<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
    <meta name="csrf-token-name" content="<?= esc(csrf_token()) ?>">
    <meta name="csrf-token" content="<?= esc(csrf_hash()) ?>">
    <title><?= esc($title ?? 'TIEASY') ?> · TIEASY</title>
    <link rel="stylesheet" href="<?= base_url('assets/css/app.css') ?>">
</head>
<body class="app-body">
<?php $activeNav = $activeNav ?? ''; ?>
<div class="app-shell">
    <header class="app-header">
        <?= $this->renderSection('header') ?>
    </header>

    <main class="app-main">
        <?php if (session()->getFlashdata('error')): ?>
            <div class="flash flash-error" role="alert"><?= esc(session()->getFlashdata('error')) ?></div>
        <?php endif; ?>
        <?php if (session()->getFlashdata('success')): ?>
            <div class="flash flash-success" role="status"><?= esc(session()->getFlashdata('success')) ?></div>
        <?php endif; ?>
        <?= $this->renderSection('content') ?>
    </main>

    <nav class="bottom-nav" aria-label="Primary">
        <a class="nav-item <?= $activeNav === 'home' ? 'is-active' : '' ?>" href="<?= site_url('dashboard') ?>" aria-label="Home">
            <svg viewBox="0 0 24 24" width="24" height="24" aria-hidden="true"><rect x="5" y="4" width="14" height="16" rx="2" fill="none" stroke="currentColor" stroke-width="1.8"/><path d="M8 9h8M8 13h8M8 17h5" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round"/></svg>
        </a>
        <a class="nav-item <?= $activeNav === 'analytics' ? 'is-active' : '' ?>" href="<?= site_url('analytics') ?>" aria-label="Analytics">
            <svg viewBox="0 0 24 24" width="24" height="24" aria-hidden="true"><path d="M5 19V10M12 19V5M19 19v-7" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round"/></svg>
        </a>
        <button type="button" class="nav-item <?= $activeNav === 'menu' ? 'is-active' : '' ?>" id="hamburger-btn" aria-label="Menu" aria-expanded="false" aria-controls="hamburger-menu">
            <svg viewBox="0 0 24 24" width="24" height="24" aria-hidden="true"><path d="M5 7h14M5 12h14M5 17h14" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round"/></svg>
        </button>
        <a class="nav-fab" href="<?= site_url('tasks/create') ?>" aria-label="Add Task">
            <svg viewBox="0 0 24 24" width="22" height="22" aria-hidden="true"><path d="M12 5v14M5 12h14" fill="none" stroke="#fff" stroke-width="2.2" stroke-linecap="round"/></svg>
        </a>
    </nav>
</div>

<div class="menu-backdrop" id="menu-backdrop" hidden></div>
<div class="hamburger-menu" id="hamburger-menu" hidden>
    <a href="<?= site_url('notifications') ?>">
        <span class="menu-ico" aria-hidden="true">
            <svg viewBox="0 0 24 24" width="20" height="20"><path d="M15 17h5l-1.4-1.4A2 2 0 0 1 18 14.2V11a6 6 0 1 0-12 0v3.2c0 .5-.2 1-.6 1.4L4 17h5m6 0a3 3 0 1 1-6 0" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round"/></svg>
        </span>
        Notifications
    </a>
    <a href="<?= site_url('categories') ?>">
        <span class="menu-ico" aria-hidden="true">
            <svg viewBox="0 0 24 24" width="20" height="20"><rect x="4" y="4" width="7" height="7" rx="1.5" fill="none" stroke="currentColor" stroke-width="1.8"/><rect x="13" y="4" width="7" height="7" rx="1.5" fill="none" stroke="currentColor" stroke-width="1.8"/><rect x="4" y="13" width="7" height="7" rx="1.5" fill="none" stroke="currentColor" stroke-width="1.8"/><rect x="13" y="13" width="7" height="7" rx="1.5" fill="none" stroke="currentColor" stroke-width="1.8"/></svg>
        </span>
        Category Manager
    </a>
    <a href="<?= site_url('settings') ?>">
        <span class="menu-ico" aria-hidden="true">
            <svg viewBox="0 0 24 24" width="20" height="20"><circle cx="12" cy="12" r="3" fill="none" stroke="currentColor" stroke-width="1.8"/><path d="M12 3.5v2.2M12 18.3v2.2M4.6 6.5l1.6 1.6M17.8 15.9l1.6 1.6M3.5 12h2.2M18.3 12h2.2M4.6 17.5l1.6-1.6M17.8 8.1l1.6-1.6" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round"/></svg>
        </span>
        Settings
    </a>
    <a href="<?= site_url('support') ?>">
        <span class="menu-ico" aria-hidden="true">
            <svg viewBox="0 0 24 24" width="20" height="20"><circle cx="12" cy="12" r="9" fill="none" stroke="currentColor" stroke-width="1.8"/><path d="M9.5 9a2.5 2.5 0 1 1 3.6 2.2c-.8.4-1.1 1-1.1 1.8V14" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round"/><circle cx="12" cy="17" r="1" fill="currentColor"/></svg>
        </span>
        Contact Support
    </a>
    <a class="menu-logout" href="<?= site_url('logout') ?>">Logout</a>
    <p class="menu-hint">This helps us set your profile and provide better personalization.</p>
</div>

<script src="<?= base_url('assets/js/app.js') ?>" defer></script>
<?php foreach (($extraScripts ?? []) as $scriptSrc): ?>
    <?php if (is_string($scriptSrc) && preg_match('#^assets/js/[a-zA-Z0-9._-]+$#', $scriptSrc) === 1): ?>
        <script src="<?= base_url($scriptSrc) ?>"></script>
    <?php endif; ?>
<?php endforeach; ?>
</body>
</html>
