<nav class="navbar navbar-expand-md sticky-top px-3 mb-3">
    <span class="navbar-brand">
        SekiPOS
        <small class="text-muted fw-normal" style="font-size:0.65rem;">v2.0</small>
    </span>

    <div class="ms-3 gap-2 d-flex">
        <a href="/inventory" class="btn btn-sm {{ 'btn-primary' if active_page == 'inventory' else 'btn-outline-primary' }}">
            <i class="bi bi-box-seam me-1"></i>Inventario
        </a>
        <a href="/checkout"
            class="btn btn-sm {{ 'btn-primary' if active_page == 'checkout' else 'btn-outline-primary' }}">
            <i class="bi bi-cart-fill me-1"></i>Caja
        </a>
        <a href="/sales" class="btn btn-sm {{ 'btn-primary' if active_page == 'sales' else 'btn-outline-primary' }}">
            <i class="bi bi-receipt me-1"></i>Ventas
        </a>
        <a href="/dicom" class="btn btn-sm {{ 'btn-danger' if active_page == 'dicom' else 'btn-outline-danger' }}">
            <i class="bi bi-journal-x me-1"></i>Dicom
        </a>
    </div>

    <div class="ms-auto">
        <div class="dropdown">
            <button class="btn btn-accent dropdown-toggle" type="button" data-bs-toggle="dropdown">
                <i class="bi bi-person-circle me-1"></i>
                <span class="d-none d-sm-inline">{{ user.username }}</span>
            </button>
            <ul class="dropdown-menu dropdown-menu-end shadow">
                <li>
                    <button class="dropdown-item" onclick="toggleTheme()">
                        <i class="bi bi-moon-stars me-2"></i>Modo Oscuro
                    </button>
                </li>
                <li>
                    <a class="dropdown-item" href="/export/db">
                        <i class="bi bi-database-down me-2"></i>Descargar DB
                    </a>
                </li>
                <li>
                    <a class="dropdown-item" href="/export/images">
                        <i class="bi bi-images me-2"></i>Descargar Imágenes
                    </a>
                </li>
                <li><hr class="dropdown-divider"></li>
                <li>
                    <a class="dropdown-item text-danger" href="/logout">
                        <i class="bi bi-box-arrow-right me-2"></i>Salir
                    </a>
                </li>
            </ul>
        </div>
    </div>
</nav>