<?php
require_once 'includes/api_helper.php';

// بررسی لاگین کاربر
if (!isset($_SESSION['token']) || empty($_SESSION['token'])) {
    header("Location: login.php");
    exit;
}

// دریافت اطلاعات کاربر (نام واقعی از API)
$me_response = callAPI('GET', '/auth/me');
$userName = $me_response['data']['name'] ?? ($_SESSION['user_name'] ?? 'کاربر');

// دریافت لیست ساختمان‌ها
$buildings_response = callAPI('GET', '/buildings');
$active_building = null;

if (isset($buildings_response['success']) && $buildings_response['success'] === true && !empty($buildings_response['data'])) {
    $active_building = $buildings_response['data'][0];
    $_SESSION['active_building_id'] = $active_building['id'];
}

$building_id = (int) ($active_building['id'] ?? 0);

// دریافت اعلانات برای عدد زنگوله
$notif_response = callAPI('GET', '/notifications');
$unread_notifs = 0;
if (isset($notif_response['success']) && $notif_response['success'] === true) {
    foreach ($notif_response['data'] as $notif) {
        if (empty($notif['is_read'])) {
            $unread_notifs++;
        }
    }
}

// ---------- داده‌های واقعی داشبورد (بر اساس ساختمان فعال) ----------

// اعضای ساختمان
$members_count = 0;
if ($building_id > 0) {
    $members_response = callAPI('GET', '/buildings/' . $building_id . '/members');
    if (isset($members_response['success']) && $members_response['success'] === true) {
        $members_count = is_array($members_response['data']) ? count($members_response['data']) : 0;
    }
}

// اعلان‌های اخیر (ماژول اطلاعیه‌ها)
$announcements = [];
if ($building_id > 0) {
    $announcements_response = callAPI('GET', '/announcements?building_id=' . $building_id);
    if (isset($announcements_response['success']) && $announcements_response['success'] === true) {
        $announcements = is_array($announcements_response['data']) ? $announcements_response['data'] : [];
    }
}

// درخواست‌های اخیر (ماژول تعمیرات)
$maintenance_requests = [];
if ($building_id > 0) {
    $maintenance_response = callAPI('GET', '/maintenance?building_id=' . $building_id);
    if (isset($maintenance_response['success']) && $maintenance_response['success'] === true) {
        $maintenance_requests = is_array($maintenance_response['data']) ? $maintenance_response['data'] : [];
    }
}

// درخواست‌های فعال (در انتظار / در حال بررسی)
$active_requests_count = 0;
foreach ($maintenance_requests as $mr) {
    if (in_array($mr['status'] ?? '', ['pending', 'in_progress'], true)) {
        $active_requests_count++;
    }
}

// وضعیت مالی ساختمان
$financial = [
    'total_costs' => 0,
    'total_collected' => 0,
    'total_remaining' => 0,
    'collection_percentage' => 0,
];
if ($building_id > 0) {
    $financial_response = callAPI('GET', '/costs/summary?building_id=' . $building_id);
    if (isset($financial_response['success']) && $financial_response['success'] === true) {
        $financial = array_merge($financial, $financial_response['data']);
    }
}

// وضعیت نمایشی درخواست‌ها: برچسب و کلاس بج
$request_status_map = [
    'pending' => ['label' => 'جدید', 'class' => 'new'],
    'in_progress' => ['label' => 'در حال بررسی', 'class' => 'warning'],
    'resolved' => ['label' => 'تکمیل شد', 'class' => 'done'],
    'closed' => ['label' => 'بسته شد', 'class' => 'done'],
    'rejected' => ['label' => 'رد شده', 'class' => 'done'],
];
?>

<!DOCTYPE html>
<html lang="fa" dir="rtl">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>داشبورد ساختمان پارسیان</title>
    <!-- بارگذاری فونت زیبا و استاندارد وزیرمتن -->
    <link href="https://cdn.jsdelivr.net/gh/rastikerdar/vazirmatn@v33.003/Vazirmatn-font-face.css" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" href="assets/css/style.css">
</head>

<body class="app-body">

    <div class="app-container">



        <!-- هدر برنامه -->
        <header class="app-header">
            <div class="header-profile-section">
                <div class="notification-bell" onclick="window.location.href='notifications.php'" style="cursor:pointer;" role="link" aria-label="اعلانات">
                    <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
                        <path d="M18 8A6 6 0 0 0 6 8c0 7-3 9-3 9h18s-3-2-3-9"></path>
                        <path d="M13.73 21a2 2 0 0 1-3.46 0"></path>
                    </svg>
                    <?php if ($unread_notifs > 0): ?>
                        <span class="badge"><?= $unread_notifs ?></span>
                    <?php endif; ?>
                </div>
            </div>

            <div class="header-title-text">
                <h1>داشبورد</h1>
                <p>به خانه‌تان خوش آمدید 👋</p>
            </div>

            <div class="menu-hamburger">
                <span></span>
                <span style="width: 14px; align-self: flex-start; margin-right: 12px;"></span>
                <span></span>
            </div>
        </header>

        <!-- کارت بزرگ معرفی ساختمان -->
        <section class="building-hero-card">

            <div class="building-details-wrapper">
                <div class="building-header-row">
                    <div class="building-name-container">
                        <h2>
                            <?= htmlspecialchars($active_building['name'] ?? 'ساختمانی یافت نشد') ?>
                            <svg width="10" height="6" viewBox="0 0 10 6" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
                                <path d="m1 1 4 4 4-4" />
                            </svg>
                        </h2>
                        <p><?= htmlspecialchars($userName) ?></p>
                    </div>
                    <div class="building-logo-icon">
                        <svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="<?= htmlspecialchars($active_building['theme_color'] ?? 'var(--gold-primary)') ?>" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
                            <rect x="2" y="10" width="4" height="11" rx="1" />
                            <rect x="8" y="2" width="4" height="19" rx="1" />
                            <rect x="14" y="8" width="4" height="13" rx="1" />
                            <rect x="20" y="13" width="2" height="8" rx="1" />
                        </svg>
                    </div>
                </div>

                <div class="building-meta-specs" style="font-size: 10px; opacity: 0.8; margin-top: 4px;">
                    <?= htmlspecialchars($active_building['address'] ?? 'لطفا یک ساختمان ثبت کنید') ?>
                </div>

                <?php if ($active_building): ?>
                    <button class="btn-view-profile" onclick="window.location.href='building_view.php?id=<?= $active_building['id'] ?>'">
                        <span>مشاهده پروفایل ساختمان</span>
                        <svg width="6" height="10" viewBox="0 0 6 10" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round">
                            <path d="M5 9 1 5l4-4" />
                        </svg>
                    </button>
                <?php else: ?>
                    <button class="btn-view-profile" onclick="window.location.href='building_add.php'">
                        <span>ثبت ساختمان جدید</span>
                        <svg width="6" height="10" viewBox="0 0 6 10" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round">
                            <path d="M5 9 1 5l4-4" />
                        </svg>
                    </button>
                <?php endif; ?>
            </div>
            <div class="building-image-wrapper">
                <?php if (!empty($active_building['custom_logo_path'])): ?>
                    <img src="<?= htmlspecialchars($active_building['custom_logo_path']) ?>" alt="<?= htmlspecialchars($active_building['name']) ?>">
                <?php else: ?>
                    <img src="https://images.unsplash.com/photo-1545324418-cc1a3fa10c00?auto=format&fit=crop&w=300&q=80" alt="ساختمان پیش‌فرض">
                <?php endif; ?>
            </div>
        </section>

        <!-- کارت سفید آمار ۴ ستونه -->
        <section class="statistics-grid-card">
            <!-- ستون ۱ (راست) -->
            <div class="stat-column">
                <div class="stat-icon-box purple">
                    <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
                        <rect x="2" y="4" width="20" height="16" rx="2" />
                        <line x1="12" y1="20" x2="12" y2="4" />
                    </svg>
                </div>
                <div class="stat-numeric-value"><?= fa_number($financial['total_remaining']) ?></div>
                <div class="stat-text-label">مانده حساب ساختمان</div>
                <div class="stat-growth-rate link" onclick="window.location.href='costs.php?building_id=<?= (int) $building_id ?>'" style="cursor:pointer;">
                    مشاهده جزئیات
                    <svg width="4" height="7" viewBox="0 0 6 10" fill="none" stroke="currentColor" stroke-width="2">
                        <path d="M5 9 1 5l4-4" />
                    </svg>
                </div>
            </div>

            <!-- ستون ۲ -->
            <div class="stat-column">
                <div class="stat-icon-box orange">
                    <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
                        <path d="M18 8A6 6 0 0 0 6 8c0 7-3 9-3 9h18s-3-2-3-9"></path>
                    </svg>
                </div>
                <div class="stat-numeric-value"><?= fa_digits($unread_notifs) ?></div>
                <div class="stat-text-label">اعلان‌های جدید</div>
                <div class="stat-growth-rate up">
                    <span>خوانده نشده</span>
                    <span style="color:var(--text-gray); font-size:7px; font-weight:normal;">امروز</span>
                </div>
            </div>

            <!-- ستون ۳ -->
            <div class="stat-column">
                <div class="stat-icon-box blue">
                    <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
                        <path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z" />
                        <polyline points="14 2 14 8 20 8" />
                        <line x1="16" y1="13" x2="8" y2="13" />
                        <line x1="16" y1="17" x2="8" y2="17" />
                        <polyline points="10 9 9 9 8 9" />
                    </svg>
                </div>
                <div class="stat-numeric-value"><?= fa_digits($active_requests_count) ?></div>
                <div class="stat-text-label">درخواست فعال</div>
                <div class="stat-growth-rate up">
                    <span>در جریان</span>
                    <span style="color:var(--text-gray); font-size:7px; font-weight:normal;">تعمیرات</span>
                </div>
            </div>

            <!-- ستون ۴ (چپ) -->
            <div class="stat-column">
                <div class="stat-icon-box teal">
                    <svg width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
                        <path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2" />
                        <circle cx="9" cy="7" r="4" />
                        <path d="M23 21v-2a4 4 0 0 0-3-3.87" />
                        <path d="M16 3.13a4 4 0 0 1 0 7.75" />
                    </svg>
                </div>
                <div class="stat-numeric-value"><?= fa_digits($members_count) ?></div>
                <div class="stat-text-label">اعضای ساختمان</div>
                <div class="stat-growth-rate up">
                    <span>عضو فعال</span>
                    <span style="color:var(--text-gray); font-size:7px; font-weight:normal;">ساختمان</span>
                </div>
            </div>
        </section>

        <!-- بخش دسترسی سریع -->
        <section class="quick-access-section">
            <div class="section-header-row">
                <h2 class="section-title">دسترسی سریع</h2>
                <a class="edit-action-btn" href="building_edit.php?id=<?= (int) $building_id ?>" onclick="event.stopPropagation();">
                    <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                        <path d="M12 20h9" />
                        <path d="M16.5 3.5a2.121 2.121 0 0 1 3 3L7 19l-4 1 1-4L16.5 3.5z" />
                    </svg>
                    ویرایش
                </a>
            </div>

            <div class="quick-buttons-row">
                <!-- آیتم ۱ -->
                <div class="quick-btn-item" onclick="window.location.href='reports.php?building_id=<?= (int) $building_id ?>'" style="cursor:pointer;">
                    <svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="#0ea5e9" stroke-width="2">
                        <rect x="3" y="3" width="18" height="18" rx="2" />
                        <line x1="9" y1="9" x2="15" y2="9" />
                        <line x1="9" y1="13" x2="15" y2="13" />
                        <line x1="9" y1="17" x2="13" y2="17" />
                    </svg>
                    <span>گزارش‌ها</span>
                </div>
                <!-- آیتم ۲ -->
                <div class="quick-btn-item" onclick="window.location.href='maintenance.php?building_id=<?= (int) $building_id ?>'" style="cursor:pointer;">
                    <svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="#f97316" stroke-width="2">
                        <path d="M14.7 6.3a1 1 0 0 0 0 1.4l1.6 1.6a1 1 0 0 0 1.4 0l3.77-3.77a6 6 0 0 1-7.94 7.94l-6.91 6.91a2.12 2.12 0 0 1-3-3l6.91-6.91a6 6 0 0 1 7.94-7.94l-3.76 3.76z" />
                    </svg>
                    <span>تاسیسات</span>
                </div>
                <!-- آیتم ۳ -->
                <div class="quick-btn-item" onclick="window.location.href='visitors.php?building_id=<?= (int) $building_id ?>'" style="cursor:pointer;">
                    <svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="#a855f7" stroke-width="2">
                        <rect x="3" y="4" width="18" height="18" rx="2" />
                        <line x1="16" y1="2" x2="16" y2="6" />
                        <line x1="8" y1="2" x2="8" y2="6" />
                        <line x1="3" y1="10" x2="21" y2="10" />
                    </svg>
                    <span>بازدیدها</span>
                </div>
                <!-- آیتم ۴ -->
                <div class="quick-btn-item" onclick="window.location.href='documents.php?building_id=<?= (int) $building_id ?>'" style="cursor:pointer;">
                    <svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="#3b82f6" stroke-width="2">
                        <path d="M22 19a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h5l2 3h9a2 2 0 0 1 2 2z" />
                    </svg>
                    <span>مدارک ساختمان</span>
                </div>
                <!-- آیتم ۵ -->
                <div class="quick-btn-item" onclick="window.location.href='members.php?building_id=<?= (int) $building_id ?>'" style="cursor:pointer;">
                    <svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="#10b981" stroke-width="2">
                        <path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2" />
                        <circle cx="9" cy="7" r="4" />
                    </svg>
                    <span>اعضا</span>
                </div>
            </div>
        </section>

        <!-- بخش ستون‌های دوتایی -->
        <section class="split-widgets-container">

            <!-- ستون راست: اعلان‌های اخیر (روشن) -->
            <div class="widget-column-box">
                <div class="widget-box-header">
                    <h3>اعلان‌های اخیر</h3>
                    <span class="widget-view-all-link gold" onclick="window.location.href='announcements.php?building_id=<?= (int) $building_id ?>'" style="cursor:pointer;">مشاهده همه</span>
                </div>

                <div class="light-announcements-card">
                    <?php if (empty($announcements)): ?>
                        <!-- حالت خالی -->
                        <div class="announcement-list-item">
                            <div class="announcement-icon-wrapper blue">
                                <svg width="14" height="14" viewBox="0 0 24 24" fill="currentColor">
                                    <path d="M12 2.69l5.66 5.66a8 8 0 1 1-11.31 0z" />
                                </svg>
                            </div>
                            <div class="announcement-text-content">
                                <div class="announcement-top-row">
                                    <span class="announcement-item-title">اطلاعیه‌ای ثبت نشده</span>
                                    <span class="announcement-item-time"></span>
                                </div>
                                <p class="announcement-item-description">هنوز اطلاعیه‌ای برای این ساختمان ثبت نشده است.</p>
                            </div>
                        </div>
                    <?php else: ?>
                        <?php
                        $announcement_icons = [
                            ['color' => 'blue', 'type' => 'bell'],
                            ['color' => 'red', 'type' => 'calendar'],
                            ['color' => 'green', 'type' => 'wallet'],
                        ];
                        $i = 0;
                        foreach (array_slice($announcements, 0, 3) as $announcement):
                            $icon = $announcement_icons[$i % 3];
                            $i++;
                        ?>
                            <div class="announcement-list-item">
                                <div class="announcement-icon-wrapper <?= $icon['color'] ?>">
                                    <?php if ($icon['type'] === 'bell'): ?>
                                        <svg width="14" height="14" viewBox="0 0 24 24" fill="currentColor">
                                            <path d="M12 2.69l5.66 5.66a8 8 0 1 1-11.31 0z" />
                                        </svg>
                                    <?php elseif ($icon['type'] === 'calendar'): ?>
                                        <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5">
                                            <rect x="3" y="4" width="18" height="18" rx="2" />
                                            <line x1="16" y1="2" x2="16" y2="6" />
                                            <line x1="8" y1="2" x2="8" y2="6" />
                                        </svg>
                                    <?php else: ?>
                                        <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5">
                                            <rect x="2" y="5" width="20" height="14" rx="2" />
                                            <line x1="12" y1="15" x2="12" y2="15" />
                                        </svg>
                                    <?php endif; ?>
                                </div>
                                <div class="announcement-text-content">
                                    <div class="announcement-top-row">
                                        <span class="announcement-item-title"><?= htmlspecialchars($announcement['title'] ?? '') ?></span>
                                        <span class="announcement-item-time"><?= htmlspecialchars(fa_time_ago($announcement['created_at'] ?? '')) ?></span>
                                    </div>
                                    <p class="announcement-item-description"><?= htmlspecialchars($announcement['content'] ?? '') ?></p>
                                </div>
                            </div>
                        <?php endforeach; ?>
                    <?php endif; ?>

                    <button class="btn-show-all-announcements" onclick="window.location.href='announcements.php?building_id=<?= (int) $building_id ?>'">
                        مشاهده همه اعلان‌ها
                        <svg width="5" height="8" viewBox="0 0 6 10" fill="none" stroke="currentColor" stroke-width="2">
                            <path d="M5 9 1 5l4-4" />
                        </svg>
                    </button>
                </div>
            </div>

            <!-- ستون چپ: درخواست‌های اخیر (تیره) -->
            <div class="widget-column-box">
                <div class="widget-box-header dark">
                    <h3 style="color: white;">درخواست‌های اخیر</h3>
                    <span class="widget-view-all-link" onclick="window.location.href='maintenance.php?building_id=<?= (int) $building_id ?>'" style="cursor:pointer;">مشاهده همه</span>
                </div>

                <div class="dark-requests-card">
                    <?php if (empty($maintenance_requests)): ?>
                        <!-- حالت خالی -->
                        <div class="request-list-item">
                            <div class="request-item-right-info">
                                <div class="request-icon-container">
                                    <svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="var(--blue-info)" stroke-width="2">
                                        <path d="m3 16 4 4 4-4M7 20V4M21 8l-4-4-4 4M17 4v16" />
                                    </svg>
                                </div>
                                <div class="request-text-meta">
                                    <h4>درخواستی ثبت نشده</h4>
                                    <p>هنوز درخواست تعمیراتی وجود ندارد</p>
                                </div>
                            </div>
                            <span class="request-badge-status new">جدید</span>
                        </div>
                    <?php else: ?>
                        <?php
                        $request_icons = [
                            'wrench' => '<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="var(--blue-info)" stroke-width="2"><path d="m3 16 4 4 4-4M7 20V4M21 8l-4-4-4 4M17 4v16" /></svg>',
                            'shield' => '<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="var(--blue-info)" stroke-width="2"><path d="M12 2.69l5.66 5.66a8 8 0 1 1-11.31 0z" /></svg>',
                            'bulb' => '<svg width="14" height="14" viewBox="0 0 24 24" fill="none" stroke="var(--gold-primary)" stroke-width="2"><path d="M15 14c.2-1 .7-1.7 1.5-2.5 1-.9 1.5-2.2 1.5-3.5A5 5 0 0 0 8 8c0 1 .3 2.2 1 3M9 18h6M10 22h4" /></svg>',
                        ];
                        $request_icon_keys = ['wrench', 'shield', 'bulb'];
                        $i = 0;
                        foreach (array_slice($maintenance_requests, 0, 3) as $mr):
                            $icon_key = $request_icon_keys[$i % 3];
                            $i++;
                            $status = $request_status_map[$mr['status'] ?? ''] ?? ['label' => 'در انتظار', 'class' => 'warning'];
                        ?>
                            <div class="request-list-item">
                                <div class="request-item-right-info">
                                    <div class="request-icon-container">
                                        <?= $request_icons[$icon_key] ?>
                                    </div>
                                    <div class="request-text-meta">
                                        <h4><?= htmlspecialchars($mr['title'] ?? '') ?></h4>
                                        <p><?= htmlspecialchars(fa_time_ago($mr['created_at'] ?? '')) ?></p>
                                    </div>
                                </div>
                                <span class="request-badge-status <?= $status['class'] ?>"><?= htmlspecialchars($status['label']) ?></span>
                            </div>
                        <?php endforeach; ?>
                    <?php endif; ?>

                    <button class="btn-add-new-request" onclick="window.location.href='maintenance.php?building_id=<?= (int) $building_id ?>'">
                        <svg width="12" height="12" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5">
                            <line x1="12" y1="5" x2="12" y2="19" />
                            <line x1="5" y1="12" x2="19" y2="12" />
                        </svg>
                        ثبت درخواست جدید
                    </button>
                </div>
            </div>

        </section>

        <!-- کارت وضعیت مالی ساختمان -->
        <section class="financial-overview-card">
            <div class="financial-card-header" onclick="window.location.href='costs.php?building_id=<?= (int) $building_id ?>'" style="cursor:pointer;">
                <h3>وضعیت مالی ساختمان</h3>
                <span>مشاهده جزئیات</span>
            </div>

            <div class="financial-data-row">
                <!-- نمودار دایره‌ای سمت راست -->
                <div class="gauge-chart-container">
                    <svg width="72" height="72" viewBox="0 0 36 36">
                        <!-- دایره پس‌زمینه خاکستری تیره -->
                        <path d="M18 2.0845 a 15.9155 15.9155 0 0 1 0 31.831 a 15.9155 15.9155 0 0 1 0 -31.831" fill="none" stroke="rgba(255,255,255,0.06)" stroke-width="2.8" />
                        <!-- دایره رنگی طلایی مقدار درصد وصولی واقعی -->
                        <path d="M18 2.0845 a 15.9155 15.9155 0 0 1 0 31.831 a 15.9155 15.9155 0 0 1 0 -31.831" fill="none" stroke="url(#goldGradient)" stroke-width="2.8" stroke-dasharray="<?= max(0, min(100, (float) ($financial['collection_percentage'] ?? 0))) ?>, 100" stroke-linecap="round" />
                        <defs>
                            <linearGradient id="goldGradient" x1="0%" y1="0%" x2="100%" y2="100%">
                                <stop offset="0%" stop-color="#f59e0b" />
                                <stop offset="100%" stop-color="#b45309" />
                            </linearGradient>
                        </defs>
                    </svg>
                    <div class="gauge-inner-text">
                        <span class="percentage"><?= fa_digits((int) round((float) ($financial['collection_percentage'] ?? 0))) ?>٪</span>
                        <span class="label">از کل هزینه‌ها</span>
                    </div>
                </div>

                <!-- آمارهای میانی -->
                <div class="financial-stats-middle">
                    <div class="financial-stat-block">
                        <p>مجموع درآمدها</p>
                        <h4><?= fa_number($financial['total_collected'] ?? 0) ?></h4>
                        <div class="financial-trend up">
                            <span>واریز تأیید شده</span>
                            <span style="color:var(--text-muted-white); font-weight:normal;"><?= fa_digits($financial['confirmed_count'] ?? 0) ?> پرداخت</span>
                        </div>
                    </div>
                    <div class="financial-stat-block">
                        <p>مجموع هزینه‌ها</p>
                        <h4><?= fa_number($financial['total_costs'] ?? 0) ?></h4>
                        <div class="financial-trend down">
                            <span>کل هزینه‌ها</span>
                            <span style="color:var(--text-muted-white); font-weight:normal;"><?= fa_digits($financial['costs_count'] ?? 0) ?> هزینه</span>
                        </div>
                    </div>
                </div>

                <!-- آیکون کیف پول سمت چپ -->
                <div class="financial-wallet-icon-box">
                    <svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="var(--gold-primary)" stroke-width="2">
                        <rect x="2" y="5" width="20" height="14" rx="2" />
                        <path d="M22 10h-6a2 2 0 0 0 0 4h6" />
                    </svg>
                </div>
            </div>
        </section>

        <!-- ناوبری پایین صفحه (Navigation Bar) -->
        <nav class="bottom-nav-bar">
            <!-- پروفایل -->
            <div class="nav-item-link" onclick="window.location.href='profile.php'" style="cursor:pointer;">
                <svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                    <path d="M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2" />
                    <circle cx="12" cy="7" r="4" />
                </svg>
                <span>پروفایل</span>
            </div>

            <!-- پیام‌ها -->
            <div class="nav-item-link" onclick="window.location.href='notifications.php'" style="cursor:pointer;">
                <svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                    <path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z" />
                </svg>
                <span>پیام‌ها</span>
                <?php if ($unread_notifs > 0): ?>
                    <span class="nav-badge" style="right: 18px;"><?= fa_digits($unread_notifs) ?></span>
                <?php endif; ?>
            </div>

            <!-- دکمه شناور وسط -->
            <div class="floating-action-button" onclick="window.location.href='building_add.php'" style="cursor:pointer;">
                <svg width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#fff" stroke-width="3">
                    <line x1="12" y1="5" x2="12" y2="19" />
                    <line x1="5" y1="12" x2="19" y2="12" />
                </svg>
            </div>

            <!-- تقویم -->
            <div class="nav-item-link" onclick="window.location.href='calendar.php?building_id=<?= (int) $building_id ?>'" style="cursor:pointer;">
                <svg width="22" height="22" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
                    <rect x="3" y="4" width="18" height="18" rx="2" />
                    <line x1="16" y1="2" x2="16" y2="6" />
                    <line x1="8" y1="2" x2="8" y2="6" />
                    <line x1="3" y1="10" x2="21" y2="10" />
                </svg>
                <span>تقویم</span>
            </div>

            <!-- داشبورد (فعال) -->
            <div class="nav-item-link active">
                <div class="active-pill-box">
                    <svg width="20" height="20" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5">
                        <path d="m3 9 9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z" />
                        <polyline points="9 22 9 12 15 12 15 22" />
                    </svg>
                    <span>داشبورد</span>
                </div>
            </div>
        </nav>

    </div>

    <script src="assets/js/main.js"></script>
</body>

</html>