<?php
session_start();
if (!file_exists(__DIR__ . '/db.php')) {
    header("Location: install");
    exit;
}
require 'db.php';
require 'lang.php';

if (isset($_SESSION['user_id'])) {
    header("Location: ./");
    exit;
}

$error = '';

if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    $login    = trim($_POST['login']); // Can be username or email
    $password = $_POST['password'];

    if ($login && $password) {
        $stmt = $pdo->prepare("SELECT * FROM users WHERE username = ? OR email = ?");
        $stmt->execute([$login, $login]);
        $user = $stmt->fetch();

        if ($user && password_verify($password, $user['password'])) {
            if (($user['status'] ?? 'active') === 'blocked') {
                $error = $t['account_blocked'];
            } else {
                $_SESSION['user_id'] = $user['id'];
                $_SESSION['username'] = $user['username'];
                $_SESSION['role'] = $user['role'] ?? 'user';
                $_SESSION['avatar'] = $user['avatar'] ?? 'assets/default_avatar.png';

                // Update Last Seen
                $pdo->prepare("UPDATE users SET last_seen = NOW() WHERE id = ?")->execute([$user['id']]);

                header("Location: ./");
                exit;
            }
        } else {
            $error = $t['error_auth'];
        }
    } else {
        $error = $t['error_fields'];
    }
}
?>
<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title><?php echo $t['login_title']; ?> - Chat</title>
    <link rel="stylesheet" href="assets/style.css">
    <style>
        body {
            margin: 0;
            padding: 0;
            min-height: 100vh;
            overflow: hidden;
            position: relative;
            background: linear-gradient(135deg, #667eea 0%, #764ba2 25%, #f093fb 50%, #4facfe 75%, #00f2fe 100%);
            background-size: 400% 400%;
            animation: gradientShift 15s ease infinite;
        }

        @keyframes gradientShift {
            0% {
                background-position: 0% 50%;
            }

            50% {
                background-position: 100% 50%;
            }

            100% {
                background-position: 0% 50%;
            }
        }

        /* Animated particles */
        .particles {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            overflow: hidden;
            z-index: 1;
            pointer-events: none;
        }

        .particle {
            position: absolute;
            width: 10px;
            height: 10px;
            background: rgba(255, 255, 255, 0.3);
            border-radius: 50%;
            animation: float 20s infinite;
        }

        @keyframes float {

            0%,
            100% {
                transform: translateY(0) translateX(0) scale(1);
                opacity: 0;
            }

            10% {
                opacity: 0.8;
            }

            90% {
                opacity: 0.8;
            }

            100% {
                transform: translateY(-100vh) translateX(100px) scale(0.5);
                opacity: 0;
            }
        }

        .auth-container {
            position: relative;
            z-index: 10;
            backdrop-filter: blur(10px);
            background: rgba(255, 255, 255, 0.1);
            border: 1px solid rgba(255, 255, 255, 0.2);
            box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
        }
    </style>
</head>

<body>
    <!-- Animated particles background -->
    <div class="particles" id="particles"></div>

    <div class="auth-container">
        <?php echo lang_links(); ?>

        <div style="text-align: center; margin-bottom: 25px;">
            <img src="assets/logo.png" alt="Logo" style="width: 80px; height: 80px; margin-bottom: 12px; filter: drop-shadow(0 4px 6px rgba(0,0,0,0.3)); border-radius: 20px;">
            <p style="color: rgba(255,255,255,0.95); font-size: 1.1rem; font-weight: 600; margin: 0 0 5px 0; text-shadow: 0 2px 4px rgba(0,0,0,0.4); letter-spacing: 0.5px;">
                <?php echo $t['audio_video_calls']; ?>
            </p>
            <p style="color: rgba(255,255,255,0.6); font-size: 0.75rem; font-weight: 400; margin: 0; text-transform: uppercase; letter-spacing: 1px;">
                <?php echo $t['next_gen_messenger']; ?>
            </p>
        </div>

        <h2><?php echo $t['login_title']; ?></h2>
        <?php if ($error): ?>
            <p style="color: #cf6679; text-align: center;"><?php echo htmlspecialchars($error); ?></p>
        <?php endif; ?>
        <form method="POST">
            <input type="text" name="login" placeholder="<?php echo $t['username_email']; ?>" required>
            <input type="password" name="password" placeholder="<?php echo $t['password']; ?>" required>
            <button type="submit"><?php echo $t['login_btn']; ?></button>
        </form>
        <div class="link">
            <?php echo $t['no_account']; ?> <a href="register"><?php echo $t['register_btn']; ?></a>
        </div>
        <div style="margin-top: 20px; text-align: center; font-size: 0.7rem; color: rgba(255,255,255,0.4);">
            &copy; <?php echo date('Y'); ?> by <strong>ANUS_TANGA</strong>
        </div>
    </div>

    <script>
        // Generate particles
        const particlesContainer = document.getElementById('particles');
        const particleCount = 50;

        for (let i = 0; i < particleCount; i++) {
            const particle = document.createElement('div');
            particle.className = 'particle';
            particle.style.left = Math.random() * 100 + '%';
            particle.style.animationDelay = Math.random() * 20 + 's';
            particle.style.animationDuration = (15 + Math.random() * 10) + 's';
            particlesContainer.appendChild(particle);
        }
    </script>
</body>

</html>