<?php
session_start();
if(!isset($_SESSION['rev_logado'])){ header("Location: index_rev.php"); exit(); }
include('../api/conexao_rev.php');

$id_rev = $_SESSION['rev_logado'];
$jsonFile = "../api/db/msg_rev_" . $id_rev . ".json";

if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    $data = [
        'mensagem' => $_POST['mensagem'],
        'cor'      => $_POST['cor'],
        'bgcolor'  => $_POST['bgcolor'],
        'opacity'  => $_POST['opacity'],
        'fontSize' => $_POST['fontSize'],
        'efeito'   => $_POST['efeito']
    ];
    file_put_contents($jsonFile, json_encode($data, JSON_UNESCAPED_SLASHES));
    $_SESSION['msg_ok'] = "Mensagem atualizada!";
    header("Location: msg_rev.php"); exit();
}

// Carrega dados existentes ou padrão
if (file_exists($jsonFile)) {
    $conf = json_decode(file_get_contents($jsonFile), true);
} else {
    $conf = [
        'mensagem' => 'BEM-VINDO AO APP',
        'cor' => '#ffffff',
        'bgcolor' => '#3b82f6',
        'opacity' => '1',
        'fontSize' => '16',
        'efeito' => 'scroll'
    ];
}
?>
<!DOCTYPE html>
<html lang="pt-br">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Gerenciar Mensagem</title>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
    <style>
        * { box-sizing: border-box; }
        html, body { background-color: #020617 !important; color: #e2e8f0 !important; font-family: 'Inter', sans-serif; margin: 0; padding: 0; }
        .container-fluid { padding: 30px 15px !important; max-width: 700px; margin: 0 auto; }
        .btn-back-nav { display: inline-flex; align-items: center; gap: 8px; color: #64748b; text-decoration: none !important; font-size: 0.85rem; font-weight: 600; margin-bottom: 20px; transition: 0.3s; }
        .btn-back-nav:hover { color: #3b82f6; }
        
        .premium-card { background: #070e1b; border: 1px solid #1e293b; border-radius: 24px; padding: 30px; box-shadow: 0 10px 25px rgba(0,0,0,0.3); }
        .card-header { margin-bottom: 25px; border-bottom: 1px solid rgba(255,255,255,0.05); padding-bottom: 15px; }
        .card-header h1 { font-size: 1.4rem; font-weight: 900; margin: 0; color: #fff; }
        
        label { display: block; color: #3b82f6; font-size: 0.7rem; font-weight: 800; margin-bottom: 8px; text-transform: uppercase; }
        .input-lux { width: 100%; background: #0f172a !important; border: 1px solid #1e293b !important; color: #fff !important; padding: 16px; border-radius: 14px; margin-bottom: 20px; outline: none; }
        
        .grid-inputs { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }
        
        select.input-lux { cursor: pointer; appearance: none; }
        
        .btn-save-lux { width: 100%; background: #3b82f6; color: #fff; padding: 18px; border-radius: 14px; font-weight: 800; text-transform: uppercase; border: none; cursor: pointer; box-shadow: 0 4px 15px rgba(59, 130, 246, 0.2); transition: 0.3s; margin-top: 10px; }
        .btn-save-lux:hover { background: #2563eb; transform: translateY(-2px); }

        /* Preview Simples */
        .preview-text { background: #000; padding: 15px; border-radius: 12px; margin-bottom: 20px; text-align: center; border: 1px dashed #3b82f6; overflow: hidden; }
    </style>
</head>
<body>

<div class="container-fluid">
    <a href="dashboard_rev.php" class="btn-back-nav"><i class="fas fa-columns"></i> VOLTAR AO DASHBOARD</a>

    <div class="premium-card">
        <div class="card-header">
            <h1>Mensagem de Rodapé</h1>
        </div>

        <form method="post">
            <label>Texto da Mensagem</label>
            <input type="text" name="mensagem" class="input-lux" value="<?= htmlspecialchars($conf['mensagem']) ?>" required placeholder="Digite o aviso aqui...">

            <div class="grid-inputs">
                <div>
                    <label>Cor do Texto</label>
                    <input type="color" name="cor" class="input-lux" style="height: 55px; padding: 5px;" value="<?= $conf['cor'] ?>">
                </div>
                <div>
                    <label>Cor do Fundo</label>
                    <input type="color" name="bgcolor" class="input-lux" style="height: 55px; padding: 5px;" value="<?= $conf['bgcolor'] ?>">
                </div>
            </div>

            <div class="grid-inputs">
                <div>
                    <label>Tamanho da Fonte (px)</label>
                    <input type="number" name="fontSize" class="input-lux" value="<?= $conf['fontSize'] ?>" min="10" max="50">
                </div>
                <div>
                    <label>Opacidade do Fundo (0 a 1)</label>
                    <input type="text" name="opacity" class="input-lux" value="<?= $conf['opacity'] ?>" placeholder="Ex: 0.8">
                </div>
            </div>

            <label>Efeito de Animação</label>
            <select name="efeito" class="input-lux">
                <option value="scroll" <?= $conf['efeito'] == 'scroll' ? 'selected' : '' ?>>Texto Rolante (Scroll)</option>
                <option value="static" <?= $conf['efeito'] == 'static' ? 'selected' : '' ?>>Estático (Centralizado)</option>
                <option value="blink" <?= $conf['efeito'] == 'blink' ? 'selected' : '' ?>>Piscando (Blink)</option>
                <option value="typing" <?= $conf['efeito'] == 'typing' ? 'selected' : '' ?>>Digitando (Typing)</option>
            </select>

            <button type="submit" class="btn-save-lux">Salvar Mensagem</button>
        </form>
    </div>
</div>

<script>
    <?php if (isset($_SESSION['msg_ok'])): ?>
        Swal.fire({ icon: 'success', title: 'Sucesso', text: '<?= $_SESSION['msg_ok'] ?>', background: '#070e1b', color: '#fff', confirmButtonColor: '#3b82f6' });
        <?php unset($_SESSION['msg_ok']); ?>
    <?php endif; ?>
</script>
</body>
</html>
