<?php
session_start();
require_once '../includes/db.php';
//require_once '../includes/theme_only.php'; 

// Verificar si el usuario está logueado y es administrador
if (!isset($_SESSION['usuario_id']) || $_SESSION['rol'] !== 'admin') {
    header('Location: login.php');
    exit;
}

$db = new Database();
$pdo = $db->getPDO();

// Procesar el formulario
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
    $instance_id = trim($_POST['instance_id']);
    $api_token = trim($_POST['api_token']);

    $stmt = $pdo->prepare("UPDATE configuracion SET instance_id = ?, api_token = ?");
    if ($stmt->execute([$instance_id, $api_token])) {
        $_SESSION['mensaje'] = "Configuración actualizada con éxito";
        $_SESSION['tipo'] = "success";
    } else {
        $_SESSION['mensaje'] = "Error al actualizar la configuración";
        $_SESSION['tipo'] = "danger";
    }
    
    // Redirigir después de procesar el formulario
    header('Location: ' . $_SERVER['PHP_SELF']);
    exit;
}

// Obtener mensaje de la sesión
$mensaje = $_SESSION['mensaje'] ?? null;
$tipo = $_SESSION['tipo'] ?? null;

// Limpiar mensajes de la sesión
unset($_SESSION['mensaje'], $_SESSION['tipo']);

// Obtener configuración actual
$stmt = $pdo->query("SELECT instance_id, api_token, color_principal, color_secundario FROM configuracion LIMIT 1");
$config = $stmt->fetch(PDO::FETCH_ASSOC);
//echo getThemeCSS();
require_once '../includes/header.php';
?>

<!DOCTYPE html>
<html lang="es">
<head>
<?php
    // Modo oscuro
    require_once '../includes/dark_mode.php';
    ?>
    <meta name="color-scheme" content="light dark">
    <?php echo getDarkModeStyles(); ?>

    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Configuración de WhatsApp</title>
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css">
    <style>
        /* Estilos para leyendas principales */
        .form-label, h2 {
            color: <?php echo $config['color_principal'] ?? '#0d6efd'; ?>;
        }

        /* Estilos para leyendas secundarias */
        .text-secondary {
            color: <?php echo $config['color_secundario'] ?? '#6c757d'; ?> !important;
        }

        /* Estilos para los controles cuando tienen foco */
        .form-control {
            border-color: #dee2e6;
            transition: all 0.2s ease-in-out;
        }

        .form-control:focus {
            border-color: <?php echo $config['color_principal'] ?? '#0d6efd'; ?>;
            box-shadow: 0 0 0 0.25rem <?php echo $config['color_principal'] ?? '#0d6efd'; ?>25;
        }

        /* Estilo para el botón principal */
        .btn-primary {
            background-color: <?php echo $config['color_principal'] ?? '#0d6efd'; ?>;
            border-color: <?php echo $config['color_principal'] ?? '#0d6efd'; ?>;
        }

        .btn-primary:hover {
            background-color: <?php echo $config['color_secundario'] ?? '#0b5ed7'; ?>;
            border-color: <?php echo $config['color_secundario'] ?? '#0b5ed7'; ?>;
        }
    </style>
</head>
<body>
    <div class="container mt-5">
        <h2 class="text-center mb-4">Configuración de WhatsApp</h2>

        <?php if (isset($mensaje)): ?>
        <div class="alert alert-<?php echo $tipo; ?> alert-dismissible fade show" role="alert">
            <?php echo $mensaje; ?>
            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
        </div>
        <?php endif; ?>

        <div class="row">
            <!-- Tarjeta Configuración -->
            <div class="col-md-6 mb-4">
                <div class="card h-100">
                    <div class="card-header">
                        <h5 class="mb-0"><i class="bi bi-gear me-2"></i>Configuración</h5>
                    </div>
                    <div class="card-body">
                        <form method="POST">
                            <div class="mb-3">
                                <label for="instance_id" class="form-label">Instance ID</label>
                                <input type="password" class="form-control" id="instance_id" name="instance_id" 
                                       value="<?php echo htmlspecialchars($config['instance_id'] ?? ''); ?>" required>
                            </div>
                            <div class="mb-3">
                                <label for="api_token" class="form-label">API Token</label>
                                <input type="text" class="form-control" id="api_token" name="api_token" 
                                       value="<?php echo htmlspecialchars($config['api_token'] ?? ''); ?>" required>
                            </div>
                            <div class="d-flex justify-content-between">
                                <a href="configuracion.php" class="btn btn-secondary">
                                    <i class="bi bi-arrow-left-circle me-2"></i>Volver
                                </a>
                                <button type="submit" class="btn btn-primary">
                                    <i class="bi bi-save me-2"></i>Guardar Cambios
                                </button>
                            </div>
                        </form>
                    </div>
                </div>
            </div>

            <!-- Tarjeta Vincular Dispositivo -->
            <div class="col-md-6 mb-4">
                <div class="card h-100">
                    <div class="card-header">
                        <h5 class="mb-0"><i class="bi bi-qr-code me-2"></i>Vincular Dispositivo</h5>
                    </div>
                    <div class="card-body p-0">
                        <iframe src="../whatsapp/qr/index.php?embed=1" style="width: 100%; height: 100%; min-height: 400px; border: none;"></iframe>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script src="js/bootstrap.bundle.min.js"></script>
</body>
</html>