<?php
    include("../protecao_admin.php");
    include("../../conectar_db.php");

    // Consulta para listar as cidades cadastradas
    $consulta_cidade_busca = "SELECT * FROM imoveis_cidades ORDER BY cidade ASC";
    $con_cidade_busca = mysqli_query($conn, $consulta_cidade_busca);
?>
<!DOCTYPE html>
<html lang="pt-br">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Configurações - Cidades</title>
    
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css">
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600&display=swap" rel="stylesheet">

    <style>
        body { background-color: #f4f7f6; font-family: 'Inter', sans-serif; }
        .card-custom { border: none; border-radius: 12px; box-shadow: 0 4px 12px rgba(0,0,0,0.05); background: #fff; }
        .btn-save { background-color: #0d6efd; color: white; border: none; font-weight: 600; padding: 12px; transition: 0.3s; }
        .btn-save:hover { background-color: #0b5ed7; transform: translateY(-2px); }
        
        .cidade-item { 
            display: flex; 
            justify-content: space-between; 
            align-items: center; 
            padding: 12px 15px; 
            border-bottom: 1px solid #eee; 
            transition: 0.2s;
        }
        .cidade-item:last-child { border-bottom: none; }
        .cidade-item:hover { background-color: #f8f9ff; }
        
        .badge-uf { background-color: #e9ecef; color: #495057; font-weight: 600; min-width: 35px; text-align: center; }
        .delete-btn { color: #dc3545; text-decoration: none; padding: 5px 10px; transition: 0.2s; }
        .delete-btn:hover { color: #a71d2a; transform: scale(1.1); }
        
        .header-title { background: #1a1a1a; color: white; padding: 25px 0; margin-bottom: 30px; }
    </style>
</head>
<body>

<header class="header-title shadow-sm">
    <div class="container d-flex justify-content-between align-items-center">
        <h4 class="m-0"><i class="fas fa-map-marked-alt me-2"></i>Gerenciar Cidades</h4>
        <a href="tela_cadastro_imoveis.php" class="btn btn-outline-light btn-sm"><i class="fas fa-arrow-left me-1"></i> Voltar</a>
    </div>
</header>

<div class="container pb-5">
    <div class="row g-4">
        
        <div class="col-md-5">
            <div class="card card-custom p-4">
                <h5 class="fw-bold mb-4 text-primary">Nova Cidade</h5>
                <form action="cadastro_cidade_imoveis.php" method="post">
                    <div class="mb-3">
                        <label class="form-label small fw-bold text-muted">Nome da Cidade</label>
                        <input name="cidade" type="text" class="form-control" placeholder="Ex: Brasília" required>
                    </div>
                    
                    <div class="mb-4">
                        <label class="form-label small fw-bold text-muted">Estado (UF)</label>
                        <select name="estado" class="form-select" required>
                            <option value="" selected disabled>Selecione...</option>
                            <?php 
                                $ufs = ["AC","AL","AP","AM","BA","CE","DF","ES","GO","MA","MT","MS","MG","PA","PB","PR","PE","PI","RJ","RN","RS","RO","RR","SC","SP","SE","TO"];
                                foreach($ufs as $uf) echo "<option value='$uf'>$uf</option>";
                            ?>
                        </select>
                    </div>

                    <button type="submit" class="btn btn-save w-100 shadow-sm">
                        <i class="fas fa-check me-2"></i>Salvar Localidade
                    </button>
                </form>
            </div>
        </div>

        <div class="col-md-7">
            <div class="card card-custom p-4">
                <div class="d-flex justify-content-between align-items-center mb-4">
                    <h5 class="fw-bold m-0">Cidades Atendidas</h5>
                    <span class="badge bg-primary rounded-pill"><?= mysqli_num_rows($con_cidade_busca) ?></span>
                </div>

                <div class="list-container">
                    <?php if(mysqli_num_rows($con_cidade_busca) > 0): ?>
                        <?php while($row = mysqli_fetch_array($con_cidade_busca)): ?>
                            <div class="cidade-item">
                                <div>
                                    <span class="badge badge-uf me-3"><?= $row['estado'] ?></span>
                                    <span class="fw-semibold text-dark"><?= $row['cidade'] ?></span>
                                </div>
                                <a href="delete_cidade_imoveis_cad.php?id=<?= $row['id'] ?>" 
                                   class="delete-btn" 
                                   title="Excluir"
                                   onclick="return confirm('Tem certeza que deseja excluir esta cidade?')">
                                    <i class="fas fa-trash-alt"></i>
                                </a>
                            </div>
                        <?php endwhile; ?>
                    <?php else: ?>
                        <div class="text-center py-5">
                            <i class="fas fa-city fa-3x text-light mb-3"></i>
                            <p class="text-muted">Nenhuma cidade cadastrada ainda.</p>
                        </div>
                    <?php endif; ?>
                </div>
            </div>
        </div>

    </div>
</div>

<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>
<?php mysqli_close($conn); ?>