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

<div style="margin-bottom: 2rem;">
    <h3 style="margin: 0 0 0.5rem; color: white;">Overview Statistics</h3>
    <p style="color: var(--text-muted); margin: 0;">Select a card or use the sidebar to manage core system tables.</p>
</div>

<div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 2rem; margin-bottom: 3rem;">
    <!-- Users Card -->
    <a href="/superadmin/users" style="text-decoration: none; color: inherit;">
        <div class="card-stat">
            <div>
                <h4 style="margin: 0; color: var(--text-muted); font-size: 0.9rem; text-transform: uppercase; letter-spacing: 0.05em;">Total Users</h4>
                <h2 style="margin: 0.5rem 0 0; color: white; font-size: 2.25rem; font-weight: 700;"><?php echo intval($userCount); ?></h2>
            </div>
            <div class="icon-box">
                <i class="ph ph-users-three"></i>
            </div>
        </div>
    </a>

    <!-- Privileges Card -->
    <a href="/superadmin/privileges" style="text-decoration: none; color: inherit;">
        <div class="card-stat">
            <div>
                <h4 style="margin: 0; color: var(--text-muted); font-size: 0.9rem; text-transform: uppercase; letter-spacing: 0.05em;">Privileges</h4>
                <h2 style="margin: 0.5rem 0 0; color: white; font-size: 2.25rem; font-weight: 700;"><?php echo intval($privilegeCount); ?></h2>
            </div>
            <div class="icon-box">
                <i class="ph ph-shield"></i>
            </div>
        </div>
    </a>

    <!-- UOMs Card -->
    <a href="/superadmin/uoms" style="text-decoration: none; color: inherit;">
        <div class="card-stat">
            <div>
                <h4 style="margin: 0; color: var(--text-muted); font-size: 0.9rem; text-transform: uppercase; letter-spacing: 0.05em;">Units of Measure</h4>
                <h2 style="margin: 0.5rem 0 0; color: white; font-size: 2.25rem; font-weight: 700;"><?php echo intval($uomCount); ?></h2>
            </div>
            <div class="icon-box">
                <i class="ph ph-scales"></i>
            </div>
        </div>
    </a>

    <!-- SMTP Settings Card -->
    <a href="/superadmin/smtp" style="text-decoration: none; color: inherit;">
        <div class="card-stat">
            <div>
                <h4 style="margin: 0; color: var(--text-muted); font-size: 0.9rem; text-transform: uppercase; letter-spacing: 0.05em;">SMTP Profiles</h4>
                <h2 style="margin: 0.5rem 0 0; color: white; font-size: 2.25rem; font-weight: 700;"><?php echo intval($smtpCount); ?></h2>
            </div>
            <div class="icon-box">
                <i class="ph ph-envelope-simple"></i>
            </div>
        </div>
    </a>
</div>

<div class="card" style="padding: 2rem;">
    <h3 style="margin-top: 0; color: white; border-bottom: 1px solid var(--glass-border); padding-bottom: 0.75rem;">
        <i class="ph ph-info" style="vertical-align: middle; color: #fbbf24; margin-right: 0.5rem;"></i>System Administration Note
    </h3>
    <p style="color: var(--text-light); line-height: 1.6; margin-bottom: 0;">
        Welcome to the NexCore Pharma Global Superadmin portal. This interface allows direct read/write management of central configuration matrices. Actions performed here affect all active tenants. Please exercise extreme caution when modifying credentials, user roles, or SMTP settings as these changes can directly impact mail deliverability and auth configurations.
    </p>
</div>

</div> <!-- main-content -->
</div> <!-- dashboard-layout -->

<script>
function updateClock() {
    const clockDateEl = document.getElementById('clockDate');
    const clockTimeEl = document.getElementById('clockTime');
    if (!clockDateEl || !clockTimeEl) return;

    const now = new Date();
    const options = { weekday: 'short', year: 'numeric', month: 'short', day: 'numeric' };
    const dateStr = now.toLocaleDateString('en-US', options);
    
    let hours = now.getHours();
    const minutes = String(now.getMinutes()).padStart(2, '0');
    const seconds = String(now.getSeconds()).padStart(2, '0');
    const ampm = hours >= 12 ? 'PM' : 'AM';
    hours = hours % 12;
    hours = hours ? hours : 12;
    const hoursStr = String(hours).padStart(2, '0');
    
    clockDateEl.textContent = dateStr;
    clockTimeEl.textContent = `${hoursStr}:${minutes}:${seconds} ${ampm}`;
}
updateClock();
setInterval(updateClock, 1000);
</script>
</body>
</html>
