<?php
$page_title = 'Project Management Office';
require_once __DIR__ . '/../config.php';
if (session_status() === PHP_SESSION_NONE) { session_start(); }
if (!isset($_SESSION['admin_id'])) { redirect(SITE_URL . '/admin/login.php'); }
require_once __DIR__ . '/header.php';
?>

<div style="display:flex; justify-content:space-between; align-items:center; margin-bottom:24px;">
    <div>
        <h2 style="font-family:'Outfit', sans-serif; font-size:1.8rem; color:#0f172a; margin:0;"><i class="fas fa-tasks" style="color:#3b82f6; margin-right:10px;"></i>Project Management Office</h2>
        <p style="color:#64748b; font-size:0.95rem; margin-top:5px;">Mega project tracking, Capex management, Gantt charts, and resource allocation.</p>
    </div>
    <button style="background:linear-gradient(135deg,#3b82f6,#2563eb); color:#fff; border:none; padding:10px 20px; border-radius:8px; font-size:0.9rem; cursor:pointer; font-weight:600;"><i class="fas fa-plus"></i> New Project</button>
</div>

<div class="grid-4" style="margin-bottom:24px;">
    <div style="background:#fff; padding:20px; border-radius:12px; border:1px solid #e2e8f0; border-top:4px solid #3b82f6;">
        <div style="color:#64748b; font-size:0.8rem; font-weight:600; margin-bottom:8px;">ACTIVE PROJECTS</div>
        <div style="font-size:1.6rem; font-weight:700; color:#0f172a;">14</div>
        <div style="color:#3b82f6; font-size:0.8rem; margin-top:5px;"><i class="fas fa-hard-hat"></i> 3 Mega Projects</div>
    </div>
    <div style="background:#fff; padding:20px; border-radius:12px; border:1px solid #e2e8f0; border-top:4px solid #10b981;">
        <div style="color:#64748b; font-size:0.8rem; font-weight:600; margin-bottom:8px;">TOTAL CAPEX</div>
        <div style="font-size:1.6rem; font-weight:700; color:#0f172a;">₹42 Cr</div>
        <div style="color:#10b981; font-size:0.8rem; margin-top:5px;"><i class="fas fa-arrow-up"></i> 68% Utilized</div>
    </div>
    <div style="background:#fff; padding:20px; border-radius:12px; border:1px solid #e2e8f0; border-top:4px solid #f59e0b;">
        <div style="color:#64748b; font-size:0.8rem; font-weight:600; margin-bottom:8px;">ON-TIME DELIVERY</div>
        <div style="font-size:1.6rem; font-weight:700; color:#0f172a;">86%</div>
        <div style="color:#f59e0b; font-size:0.8rem; margin-top:5px;"><i class="fas fa-clock"></i> 2 Delayed</div>
    </div>
    <div style="background:#fff; padding:20px; border-radius:12px; border:1px solid #e2e8f0; border-top:4px solid #8b5cf6;">
        <div style="color:#64748b; font-size:0.8rem; font-weight:600; margin-bottom:8px;">PROJECT PROFIT</div>
        <div style="font-size:1.6rem; font-weight:700; color:#0f172a;">₹8.4 Cr</div>
        <div style="color:#8b5cf6; font-size:0.8rem; margin-top:5px;"><i class="fas fa-chart-line"></i> 20% Margin</div>
    </div>
</div>

<div class="grid-2" style="margin-bottom:24px;">
    <div style="background:#fff; padding:20px; border-radius:12px; border:1px solid #e2e8f0;">
        <h3 style="margin:0 0 15px; font-size:1.15rem; color:#0f172a;"><i class="fas fa-project-diagram" style="color:#3b82f6; margin-right:8px;"></i>Mega Project Tracker</h3>
        <?php
        $projects = [
            ['Plant Expansion Phase 3', '₹18 Cr', 72, '#10b981', 'On Track', 'Dec 2024'],
            ['Warehouse Automation', '₹8.5 Cr', 45, '#3b82f6', 'In Progress', 'Mar 2025'],
            ['Solar Farm Installation', '₹6 Cr', 88, '#f59e0b', 'Ahead', 'Aug 2024'],
            ['ERP Migration to S/4HANA', '₹4.2 Cr', 30, '#ef4444', 'At Risk', 'Jun 2025'],
            ['New Delhi Hub Setup', '₹5.3 Cr', 15, '#8b5cf6', 'Planning', 'Sep 2025'],
        ];
        foreach ($projects as $p): ?>
        <div style="border:1px solid #e2e8f0; border-radius:8px; padding:15px; margin-bottom:10px;">
            <div style="display:flex; justify-content:space-between; align-items:flex-start; margin-bottom:10px;">
                <div>
                    <div style="font-weight:600; font-size:0.9rem; color:#0f172a;"><?= $p[0] ?></div>
                    <div style="font-size:0.75rem; color:#94a3b8;">Budget: <?= $p[1] ?> · Due: <?= $p[5] ?></div>
                </div>
                <span style="background:<?= $p[3] ?>15; color:<?= $p[3] ?>; padding:3px 10px; border-radius:10px; font-size:0.7rem; font-weight:bold;"><?= $p[4] ?></span>
            </div>
            <div style="background:#e2e8f0; height:8px; border-radius:4px; overflow:hidden;">
                <div style="width:<?= $p[2] ?>%; height:100%; background:<?= $p[3] ?>; border-radius:4px; transition:width 0.5s;"></div>
            </div>
            <div style="font-size:0.75rem; color:#94a3b8; margin-top:5px;"><?= $p[2] ?>% Complete</div>
        </div>
        <?php endforeach; ?>
    </div>

    <div style="display:flex; flex-direction:column; gap:24px;">
        <div style="background:#fff; padding:20px; border-radius:12px; border:1px solid #e2e8f0;">
            <h3 style="margin:0 0 15px; font-size:1.15rem; color:#0f172a;"><i class="fas fa-exclamation-triangle" style="color:#ef4444; margin-right:8px;"></i>Risk Register</h3>
            <div style="border-left:3px solid #ef4444; padding-left:12px; margin-bottom:15px;">
                <div style="font-weight:600; font-size:0.9rem;">Steel Price Volatility</div>
                <div style="font-size:0.8rem; color:#64748b;">Impact: High · Probability: Medium</div>
            </div>
            <div style="border-left:3px solid #f59e0b; padding-left:12px; margin-bottom:15px;">
                <div style="font-weight:600; font-size:0.9rem;">Labor Shortage (Plant 3)</div>
                <div style="font-size:0.8rem; color:#64748b;">Impact: Medium · Probability: High</div>
            </div>
            <div style="border-left:3px solid #3b82f6; padding-left:12px;">
                <div style="font-weight:600; font-size:0.9rem;">Regulatory Approval Delay</div>
                <div style="font-size:0.8rem; color:#64748b;">Impact: Medium · Probability: Low</div>
            </div>
        </div>

        <div style="background:#fff; padding:20px; border-radius:12px; border:1px solid #e2e8f0;">
            <h3 style="margin:0 0 15px; font-size:1.15rem; color:#0f172a;"><i class="fas fa-users" style="color:#8b5cf6; margin-right:8px;"></i>Resource Allocation</h3>
            <div style="display:grid; grid-template-columns:1fr 1fr; gap:15px;">
                <div style="background:#f8fafc; padding:12px; border-radius:8px; text-align:center;">
                    <div style="font-size:1.5rem; font-weight:700; color:#3b82f6;">142</div>
                    <div style="font-size:0.75rem; color:#94a3b8;">Team Members</div>
                </div>
                <div style="background:#f8fafc; padding:12px; border-radius:8px; text-align:center;">
                    <div style="font-size:1.5rem; font-weight:700; color:#10b981;">88%</div>
                    <div style="font-size:0.75rem; color:#94a3b8;">Utilization</div>
                </div>
            </div>
        </div>

        <div style="background:linear-gradient(135deg,#3b82f6,#2563eb); color:#fff; padding:20px; border-radius:12px;">
            <h3 style="margin:0 0 8px; font-size:1.1rem;"><i class="fas fa-file-invoice-dollar"></i> Milestone Billing</h3>
            <p style="margin:0 0 10px; font-size:0.85rem; opacity:0.85;">₹12.6 Cr billed · ₹8.4 Cr collected · ₹4.2 Cr pending</p>
            <div style="background:rgba(255,255,255,0.2); height:8px; border-radius:4px; overflow:hidden;">
                <div style="width:67%; height:100%; background:#fff; border-radius:4px;"></div>
            </div>
        </div>
    </div>
</div>

<?php require_once __DIR__ . '/footer.php'; ?>
