<?php
error_reporting(E_ALL);
ini_set('display_errors', 1);

include_once('../config.php');
include_once('../header.php');

$mensagem = "";

// 1. CADASTRAR USUÁRIO
if (isset($_POST['btn_cadastrar'])) {
    $nome = strtoupper($_POST['nome']);
    $cargo = strtoupper($_POST['cargo']);

    $sql = "INSERT INTO usuarios (nome, cargo) VALUES ('$nome', '$cargo')";
    if ($conn->query($sql)) {
        $mensagem = "USUÁRIO CADASTRADO COM SUCESSO!";
    } else {
        $mensagem = "ERRO AO CADASTRAR: " . $conn->error;
    }
}

// 2. EXCLUIR USUÁRIO
if (isset($_GET['excluir'])) {
    $id = $_GET['excluir'];
    $conn->query("DELETE FROM usuarios WHERE id = $id");
    echo "<script>window.location.href='usuarios.php';</script>";
exit();
}

// 3. BUSCAR USUÁRIOS
$usuarios = $conn->query("SELECT * FROM usuarios ORDER BY nome ASC");
?>

<style>
    .usuarios-wrapper { 
        background: #fff; 
        border: 1px solid #ccc; 
        padding: 15px; 
        font-family: Arial, sans-serif; 
        text-transform: uppercase; 
        overflow-x: hidden; /* Evita que a página inteira escape para o lado */
    }
    .form-cadastro { 
        background: #f9f9f9; 
        border: 1px solid #ddd; 
        padding: 15px; 
        margin-bottom: 20px; 
        border-radius: 4px; 
        display: flex; 
        gap: 10px; 
        align-items: flex-end; 
    }
    .form-group { display: flex; flex-direction: column; flex: 1; }
    .form-group label { font-size: 10px; font-weight: bold; margin-bottom: 4px; color: #555; }
    .form-input { 
        padding: 8px; 
        border: 1px solid #ccc; 
        border-radius: 3px; 
        font-size: 11px; 
        text-transform: uppercase; 
        background-color: #fff8e1; 
        width: 100%; 
        box-sizing: border-box; 
    }
    .btn-salvar { 
        background-color: #00569e; 
        color: white; 
        border: none; 
        padding: 10px 20px; 
        font-weight: bold; 
        cursor: pointer; 
        border-radius: 3px; 
        font-size: 11px; 
    }
    .btn-salvar:hover { background-color: #003d70; }
    
    /* Container para permitir scroll na tabela no mobile */
    .tabela-container {
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .tabela-usuarios { width: 100%; border-collapse: collapse; font-size: 11px; min-width: 500px; }
    .tabela-usuarios th { background-color: #333; color: white; padding: 10px; text-align: left; }
    .tabela-usuarios td { padding: 10px; border-bottom: 1px solid #eee; }
    .tabela-usuarios tr:hover { background-color: #f5f5f5; }
    .btn-excluir { color: #d9534f; text-decoration: none; font-weight: bold; font-size: 10px; border: 1px solid #d9534f; padding: 2px 6px; border-radius: 3px; }
    .btn-excluir:hover { background: #d9534f; color: #fff; }
    .alerta { background-color: #d4edda; color: #155724; padding: 10px; margin-bottom: 15px; border-radius: 4px; font-weight: bold; text-align: center; border: 1px solid #c3e6cb; }

    /* AJUSTES PARA CELULAR */
    @media (max-width: 600px) {
        .form-cadastro { 
            flex-direction: column; 
            align-items: stretch; 
        }
        .form-group { 
            width: 100%; 
        }
        .btn-salvar { 
            width: 100%; 
            padding: 12px; 
            margin-top: 5px;
        }
    }
</style>

<div class="usuarios-wrapper">
    <div style="font-weight: bold; font-size: 14px; border-bottom: 2px solid #333; padding-bottom: 5px; margin-bottom: 15px;">
        👤 CADASTRO DE USUÁRIOS DO SISTEMA
    </div>

    <?php if ($mensagem != ""): ?>
        <div class="alerta"><?php echo $mensagem; ?></div>
    <?php endif; ?>

    <form action="usuarios.php" method="POST" class="form-cadastro">
        <div class="form-group">
            <label>NOME COMPLETO</label>
            <input type="text" name="nome" class="form-input" placeholder="DIGITE O NOME..." required>
        </div>
        <div class="form-group">
            <label>CARGO / FUNÇÃO</label>
            <select name="cargo" class="form-input" required>
                <option value="">SELECIONE...</option>
                <option value="ADMINISTRADOR">ADMINISTRADOR</option>
                <option value="VENDEDOR">VENDEDOR</option>
                <option value="GERENTE">GERENTE</option>
                <option value="CAIXA">CAIXA</option>
            </select>
        </div>
        <button type="submit" name="btn_cadastrar" class="btn-salvar">✅ CADASTRAR</button>
    </form>

    <table class="tabela-usuarios">
        <thead>
            <tr>
                <th style="width: 50px;">ID</th>
                <th>NOME</th>
                <th>CARGO</th>
                <th style="width: 100px; text-align: center;">AÇÕES</th>
            </tr>
        </thead>
        <tbody>
            <?php if ($usuarios->num_rows > 0): ?>
                <?php while ($u = $usuarios->fetch_assoc()): ?>
                   <tr>
    <td>#<?php echo $u['ID']; ?></td>
    <td><?php echo $u['NOME']; ?></td>
    <td><?php echo $u['cargo']; ?></td>
    <td>
        <a href="usuarios.php?excluir=<?php echo $u['ID']; ?>" 
           class="btn-excluir" 
           onclick="return confirm('DESEJA REALMENTE REMOVER ESTE USUÁRIO?')">
           EXCLUIR
        </a>
    </td>
</tr>
                <?php endwhile; ?>
            <?php else: ?>
                <tr>
                    <td colspan="4" style="text-align: center; padding: 20px; color: #888;">NENHUM USUÁRIO CADASTRADO.</td>
                </tr>
            <?php endif; ?>
        </tbody>
    </table>
</div>