<!DOCTYPE html> 
<?php
    include('menus.php');
    session_start();
    sesion_paciente();
    include('conexion.php'); // Conectar a la base de datos
    // Verifica si la sesión 'cedula' está iniciada
    if (!isset($_SESSION['cedula'])) {
        // Si no hay una sesión iniciada, redirige a login.php con un mensaje
        header("Location: login.php?mensaje=" . urlencode("Debe iniciar sesión para poder ver esta página"));
        exit(); // Asegurarse de que el script se detenga aquí
    } else {
        // Verifica si la sesión 'tipo' está definida y es igual a "paciente"
        if (isset($_SESSION['tipo']) && $_SESSION['tipo'] == "Paciente") {
             // El usuario tiene sesión iniciada, pero no es de tipo "paciente"
            header("Location: login.php?mensaje=" . urlencode("Debe tener privilegios de Especialista para poder ver esta página"));
            exit(); // Asegurarse de que el script se detenga aquí
        } else {
            // El usuario tiene sesión iniciada y es de tipo "paciente", permite el acceso a la página
        }
    }
?>
<html class="no-js" lang="zxx">
    <?php
       head_1();
    ?>
    <style>
        .product-card {
            display: flex;
            flex-direction: column;
            justify-content: space-between;
            height: 400px; /* Altura fija de todas las tarjetas */
            width: 300px;
        }
        .mdl-card__title img {
            max-height: 150px; /* Tamaño uniforme para las imágenes */
            width: auto;
            display: block;
            margin: 0 auto;
        }
        .mdl-card__supporting-text {
            flex-grow: 1;
            display: flex;
            flex-direction: column;
            justify-content: center;
            text-align: center;
        }
        .mdl-card__actions {
            margin-top: auto; /* Mantiene los botones en la parte inferior */
        }
        /* Control de altura y scroll para respuestas largas */
        .respuesta-container {
            max-height: 250px; /* Altura máxima antes de activar el scroll */
            overflow-y: auto;
            padding: 10px;
            border-top: 1px solid #ccc;
            margin-top: 10px;
        }
    </style>
    <body>
       <?php
            menu_registro();
            vericar_sesion();
        ?>
        <!-- Single News -->
        <section class="news-single section">
            <section class="faq section">
                <div class="container">
                <div class="breadcrumbs overlay">
            <div class="container">
                <div class="bread-inner">
                            <div class="row">
                                <div class="col-12">
                                    <h2>Preguntas Frecuentes</h2>
                                    <ul class="bread-list">
                                        <li><a href="index.php">Inicio</a></li>
                                        <li><i class="icofont-simple-right"></i></li>
                                        <li class="active">Preguntas Frecuentes</li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                    <div class="row">
                        <div class="col-lg-8 col-12">
                            <<div class="col-13">
                                <div class="section-title text-center">
                                    <h2>Preguntas y Respuestas</h2>
                                    <img src="img/section-img.png" alt="#">
                                    <p>Aquí encontrarás respuestas a las preguntas más frecuentes enviadas por nuestros usuarios.</p>
                                </div>
                                <div class="comments-form">
                                <div class="mdl-grid" id="preguntas-container">
                                    <!--<div class="mdl-grid">-->
                                        <?php
                                        $sql = "SELECT id, nombre, pregunta, respuesta, categoria, fecha FROM preguntas ORDER BY fecha DESC";
                                        $result = $conn->query($sql);
                                        if ($result->num_rows > 0) {
                                            while ($row = $result->fetch_assoc()) {
                                                echo '<div class="mdl-cell mdl-cell--4-col mdl-card mdl-shadow--2dp full-width product-card" style="margin: 10px;" id="pregunta-' . $row["id"] . '">';
                                                echo '    <div class="mdl-card mdl-shadow--2dp full-width">';
                                                echo '        <div class="mdl-card__supporting-text">';
                                                echo '            <h1 class="mdl-card__title-text" style="font-weight: bold; color: #333;">' . htmlspecialchars($row["nombre"]) . ' preguntó:</h1>';
                                                echo '            <p style="font-size: 22px; font-weight: bold;">' . htmlspecialchars($row["pregunta"]) . '</p>';
                                                echo '            <div class="respuesta-container">';
                                                if (empty($row["respuesta"])) {
                                                    echo '                <p style="font-size: 16px; color: red; font-weight: bold;">Aún no hay respuesta para esta pregunta.</p>'; 
                                                    if ($_SESSION['tipo'] === "Especialista") {
                                                        echo '<form method="post" action="responder_pregunta.php">';
                                                        echo '    <textarea name="respuesta" rows="3" placeholder="Escribe tu respuesta aquí..." required></textarea>';
                                                        echo '    <input type="hidden" name="id_pregunta" value="' . $row["id"] . '">';
                                                        echo '    <button type="submit" class="mdl-button mdl-js-button mdl-button--raised mdl-js-ripple-effect mdl-button--colored">Responder</button>';
                                                        echo '</form>';
                                                    }
                                                } else {
                                                    echo '                <p style="font-size: 16px; color: #555;">' . htmlspecialchars($row["respuesta"]) . '</p>';
                                                }
                                                echo '            </div>';
                                                echo '            <div class="mdl-card__actions mdl-card--border text-center">';
                                                echo '                <small style="font-size: 14px; font-weight: bold;">📅 ' . $row["fecha"] . ' <br> 🏷️ ' . htmlspecialchars($row["categoria"]) . '</small>';
                                                echo '            </div>';
                                                echo '        </div>';
                                                echo '    </div>';
                                                echo '</div>';
                                            }
                                        } else {
                                            echo '<p class="text-center">No hay preguntas registradas.</p>';
                                        }
                                        ?>
                                    </div>
                                </div>    
                            </div>
                        </div>  
                        <div class="col-lg-4 col-12">
                            <div class="main-sidebar">
                                <!-- Widget de Búsqueda -->
                                <div class="single-widget search">
                                    <div class="form">
                                        <input type="text" name="busqueda" id="searchInput" placeholder="Buscar Aquí..." onkeyup="filtrarPreguntas()">
                                        <a class="button"><i class="fa fa-search"></i></a>
                                    </div>
                                </div>
                                <!--/ End Single Widget -->
                                <!-- Preguntas recientes -->
                                <div class="single-widget recent-post">
                                    <h3 class="title">Preguntas Recientes</h3>
                                    <?php
                                    $imagenes = ["img/blog-sidebar1.jpg", "img/blog-sidebar2.jpg", "img/blog-sidebar3.jpg"];
                                    $index = 0;
                                    $sql_recent = "SELECT p.id, p.pregunta, p.fecha, 
                                        (SELECT COUNT(*) FROM preguntas WHERE respuesta IS NOT NULL AND id = p.id) AS total_respuestas 
                                        FROM preguntas p 
                                        ORDER BY p.fecha DESC LIMIT 3";
                                    $result_recent = $conn->query($sql_recent);
                                    if ($result_recent->num_rows > 0) {
                                        while ($recent = $result_recent->fetch_assoc()) {
                                            echo '<div class="single-post">';
                                            echo '    <div class="image">';
                                            echo '        <img src="' . $imagenes[$index] . '" alt="#">';
                                            echo '    </div>';
                                            echo '    <div class="content">';
                                            echo '        <h5><a href="preguntas_frecuentes.php#pregunta-' . $recent['id'] . '">' . htmlspecialchars($recent['pregunta'], ENT_QUOTES, 'UTF-8') . '</a></h5>';
                                            echo '        <ul class="comment">';
                                            echo '            <li><i class="fa fa-calendar" aria-hidden="true"></i> ' . htmlspecialchars($recent['fecha'], ENT_QUOTES, 'UTF-8') . '</li>';
                                            echo '            <li><i class="fa fa-commenting-o" aria-hidden="true"></i> ' . $recent['total_respuestas'] . '</li>';
                                            echo '        </ul>';
                                            echo '    </div>';
                                            echo '</div>';
                                            $index++;
                                        }
                                    } else {
                                        echo '<p>No hay preguntas recientes.</p>';
                                    }
                                    ?>
                                </div>
                                <!--/ End Single Widget -->
                                <!-- Single Widget - Categorías de Preguntas -->
                                <div class="single-widget category">
                                    <h3 class="title">Categorías de Preguntas</h3>
                                    <ul class="categor-list">
                                    <?php
                                    include('conexion.php'); // Asegurar la conexión con la base de datos
                                    // Consulta para contar el total de preguntas
                                    $sql_total = "SELECT COUNT(*) AS total FROM preguntas";
                                    $result_total = $conn->query($sql_total);
                                    $totalPreguntas = ($result_total) ? $result_total->fetch_assoc()['total'] : 0;
                                    ?>
                                        <li><a href="preguntas_frecuentes.php">Ver Todas (<?php echo $totalPreguntas; ?>)</a></li>
                                        <?php
                                        // Consulta para contar preguntas por categoría
                                        $sql_categorias = "SELECT categoria, COUNT(*) AS total FROM preguntas GROUP BY categoria";
                                        $result_categorias = $conn->query($sql_categorias);
                                        if ($result_categorias) {
                                            while ($categoria = $result_categorias->fetch_assoc()) {
                                                echo '<li><a href="preguntas_frecuentes.php?categoria=' . urlencode($categoria['categoria']) . '">'
                                                    . htmlspecialchars($categoria['categoria']) . ' (' . $categoria['total'] . ')</a></li>';
                                            }
                                        } else {
                                            echo "<li>No hay categorías disponibles.</li>";
                                        }
                                        ?>
                                    </ul>
                                </div>
                                <!--/ End Single Widget -->
                            </div>
                        </div>
                    </div>
                </div>
            </section>
        </section>
        <?php
            footer_1();
        ?>
        <script>
        function filtrarPreguntas() {
            let input = document.getElementById("searchInput").value.trim().toLowerCase();
            let formData = new FormData();
            formData.append("busqueda", input);
            fetch("buscar_preguntas_especialista.php", {
                method: "POST",
                body: formData
            })
            .then(response => response.text())
            .then(data => {
                document.getElementById("preguntas-container").innerHTML = data;
            })
            .catch(error => console.error("Error en la búsqueda:", error));
        }
        </script>
    </body>
</html>