<?php
/**
 * Manage Land Neighbors
 * Allows users to view auto-detected neighbors and add manual neighbors
 */

define('APP_RUNNING', true);

// Production-ready database connection
$isProduction = (strpos($_SERVER['HTTP_HOST'] ?? '', 'landsecure.co.tz') !== false);

if ($isProduction) {
    // Production database settings
    $db_host = 'localhost';
    $db_user = 'pitechco_mylands';
    $db_pass = 'RomilusK>%+66';
    $db_name = 'pitechco_mylands';
} else {
    // Local development settings
    $db_host = 'localhost';
    $db_user = 'root';
    $db_pass = '';
    $db_name = 'uhakikimadalali';
}

// Create connection
$conn = mysqli_connect($db_host, $db_user, $db_pass, $db_name);
if (!$conn) {
    die("Database connection failed. Please try again later.");
}
mysqli_set_charset($conn, "utf8mb4");

require_once 'includes/auth.php';
require_once 'includes/polygon_functions.php';

initSecureSession();

if(!isAuthenticated() || !validateSession()) {
    header('Location: login');
    exit;
}

$user_id = $_SESSION['user_id'];
$land_id = isset($_GET['id']) ? intval($_GET['id']) : 0;
$message = '';
$error = '';

// Verify land belongs to user
$land = null;
if($land_id > 0) {
    // Check which tables exist for location data
    $hasRegions = false;
    $hasDistricts = false;
    $hasVillages = false;

    $tablesResult = mysqli_query($conn, "SHOW TABLES");
    while ($table = mysqli_fetch_array($tablesResult)) {
        $tableName = strtolower($table[0]);
        if ($tableName == 'regions') $hasRegions = true;
        if ($tableName == 'districts') $hasDistricts = true;
        if ($tableName == 'villages') $hasVillages = true;
    }

    // Check which columns exist in lands table
    $landColumns = [];
    $colResult = mysqli_query($conn, "SHOW COLUMNS FROM lands");
    while ($col = mysqli_fetch_assoc($colResult)) {
        $landColumns[] = strtolower($col['Field']);
    }

    $hasRegionId = in_array('region_id', $landColumns);
    $hasDistrictId = in_array('district_id', $landColumns);
    $hasVillageId = in_array('village_id', $landColumns);

    // Build query dynamically based on available tables and columns
    $selectParts = ["l.*"];
    $joinParts = "";

    if ($hasRegions && $hasRegionId) {
        $selectParts[] = "r.name as region_name";
        $joinParts .= " LEFT JOIN regions r ON l.region_id = r.id";
    }
    if ($hasDistricts && $hasDistrictId) {
        $selectParts[] = "d.name as district_name";
        $joinParts .= " LEFT JOIN districts d ON l.district_id = d.id";
    }
    if ($hasVillages && $hasVillageId) {
        $selectParts[] = "v.name as village_name";
        $joinParts .= " LEFT JOIN villages v ON l.village_id = v.id";
    }

    $selectClause = implode(", ", $selectParts);
    $sql = "SELECT $selectClause FROM lands l $joinParts WHERE l.id = $land_id AND l.user_id = $user_id";

    $result = mysqli_query($conn, $sql);
    if ($result) {
        $land = mysqli_fetch_assoc($result);
    }
}

if(!$land) {
    header('Location: lands');
    exit;
}

// Handle form submissions
if($_SERVER['REQUEST_METHOD'] == 'POST') {
    $action = $_POST['action'] ?? '';

    if($action == 'add_neighbor') {
        $neighbor_name = mysqli_real_escape_string($conn, trim($_POST['neighbor_name'] ?? ''));
        $neighbor_phone = mysqli_real_escape_string($conn, trim($_POST['neighbor_phone'] ?? ''));
        $neighbor_national_id = mysqli_real_escape_string($conn, trim($_POST['neighbor_national_id'] ?? ''));
        $neighbor_direction = mysqli_real_escape_string($conn, $_POST['neighbor_direction'] ?? 'north');

        if(empty($neighbor_name)) {
            $error = 'Neighbor name is required.';
        } else {
            // Generate confirmation code
            $confirmationCode = strtoupper(substr(md5(uniqid()), 0, 8));
            $expiresAt = date('Y-m-d H:i:s', strtotime('+14 days'));

            $sql = "INSERT INTO land_neighbors (
                land_id, neighbor_name, neighbor_phone, neighbor_national_id,
                neighbor_direction, detection_method, confirmation_status,
                confirmation_code, expires_at, created_at
            ) VALUES (
                $land_id, '$neighbor_name', '$neighbor_phone', '$neighbor_national_id',
                '$neighbor_direction', 'manual', 'pending',
                '$confirmationCode', '$expiresAt', NOW()
            )";

            if(mysqli_query($conn, $sql)) {
                $message = "Neighbor '$neighbor_name' added successfully. Confirmation code: $confirmationCode";

                // Log the activity
                mysqli_query($conn, "INSERT INTO activity_logs (user_id, action, description, ip_address)
                    VALUES ($user_id, 'add_neighbor', 'Added neighbor $neighbor_name for land #$land_id', '{$_SERVER['REMOTE_ADDR']}')");
            } else {
                $error = 'Failed to add neighbor. Please try again.';
            }
        }
    }

    if($action == 'remove_neighbor') {
        $neighbor_id = intval($_POST['neighbor_id'] ?? 0);
        if($neighbor_id > 0) {
            // Verify this neighbor belongs to user's land
            $check = mysqli_query($conn, "SELECT ln.id FROM land_neighbors ln
                                         JOIN lands l ON ln.land_id = l.id
                                         WHERE ln.id = $neighbor_id AND l.user_id = $user_id");
            if(mysqli_num_rows($check) > 0) {
                mysqli_query($conn, "DELETE FROM land_neighbors WHERE id = $neighbor_id");
                $message = 'Neighbor removed successfully.';
            }
        }
    }

    if($action == 'rescan_neighbors') {
        // Get land beacon points
        $pointsResult = mysqli_query($conn, "SELECT latitude as lat, longitude as lng FROM beacon_points WHERE land_id = $land_id ORDER BY point_order");
        $points = [];
        while($p = mysqli_fetch_assoc($pointsResult)) {
            $points[] = $p;
        }

        if(count($points) >= 3) {
            $detectedNeighbors = detectNeighbors($conn, $land_id, $points, 50);
            $newCount = saveDetectedNeighbors($conn, $land_id, $detectedNeighbors, true);
            $message = "Neighbor scan complete. Found $newCount new neighbors.";
        } else {
            $error = 'Land must have at least 3 boundary points to detect neighbors.';
        }
    }
}

// Get current neighbors
$neighbors = getLandNeighbors($conn, $land_id);

// Get beacon count
$beaconResult = mysqli_query($conn, "SELECT COUNT(*) as cnt FROM beacon_points WHERE land_id = $land_id");
$beaconCount = mysqli_fetch_assoc($beaconResult)['cnt'] ?? 0;

// Count by status
$confirmedCount = 0;
$pendingCount = 0;
$disputedCount = 0;
foreach($neighbors as $n) {
    if($n['confirmation_status'] == 'confirmed') $confirmedCount++;
    elseif($n['confirmation_status'] == 'pending') $pendingCount++;
    elseif($n['confirmation_status'] == 'disputed') $disputedCount++;
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Manage Neighbors - <?php echo htmlspecialchars($land['land_name']); ?></title>
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
    <link rel="stylesheet" href="assets/font-awesome/css/all.min.css">
    <link href="assets/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">
</head>
<body>
    <?php include 'includes/sidebar.php'; ?>

    <main class="app-main">
        <!-- Page Header -->
        <div class="page-header">
            <div class="page-header-content">
                <div class="page-title">
                    <a href="view_land?id=<?php echo $land_id; ?>" class="back-link">
                        <i class="fas fa-arrow-left"></i>
                    </a>
                    <div>
                        <h1><i class="fas fa-users"></i> Manage Neighbors / Simamia Majirani</h1>
                        <p><?php echo htmlspecialchars($land['land_name']); ?></p>
                    </div>
                </div>
                <div class="page-actions">
                    <form method="POST" style="display:inline;">
                        <input type="hidden" name="action" value="rescan_neighbors">
                        <button type="submit" class="btn-action" <?php echo $beaconCount < 3 ? 'disabled' : ''; ?>>
                            <i class="fas fa-sync-alt"></i> Rescan / Tafuta Upya
                        </button>
                    </form>
                </div>
            </div>
        </div>

        <?php if($message): ?>
        <div class="alert alert-success">
            <i class="fas fa-check-circle"></i> <?php echo $message; ?>
        </div>
        <?php endif; ?>

        <?php if($error): ?>
        <div class="alert alert-danger">
            <i class="fas fa-exclamation-circle"></i> <?php echo $error; ?>
        </div>
        <?php endif; ?>

        <!-- Stats Cards -->
        <div class="stats-row">
            <div class="stat-card">
                <div class="stat-icon total"><i class="fas fa-users"></i></div>
                <div class="stat-info">
                    <span class="stat-value"><?php echo count($neighbors); ?></span>
                    <span class="stat-label">Total Neighbors</span>
                </div>
            </div>
            <div class="stat-card">
                <div class="stat-icon confirmed"><i class="fas fa-check-circle"></i></div>
                <div class="stat-info">
                    <span class="stat-value"><?php echo $confirmedCount; ?></span>
                    <span class="stat-label">Confirmed</span>
                </div>
            </div>
            <div class="stat-card">
                <div class="stat-icon pending"><i class="fas fa-clock"></i></div>
                <div class="stat-info">
                    <span class="stat-value"><?php echo $pendingCount; ?></span>
                    <span class="stat-label">Pending</span>
                </div>
            </div>
            <div class="stat-card">
                <div class="stat-icon disputed"><i class="fas fa-exclamation-triangle"></i></div>
                <div class="stat-info">
                    <span class="stat-value"><?php echo $disputedCount; ?></span>
                    <span class="stat-label">Disputed</span>
                </div>
            </div>
        </div>

        <div class="content-grid">
            <!-- Neighbors List -->
            <div class="content-card">
                <div class="card-header-custom">
                    <h3><i class="fas fa-list"></i> Neighbors / Majirani</h3>
                </div>
                <div class="card-body">
                    <?php if(count($neighbors) > 0): ?>
                    <div class="neighbors-list">
                        <?php foreach($neighbors as $neighbor): ?>
                        <?php
                            $statusClass = '';
                            $statusIcon = '';
                            switch($neighbor['confirmation_status']) {
                                case 'confirmed':
                                    $statusClass = 'status-confirmed';
                                    $statusIcon = 'fa-check-circle';
                                    break;
                                case 'disputed':
                                    $statusClass = 'status-disputed';
                                    $statusIcon = 'fa-exclamation-triangle';
                                    break;
                                case 'no_response':
                                    $statusClass = 'status-expired';
                                    $statusIcon = 'fa-clock';
                                    break;
                                default:
                                    $statusClass = 'status-pending';
                                    $statusIcon = 'fa-hourglass-half';
                            }

                            $directionLabels = [
                                'north' => 'Kaskazini / North',
                                'south' => 'Kusini / South',
                                'east' => 'Mashariki / East',
                                'west' => 'Magharibi / West',
                                'northeast' => 'Kaskazini-Mashariki / NE',
                                'northwest' => 'Kaskazini-Magharibi / NW',
                                'southeast' => 'Kusini-Mashariki / SE',
                                'southwest' => 'Kusini-Magharibi / SW'
                            ];
                        ?>
                        <div class="neighbor-item">
                            <div class="neighbor-direction">
                                <span class="direction-badge direction-<?php echo $neighbor['neighbor_direction']; ?>">
                                    <?php echo strtoupper(substr($neighbor['neighbor_direction'], 0, 2)); ?>
                                </span>
                            </div>
                            <div class="neighbor-info">
                                <h4>
                                    <?php echo htmlspecialchars($neighbor['neighbor_name'] ?: $neighbor['neighbor_user_name'] ?: 'Unknown'); ?>
                                    <?php if($neighbor['detection_method'] == 'auto'): ?>
                                    <span class="auto-badge"><i class="fas fa-robot"></i> Auto</span>
                                    <?php endif; ?>
                                </h4>
                                <p class="neighbor-details">
                                    <span><i class="fas fa-compass"></i> <?php echo $directionLabels[$neighbor['neighbor_direction']] ?? $neighbor['neighbor_direction']; ?></span>
                                    <?php if($neighbor['neighbor_phone'] || $neighbor['neighbor_user_phone']): ?>
                                    <span><i class="fas fa-phone"></i> <?php echo htmlspecialchars($neighbor['neighbor_phone'] ?: $neighbor['neighbor_user_phone']); ?></span>
                                    <?php endif; ?>
                                    <?php if($neighbor['neighbor_national_id']): ?>
                                    <span><i class="fas fa-id-card"></i> ID: <?php echo htmlspecialchars($neighbor['neighbor_national_id']); ?></span>
                                    <?php endif; ?>
                                </p>
                                <?php if($neighbor['neighbor_land_name']): ?>
                                <p class="neighbor-land">
                                    <i class="fas fa-map-marked-alt"></i> Land: <?php echo htmlspecialchars($neighbor['neighbor_land_name']); ?>
                                    <?php if($neighbor['overlap_percentage'] > 0): ?>
                                    <span class="overlap-badge">Overlap: <?php echo $neighbor['overlap_percentage']; ?>%</span>
                                    <?php elseif($neighbor['distance_meters'] !== null): ?>
                                    <span class="distance-badge"><?php echo $neighbor['distance_meters']; ?>m away</span>
                                    <?php endif; ?>
                                </p>
                                <?php endif; ?>
                            </div>
                            <div class="neighbor-status">
                                <span class="status-badge <?php echo $statusClass; ?>">
                                    <i class="fas <?php echo $statusIcon; ?>"></i>
                                    <?php echo ucfirst(str_replace('_', ' ', $neighbor['confirmation_status'])); ?>
                                </span>
                                <?php if($neighbor['confirmed_at']): ?>
                                <small class="confirm-date">
                                    <?php echo date('M d, Y', strtotime($neighbor['confirmed_at'])); ?>
                                </small>
                                <?php endif; ?>
                            </div>
                            <div class="neighbor-actions">
                                <?php if($neighbor['confirmation_status'] == 'pending'): ?>
                                <span class="confirm-code" title="Confirmation Code">
                                    <i class="fas fa-key"></i> <?php echo $neighbor['confirmation_code']; ?>
                                </span>
                                <?php endif; ?>
                                <form method="POST" style="display:inline;" onsubmit="return confirm('Remove this neighbor?');">
                                    <input type="hidden" name="action" value="remove_neighbor">
                                    <input type="hidden" name="neighbor_id" value="<?php echo $neighbor['id']; ?>">
                                    <button type="submit" class="btn-remove" title="Remove">
                                        <i class="fas fa-times"></i>
                                    </button>
                                </form>
                            </div>
                        </div>
                        <?php endforeach; ?>
                    </div>
                    <?php else: ?>
                    <div class="empty-state">
                        <i class="fas fa-users"></i>
                        <h4>No Neighbors Added</h4>
                        <p>Add neighbors manually or click "Rescan" to auto-detect</p>
                    </div>
                    <?php endif; ?>
                </div>
            </div>

            <!-- Add Neighbor Form -->
            <div class="content-card">
                <div class="card-header-custom">
                    <h3><i class="fas fa-user-plus"></i> Add Neighbor Manually</h3>
                </div>
                <div class="card-body">
                    <form method="POST">
                        <input type="hidden" name="action" value="add_neighbor">

                        <div class="form-group">
                            <label>Neighbor Name / Jina la Jirani <span class="required">*</span></label>
                            <input type="text" name="neighbor_name" class="form-control" required
                                   placeholder="Enter full name">
                        </div>

                        <div class="form-group">
                            <label>Phone Number / Namba ya Simu</label>
                            <input type="tel" name="neighbor_phone" class="form-control"
                                   placeholder="e.g., 0712345678">
                        </div>

                        <div class="form-group">
                            <label>National ID / Namba ya Kitambulisho</label>
                            <input type="text" name="neighbor_national_id" class="form-control"
                                   placeholder="e.g., 19850101-12345-00001-23">
                        </div>

                        <div class="form-group">
                            <label>Direction from Your Land / Upande <span class="required">*</span></label>
                            <select name="neighbor_direction" class="form-control" required>
                                <option value="north">Kaskazini / North</option>
                                <option value="south">Kusini / South</option>
                                <option value="east">Mashariki / East</option>
                                <option value="west">Magharibi / West</option>
                                <option value="northeast">Kaskazini-Mashariki / Northeast</option>
                                <option value="northwest">Kaskazini-Magharibi / Northwest</option>
                                <option value="southeast">Kusini-Mashariki / Southeast</option>
                                <option value="southwest">Kusini-Magharibi / Southwest</option>
                            </select>
                        </div>

                        <button type="submit" class="btn-primary btn-block">
                            <i class="fas fa-plus"></i> Add Neighbor / Ongeza Jirani
                        </button>
                    </form>

                    <div class="info-box">
                        <h5><i class="fas fa-info-circle"></i> How Confirmation Works</h5>
                        <ul>
                            <li>Each neighbor receives a confirmation code</li>
                            <li>They can confirm via app, SMS, or in person at village office</li>
                            <li>Village officials can also confirm on behalf of neighbors</li>
                            <li>National ID may be required for confirmation</li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </main>

    <style>
    .page-header {
        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
        border-radius: 20px;
        padding: 30px;
        margin-bottom: 30px;
        color: white;
    }

    .page-header-content {
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-wrap: wrap;
        gap: 20px;
    }

    .page-title {
        display: flex;
        align-items: center;
        gap: 20px;
    }

    .back-link {
        width: 48px;
        height: 48px;
        background: rgba(255,255,255,0.2);
        border-radius: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        color: white;
        text-decoration: none;
        transition: all 0.3s;
    }

    .back-link:hover {
        background: rgba(255,255,255,0.3);
        color: white;
    }

    .page-title h1 {
        font-size: 24px;
        font-weight: 700;
        margin: 0;
    }

    .page-title p {
        margin: 0;
        opacity: 0.9;
    }

    .btn-action {
        padding: 12px 24px;
        background: rgba(255,255,255,0.2);
        border: 2px solid rgba(255,255,255,0.3);
        color: white;
        border-radius: 12px;
        font-weight: 600;
        cursor: pointer;
        transition: all 0.3s;
    }

    .btn-action:hover:not(:disabled) {
        background: white;
        color: #667eea;
    }

    .btn-action:disabled {
        opacity: 0.5;
        cursor: not-allowed;
    }

    .stats-row {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
        gap: 20px;
        margin-bottom: 30px;
    }

    .stat-card {
        background: white;
        border-radius: 16px;
        padding: 20px;
        display: flex;
        align-items: center;
        gap: 16px;
        box-shadow: 0 4px 20px rgba(0,0,0,0.05);
    }

    .stat-icon {
        width: 56px;
        height: 56px;
        border-radius: 14px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 24px;
        color: white;
    }

    .stat-icon.total { background: linear-gradient(135deg, #667eea, #764ba2); }
    .stat-icon.confirmed { background: linear-gradient(135deg, #22c55e, #16a34a); }
    .stat-icon.pending { background: linear-gradient(135deg, #f59e0b, #d97706); }
    .stat-icon.disputed { background: linear-gradient(135deg, #ef4444, #dc2626); }

    .stat-value {
        display: block;
        font-size: 28px;
        font-weight: 700;
        color: #1e293b;
    }

    .stat-label {
        font-size: 14px;
        color: #64748b;
    }

    .content-grid {
        display: grid;
        grid-template-columns: 2fr 1fr;
        gap: 24px;
    }

    @media (max-width: 1024px) {
        .content-grid {
            grid-template-columns: 1fr;
        }
    }

    .content-card {
        background: white;
        border-radius: 20px;
        box-shadow: 0 4px 20px rgba(0,0,0,0.05);
        overflow: hidden;
    }

    .card-header-custom {
        padding: 20px 24px;
        border-bottom: 1px solid #f1f5f9;
    }

    .card-header-custom h3 {
        font-size: 16px;
        font-weight: 600;
        margin: 0;
        color: #1e293b;
    }

    .card-body {
        padding: 24px;
    }

    .neighbors-list {
        display: flex;
        flex-direction: column;
        gap: 16px;
    }

    .neighbor-item {
        display: flex;
        align-items: center;
        gap: 16px;
        padding: 16px;
        background: #f8fafc;
        border-radius: 12px;
        transition: all 0.3s;
    }

    .neighbor-item:hover {
        background: #f1f5f9;
    }

    .direction-badge {
        width: 48px;
        height: 48px;
        border-radius: 12px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-weight: 700;
        font-size: 14px;
        color: white;
    }

    .direction-north, .direction-south { background: linear-gradient(135deg, #3b82f6, #1d4ed8); }
    .direction-east, .direction-west { background: linear-gradient(135deg, #22c55e, #16a34a); }
    .direction-northeast, .direction-northwest,
    .direction-southeast, .direction-southwest { background: linear-gradient(135deg, #f59e0b, #d97706); }

    .neighbor-info {
        flex: 1;
        min-width: 0;
    }

    .neighbor-info h4 {
        font-size: 15px;
        font-weight: 600;
        color: #1e293b;
        margin: 0 0 4px;
        display: flex;
        align-items: center;
        gap: 8px;
    }

    .auto-badge {
        font-size: 10px;
        padding: 2px 8px;
        background: linear-gradient(135deg, #8b5cf6, #7c3aed);
        color: white;
        border-radius: 10px;
        font-weight: 600;
    }

    .neighbor-details {
        display: flex;
        flex-wrap: wrap;
        gap: 12px;
        font-size: 13px;
        color: #64748b;
        margin: 0;
    }

    .neighbor-land {
        font-size: 12px;
        color: #94a3b8;
        margin: 4px 0 0;
    }

    .overlap-badge {
        background: #fee2e2;
        color: #dc2626;
        padding: 2px 8px;
        border-radius: 8px;
        font-size: 11px;
        font-weight: 600;
    }

    .distance-badge {
        background: #dbeafe;
        color: #2563eb;
        padding: 2px 8px;
        border-radius: 8px;
        font-size: 11px;
        font-weight: 600;
    }

    .neighbor-status {
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        gap: 4px;
    }

    .status-badge {
        display: inline-flex;
        align-items: center;
        gap: 6px;
        padding: 6px 12px;
        border-radius: 20px;
        font-size: 12px;
        font-weight: 600;
    }

    .status-confirmed { background: #d1fae5; color: #059669; }
    .status-pending { background: #fef3c7; color: #d97706; }
    .status-disputed { background: #fee2e2; color: #dc2626; }
    .status-expired { background: #e2e8f0; color: #64748b; }

    .confirm-date {
        font-size: 11px;
        color: #94a3b8;
    }

    .neighbor-actions {
        display: flex;
        align-items: center;
        gap: 10px;
    }

    .confirm-code {
        font-size: 11px;
        font-family: monospace;
        background: #e2e8f0;
        padding: 4px 8px;
        border-radius: 6px;
        color: #64748b;
    }

    .btn-remove {
        width: 32px;
        height: 32px;
        border-radius: 8px;
        border: none;
        background: #fee2e2;
        color: #dc2626;
        cursor: pointer;
        transition: all 0.3s;
    }

    .btn-remove:hover {
        background: #dc2626;
        color: white;
    }

    .empty-state {
        text-align: center;
        padding: 40px;
        color: #64748b;
    }

    .empty-state i {
        font-size: 48px;
        margin-bottom: 16px;
        opacity: 0.5;
    }

    .form-group {
        margin-bottom: 20px;
    }

    .form-group label {
        display: block;
        font-weight: 500;
        color: #475569;
        margin-bottom: 8px;
    }

    .required { color: #ef4444; }

    .form-control {
        width: 100%;
        padding: 12px 16px;
        border: 2px solid #e2e8f0;
        border-radius: 10px;
        font-size: 15px;
        transition: all 0.3s;
    }

    .form-control:focus {
        outline: none;
        border-color: #667eea;
        box-shadow: 0 0 0 4px rgba(102, 126, 234, 0.1);
    }

    .btn-primary {
        width: 100%;
        padding: 14px;
        background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
        color: white;
        border: none;
        border-radius: 12px;
        font-weight: 600;
        font-size: 15px;
        cursor: pointer;
        transition: all 0.3s;
    }

    .btn-primary:hover {
        transform: translateY(-2px);
        box-shadow: 0 6px 20px rgba(102, 126, 234, 0.4);
    }

    .info-box {
        margin-top: 24px;
        padding: 16px;
        background: linear-gradient(135deg, rgba(102, 126, 234, 0.1) 0%, rgba(118, 75, 162, 0.1) 100%);
        border-radius: 12px;
        border-left: 4px solid #667eea;
    }

    .info-box h5 {
        font-size: 14px;
        font-weight: 600;
        color: #667eea;
        margin: 0 0 12px;
    }

    .info-box ul {
        margin: 0;
        padding-left: 18px;
        font-size: 13px;
        color: #475569;
    }

    .info-box li {
        margin-bottom: 6px;
    }

    .alert {
        border: none;
        border-radius: 14px;
        padding: 16px 20px;
        margin-bottom: 25px;
        display: flex;
        align-items: center;
        gap: 12px;
    }

    .alert-success {
        background: linear-gradient(135deg, rgba(34, 197, 94, 0.1) 0%, rgba(22, 163, 74, 0.1) 100%);
        color: #166534;
        border-left: 4px solid #22c55e;
    }

    .alert-danger {
        background: linear-gradient(135deg, rgba(239, 68, 68, 0.1) 0%, rgba(220, 38, 38, 0.1) 100%);
        color: #991b1b;
        border-left: 4px solid #ef4444;
    }

    @media (max-width: 768px) {
        .page-header-content {
            flex-direction: column;
            align-items: flex-start;
        }

        .neighbor-item {
            flex-direction: column;
            text-align: center;
        }

        .neighbor-status {
            align-items: center;
        }
    }
    </style>

    <script src="assets/vendor/jquery/jquery.min.js"></script>
    <script src="assets/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
</body>
</html>
