<?php

include "../../config/master.php";

allowRoles([1,5,6]);

include "../layout/header.php";

/* HIDE SIDEBAR */
echo "<style>
.sidebar{display:none !important;}
.topbar{margin-left:0 !important;}
.main{margin-left:0 !important;padding-bottom:80px;}
</style>";

$role_id = $_SESSION['role_id'];
$village_id = $_SESSION['village_id'] ?? 0;

$search = $_GET['search'] ?? '';

$where = "WHERE 1";

if($role_id != 1){
    $where .= " AND village_id='".intval($village_id)."'";
}

if($search != ''){
    $search_safe = mysqli_real_escape_string($conn,$search);
    $where .= " AND family_head LIKE '%$search_safe%'";
}

$query = mysqli_query($conn,"
SELECT f.*,
(SELECT COUNT(*) FROM family_members m WHERE m.family_id=f.id)+1 as members
FROM families f
$where
ORDER BY f.id DESC
");

?>

<div class="app-content">

<!-- HEADER -->
<div class="card-box">
    <h4>Families</h4>
    <p style="font-size:12px;color:#777;">Manage village families</p>
</div>

<!-- SEARCH -->
<form method="GET" style="display:flex;gap:10px;margin-bottom:15px;">

<input type="text" name="search"
placeholder="Search family head..."
value="<?php echo htmlspecialchars($search); ?>"
class="form-control">

<button type="submit" style="
padding:12px 15px;
background:#2c3e50;
color:white;
border:none;
border-radius:10px;
">
<i class="fa fa-search"></i>
</button>

</form>

<!-- LIST -->
<?php if(mysqli_num_rows($query) > 0){ ?>

<?php while($row=mysqli_fetch_assoc($query)){ ?>

<div class="card-box">

<h5 style="margin:0;"><?php echo htmlspecialchars($row['family_head']); ?></h5>

<p style="font-size:12px;color:#666;margin:4px 0;">
🏠 House No: <?php echo htmlspecialchars($row['house_number']); ?>
</p>

<p style="font-size:12px;color:#666;margin:0;">
📞 <?php echo htmlspecialchars($row['mobile']); ?>
</p>

<p style="font-size:12px;color:#999;margin-top:4px;">
👨‍👩‍👧 Members: <b><?php echo $row['members']; ?></b>
</p>

<!-- ACTION ICONS -->
<div style="display:flex;gap:8px;margin-top:12px;">

<a href="../members/view_members.php?family_id=<?php echo $row['id']; ?>"
class="action-btn green">
<i class="fa fa-eye"></i>
</a>

<a href="../members/add_member.php?family_id=<?php echo $row['id']; ?>"
class="action-btn blue">
<i class="fa fa-user-plus"></i>
</a>

<a href="edit_family.php?id=<?php echo $row['id']; ?>"
class="action-btn orange">
<i class="fa fa-pen"></i>
</a>

<a href="delete_family.php?id=<?php echo $row['id']; ?>"
onclick="return confirm('Delete family?')"
class="action-btn red">
<i class="fa fa-trash"></i>
</a>

</div>

</div>

<?php } ?>

<?php } else { ?>

<div class="card-box" style="text-align:center;">
No families found
</div>

<?php } ?>

</div>

<!-- ===== UPDATED BOTTOM NAV ===== -->

<style>
.bottom-nav{
position:fixed;
bottom:0;
left:0;
width:100%;
height:65px;
background:#fff;
border-top:1px solid #ddd;
display:flex;
justify-content:space-around;
align-items:center;
z-index:1000;
}

.bottom-nav a{
text-decoration:none;
color:#888;
font-size:11px;
text-align:center;
flex:1;
}

.bottom-nav a i{
display:block;
font-size:20px;
margin-bottom:3px;
}

.bottom-nav a.active{
color:#007bff;
}

/* ACTION BUTTON STYLE */
.action-btn{
flex:1;
text-align:center;
padding:10px;
border-radius:10px;
color:white;
text-decoration:none;
font-size:16px;
}

.green{background:#27ae60;}
.blue{background:#2980b9;}
.orange{background:#f39c12;}
.red{background:#e74c3c;}
</style>

<div class="bottom-nav">
    <a href="../dashboard.php">
        <i class="fa fa-home"></i>
        Home
    </a>

    <a href="../villages/village_data.php">
        <i class="fa fa-map"></i>
        Villages
    </a>

    <a href="../families/view_families.php">
        <i class="fa fa-users"></i>
        Families
    </a>

    <a href="view_schemes.php" class="active">
        <i class="fa fa-list"></i>
        Schemes
    </a>
</div>

<?php include "../layout/footer.php"; ?>