<?php
$page_title = 'Branch Management';
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-code-branch" style="color:#0ea5e9; margin-right:10px;"></i>Branch Management</h2>
        <p style="color:#64748b; font-size:0.95rem; margin-top:5px;">Multi-branch company portal covering Head Office, Factory, Warehouse, Regional, and Sales Territories.</p>
    </div>
    <button style="background:linear-gradient(135deg,#0ea5e9,#0284c7); 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> Add New Branch</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 #0f172a;">
        <div style="color:#64748b; font-size:0.8rem; font-weight:600; margin-bottom:8px;">TOTAL LOCATIONS</div>
        <div style="font-size:1.6rem; font-weight:700; color:#0f172a;">18</div>
        <div style="color:#10b981; font-size:0.8rem; margin-top:5px;"><i class="fas fa-map-marker-alt"></i> Across India</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;">HEAD OFFICE / FACTORY</div>
        <div style="font-size:1.6rem; font-weight:700; color:#10b981;">1 + 2</div>
        <div style="color:#10b981; font-size:0.8rem; margin-top:5px;"><i class="fas fa-industry"></i> Primary Nodes</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;">WAREHOUSES</div>
        <div style="font-size:1.6rem; font-weight:700; color:#f59e0b;">5</div>
        <div style="color:#f59e0b; font-size:0.8rem; margin-top:5px;"><i class="fas fa-warehouse"></i> Regional Hubs</div>
    </div>
    <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;">SALES TERRITORIES</div>
        <div style="font-size:1.6rem; font-weight:700; color:#3b82f6;">10</div>
        <div style="color:#3b82f6; font-size:0.8rem; margin-top:5px;"><i class="fas fa-map"></i> Active Regions</div>
    </div>
</div>

<div class="grid-2">
    <!-- Branch Hierarchy -->
    <div class="card">
        <h3 style="margin:0 0 15px; font-size:1.15rem; color:#0f172a;"><i class="fas fa-sitemap" style="color:#0ea5e9; margin-right:8px;"></i>Organization Hierarchy</h3>
        <p style="font-size:0.85rem; color:#64748b; margin-bottom:15px;">Balimeen Private Limited organizational structure.</p>
        
        <div style="background:#f8fafc; padding:15px; border-radius:8px; border:1px solid #e2e8f0;">
            <!-- Head Office -->
            <div style="display:flex; align-items:center; gap:10px; margin-bottom:15px;">
                <div style="width:36px; height:36px; background:#0f172a; color:#fff; border-radius:8px; display:flex; align-items:center; justify-content:center;"><i class="fas fa-building"></i></div>
                <div>
                    <div style="font-weight:600; font-size:0.95rem;">Head Office - Mumbai</div>
                    <div style="font-size:0.75rem; color:#64748b;">HQ · 120 Employees</div>
                </div>
            </div>
            
            <div style="border-left:2px solid #cbd5e1; margin-left:18px; padding-left:24px;">
                <!-- Factories -->
                <div style="display:flex; align-items:center; gap:10px; margin-bottom:15px; position:relative;">
                    <div style="position:absolute; left:-24px; top:18px; width:20px; border-top:2px solid #cbd5e1;"></div>
                    <div style="width:36px; height:36px; background:#10b981; color:#fff; border-radius:8px; display:flex; align-items:center; justify-content:center;"><i class="fas fa-industry"></i></div>
                    <div>
                        <div style="font-weight:600; font-size:0.9rem;">Plant 1 - Palghar</div>
                        <div style="font-size:0.75rem; color:#64748b;">Manufacturing · 450 Employees</div>
                    </div>
                </div>

                <!-- Warehouses -->
                <div style="display:flex; align-items:center; gap:10px; margin-bottom:15px; position:relative;">
                    <div style="position:absolute; left:-24px; top:18px; width:20px; border-top:2px solid #cbd5e1;"></div>
                    <div style="width:36px; height:36px; background:#f59e0b; color:#fff; border-radius:8px; display:flex; align-items:center; justify-content:center;"><i class="fas fa-warehouse"></i></div>
                    <div>
                        <div style="font-weight:600; font-size:0.9rem;">Warehouses (5 Hubs)</div>
                        <div style="font-size:0.75rem; color:#64748b;">Logistics · 85 Employees</div>
                    </div>
                </div>

                <!-- Regional Offices -->
                <div style="display:flex; align-items:center; gap:10px; margin-bottom:10px; position:relative;">
                    <div style="position:absolute; left:-24px; top:18px; width:20px; border-top:2px solid #cbd5e1;"></div>
                    <div style="width:36px; height:36px; background:#3b82f6; color:#fff; border-radius:8px; display:flex; align-items:center; justify-content:center;"><i class="fas fa-map-marker-alt"></i></div>
                    <div>
                        <div style="font-weight:600; font-size:0.9rem;">Regional Offices (4 Zones)</div>
                        <div style="font-size:0.75rem; color:#64748b;">North, South, East, West · 140 Employees</div>
                    </div>
                </div>

                <div style="border-left:2px solid #cbd5e1; margin-left:18px; padding-left:24px;">
                    <!-- Sales Territories -->
                    <div style="display:flex; align-items:center; gap:10px; position:relative;">
                        <div style="position:absolute; left:-24px; top:18px; width:20px; border-top:2px solid #cbd5e1;"></div>
                        <div style="width:36px; height:36px; background:#8b5cf6; color:#fff; border-radius:8px; display:flex; align-items:center; justify-content:center;"><i class="fas fa-map"></i></div>
                        <div>
                            <div style="font-weight:600; font-size:0.85rem;">Sales Territories (10 Areas)</div>
                            <div style="font-size:0.75rem; color:#64748b;">Field Operations · 200 Employees</div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Active Branches List -->
    <div class="card">
        <div style="display:flex; justify-content:space-between; align-items:center; margin-bottom:15px;">
            <h3 style="margin:0; font-size:1.15rem; color:#0f172a;"><i class="fas fa-list" style="color:#0ea5e9; margin-right:8px;"></i>Branch Directory</h3>
            <div style="display:flex; gap:8px;">
                <input type="text" placeholder="Search branch..." style="padding:6px 12px; border:1px solid #e2e8f0; border-radius:6px; font-size:0.85rem; outline:none; width:150px;">
                <select style="padding:6px; border:1px solid #e2e8f0; border-radius:6px; font-size:0.85rem; outline:none;">
                    <option>All Types</option>
                    <option>HQ</option>
                    <option>Factory</option>
                    <option>Warehouse</option>
                </select>
            </div>
        </div>
        
        <?php
        $branches = [
            ['HQ Mumbai', 'Head Office', 'Maharashtra', 120, '#0f172a'],
            ['Plant 1 - Palghar', 'Factory', 'Maharashtra', 450, '#10b981'],
            ['Plant 2 - Gujarat', 'Factory', 'Gujarat', 320, '#10b981'],
            ['Delhi NCR Hub', 'Warehouse', 'Delhi', 25, '#f59e0b'],
            ['Bangalore Hub', 'Warehouse', 'Karnataka', 22, '#f59e0b'],
            ['Kolkata RO', 'Regional Office', 'West Bengal', 35, '#3b82f6'],
        ];
        ?>
        <table style="width:100%; border-collapse:collapse; font-size:0.85rem;">
            <thead>
                <tr style="background:#f8fafc; color:#64748b; text-align:left;">
                    <th style="padding:10px; border-bottom:1px solid #e2e8f0;">Branch Name</th>
                    <th style="padding:10px; border-bottom:1px solid #e2e8f0;">Type</th>
                    <th style="padding:10px; border-bottom:1px solid #e2e8f0;">Staff</th>
                    <th style="padding:10px; border-bottom:1px solid #e2e8f0;">Action</th>
                </tr>
            </thead>
            <tbody>
                <?php foreach ($branches as $b): ?>
                <tr style="border-bottom:1px solid #f1f5f9;">
                    <td style="padding:10px;">
                        <div style="font-weight:600; color:#0f172a;"><?= $b[0] ?></div>
                        <div style="font-size:0.75rem; color:#64748b;"><?= $b[2] ?></div>
                    </td>
                    <td style="padding:10px;"><span style="background:<?= $b[4] ?>15; color:<?= $b[4] ?>; padding:3px 8px; border-radius:6px; font-size:0.7rem; font-weight:bold;"><?= $b[1] ?></span></td>
                    <td style="padding:10px; font-weight:600;"><?= $b[3] ?></td>
                    <td style="padding:10px;">
                        <button style="background:#f1f5f9; color:#475569; border:none; padding:5px 10px; border-radius:4px; font-size:0.75rem; cursor:pointer;"><i class="fas fa-cog"></i></button>
                    </td>
                </tr>
                <?php endforeach; ?>
            </tbody>
        </table>
    </div>
</div>

<!-- Features Overview per Branch -->
<div class="card" style="margin-bottom:24px;">
    <h3 style="margin:0 0 15px; font-size:1.15rem; color:#0f172a;"><i class="fas fa-layer-group" style="color:#8b5cf6; margin-right:8px;"></i>Module Access per Branch Type</h3>
    <div style="display:flex; gap:20px;">
        <div style="flex:1; border:1px solid #e2e8f0; border-radius:8px; padding:15px; border-top:3px solid #10b981;">
            <h4 style="margin:0 0 10px; font-size:1rem; color:#0f172a;">Branch Level</h4>
            <ul style="margin:0; padding-left:20px; font-size:0.85rem; color:#475569; line-height:1.6;">
                <li>Branch Admin Dashboard</li>
                <li>Local HR Login</li>
                <li>Employee Login & Attendance</li>
                <li>Local Payroll Processing</li>
                <li>Documents Verification (Level 1)</li>
                <li>Branch Reports</li>
                <li>Inventory Access (Role-based)</li>
                <li>Support Tickets</li>
            </ul>
        </div>
        <div style="flex:1; border:1px solid #e2e8f0; border-radius:8px; padding:15px; border-top:3px solid #0f172a;">
            <h4 style="margin:0 0 10px; font-size:1rem; color:#0f172a;">Head Office Level</h4>
            <ul style="margin:0; padding-left:20px; font-size:0.85rem; color:#475569; line-height:1.6;">
                <li>All-Branch Control Dashboard</li>
                <li>Consolidated Financial Reports</li>
                <li>Central Approval Workflows</li>
                <li>Policy Management</li>
                <li>Compliance Monitoring</li>
                <li>Executive Analytics</li>
                <li>Final Verification (Level 2)</li>
            </ul>
        </div>
    </div>
</div>

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