<?php
// === INCLUDES ===
require_once 'includes/config.php';
require_once 'includes/functions.php';
require_once __DIR__ . '/includes/module_helpers.php';
require_once __DIR__ . '/includes/settings_helpers.php';
require_once __DIR__ . '/includes/tax_forms_module.php';

// === AUTH CHECK ===
session_start();
if (empty($_SESSION['authenticated'])) {
    header("Location: signin.php");
    exit();
}
require_once __DIR__ . '/db.php';

// === DATA LOADING ===
$row = null;
$sessionOrgId = $_SESSION['org_id'] ?? null;
if ($sessionOrgId !== null && $sessionOrgId !== '') {
    $stmt = $conn->prepare("SELECT * FROM organizations WHERE id = ? OR org_id = ? ORDER BY id DESC LIMIT 1");
    if ($stmt) {
        $sessionOrgIdString = (string) $sessionOrgId;
        $sessionOrgIdInt = ctype_digit($sessionOrgIdString) ? (int) $sessionOrgIdString : 0;
        $stmt->bind_param('is', $sessionOrgIdInt, $sessionOrgIdString);
        $stmt->execute();
        $result = $stmt->get_result();
        $row = $result ? $result->fetch_assoc() : null;
        $stmt->close();
    }
}
if (!$row) {
    $result = $conn->query("SELECT * FROM organizations ORDER BY id DESC LIMIT 1");
    $row = $result ? $result->fetch_assoc() : null;
}
$orgName = $row['organisation_name'] ?? ($_SESSION['org_name'] ?? 'demo');
$displayName = $_SESSION['username'] ?? $orgName;
$orgId   = $row['id'] ?? ($_SESSION['org_id'] ?? '60066881652');
$trialStatus = strtoupper($_SESSION['org_status'] ?? ($row['status'] ?? 'TRIAL'));
$userEmail = payroll_current_user_email();

if (!empty($row['organisation_name'])) {
    $_SESSION['org_name'] = $row['organisation_name'];
}
if (!empty($row['id'])) {
    $_SESSION['org_id'] = $row['id'];
}
if (isset($_GET['action'], $_GET['step']) && $_GET['action'] === 'mark_setup_complete' && $_GET['step'] === 'salary_components') {
    $orgIdInt = (int) ($row['id'] ?? 0);
    if ($orgIdInt > 0) {
        settings_set_setup_step_state($conn, $orgIdInt, 'salary_components', true);
    }
    header('Location: dashboard.php');
    exit();
}
if (isset($_GET['action'], $_GET['step']) && $_GET['action'] === 'mark_setup_complete' && $_GET['step'] === 'statutory_components') {
    $orgIdInt = (int) ($row['id'] ?? 0);
    if ($orgIdInt > 0) {
        settings_set_setup_step_state($conn, $orgIdInt, 'statutory_components', true);
    }
    header('Location: dashboard.php');
    exit();
}
settings_ensure_employee_organization_column($conn, (int) ($row['id'] ?? 0));
settings_ensure_salary_hold_tables($conn);
$orgSettings = settings_get_org_settings($conn, (int) ($row['id'] ?? 0));
$taxDetails = tax_details_get($conn, (string) ($row['id'] ?? ($_SESSION['org_id'] ?? '')));
$salaryTemplate = settings_get_salary_template($conn, (int) ($row['id'] ?? 0));
$paySchedule = settings_get_pay_schedule($conn, (int) ($row['id'] ?? 0));
$epfSettings = settings_get_statutory_component($conn, (int) ($row['id'] ?? 0), 'epf');
$esiSettings = settings_get_statutory_component($conn, (int) ($row['id'] ?? 0), 'esi');
$lwfSettings = settings_get_statutory_component($conn, (int) ($row['id'] ?? 0), 'lwf');
$bonusSettings = settings_get_statutory_component($conn, (int) ($row['id'] ?? 0), 'bonus');
$zohoApps = settings_get_zoho_app_integrations($conn, (int) ($row['id'] ?? 0));
$employeeCount = 0;
$employeeCountStmt = $conn->prepare("SELECT COUNT(*) AS total FROM employees WHERE organization_id = ? AND COALESCE(is_deleted, 0) = 0");
if ($employeeCountStmt) {
    $orgIdInt = (int) ($row['id'] ?? 0);
    $employeeCountStmt->bind_param('i', $orgIdInt);
    $employeeCountStmt->execute();
    $employeeCountResult = $employeeCountStmt->get_result();
    if ($employeeCountResult && ($employeeCountRow = $employeeCountResult->fetch_assoc())) {
        $employeeCount = (int) ($employeeCountRow['total'] ?? 0);
    }
    $employeeCountStmt->close();
}
$payrunCount = 0;
$payrunCountStmt = $conn->prepare("SELECT COUNT(*) AS total FROM payruns WHERE org_id = ?");
if ($payrunCountStmt) {
    $payrunCountStmt->bind_param('s', $orgName);
    $payrunCountStmt->execute();
    $payrunCountResult = $payrunCountStmt->get_result();
    if ($payrunCountResult && ($payrunCountRow = $payrunCountResult->fetch_assoc())) {
        $payrunCount = (int) ($payrunCountRow['total'] ?? 0);
    }
    $payrunCountStmt->close();
}
$salaryHoldNotifications = settings_get_salary_hold_notifications($conn, (int) ($row['id'] ?? 0));
$salaryHoldNotifications = array_values(array_filter($salaryHoldNotifications, static function (array $hold): bool {
    $holdStatus = strtolower(trim((string) ($hold['hold_status'] ?? 'pending')));
    return $holdStatus !== 'released';
}));
$payrunNotifications = settings_get_payrun_notifications($conn, (int) ($row['id'] ?? 0), (string) $orgName);
$notificationCount = count($salaryHoldNotifications) + count($payrunNotifications);
date_default_timezone_set('Asia/Kolkata');
$nowTime = date('h:i A');
$activeDrawer = $_GET['drawer'] ?? '';
$activeModal = $_GET['modal'] ?? '';
$validDrawers = ['org', 'notif', 'apps', 'profile', 'updates'];
if (!in_array($activeDrawer, $validDrawers, true)) {
    $activeDrawer = '';
}
$activeModal = $activeModal === 'upgrade' ? 'upgrade' : '';
$bodyClasses = 'dash-page';
$isGettingStartedPage = defined('SHOW_GETTING_STARTED_PAGE') && SHOW_GETTING_STARTED_PAGE;
if ($isGettingStartedPage) {
    $bodyClasses .= ' getting-started-page';
}
if ($activeDrawer === 'org') {
    $bodyClasses .= ' org-drawer--open';
}
if ($activeDrawer === 'updates') {
    $bodyClasses .= ' updates-open';
}
if ($activeModal === 'upgrade') {
    $bodyClasses .= ' modal-open';
}

$trialDaysLeft = $isGettingStartedPage ? 11 : 7;
$welcomeName = $isGettingStartedPage ? strtoupper((string) ($displayName ?: $orgName)) : ($displayName ?: $orgName);
$orgDisplayLabel = $isGettingStartedPage ? 'demo' : ($orgName ?: 'demo');

$profileComplete = trim((string) ($row['organisation_name'] ?? '')) !== '' && trim((string) ($row['address_line1'] ?? '')) !== '' && trim((string) ($row['state'] ?? '')) !== '';
$taxComplete = trim((string) ($taxDetails['pan'] ?? '')) !== '' && trim((string) ($taxDetails['deductor_name'] ?? '')) !== '';
$payScheduleComplete = !empty($paySchedule['pay_frequency']) && !empty($paySchedule['first_pay_date']);
$statutorySubitems = [
    ['label' => "Employees' Provident Fund", 'href' => 'statutory_components.php?component=epf', 'complete' => !empty($epfSettings['enabled'])],
    ['label' => "Employees' State Insurance", 'href' => 'statutory_components.php?component=esi', 'complete' => !empty($esiSettings['enabled'])],
    ['label' => 'Labour Welfare Fund', 'href' => 'statutory_components.php?component=lwf', 'complete' => !empty($lwfSettings['enabled'])],
    ['label' => 'Professional Tax', 'href' => 'tax_details.php', 'complete' => $taxComplete, 'note' => 'Configured based on Work Location'],
];
$statutoryComplete = count(array_filter($statutorySubitems, static function (array $item): bool {
    return !empty($item['complete']);
})) === count($statutorySubitems);
$statutoryManualComplete = settings_get_setup_step_state($conn, (int) ($row['id'] ?? 0), 'statutory_components');
$statutoryComplete = $statutoryComplete || $statutoryManualComplete;
$salaryManualComplete = settings_get_setup_step_state($conn, (int) ($row['id'] ?? 0), 'salary_components');
$salaryComplete = (float) ($salaryTemplate['annual_ctc'] ?? 0) > 0 || $salaryManualComplete;
$employeesComplete = $employeeCount > 0;
$priorPayrollComplete = $payrunCount > 0;
$zohoBooksComplete = settings_get_setup_step_state($conn, (int) ($row['id'] ?? 0), 'zoho_books');

$setupSteps = [
    ['label' => '1. Add Organisation Details', 'href' => 'orgprofile.php', 'completed' => $profileComplete, 'cta' => 'Complete Now'],
    ['label' => '2. Provide your Tax Details', 'href' => 'tax_details.php', 'completed' => $taxComplete, 'cta' => 'Complete Now'],
    ['label' => '3. Configure your Pay Schedule', 'href' => 'pay_schedule.php', 'completed' => $payScheduleComplete, 'cta' => 'Complete Now'],
    [
        'label' => '4. Set up Statutory Components',
        'href' => 'statutory_components.php',
        'completed' => $statutoryComplete,
        'cta' => 'Complete Now',
        'inline_action' => [
            'label' => 'Mark as Completed',
            'href' => 'dashboard.php?action=mark_setup_complete&step=statutory_components',
        ],
        'subitems' => $statutorySubitems,
        'grouped' => true,
    ],
    [
        'label' => '5. Set up Salary Components',
        'href' => 'salary_components.php',
        'completed' => $salaryComplete,
        'cta' => 'Complete Now',
        'inline_action' => [
            'label' => 'Mark as Completed',
            'href' => 'dashboard.php?action=mark_setup_complete&step=salary_components',
        ],
    ],
    ['label' => '6. Add Employees', 'href' => 'employees.php', 'completed' => $employeesComplete, 'cta' => 'Complete Now'],
    ['label' => '7. Configure Prior Payroll', 'href' => 'payruns.php', 'completed' => $priorPayrollComplete, 'cta' => 'Complete Now'],
    ['label' => '8. Connect with B2L Books', 'href' => 'zoho_apps.php', 'completed' => $zohoBooksComplete, 'cta' => 'Connect Now'],
];
$completedSetupSteps = count(array_filter($setupSteps, static function (array $step): bool {
    return !empty($step['completed']);
}));
$setupStepCount = count($setupSteps);
$setupProgress = $setupStepCount > 0 ? (int) round(($completedSetupSteps / $setupStepCount) * 100) : 0;
$allSetupComplete = $setupStepCount > 0 && $completedSetupSteps === $setupStepCount;
$gettingStartedSetupSteps = $setupSteps;
$gettingStartedCompletedSteps = $completedSetupSteps;
$gettingStartedStepCount = count($gettingStartedSetupSteps);
$gettingStartedProgress = $setupProgress;
$gettingStartedAllComplete = $allSetupComplete;
$showSetupSuccess = isset($_GET['setup']) && $_GET['setup'] === 'complete';
$completedStepParam = isset($_GET['step']) ? (string) $_GET['step'] : '';
$zohoBooksSuccessState = $showSetupSuccess && $completedStepParam === '8';
$incompleteSetupSteps = array_values(array_filter($setupSteps, static function (array $step): bool {
    return empty($step['completed']);
}));
$stepsToRender = $isGettingStartedPage ? $gettingStartedSetupSteps : $setupSteps;
$autoRedirectToDashboard = $isGettingStartedPage && $allSetupComplete && $activeDrawer === '' && $activeModal === '';
$payPeriodLabel = date('F Y');
$paymentDateLabel = !empty($paySchedule['first_pay_date'])
    ? date('d/m/Y', strtotime((string) $paySchedule['first_pay_date']))
    : date('d/m/Y');
if ($allSetupComplete) {
    $bodyClasses .= ' setup-complete';
}
$redirectTarget = $autoRedirectToDashboard ? 'dashboard.php' : '';
$redirectDelayMs = 1200;
$pageTitle = $isGettingStartedPage ? 'Getting Started | Payroll' : 'Dashboard | Payroll';
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title><?php echo htmlspecialchars($pageTitle); ?></title>
<link rel="stylesheet" href="organce.css">
<link rel="stylesheet" href="assets/font-inter.css"><link rel="stylesheet" href="assets/fontawesome/css/all.min.css">
</head>
<body class="<?php echo htmlspecialchars($bodyClasses); ?>" data-setup-complete="<?php echo $allSetupComplete ? '1' : '0'; ?>">
<div class="dash-layout">
    <aside class="dash-sidebar">
        <div class="sidebar-brand">
            <img src="images/b2l_mobitech_pvt_ltd_logo.jpg" class="logo" alt="B2L Mobitech Pvt Ltd">
        </div>

        <div class="sidebar-scroll">
            <div class="sidebar-section">
                <a class="getting-started" href="getting_started.php" aria-label="Open getting started flow">
                    <div class="gs-top">
                        <i class="fa-solid fa-rocket-launch"></i>
                        <span>Getting Started</span>
                    </div>
                    <div class="progress-bar">
                        <div class="progress-fill"></div>
                    </div>
                </a>
            </div>
            <nav class="sidebar-nav">
<a class="nav-item active" href="dashboard.php"><i class="fa-solid fa-gauge-high"></i><span>Dashboard</span></a>
<a class="nav-item" href="employees.php"><i class="fa-solid fa-users"></i><span>Employees</span></a>
                <a class="nav-item" href="payruns.php"><i class="fa-solid fa-money-bill-wave"></i><span>Pay Runs</span></a>
                <div class="nav-group">
                    <button class="nav-item btn" type="button" data-nav-toggle><i class="fa-regular fa-square-check"></i><span>Approvals</span></button>
                    <div class="nav-sub">
                        <a class="nav-sub-item" href="reimbursements.php">Reimbursements</a>
                        <a class="nav-sub-item" href="proof_of_investments.php">Proof Of Investments</a>
                        <a class="nav-sub-item" href="salary_revision.php">Salary Revision</a>
                        <a class="nav-sub-item" href="salary_holds.php">Salary Holds</a>
                    </div>
                </div>
                <a class="nav-item" href="form16.php"><i class="fa-regular fa-file-lines"></i><span>Form 16</span></a>
                <a class="nav-item" href="loans.php"><i class="fa-solid fa-hand-holding-dollar"></i><span>Loans</span></a>
                <a class="nav-item" href="giving.php"><i class="fa-solid fa-gift"></i><span>Giving</span></a>
                <a class="nav-item" href="documents.php"><i class="fa-regular fa-folder-open"></i><span>Documents</span></a>
                <a class="nav-item" href="reports.php"><i class="fa-solid fa-chart-pie"></i><span>Reports</span></a>
                <a class="nav-item" href="settings.php"><i class="fa-solid fa-gear"></i><span>Settings</span></a>
            </nav>
        </div>

        <div class="sidebar-footer">
            <a class="support-link" href="support.php">Contact Support</a>
        </div>
        <div class="support-tile">
            <div class="support-title">Track TDS Liabilities and Generate Form 24Q</div>
            <a class="support-action" href="support.php?promo=tds">View Details</a>
        </div>
    </aside>

    <main class="dash-main">
        <header class="dash-topbar">
            <div class="search-box">
                <i class="fa-solid fa-magnifying-glass search-icon"></i>
                <input type="text" placeholder="Search in Employee">
            </div>
            <div class="topbar-actions">
                <span class="trial">Your trial expires in <?php echo $isGettingStartedPage ? '14' : '7'; ?> day(s). <a href="dashboard.php?modal=upgrade" class="upgrade-link">Upgrade</a></span>
                <a class="pill ghost org-toggle" href="organc.php?drawer=org" data-tooltip="Organisation menu"><span class="pill-label"><?php echo htmlspecialchars($orgDisplayLabel); ?></span><i class="fa-solid fa-angle-down"></i></a>
                <a class="top-icon icon-btn notif-link" href="organc.php?drawer=notif" data-tooltip="Notifications">
                    <i class="fa-regular fa-bell"></i>
                    <?php if ($notificationCount > 0) { ?><span class="notif-badge"><?php echo (int) $notificationCount; ?></span><?php } ?>
                </a>
                <a class="top-icon top-link" href="settings.php" data-tooltip="Settings"><i class="fa-solid fa-gear"></i></a>
                <a class="top-icon icon-btn app-menu" href="organc.php?drawer=apps" data-tooltip="Apps"><i class="fa-solid fa-table-cells-large"></i></a>
                <a class="top-icon icon-btn top-avatar" href="organc.php?drawer=profile" data-tooltip="Profile"><i class="fa-regular fa-circle-user"></i></a>
                <span class="avatar" data-tooltip="Profile"><?php echo strtoupper(substr($orgName, 0, 1)); ?></span>
            </div>
        </header>

        <section class="dash-content<?php echo $allSetupComplete ? ' dashboard-complete' : ''; ?>">
            <div class="hero-card confetti-bg">
                <div class="hero-confetti"></div>
                <div class="hero-row">
                    <div class="hero-copy">
                        <h1>Welcome <?php echo htmlspecialchars($welcomeName); ?>!</h1>
                        <p class="hero-sub">Set up your organisation before you run your first payroll.</p>
                        <?php if ($isGettingStartedPage): ?>
                            <div class="hero-contact">Time now: <?php echo $nowTime; ?> IST | Need help? Call us Mon-Fri, 9 AM-7 PM at 18005726671 (toll-free).</div>
                        <?php endif; ?>
                    </div>
                    <div class="hero-actions">
                            <a class="recent-updates" href="organc.php?drawer=updates">
                                <i class="fa-regular fa-rotate"></i>
                                Recent Updates
                                <i class="fa-solid fa-chevron-down"></i>
                            </a>
                        <div class="help-line">
                            Help Line : <strong>18005726671</strong><br>
                            Mon - Fri &nbsp; Toll Free
                        </div>
                    </div>
                </div>
            </div>

            <?php if ($isGettingStartedPage): ?>
                <div class="webinar-bar webinar-bar--getting-started">
                    <a href="#" class="webinar-close" aria-label="Close webinar banner"><i class="fa-solid fa-xmark"></i></a>
                    <div class="webinar-brand" aria-hidden="true">
                        <img src="images/b2l_mobitech_pvt_ltd_logo.jpg" alt="B2L Mobitech Pvt Ltd">
                    </div>
                    <div class="webinar-copy">
                        <div class="webinar-title">Best practices to start the new fiscal year</div>
                        <div class="webinar-meta">
                            <span><i class="fa-regular fa-calendar"></i> April 8th</span>
                            <span><i class="fa-regular fa-clock"></i> 3 PM IST</span>
                        </div>
                    </div>
                    <a class="secondary-btn small webinar-cta" href="support.php?promo=webinar">Register Now</a>
                </div>
            <?php else: ?>
                <div class="webinar-bar webinar-bar--getting-started">
                    <a href="#" class="webinar-close" aria-label="Close webinar banner"><i class="fa-solid fa-xmark"></i></a>
                    <div class="webinar-brand" aria-hidden="true">
                        <img src="images/b2l_mobitech_pvt_ltd_logo.jpg" alt="B2L Mobitech Pvt Ltd">
                    </div>
                    <div class="webinar-copy">
                        <div class="webinar-title">Best practices to start the new fiscal year</div>
                        <div class="webinar-meta">
                            <span><i class="fa-regular fa-calendar"></i> April 8th</span>
                            <span><i class="fa-regular fa-clock"></i> 3 PM IST</span>
                        </div>
                    </div>
                    <a class="secondary-btn small webinar-cta" href="support.php?promo=webinar">Register Now</a>
                </div>
            <?php endif; ?>

            <?php if ($isGettingStartedPage || !$allSetupComplete): ?>
                <div class="progress-card">
                    <header class="progress-head">
                        <div>
                            <div class="label">Get started with B2L Mobitech</div>
                            <div class="sub">Complete the following steps to have a hassle-free payroll experience</div>
                        </div>
                        <div class="progress-indicator">
                            <span class="bar"><span class="fill" style="width: <?php echo $isGettingStartedPage ? (int) $gettingStartedProgress : (int) $setupProgress; ?>%;"></span></span>
                            <span class="count"><?php echo $isGettingStartedPage ? (int) $gettingStartedCompletedSteps : (int) $completedSetupSteps; ?>/<?php echo $isGettingStartedPage ? (int) $gettingStartedStepCount : (int) $setupStepCount; ?> Completed</span>
                        </div>
                    </header>
                    <?php if (!$isGettingStartedPage && $allSetupComplete): ?>
                        <div class="setup-complete-note">All <?php echo $isGettingStartedPage ? (int) $gettingStartedStepCount : (int) $setupStepCount; ?> setup steps are completed. Your organisation is ready.</div>
                    <?php endif; ?>
                    <?php if ($showSetupSuccess && !$isGettingStartedPage): ?>
                        <div class="setup-success-note" style="margin:12px 20px 0;background:#ecfdf5;border-color:#a7f3d0;color:#047857;">
                            Setup completed successfully. You are now on the dashboard.
                        </div>
                    <?php endif; ?>
                    <div class="steps">
                        <?php foreach ($stepsToRender as $setupStep): ?>
                            <div class="step<?php echo !empty($setupStep['completed']) ? ' done' : ''; ?>">
                                <span class="check<?php echo !empty($setupStep['completed']) ? '' : ' hollow'; ?>"><i class="fa-solid fa-check"></i></span>
                                <a class="step-text" href="<?php echo htmlspecialchars($setupStep['href']); ?>"><?php echo htmlspecialchars($setupStep['label']); ?></a>
                                <span class="arrow">&rsaquo;</span>
                                <?php if (!empty($setupStep['inline_action']) && empty($setupStep['completed'])): ?>
                                    <a class="step-inline-link" href="<?php echo htmlspecialchars($setupStep['inline_action']['href']); ?>"><?php echo htmlspecialchars($setupStep['inline_action']['label']); ?></a>
                                <?php endif; ?>
                                <?php if (!empty($setupStep['subitems'])): ?>
                                    <?php if (!empty($setupStep['completed'])): ?>
                                        <a class="status status-link" href="<?php echo htmlspecialchars($setupStep['href']); ?>">COMPLETED</a>
                                    <?php endif; ?>
                                <?php else: ?>
                                    <?php if (!empty($setupStep['completed'])): ?>
                                        <a class="status status-link" href="<?php echo htmlspecialchars($setupStep['href']); ?>">COMPLETED</a>
                                    <?php elseif (empty($setupStep['grouped'])): ?>
                                        <a class="pill ghost" href="<?php echo htmlspecialchars($setupStep['href']); ?>"><?php echo htmlspecialchars($setupStep['cta']); ?></a>
                                    <?php elseif (!empty($setupStep['cta']) && !empty($setupStep['grouped']) && empty($setupStep['subitems'])): ?>
                                        <a class="pill ghost" href="<?php echo htmlspecialchars($setupStep['href']); ?>"><?php echo htmlspecialchars($setupStep['cta']); ?></a>
                                    <?php endif; ?>
                                <?php endif; ?>
                            </div>
                            <?php if (!empty($setupStep['subitems'])): ?>
                                <div class="step-sublist">
                                    <?php foreach ($setupStep['subitems'] as $subitem): ?>
                                        <div class="step-subitem">
                                            <span class="subcheck<?php echo !empty($subitem['complete']) ? ' complete' : ''; ?>"><i class="fa-solid fa-check"></i></span>
                                            <a class="subtext sub-link" href="<?php echo htmlspecialchars((string) ($subitem['href'] ?? $setupStep['href'])); ?>">
                                                <?php echo htmlspecialchars((string) $subitem['label']); ?>
                                                <?php if (!empty($subitem['note'])): ?>
                                                    <span class="subnote">(<?php echo htmlspecialchars((string) $subitem['note']); ?>)</span>
                                                <?php endif; ?>
                                            </a>
                                        </div>
                                    <?php endforeach; ?>
                                </div>
                            <?php endif; ?>
                        <?php endforeach; ?>
                    </div>
                </div>
            <?php else: ?>
                <div class="dashboard-alert success">
                    <i class="fa-solid fa-circle-check"></i>
                    <span><?php echo $zohoBooksSuccessState
                        ? 'Step 8 is complete. B2L Books is connected successfully and your organisation setup is now finished.'
                        : 'Statutory details setup is marked as completed.'; ?></span>
                </div>

                <?php if ($showSetupSuccess): ?>
                    <div class="dashboard-alert success soft">
                        <?php echo $isGettingStartedPage
                            ? 'Setup completed successfully. You are viewing the finished onboarding flow.'
                            : ($zohoBooksSuccessState
                                ? 'B2L Books is connected. You can continue with payroll operations from here.'
                                : 'Setup completed successfully. You are now on the dashboard.'); ?>
                    </div>
                <?php endif; ?>

                <div class="dashboard-overview">
                    <div class="overview-main">
                        <div class="overview-card overview-payrun">
                            <div class="overview-head">
                                <h2>Upcoming Payrun</h2>
                            </div>
                            <div class="overview-panel">
                                <h3>Process Pay Run for <?php echo htmlspecialchars($payPeriodLabel); ?></h3>
                                <div class="overview-meta-row">
                                    <div>
                                        <span class="meta-label">Employees' Net Pay</span>
                                        <strong><?php echo $employeesComplete ? 'READY TO PROCESS' : 'YET TO PROCESS'; ?></strong>
                                    </div>
                                    <div>
                                        <span class="meta-label">Payment Date</span>
                                        <strong><?php echo htmlspecialchars($paymentDateLabel); ?></strong>
                                    </div>
                                    <div>
                                        <span class="meta-label">No. of Employees</span>
                                        <strong><?php echo (int) $employeeCount; ?></strong>
                                    </div>
                                    <a class="secondary-btn small payrun-action" href="payruns.php">CREATE PAY RUN</a>
                                </div>
                                <p class="overview-note">
                                    <?php if ($employeeCount > 0): ?>
                                        You have employees ready for the next payroll cycle.
                                    <?php else: ?>
                                        There are no employees, with completed profiles in this payroll. Please complete their profile to process this payrun.
                                    <?php endif; ?>
                                </p>
                            </div>
                        </div>

                        <div class="overview-two-col">
                            <div class="overview-card">
                                <div class="overview-head">
                                    <h2>Benefits and Deductions</h2>
                                    <span class="overview-filter">Previous Month</span>
                                </div>
                                <div class="overview-amount-grid">
                                    <div class="overview-mini">
                                        <div class="overview-mini-ico epf"><i class="fa-solid fa-leaf"></i></div>
                                        <div class="overview-mini-label">EPF</div>
                                        <div class="overview-mini-value">-</div>
                                        <a href="salary_components.php">View Details</a>
                                    </div>
                                    <div class="overview-mini">
                                        <div class="overview-mini-ico esi"><i class="fa-solid fa-shield-heart"></i></div>
                                        <div class="overview-mini-label">ESI</div>
                                        <div class="overview-mini-value">-</div>
                                        <a href="statutory_components.php?component=esi">View Details</a>
                                    </div>
                                    <div class="overview-mini">
                                        <div class="overview-mini-ico tds"><i class="fa-solid fa-percent"></i></div>
                                        <div class="overview-mini-label">TDS</div>
                                        <div class="overview-mini-value">-</div>
                                        <a href="tax_details.php">View Details</a>
                                    </div>
                                </div>
                            </div>

                            <div class="overview-card employee-summary-card">
                                <div class="overview-head">
                                    <h2>Employee Summary</h2>
                                </div>
                                <div class="employee-summary-box">
                                    <span class="summary-label">Active Employees</span>
                                    <strong><?php echo (int) $employeeCount; ?></strong>
                                    <a href="employees.php">View Employees</a>
                                </div>
                            </div>
                        </div>

                        <div class="overview-card overview-chart-card">
                            <div class="overview-head">
                                <h2>Payroll Cost Summary</h2>
                                <span class="overview-filter">This Year</span>
                            </div>
                            <div class="overview-chart">
                                <div class="overview-chart-empty">There are no completed pay runs in the selected period.</div>
                            </div>
                        </div>
                    </div>

                    <aside class="overview-side">
                        <div class="overview-card bank-holiday-card">
                            <div class="overview-head">
                                <h2>Upcoming Bank Holidays</h2>
                            </div>
                            <div class="bank-holiday-body">
                                <p>Salary Payment through direct deposit can't be processed on this day. Plan accordingly.</p>
                                <div class="bank-holiday-item">
                                    <div class="bank-holiday-date">
                                        <strong>01</strong>
                                        <span>APR</span>
                                    </div>
                                    <div class="bank-holiday-meta">
                                        <div class="bank-holiday-title">Annual closing of banks</div>
                                        <div class="bank-holiday-sub">Wednesday</div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="overview-card overview-todo-card">
                            <div class="overview-head">
                                <h2>To Do Tasks</h2>
                            </div>
                            <div class="todo-empty">
                                <div class="todo-illustration" aria-hidden="true">
                                    <i class="fa-regular fa-face-smile"></i>
                                </div>
                                <h3>Time to celebrate!</h3>
                                <p>You have no pending tasks.</p>
                            </div>
                        </div>
                    </aside>
                </div>
            <?php endif; ?>

            <div class="features-grid">
                <a class="feature-card" href="direct_deposits.php">
                    <div class="feature-icon"><i class="fa-regular fa-clock"></i></div>
                    <div class="feature-title">Direct Deposit</div>
                </a>
                <a class="feature-card" href="salary_templates.php">
                    <div class="feature-icon"><i class="fa-solid fa-file-invoice-dollar"></i></div>
                    <div class="feature-title">Salary Templates</div>
                </a>
                <a class="feature-card" href="claims_declarations.php">
                    <div class="feature-icon"><i class="fa-solid fa-bolt"></i></div>
                    <div class="feature-title">Auto Reminder for IT &amp; POI Declaration</div>
                </a>
                <a class="feature-card" href="employees.php">
                    <div class="feature-icon"><i class="fa-solid fa-robot"></i></div>
                    <div class="feature-title">Employee Custom Field</div>
                </a>
            </div>

            <section class="help-wrapper">
                <h2 class="section-title center">Find help & resources</h2>
                <div class="help-grid">
                    <div class="card wide">
                        <div class="card-subtitle">Learn how to use B2L Mobitech</div>
                        <div class="video-card large">
                            <div class="play-btn big"><i class="fa-solid fa-play"></i></div>
                            <p>Watch Complete Walkthrough Video</p>
                        </div>
                    </div>
                    <div class="card help-panel">
                        <div class="card-subtitle">Help & Support</div>
                        <div class="support-list icons">
                            <div class="support-item"><span class="support-icon"><i class="fa-regular fa-circle-question"></i></span>Help</div>
                            <div class="support-item"><span class="support-icon"><i class="fa-regular fa-comments"></i></span>FAQ</div>
                            <div class="support-item"><span class="support-icon"><i class="fa-solid fa-notes-medical"></i></span>Forum</div>
                        </div>
                    </div>
                </div>
            </section>

            <div class="info-strip">
                <div class="info-item">
                    <span class="info-icon"><i class="fa-regular fa-envelope"></i></span>
                    Need Clarification? <a href="mailto:support@b2lmobitech.com">Drop us an email</a> and we'll get back to you
                </div>
                <div class="info-item">
                    <span class="info-icon"><i class="fa-solid fa-phone"></i></span>
                    You can directly talk to us every Monday to Friday<br>
                    Toll Free: 18005726671 (9:00 AM to 7:00 PM)
                </div>
            </div>

            <div id="dashboard-end" class="footer-grid">
                <div class="promo-card">
                    <img src="images/mobile-footer-in-6c8e1951aeca90821dfaa475a1967a1c.png" alt="Payroll mobile app preview" class="promo-img">
                    <div class="phone-card">Payroll portal app for your employees; accessible anywhere anytime</div>
                    <div class="store-row">
                        <a class="store-badge store-apple" href="https://www.apple.com/app-store/" target="_blank" rel="noopener">
                            <i class="fa-brands fa-apple"></i>
                            <span class="store-text">
                                <small>Download on the</small>
                                <strong>App Store</strong>
                            </span>
                        </a>
                        <a class="store-badge store-google" href="https://play.google.com/store" target="_blank" rel="noopener">
                            <img src="images/google-icon.svg" alt="" aria-hidden="true">
                            <span class="store-text">
                                <small>GET IT ON</small>
                                <strong>Google Play</strong>
                            </span>
                        </a>
                    </div>
                </div>
                <div class="link-col">
                    <h4>Other B2L Apps</h4>
                    <ul>
                        <li>Accounting Software</li>
                        <li>HR Software</li>
                        <li>Inventory Management</li>
                        <li>Expense Reporting</li>
                        <li>CRM & Other Apps</li>
                    </ul>
                </div>
                <div class="link-col">
                    <h4>Help & Support</h4>
                    <ul>
                        <li>Contact Support</li>
                        <li>Help Documentation</li>
                        <li>FAQ</li>
                        <li>Training Program</li>
                    </ul>
                </div>
                <div class="link-col">
                    <h4>Quick Links</h4>
                    <ul>
                        <li>Features</li>
                        <li>Integrations</li>
                        <li>What's New?</li>
                    </ul>
                </div>
            </div>

            <p class="copyright">  2026, B2L Mobitech Pvt. Ltd. All Rights Reserved.</p>
        </section>
    </main>
</div>

<aside class="org-drawer" id="orgDrawer" aria-hidden="<?php echo $activeDrawer === 'org' ? 'false' : 'true'; ?>">
    <div class="org-panel">
            <div class="org-drawer__header">
            <span>Organisations</span>
            <div class="org-head-actions">
                <a href="settings.php" class="manage-link"><i class="fa-solid fa-gear"></i>Manage</a>
                <a class="org-close" href="dashboard.php" aria-label="Close"><i class="fa-solid fa-xmark"></i></a>
            </div>
        </div>
        <div class="org-drawer__subhead">
            <span class="label">My Organisations</span>
        </div>
        <div class="org-list">
            <div class="org-card active">
                <div class="org-icon"><i class="fa-regular fa-building"></i></div>
                <div class="org-meta">
                    <div class="org-name"><?php echo htmlspecialchars($orgName); ?></div>
                    <div class="org-id">Organisation ID: <?php echo htmlspecialchars($orgId); ?>   <?php echo htmlspecialchars($trialStatus); ?></div>
                </div>
                <div class="org-check"><i class="fa-solid fa-circle-check"></i></div>
            </div>
        </div>
    </div>
</aside>

<!-- Right side drawers -->
<aside class="side-drawer<?php echo $activeDrawer === 'notif' ? ' is-open' : ''; ?>" id="notifDrawer" aria-hidden="<?php echo $activeDrawer === 'notif' ? 'false' : 'true'; ?>">
    <div class="drawer-panel">
        <div class="drawer-head">
            <div class="drawer-title">Notifications</div>
            <a class="drawer-close" href="organc.php" aria-label="Close"><i class="fa-solid fa-xmark"></i></a>
        </div>
        <div class="drawer-body">
            <?php if ($payrunNotifications || $salaryHoldNotifications): ?>
                <div class="notif-section">
                    <div class="drawer-section-title">Payroll Status</div>
                    <div class="notif-list">
                        <?php foreach ($payrunNotifications as $payrun): ?>
                            <article class="notif-card">
                                <div class="notif-card-ico"><i class="<?php echo htmlspecialchars((string) ($payrun['icon'] ?? 'fa-solid fa-money-bill-wave')); ?>"></i></div>
                                <div class="notif-card-body">
                                    <div class="notif-card-top">
                                        <strong><?php echo htmlspecialchars((string) ($payrun['title'] ?? 'Payroll Status')); ?></strong>
                                        <span class="salary-pill status-<?php echo htmlspecialchars((string) ($payrun['status_key'] ?? 'pending')); ?>"><?php echo htmlspecialchars((string) ($payrun['status_label'] ?? 'Pending')); ?></span>
                                    </div>
                                    <p><?php echo htmlspecialchars((string) ($payrun['message'] ?? '')); ?></p>
                                    <div class="notif-meta">
                                        <span>Pay date: <?php echo htmlspecialchars((string) ($payrun['pay_date_label'] ?? '-')); ?></span>
                                        <?php if (!empty($payrun['component'])) { ?><span>Component: <?php echo htmlspecialchars((string) $payrun['component']); ?></span><?php } ?>
                                    </div>
                                </div>
                            </article>
                        <?php endforeach; ?>
                    </div>
                </div>

                <?php if ($salaryHoldNotifications): ?>
                    <div class="notif-section">
                        <div class="drawer-section-title">Salary Holds</div>
                        <div class="notif-list">
                            <?php foreach ($salaryHoldNotifications as $hold): ?>
                                <?php
                                    $details = settings_salary_hold_notification_details($hold);
                                ?>
                                <article class="notif-card">
                                    <div class="notif-card-ico"><i class="<?php echo htmlspecialchars((string) $details['icon']); ?>"></i></div>
                                    <div class="notif-card-body">
                                        <div class="notif-card-top">
                                            <strong><?php echo htmlspecialchars((string) $details['title']); ?></strong>
                                            <span class="salary-pill status-<?php echo htmlspecialchars((string) $details['status_key']); ?>"><?php echo htmlspecialchars((string) $details['status_label']); ?></span>
                                        </div>
                                        <p><?php echo htmlspecialchars((string) $details['message']); ?></p>
                                        <div class="notif-meta">
                                            <span><?php echo htmlspecialchars((string) $details['period_label']); ?></span>
                                            <span>Release: <?php echo htmlspecialchars((string) $details['release_label']); ?></span>
                                            <span><?php echo (int) $details['pending_months']; ?> month(s) pending</span>
                                        </div>
                                    </div>
                                </article>
                            <?php endforeach; ?>
                        </div>
                    </div>
                <?php endif; ?>

                <div style="margin-top:16px;">
                    <a class="pill ghost" href="salary_holds.php" style="display:inline-flex;">Open Salary Holds</a>
                </div>
            <?php else: ?>
                <div class="empty-state">
                    <div class="notif-illustration">
                        <img src="images/notifications-new-8be8bc83fe9609e31e66bb52130f48e7.svg" alt="No notifications">
                    </div>
                    <h4>It's too quiet here!</h4>
                    <p>We'll let you know when payroll is pending, paid, or when salary holds or release approvals need attention.</p>
                </div>
            <?php endif; ?>
        </div>
    </div>
</aside>

<aside class="side-drawer<?php echo $activeDrawer === 'apps' ? ' is-open' : ''; ?>" id="appsDrawer" aria-hidden="<?php echo $activeDrawer === 'apps' ? 'false' : 'true'; ?>">
    <div class="drawer-panel">
        <div class="drawer-head">
            <div class="drawer-title">All B2L Apps</div>
            <div class="drawer-actions">
                <a class="icon-btn ghost" href="#" aria-label="Search"><i class="fa-solid fa-magnifying-glass"></i></a>
                <a class="drawer-close" href="organc.php" aria-label="Close"><i class="fa-solid fa-xmark"></i></a>
            </div>
        </div>
        <div class="drawer-body">
            <div class="drawer-section">
                <div class="drawer-section-title">Finance Apps</div>
                <div class="app-list">
                    <div class="app-row"><span class="app-ico zapp-c-blue"><svg><use href="#icon-books"></use></svg></span><div><div class="app-name">B2L Books</div><div class="app-sub">Online Accounting Software</div></div></div>
                    <div class="app-row"><span class="app-ico zapp-c-red"><svg><use href="#icon-expense"></use></svg></span><div><div class="app-name">B2L Expense</div><div class="app-sub">Expense Reporting Software</div></div><i class="fa-solid fa-angle-right app-arrow"></i></div>
                    <div class="app-row"><span class="app-ico zapp-c-green"><svg><use href="#icon-billing"></use></svg></span><div><div class="app-name">B2L Billing</div><div class="app-sub">End-to-end Billing Solution</div></div></div>
                    <div class="app-row"><span class="app-ico zapp-c-red"><svg><use href="#icon-inventory"></use></svg></span><div><div class="app-name">B2L Inventory</div><div class="app-sub">Order &amp; Inventory Management</div></div></div>
                    <div class="app-row"><span class="app-ico zapp-c-blue"><svg><use href="#icon-checkout"></use></svg></span><div><div class="app-name">B2L Checkout</div><div class="app-sub">One-time &amp; Recurring Payments</div></div></div>
                    <div class="app-row"><span class="app-ico zapp-c-green"><svg><use href="#icon-commerce"></use></svg></span><div><div class="app-name">B2L Commerce</div><div class="app-sub">Ecommerce Software</div></div></div>
                </div>
            </div>

            <div class="drawer-section">
                <div class="drawer-section-title">Other Apps <span class="section-caret"><i class="fa-solid fa-angle-down"></i></span></div>

                <div class="drawer-subtitle">Email and Collaboration</div>
                <div class="app-grid compact">
                    <div class="app-tile"><span class="app-ico zapp-c-amber"><svg><use href="#icon-notebook"></use></svg></span>Notebook</div>
                    <div class="app-tile"><span class="app-ico zapp-c-blue"><svg><use href="#icon-meeting"></use></svg></span>Meeting</div>
                    <div class="app-tile"><span class="app-ico zapp-c-red"><svg><use href="#icon-projects"></use></svg></span>Projects</div>
                    <div class="app-tile"><span class="app-ico zapp-c-blue"><svg><use href="#icon-sign"></use></svg></span>Sign</div>
                    <div class="app-tile"><span class="app-ico zapp-c-green"><svg><use href="#icon-sprints"></use></svg></span>Sprints</div>
                    <div class="app-tile"><span class="app-ico zapp-c-teal"><svg><use href="#icon-teaminbox"></use></svg></span>TeamInbox</div>
                    <div class="app-tile"><span class="app-ico zapp-c-blue"><svg><use href="#icon-mail"></use></svg></span>Mail</div>
                    <div class="app-tile"><span class="app-ico zapp-c-rose"><svg><use href="#icon-cliq"></use></svg></span>Cliq</div>
                    <div class="app-tile"><span class="app-ico zapp-c-green"><svg><use href="#icon-sheet"></use></svg></span>Sheet</div>
                    <div class="app-tile"><span class="app-ico zapp-c-red"><svg><use href="#icon-show"></use></svg></span>Show</div>
                    <div class="app-tile"><span class="app-ico zapp-c-indigo"><svg><use href="#icon-writer"></use></svg></span>Writer</div>
                    <div class="app-tile selected"><span class="app-ico zapp-c-blue"><svg><use href="#icon-connect"></use></svg></span>Connect</div>
                    <div class="app-tile"><span class="app-ico zapp-c-red"><svg><use href="#icon-vault"></use></svg></span>Vault</div>
                    <div class="app-tile"><span class="app-ico zapp-c-blue"><svg><use href="#icon-workdrive"></use></svg></span>WorkDrive</div>
                    <div class="app-tile"><span class="app-ico zapp-c-red"><svg><use href="#icon-learn"></use></svg></span>Learn</div>
                </div>

                <div class="drawer-subtitle">Sales</div>
                <div class="app-grid compact">
                    <div class="app-tile"><span class="app-ico zapp-c-blue"><svg><use href="#icon-crm"></use></svg></span>CRM</div>
                    <div class="app-tile"><span class="app-ico zapp-c-red"><svg><use href="#icon-salesiq"></use></svg></span>SalesIQ</div>
                    <div class="app-tile"><span class="app-ico zapp-c-green"><svg><use href="#icon-salesinbox"></use></svg></span>SalesInbox</div>
                    <div class="app-tile"><span class="app-ico zapp-c-green"><svg><use href="#icon-bigin"></use></svg></span>Bigin</div>
                    <div class="app-tile"><span class="app-ico zapp-c-blue"><svg><use href="#icon-bookings"></use></svg></span>Bookings</div>
                    <div class="app-tile"><span class="app-ico zapp-c-green"><svg><use href="#icon-commerce"></use></svg></span>Commerce</div>
                </div>

                <div class="drawer-subtitle">Marketing</div>
                <div class="app-grid compact">
                    <div class="app-tile"><span class="app-ico zapp-c-blue"><svg><use href="#icon-sites"></use></svg></span>Sites</div>
                    <div class="app-tile"><span class="app-ico zapp-c-red"><svg><use href="#icon-campaigns"></use></svg></span>Campaigns</div>
                    <div class="app-tile"><span class="app-ico zapp-c-amber"><svg><use href="#icon-survey"></use></svg></span>Survey</div>
                    <div class="app-tile"><span class="app-ico zapp-c-indigo"><svg><use href="#icon-backstage"></use></svg></span>Backstage</div>
                    <div class="app-tile"><span class="app-ico zapp-c-green"><svg><use href="#icon-forms"></use></svg></span>Forms</div>
                    <div class="app-tile"><span class="app-ico zapp-c-red"><svg><use href="#icon-marketinghub"></use></svg></span>MarketingHub</div>
                    <div class="app-tile"><span class="app-ico zapp-c-orange"><svg><use href="#icon-pagesense"></use></svg></span>PageSense</div>
                    <div class="app-tile"><span class="app-ico zapp-c-teal"><svg><use href="#icon-social"></use></svg></span>Social</div>
                </div>

                <div class="drawer-subtitle">Help Desk and Customer Support</div>
                <div class="app-grid compact">
                    <div class="app-tile"><span class="app-ico zapp-c-green"><svg><use href="#icon-desk"></use></svg></span>Desk</div>
                    <div class="app-tile"><span class="app-ico zapp-c-red"><svg><use href="#icon-lens"></use></svg></span>Lens</div>
                    <div class="app-tile"><span class="app-ico zapp-c-teal"><svg><use href="#icon-assist"></use></svg></span>Assist</div>
                </div>

                <div class="drawer-subtitle">Human Resources</div>
                <div class="app-grid compact">
                    <div class="app-tile"><span class="app-ico zapp-c-blue"><svg><use href="#icon-people"></use></svg></span>People</div>
                    <div class="app-tile"><span class="app-ico zapp-c-red"><svg><use href="#icon-recruit"></use></svg></span>Recruit</div>
                </div>

                <div class="drawer-subtitle">Business Process</div>
                <div class="app-grid compact">
                    <div class="app-tile"><span class="app-ico zapp-c-red"><svg><use href="#icon-analytics"></use></svg></span>Analytics</div>
                    <div class="app-tile"><span class="app-ico zapp-c-blue"><svg><use href="#icon-creator"></use></svg></span>Creator</div>
                    <div class="app-tile"><span class="app-ico zapp-c-green"><svg><use href="#icon-flow"></use></svg></span>Flow</div>
                    <div class="app-tile"><span class="app-ico zapp-c-gray"><svg><use href="#icon-qntrl"></use></svg></span>Qntrl</div>
                    <div class="app-tile"><span class="app-ico zapp-c-blue"><svg><use href="#icon-dataprep"></use></svg></span>DataPrep</div>
                    <div class="app-tile"><span class="app-ico zapp-c-teal"><svg><use href="#icon-rpa"></use></svg></span>RPA</div>
                </div>
            </div>
        </div>
    </div>
</aside>

<aside class="side-drawer<?php echo $activeDrawer === 'profile' ? ' is-open' : ''; ?>" id="profileDrawer" aria-hidden="<?php echo $activeDrawer === 'profile' ? 'false' : 'true'; ?>">
    <div class="drawer-panel">
        <div class="drawer-head">
            <div class="drawer-title"><?php echo htmlspecialchars($displayName); ?></div>
            <a class="drawer-close" href="organc.php" aria-label="Close"><i class="fa-solid fa-xmark"></i></a>
        </div>
        <div class="drawer-body">
            <div class="profile-meta">
                <div class="profile-avatar"><?php echo strtoupper(substr($displayName,0,1)); ?></div>
                <div>
                    <div class="profile-name"><?php echo htmlspecialchars($displayName); ?></div>
                    <div class="profile-sub"><?php echo htmlspecialchars($userEmail); ?></div>
                    <div class="profile-sub">Organisation ID: <?php echo htmlspecialchars($orgId); ?></div>
                </div>
            </div>
            <div class="profile-links">
                <a href="orgprofile.php" class="profile-link">My Account</a>
                <a href="logout.php" class="profile-link danger">Sign Out</a>
            </div>
            <div class="profile-panel">
                <div class="panel-title">Need Assistance?</div>
                <div class="panel-item"><i class="fa-regular fa-circle-dot"></i> Record an issue</div>
                <div class="panel-item"><i class="fa-regular fa-envelope"></i> Send an email</div>
                <div class="panel-item"><i class="fa-regular fa-calendar"></i> Register for webinars</div>
            </div>
        </div>
    </div>
</aside>

<aside class="updates-popover<?php echo $activeDrawer === 'updates' ? ' is-open' : ''; ?>" id="updatesPopover" aria-hidden="<?php echo $activeDrawer === 'updates' ? 'false' : 'true'; ?>">
    <div class="updates-popover__backdrop" data-close-updates></div>
    <div class="updates-popover__card">
        <div class="updates-popover__head">
            <div class="updates-popover__title">Recent Updates</div>
            <a class="updates-popover__close" href="organc.php" aria-label="Close updates"><i class="fa-solid fa-xmark"></i></a>
        </div>
        <div class="updates-popover__body">
            <a class="updates-popover__chip" href="getting_started.php">Getting Started</a>
            <a class="updates-popover__item" href="support.php?tab=updates">
                <strong>Income Tax Rules, 2026: What&apos;s changed?</strong>
                <span>Learn about the latest updates to income tax rules, sections, allowances, and payroll impact.</span>
            </a>
            <a class="updates-popover__item" href="support.php?promo=webinar">
                <strong>B2L Mobitech Online Training</strong>
                <span>Join the next webinar and get a guided walkthrough.</span>
            </a>
        </div>
    </div>
</aside>

<!-- Upgrade modal -->
<div class="upgrade-modal" id="upgradeModal" aria-hidden="<?php echo $activeModal === 'upgrade' ? 'false' : 'true'; ?>" role="dialog" aria-modal="true" aria-labelledby="upgradeTitle">
    <div class="upgrade-card">
        <div class="upgrade-head">
            <h3 id="upgradeTitle">Ready to make the switch?</h3>
            <a class="upgrade-close" href="dashboard.php" aria-label="Close"><i class="fa-solid fa-xmark"></i></a>
        </div>
        <div class="upgrade-body">
            <div class="upgrade-illustration" aria-hidden="true">
                <i class="fa-solid fa-hourglass-half"></i>
            </div>
            <div class="upgrade-sub">
                <div class="upgrade-trial">Your trial expires in 6 day(s).</div>
                <p>We hope you enjoyed using B2L Mobitech. To join the B2L Mobitech family, click the Upgrade Subscription button.</p>
            </div>

            <div class="upgrade-help">
                <div class="upgrade-help-title"><span class="bulb"><i class="fa-regular fa-lightbulb"></i></span>Need help to know more on B2L Mobitech?</div>
                <div class="upgrade-help-sub">Checkout our tailor made help resources below</div>
                <div class="upgrade-help-grid">
                    <div class="help-chips">
                        <a class="help-chip" href="support.php"><span class="chip-ico"><i class="fa-regular fa-circle-question"></i></span>Help</a>
                        <a class="help-chip" href="support.php?tab=videos"><span class="chip-ico"><i class="fa-regular fa-circle-play"></i></span>Videos</a>
                        <a class="help-chip" href="support.php?tab=faq"><span class="chip-ico"><i class="fa-regular fa-rectangle-list"></i></span>FAQ</a>
                        <a class="help-chip" href="support.php?tab=academy"><span class="chip-ico"><i class="fa-solid fa-graduation-cap"></i></span>Academy</a>
                    </div>
                    <div class="help-card">
                        <div class="help-ico"><i class="fa-solid fa-headset"></i></div>
                        <div>
                            <div class="help-card-title">Need Clarification?</div>
                            <a href="mailto:support@b2lmobitech.com" class="help-card-link">Drop us an email</a>
                        </div>
                    </div>
                </div>
                <div class="upgrade-webinar">
                    <span class="webinar-ico"><i class="fa-solid fa-video"></i></span>
                    Join Live webinar on getting started with B2L Mobitech
                    <a href="support.php?promo=webinar" class="upgrade-webinar-link">Register Now</a>
                </div>
            </div>
        </div>
        <div class="upgrade-actions">
            <a class="upgrade-primary" href="subscriptions.php">Upgrade Subscription</a>
            <a class="upgrade-secondary" href="subscriptions.php?plan=free">Move to Free Plan</a>
        </div>
    </div>
</div>

<?php if ($activeDrawer === 'updates'): ?>
<aside class="recent-update-float" aria-label="Recent update">
    <div class="recent-update-float__head">
        <strong>Income Tax Rules, 2026: What&apos;s changed?</strong>
        <a href="organc.php" aria-label="Close recent update">Close</a>
    </div>
    <p>Learn about the latest updates to income tax rules, including rate changes, forms, sections, allowances, and payroll impact.</p>
    <div class="recent-update-float__actions">
        <a class="recent-update-float__button" href="support.php?tab=updates">READ THE DETAILED GUIDE</a>
        <a class="recent-update-float__link" href="organc.php">Hide</a>
    </div>
</aside>
<?php endif; ?>

<!-- Custom app icon sprite -->
<svg class="zapp-sprite" aria-hidden="true">
    <symbol id="icon-books" viewBox="0 0 24 24">
        <rect x="3" y="5" width="7" height="14" rx="1.5"></rect>
        <rect x="11" y="4" width="10" height="16" rx="1.5"></rect>
        <line x1="6" y1="9" x2="9" y2="9"></line>
        <line x1="14" y1="9" x2="19" y2="9"></line>
    </symbol>
    <symbol id="icon-expense" viewBox="0 0 24 24">
        <path d="M7 4h8l2 2v14l-2-1-2 1-2-1-2 1-2-1-2 1V4z"></path>
        <line x1="9" y1="9" x2="15" y2="9"></line>
        <line x1="9" y1="13" x2="15" y2="13"></line>
    </symbol>
    <symbol id="icon-billing" viewBox="0 0 24 24">
        <rect x="3" y="6" width="18" height="12" rx="2"></rect>
        <line x1="6" y1="10" x2="10" y2="10"></line>
        <line x1="14" y1="14" x2="18" y2="14"></line>
    </symbol>
    <symbol id="icon-inventory" viewBox="0 0 24 24">
        <path d="M4 7l8-4 8 4-8 4-8-4z"></path>
        <path d="M4 7v10l8 4 8-4V7"></path>
    </symbol>
    <symbol id="icon-checkout" viewBox="0 0 24 24">
        <rect x="4" y="6" width="16" height="8" rx="2"></rect>
        <path d="M8 14v4h8v-4"></path>
        <line x1="7" y1="10" x2="11" y2="10"></line>
    </symbol>
    <symbol id="icon-commerce" viewBox="0 0 24 24">
        <path d="M6 8h12l-1 11H7L6 8z"></path>
        <path d="M9 8V6a3 3 0 0 1 6 0v2"></path>
    </symbol>
    <symbol id="icon-notebook" viewBox="0 0 24 24">
        <rect x="5" y="4" width="14" height="16" rx="2"></rect>
        <line x1="9" y1="4" x2="9" y2="20"></line>
        <line x1="12" y1="9" x2="17" y2="9"></line>
    </symbol>
    <symbol id="icon-meeting" viewBox="0 0 24 24">
        <circle cx="12" cy="12" r="3"></circle>
        <line x1="12" y1="3" x2="12" y2="7"></line>
        <line x1="12" y1="17" x2="12" y2="21"></line>
        <line x1="3" y1="12" x2="7" y2="12"></line>
        <line x1="17" y1="12" x2="21" y2="12"></line>
        <line x1="5.2" y1="5.2" x2="8" y2="8"></line>
        <line x1="16" y1="16" x2="18.8" y2="18.8"></line>
        <line x1="5.2" y1="18.8" x2="8" y2="16"></line>
        <line x1="16" y1="8" x2="18.8" y2="5.2"></line>
    </symbol>
    <symbol id="icon-projects" viewBox="0 0 24 24">
        <rect x="5" y="4" width="14" height="16" rx="2"></rect>
        <line x1="8" y1="9" x2="16" y2="9"></line>
        <line x1="8" y1="13" x2="13" y2="13"></line>
        <path d="M9 16l1.5 1.5L13 15"></path>
    </symbol>
    <symbol id="icon-sign" viewBox="0 0 24 24">
        <path d="M4 18l4-1 8-8-3-3-8 8-1 4z"></path>
        <line x1="13" y1="6" x2="18" y2="11"></line>
    </symbol>
    <symbol id="icon-sprints" viewBox="0 0 24 24">
        <path d="M5 14l6-6 4 4-6 6H5z"></path>
        <path d="M9 6l2-2 4 4-2 2"></path>
        <circle cx="16.5" cy="7.5" r="1"></circle>
    </symbol>
    <symbol id="icon-teaminbox" viewBox="0 0 24 24">
        <path d="M4 7h16l-2 10H6L4 7z"></path>
        <path d="M9 13h6"></path>
    </symbol>
    <symbol id="icon-mail" viewBox="0 0 24 24">
        <rect x="4" y="6" width="16" height="12" rx="2"></rect>
        <path d="M4 8l8 6 8-6"></path>
    </symbol>
    <symbol id="icon-cliq" viewBox="0 0 24 24">
        <path d="M4 6h12a4 4 0 0 1 4 4v2a4 4 0 0 1-4 4H9l-5 4v-4H4a4 4 0 0 1-4-4v-2a4 4 0 0 1 4-4z"></path>
    </symbol>
    <symbol id="icon-sheet" viewBox="0 0 24 24">
        <rect x="4" y="5" width="16" height="14" rx="2"></rect>
        <line x1="4" y1="10" x2="20" y2="10"></line>
        <line x1="9" y1="5" x2="9" y2="19"></line>
    </symbol>
    <symbol id="icon-show" viewBox="0 0 24 24">
        <rect x="4" y="6" width="16" height="12" rx="2"></rect>
        <path d="M11 10l4 2-4 2z"></path>
    </symbol>
    <symbol id="icon-writer" viewBox="0 0 24 24">
        <path d="M6 18l10-10 2 2-10 10H6z"></path>
        <path d="M14 6l2-2 4 4-2 2"></path>
    </symbol>
    <symbol id="icon-connect" viewBox="0 0 24 24">
        <circle cx="6" cy="12" r="3"></circle>
        <circle cx="18" cy="7" r="3"></circle>
        <circle cx="18" cy="17" r="3"></circle>
        <line x1="8.5" y1="10.5" x2="15.5" y2="8.5"></line>
        <line x1="8.5" y1="13.5" x2="15.5" y2="15.5"></line>
    </symbol>
    <symbol id="icon-vault" viewBox="0 0 24 24">
        <rect x="5" y="10" width="14" height="10" rx="2"></rect>
        <path d="M8 10V7a4 4 0 0 1 8 0v3"></path>
        <circle cx="12" cy="15" r="1.5"></circle>
    </symbol>
    <symbol id="icon-workdrive" viewBox="0 0 24 24">
        <rect x="4" y="7" width="16" height="10" rx="2"></rect>
        <circle cx="8" cy="12" r="1.5"></circle>
        <line x1="11" y1="12" x2="18" y2="12"></line>
    </symbol>
    <symbol id="icon-learn" viewBox="0 0 24 24">
        <path d="M4 6h8a4 4 0 0 1 4 4v8H8a4 4 0 0 0-4 0V6z"></path>
        <path d="M20 6h-8a4 4 0 0 0-4 4v8h8a4 4 0 0 1 4 0V6z"></path>
    </symbol>
    <symbol id="icon-crm" viewBox="0 0 24 24">
        <path d="M9 7h4a4 4 0 0 1 0 8H9"></path>
        <path d="M15 17h-4a4 4 0 0 1 0-8h4"></path>
    </symbol>
    <symbol id="icon-salesiq" viewBox="0 0 24 24">
        <rect x="4" y="6" width="16" height="10" rx="3"></rect>
        <path d="M9 16l-3 3v-3"></path>
        <circle cx="10" cy="11" r="1"></circle>
        <circle cx="14" cy="11" r="1"></circle>
    </symbol>
    <symbol id="icon-salesinbox" viewBox="0 0 24 24">
        <path d="M4 7h16l-2 10H6L4 7z"></path>
        <path d="M12 10v6"></path>
        <path d="M9 13l3 3 3-3"></path>
    </symbol>
    <symbol id="icon-bigin" viewBox="0 0 24 24">
        <path d="M4 6h16l-6 6v6l-4-2v-4L4 6z"></path>
    </symbol>
    <symbol id="icon-bookings" viewBox="0 0 24 24">
        <rect x="4" y="6" width="16" height="14" rx="2"></rect>
        <line x1="4" y1="10" x2="20" y2="10"></line>
        <line x1="8" y1="4" x2="8" y2="8"></line>
        <line x1="16" y1="4" x2="16" y2="8"></line>
    </symbol>
    <symbol id="icon-sites" viewBox="0 0 24 24">
        <circle cx="12" cy="12" r="9"></circle>
        <path d="M3 12h18"></path>
        <path d="M12 3a12 12 0 0 1 0 18"></path>
        <path d="M12 3a12 12 0 0 0 0 18"></path>
    </symbol>
    <symbol id="icon-campaigns" viewBox="0 0 24 24">
        <path d="M4 10l10-4v12l-10-4v-4z"></path>
        <path d="M14 8h4a3 3 0 0 1 0 8h-4"></path>
    </symbol>
    <symbol id="icon-survey" viewBox="0 0 24 24">
        <rect x="5" y="4" width="14" height="16" rx="2"></rect>
        <path d="M8 10l2 2 4-4"></path>
        <line x1="8" y1="14" x2="16" y2="14"></line>
    </symbol>
    <symbol id="icon-backstage" viewBox="0 0 24 24">
        <path d="M7 7l5-3 5 3v6l-5 3-5-3V7z"></path>
    </symbol>
    <symbol id="icon-forms" viewBox="0 0 24 24">
        <rect x="5" y="4" width="14" height="16" rx="2"></rect>
        <line x1="8" y1="9" x2="16" y2="9"></line>
        <line x1="8" y1="13" x2="14" y2="13"></line>
    </symbol>
    <symbol id="icon-marketinghub" viewBox="0 0 24 24">
        <path d="M5 16l4-4 3 3 6-6"></path>
        <path d="M16 9h4v4"></path>
    </symbol>
    <symbol id="icon-pagesense" viewBox="0 0 24 24">
        <rect x="4" y="6" width="12" height="12" rx="2"></rect>
        <rect x="8" y="4" width="12" height="12" rx="2"></rect>
    </symbol>
    <symbol id="icon-social" viewBox="0 0 24 24">
        <circle cx="6" cy="12" r="2"></circle>
        <circle cx="18" cy="7" r="2"></circle>
        <circle cx="18" cy="17" r="2"></circle>
        <line x1="8" y1="11" x2="16" y2="8"></line>
        <line x1="8" y1="13" x2="16" y2="16"></line>
    </symbol>
    <symbol id="icon-desk" viewBox="0 0 24 24">
        <path d="M6 12a6 6 0 0 1 12 0v3h-4l-2 3-2-3H6v-3z"></path>
    </symbol>
    <symbol id="icon-lens" viewBox="0 0 24 24">
        <circle cx="12" cy="12" r="7"></circle>
        <circle cx="12" cy="12" r="2"></circle>
    </symbol>
    <symbol id="icon-assist" viewBox="0 0 24 24">
        <circle cx="12" cy="12" r="7"></circle>
        <circle cx="12" cy="12" r="3"></circle>
        <line x1="12" y1="5" x2="12" y2="9"></line>
        <line x1="12" y1="15" x2="12" y2="19"></line>
    </symbol>
    <symbol id="icon-people" viewBox="0 0 24 24">
        <circle cx="9" cy="9" r="3"></circle>
        <circle cx="16" cy="10" r="2.5"></circle>
        <path d="M4 19a5 5 0 0 1 10 0"></path>
        <path d="M13 19a4 4 0 0 1 7 0"></path>
    </symbol>
    <symbol id="icon-recruit" viewBox="0 0 24 24">
        <circle cx="10" cy="9" r="3"></circle>
        <path d="M4 19a6 6 0 0 1 12 0"></path>
        <line x1="18" y1="8" x2="18" y2="14"></line>
        <line x1="15" y1="11" x2="21" y2="11"></line>
    </symbol>
    <symbol id="icon-analytics" viewBox="0 0 24 24">
        <line x1="5" y1="19" x2="5" y2="11"></line>
        <line x1="10" y1="19" x2="10" y2="7"></line>
        <line x1="15" y1="19" x2="15" y2="13"></line>
        <line x1="20" y1="19" x2="20" y2="9"></line>
    </symbol>
    <symbol id="icon-creator" viewBox="0 0 24 24">
        <rect x="4" y="4" width="8" height="8" rx="2"></rect>
        <circle cx="17" cy="7" r="3"></circle>
        <path d="M14 14h6v6h-6z"></path>
    </symbol>
    <symbol id="icon-flow" viewBox="0 0 24 24">
        <circle cx="6" cy="6" r="2"></circle>
        <circle cx="18" cy="12" r="2"></circle>
        <circle cx="6" cy="18" r="2"></circle>
        <path d="M8 6h6l4 6-4 6H8"></path>
    </symbol>
    <symbol id="icon-qntrl" viewBox="0 0 24 24">
        <circle cx="12" cy="12" r="8"></circle>
        <circle cx="12" cy="12" r="3"></circle>
        <line x1="12" y1="4" x2="12" y2="7"></line>
    </symbol>
    <symbol id="icon-dataprep" viewBox="0 0 24 24">
        <path d="M4 15c3 0 3-6 6-6s3 6 6 6 3-6 6-6"></path>
    </symbol>
    <symbol id="icon-rpa" viewBox="0 0 24 24">
        <rect x="6" y="7" width="12" height="10" rx="2"></rect>
        <circle cx="10" cy="12" r="1"></circle>
        <circle cx="14" cy="12" r="1"></circle>
        <line x1="9" y1="5" x2="9" y2="7"></line>
        <line x1="15" y1="5" x2="15" y2="7"></line>
    </symbol>
</svg>

<!-- Sticky help button (right rail) -->
<a class="help-fab" href="support.php" aria-label="Help"><i class="fa-regular fa-circle-question"></i></a>
<script>
  (function(){
    const toggles = document.querySelectorAll('[data-nav-toggle]');
    toggles.forEach(btn => {
      btn.addEventListener('click', () => {
        const group = btn.closest('.nav-group');
        if (!group) return;
        group.classList.toggle('open');
      });
    });

    const setupComplete = document.body.dataset.setupComplete === '1';
    if (setupComplete) {
      const target = document.getElementById('dashboard-end');
      if (target) {
        window.requestAnimationFrame(() => {
          target.scrollIntoView({ behavior: 'auto', block: 'start' });
        });
      }
    }

    <?php if ($autoRedirectToDashboard): ?>
    window.setTimeout(() => {
      window.location.href = 'dashboard.php';
    }, <?php echo (int) $redirectDelayMs; ?>);
    <?php endif; ?>
  })();
  (function(){
    const popover = document.getElementById('updatesPopover');
    if (!popover) return;
    const closeTargets = popover.querySelectorAll('[data-close-updates]');
    closeTargets.forEach(target => {
      target.addEventListener('click', () => {
        window.location.href = 'dashboard.php';
      });
    });
  })();
</script>
</body>
</html>
