<?php
session_start(); // Siempre al inicio

// Verificar si el usuario ya tiene una sesión activa y un rol definido
if (isset($_SESSION['Inicio']) && $_SESSION['Inicio'] === "Ok" && isset($_SESSION['Rol'])) {
    $urlRedireccion = "";
    // Determinar a qué menú redirigir según el rol
    switch ($_SESSION['Rol']) {
        case "Administrativo":
            $urlRedireccion = "./MenuAdministrativo.php";
            break;
        case "Titular":
            $urlRedireccion = "./MenuTitular.php";
            break;
        case "Pasante":
            $urlRedireccion = "./MenuPasante.php";
            break;
        default:
            session_unset();
            session_destroy();
            header("Location: ./login.php?m=6");
            exit;
    }

    if (!empty($urlRedireccion)) {
        header("Location: " . $urlRedireccion);
        exit;
    }
}
?>
<!DOCTYPE html>
<html lang="es">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Iniciar Sesión - Sistema Terapia Lenguaje</title>
    
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@500;700&family=Roboto:wght@500;700&display=swap" rel="stylesheet">
    
    <link rel="icon" type="image/png" href="./img/UNAM amarillo.png">
    <link rel="stylesheet" href="./Css/EstilosLogin.css">
</head>

<body>
    <!-- El canvas para las partículas. Ahora es el ÚNICO hijo directo del body. -->
    <div id="tsparticles"></div>

    <!-- CORRECCIÓN: Contenedor principal que se encargará de centrar el login -->
    <div class="main-container">
        <div class="login-container">
            <div class="login-image-section">
                <div class="image-overlay">
                    <h1>UNAM</h1>
                    <p>Sistema de Terapia de Lenguaje</p>
                </div>
            </div>

            <div class="login-form-section">
                <form action="./Php/ValidaAcceso.php" method="post" class="login-form">
                    <div class="form-title">Iniciar Sesión</div>
                    <div class="input-box">
                        <label for="Username" class="detalles">Usuario</label>
                        <input type="text" id="Username" name="Username" required>
                    </div>
                    <div class="input-box">
                        <label for="Password" class="detalles">Contraseña</label>
                        <input type="password" id="Password" name="Password" required>
                    </div>
                    <input type="submit" class="btn-login" value="Ingresar">
                </form>
                <?php if (isset($_GET['m'])) : ?>
                    <div class="flash-data" data-flashdata="<?php echo htmlspecialchars($_GET['m']); ?>"></div>
                <?php endif; ?>
            </div>
        </div>
    </div>

    <!-- Scripts (sin cambios) -->
    <script src="//cdn.jsdelivr.net/npm/sweetalert2@11"></script>
    <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
    <script>
        $(document).ready(function() {
            // Tu código de SweetAlert se mantiene igual
            const flashdata = $('.flash-data').data('flashdata');
            if (flashdata) {
                // ... (código de switch)
            }
        });
    </script>
    
    <!-- Scripts para las partículas (sin cambios en la configuración) -->
    <script src="https://cdn.jsdelivr.net/npm/tsparticles@2/tsparticles.bundle.min.js"></script>
    <script>
        tsParticles.load("tsparticles", {
            "fullScreen": {
                "enable": true,
                "zIndex": -1 
            },
            "particles": {
                "number": { "value": 65, "density": { "enable": true, "value_area": 800 } },
                "color": { "value": ["#ffffff", "#DDBE80"] },
                "shape": { "type": "circle" },
                "opacity": { "value": 0.5, "random": true },
                "size": { "value": 3, "random": true },
                "line_linked": { "enable": true, "distance": 150, "color": "#DDBE80", "opacity": 0.2, "width": 1 },
                "move": { "enable": true, "speed": 1, "direction": "none", "out_mode": "out" }
            },
            "interactivity": {
                "events": { "onhover": { "enable": true, "mode": "repulse" }, "onclick": { "enable": true, "mode": "push" } },
                "modes": { "repulse": { "distance": 100 }, "push": { "particles_nb": 4 } }
            },
            "background": { "color": "#262F61" },
            "detectRetina": false
        });
    </script>
</body>
</html>