<?php
require_once 'connexion/auth.php'; 

// ==========================================
// 1. INITIALISATION DE LA BASE DE DONNÉES
// ==========================================
$pdo->exec("CREATE TABLE IF NOT EXISTS info_mairie (
    id INT PRIMARY KEY,
    adresse TEXT,
    telephone VARCHAR(20),
    email VARCHAR(100),
    h_lundi VARCHAR(50),
    h_mardi VARCHAR(50),
    h_mercredi VARCHAR(50),
    h_jeudi VARCHAR(50),
    h_vendredi VARCHAR(50)
) ENGINE=InnoDB DEFAULT CHARSET=utf8mb4;");

// Insertion des données par défaut si la table est vide
$check = $pdo->query("SELECT COUNT(*) FROM info_mairie")->fetchColumn();
if ($check == 0) {
    $pdo->exec("INSERT INTO info_mairie (id, adresse, telephone, email, h_lundi, h_mardi, h_mercredi, h_jeudi, h_vendredi) VALUES 
        (1, 'Place Marcel Courtin 80310 Saint Vaast en Chaussée', '03 22 51 41 80', 'mairie@stvastenchaussee.fr', 
        '13:30 - 17:00', '08:30 - 12:00', '08:30 - 12:00', '13:30 - 19:00', '08:30 - 12:00')");
}

// ==========================================
// 2. TRAITEMENT : MODIFICATION PAR L'ÉDITEUR
// ==========================================
if (isLogged() && isset($_POST['edit_mairie'])) {
    if (hasRole('Administrateur') || hasRole('Maire') || hasRole('Adjoint') || hasRole('Editeur')) {
        $stmt = $pdo->prepare("UPDATE info_mairie SET 
            adresse = ?, telephone = ?, email = ?, 
            h_lundi = ?, h_mardi = ?, h_mercredi = ?, h_jeudi = ?, h_vendredi = ? 
            WHERE id = 1");
        $stmt->execute([
            trim($_POST['adresse']), trim($_POST['telephone']), trim($_POST['email']),
            trim($_POST['h_lundi']), trim($_POST['h_mardi']), trim($_POST['h_mercredi']),
            trim($_POST['h_jeudi']), trim($_POST['h_vendredi'])
        ]);
    }
}

// RÉCUPÉRATION
$m = $pdo->query("SELECT * FROM info_mairie WHERE id = 1")->fetch();
$can_edit = isLogged() && (hasRole('Administrateur') || hasRole('Maire') || hasRole('Adjoint') || hasRole('Editeur'));
?>
<!DOCTYPE html>
<html lang="fr">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Infos Pratiques - Saint Vaast en Chaussée</title>
    <link rel="stylesheet" href="css/global.css">
    <style>
        /* Layout spécifique Infos Pratiques */
        .infos-grid { display: flex; gap: 30px; flex-wrap: wrap; }
        .info-card { flex: 1; min-width: 300px; background: #fdfbf7; padding: 30px; border-radius: 20px; border: 2px solid #eee; position: relative; }
        
        .info-card h3 { color: var(--nature-vert, #4a7c44); border-bottom: 2px solid #eee; padding-bottom: 10px; margin-top: 0; }
        
        .contact-item { margin-bottom: 20px; }
        .contact-item strong { display: block; color: #777; font-size: 0.9em; text-transform: uppercase; }
        .contact-item p { margin: 5px 0; font-size: 1.1em; font-weight: 500; }

        .horaires-table { width: 100%; border-collapse: collapse; margin-top: 10px; }
        .horaires-table td { padding: 12px 0; border-bottom: 1px solid #eee; }
        .horaires-table td:first-child { font-weight: bold; color: #555; }
        .horaires-table td:last-child { text-align: right; color: var(--nature-vert, #4a7c44); font-weight: bold; }

        .btn-edit { position: absolute; top: 15px; right: 15px; background: white; border: 1px solid #ddd; padding: 8px 12px; border-radius: 12px; cursor: pointer; font-size: 0.8em; font-weight: bold; }

        /* MODAL */
        .modal { display: none; position: fixed; z-index: 2000; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.6); align-items: center; justify-content: center; }
        .modal-content { background: white; padding: 30px; border-radius: 25px; width: 95%; max-width: 600px; max-height: 90vh; overflow-y: auto; }
        .modal-content input, .modal-content textarea { width: 100%; padding: 10px; margin: 5px 0 15px 0; border: 2px solid #f0f4f0; border-radius: 12px; box-sizing: border-box; font-family: inherit; }
        
        .grid-inputs { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }

        @media (max-width: 768px) { .infos-grid { flex-direction: column; } .grid-inputs { grid-template-columns: 1fr; } }
    </style>
</head>
<body>
<div class="site-container">
    <img src="images/banniere.png" alt="Bannière" class="banner-img">
    <nav><?php include 'includes/menu.php'; ?></nav>

    <main class="main-wrapper">
        <h2 style="text-align:center; color:var(--nature-vert, #4a7c44); margin-top: 0; margin-bottom: 30px;">Informations Pratiques</h2>
        
        <div class="infos-grid">
            <div class="info-card">
                <?php if($can_edit): ?>
                    <button class="btn-edit" onclick="openModal()">✎ Modifier les infos</button>
                <?php endif; ?>
                
                <h3>Coordonnées</h3>
                <div class="contact-item">
                    <strong>Adresse de la Mairie</strong>
                    <p><?php echo nl2br(htmlspecialchars($m['adresse'])); ?></p>
                </div>
                <div class="contact-item">
                    <strong>Téléphone</strong>
                    <p><?php echo htmlspecialchars($m['telephone']); ?></p>
                </div>
                <div class="contact-item">
                    <strong>Email</strong>
                    <p><a href="mailto:<?php echo $m['email']; ?>" style="color:var(--nature-vert, #4a7c44); text-decoration:none;"><?php echo htmlspecialchars($m['email']); ?></a></p>
                </div>
            </div>

            <div class="info-card" style="border-color: var(--nature-vert, #4a7c44);">
                <h3>Horaires d'ouverture</h3>
                <table class="horaires-table">
                    <tr><td>Lundi</td><td><?php echo htmlspecialchars($m['h_lundi']); ?></td></tr>
                    <tr><td>Mardi</td><td><?php echo htmlspecialchars($m['h_mardi']); ?></td></tr>
                    <tr><td>Mercredi</td><td><?php echo htmlspecialchars($m['h_mercredi']); ?></td></tr>
                    <tr><td>Jeudi</td><td><?php echo htmlspecialchars($m['h_jeudi']); ?></td></tr>
                    <tr><td>Vendredi</td><td><?php echo htmlspecialchars($m['h_vendredi']); ?></td></tr>
                </table>
                <p style="font-size:0.85em; color:#888; margin-top:20px; font-style:italic;">La mairie est fermée les samedis, dimanches et jours fériés.</p>
            </div>
        </div>
    </main>
</div>

<div id="mairieModal" class="modal">
    <div class="modal-content">
        <h3 style="margin-top:0; color:var(--nature-vert, #4a7c44); border:none;">Mettre à jour la Mairie</h3>
        <form method="POST">
            <label style="font-weight: bold;">Adresse complète :</label>
            <textarea name="adresse" rows="2" required><?php echo htmlspecialchars($m['adresse']); ?></textarea>

            <div class="grid-inputs">
                <div>
                    <label style="font-weight: bold;">Téléphone :</label>
                    <input type="text" name="telephone" value="<?php echo htmlspecialchars($m['telephone']); ?>" required>
                </div>
                <div>
                    <label style="font-weight: bold;">Email :</label>
                    <input type="email" name="email" value="<?php echo htmlspecialchars($m['email']); ?>" required>
                </div>
            </div>

            <h4 style="border-top:1px solid #eee; padding-top:15px; margin-bottom: 10px;">Horaires (ex: 8:30 - 12:00)</h4>
            <div class="grid-inputs">
                <div><label style="font-size: 0.9em; color: #555;">Lundi :</label><input type="text" name="h_lundi" value="<?php echo htmlspecialchars($m['h_lundi']); ?>"></div>
                <div><label style="font-size: 0.9em; color: #555;">Mardi :</label><input type="text" name="h_mardi" value="<?php echo htmlspecialchars($m['h_mardi']); ?>"></div>
                <div><label style="font-size: 0.9em; color: #555;">Mercredi :</label><input type="text" name="h_mercredi" value="<?php echo htmlspecialchars($m['h_mercredi']); ?>"></div>
                <div><label style="font-size: 0.9em; color: #555;">Jeudi :</label><input type="text" name="h_jeudi" value="<?php echo htmlspecialchars($m['h_jeudi']); ?>"></div>
                <div><label style="font-size: 0.9em; color: #555;">Vendredi :</label><input type="text" name="h_vendredi" value="<?php echo htmlspecialchars($m['h_vendredi']); ?>"></div>
            </div>

            <button type="submit" name="edit_mairie" style="background:var(--nature-vert, #4a7c44); color:white; border:none; padding:12px; width:100%; border-radius:20px; font-weight:bold; cursor:pointer; margin-top:10px;">Enregistrer les modifications</button>
            <button type="button" onclick="closeModal()" style="background:#999; color:white; border:none; padding:10px; width:100%; border-radius:20px; margin-top:10px; cursor:pointer;">Annuler</button>
        </form>
    </div>
</div>

<script>
    function openModal() { document.getElementById('mairieModal').style.display = 'flex'; }
    function closeModal() { document.getElementById('mairieModal').style.display = 'none'; }
    window.onclick = function(e) { if(e.target.id == 'mairieModal') closeModal(); }
</script>
</body>
</html>