<?php
session_start();
require_once "modelo/Db.php";

$error = 0;

if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    $nom = isset($_POST['txtusu']) ? $_POST['txtusu'] : '';
    $cla = isset($_POST['txtcla']) ? $_POST['txtcla'] : '';

    $bd = new clsbdd();
    
    // Usamos el método escapar() de tu clase
    $usuario = $bd->escapar($nom);

    // Consulta SQL
    $sql = "SELECT usu_codigo, usu_nombre, usu_usuario, usu_rol, usu_clave 
            FROM sba_usuarios
            WHERE usu_usuario = '$usuario' AND usu_estado = 1
            LIMIT 1";

    // Usamos ejecutar_fila() que ya devuelve el assoc_array o null
    $fila = $bd->ejecutar_fila($sql); 

    if ($fila) {
        // Verificar contraseña con el hash de la base de datos
        if ($cla === $fila['usu_clave']) {
            $_SESSION['usu_codigo'] = $fila['usu_codigo'];
            $_SESSION['usuario']    = $fila['usu_usuario'];
            $_SESSION['nombre']     = $fila['usu_nombre'];
            $_SESSION['rol']        = $fila['usu_rol'];

            header("Location: index.php");
            exit();
        } else {
            $error = 1;
        }
    } else {
        $error = 1;
    }
}
?>
<!DOCTYPE html>
<html lang="es">
<head>
    <meta charset="utf-8">
    <title>SBA - Login Profesional</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    
    <link href="https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;600&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css">
    <link href="dist/css/style.min.css" rel="stylesheet">

    <style>
        body { font-family: 'Poppins', sans-serif; background-color: #121212; margin: 0; }
        
        .auth-wrapper {
            min-height: 100vh;
            display: flex;
            align-items: center;
            justify-content: center;
            background: linear-gradient(rgba(0,0,0,0.75), rgba(0,0,0,0.75)), 
                        url('assets/images/big/auth-bg.jpg') no-repeat center center;
            background-size: cover;
            padding: 20px;
        }

        .auth-box {
            background: #fff;
            border-radius: 20px;
            max-width: 900px;
            width: 100%;
            display: flex;
            box-shadow: 0 20px 60px rgba(0,0,0,0.5);
            overflow: hidden;
            border: none;
        }

        .modal-bg-img {
            background: url('assets/images/big/loginsba.png') center center / cover;
            width: 55%;
            min-height: 550px;
        }

        .login-content {
            padding: 50px 45px;
            width: 45%;
            display: flex;
            flex-direction: column;
            justify-content: center;
        }

        .inner-addon { position: relative; margin-bottom: 20px; }
        .inner-addon i { 
            position: absolute; 
            padding: 15px; 
            color: #bdc3c7; 
            font-size: 18px;
        }
        
        .inner-addon input { 
            padding-left: 50px; 
            border-radius: 12px; 
            height: 55px; 
            border: 1px solid #edf2f7; 
            background: #f8fafc;
            width: 100%;
            box-sizing: border-box;
            font-size: 15px;
            transition: all 0.3s ease;
        }

        .inner-addon input:focus {
            outline: none;
            border-color: #2d3748;
            background: #fff;
            box-shadow: 0 4px 12px rgba(0,0,0,0.05);
        }

        .btn-ingresar { 
            background: #1a202c; 
            color: #fff; 
            width: 100%; 
            border: none; 
            padding: 16px; 
            border-radius: 12px; 
            font-weight: 600; 
            cursor: pointer;
            transition: all 0.3s; 
            text-transform: uppercase;
            letter-spacing: 1px;
            margin-top: 10px;
        }

        .btn-ingresar:hover { 
            background: #000; 
            transform: translateY(-2px);
            box-shadow: 0 8px 25px rgba(0,0,0,0.2);
        }

        .alert-custom {
            background-color: #fff5f5;
            color: #c53030;
            padding: 12px;
            border-radius: 10px;
            border: 1px solid #feb2b2;
            margin-top: 20px;
            text-align: center;
            font-size: 14px;
        }

        @media (max-width: 850px) {
            .modal-bg-img { display: none; }
            .login-content { width: 100%; padding: 40px 30px; }
        }
    </style>
</head>
<body>

<div class="auth-wrapper">
    <div class="auth-box">
        <div class="modal-bg-img d-none d-md-block"></div>
        
        <div class="login-content">
            <div class="text-center mb-4">
                <img src="assets/images/big/icon.png" width="85" alt="Logo SBA">
            </div>
            
            <h3 class="text-center font-weight-bold mb-1" style="color: #1a202c;">Bienvenido</h3>
            <p class="text-center text-muted mb-4" style="font-size: 14px;">Inicia sesión para continuar</p>
            
            <form method="POST">
                <div class="inner-addon">
                    <i class="fa fa-user"></i>
                    <input type="text" name="txtusu" placeholder="Usuario" required autofocus>
                </div>
                
                <div class="inner-addon">
                    <i class="fa fa-lock"></i>
                    <input type="password" name="txtcla" placeholder="Contraseña" required>
                </div>
                
                <button type="submit" class="btn-ingresar">
                    Entrar <i class="fa fa-chevron-right ml-2" style="font-size: 12px;"></i>
                </button>
            </form>

            <?php if ($error == 1): ?>
                <div class="alert-custom">
                    <i class="fa fa-times-circle mr-1"></i> Acceso denegado. Intente de nuevo.
                </div>
            <?php endif; ?>
            
            <div class="text-center mt-4">
                <small style="color: #a0aec0;">Sistema Bar &copy; <?php echo date('Y'); ?></small>
            </div>
        </div>
    </div>
</div>

</body>
</html>