<?= $this->extend('layouts/enterprise') ?>

<?= $this->section('content') ?>

<?= view('partials/workspace_hero', [
    'workspaceCrumbPill'    => 'Inventory',
    'workspaceCrumbCurrent' => 'Barcodes',
    'workspaceTitle'        => 'Barcodes & Labels',
    'workspaceDesc'         => 'Product barcodes and SKU labels for printing.',
]) ?>

<style>
.barcode-label-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 1rem;
    margin-top: 1.5rem;
}
.barcode-label {
    border: 1px dashed #ccc;
    border-radius: 6px;
    padding: 0.75rem;
    text-align: center;
    background: #fff;
}
.barcode-label__name {
    font-size: 0.75rem;
    font-weight: 600;
    margin-bottom: 0.25rem;
    line-height: 1.2;
}
.barcode-label__sku {
    font-size: 0.65rem;
    color: #666;
    margin-bottom: 0.35rem;
}
.barcode-label__code {
    font-family: monospace;
    font-size: 1rem;
    letter-spacing: 0.05em;
    padding: 0.35rem 0;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
}
@media print {
    .enterprise-data-panel__toolbar,
    .enterprise-data-panel__head,
    .no-print,
    .enterprise-sidebar,
    .enterprise-topbar { display: none !important; }
    .barcode-label-grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 0.5rem;
    }
    .barcode-label {
        break-inside: avoid;
        border: 1px solid #000;
    }
}
</style>

<div class="enterprise-data-panel no-print">
    <div class="enterprise-data-panel__head">
        <h2 class="enterprise-data-panel__title">Products</h2>
        <p class="enterprise-data-panel__subtitle">All active products with SKU and barcode for label sheets.</p>
    </div>

    <div class="enterprise-data-panel__toolbar">
        <form action="<?= base_url('inventory/barcodes') ?>" method="get">
            <div class="enterprise-filter-grid">
                <div>
                    <label class="enterprise-field-label">Search</label>
                    <input type="text" name="q" class="form-control form-control-sm" placeholder="Name, SKU, or barcode"
                           value="<?= esc($filters['search']) ?>">
                </div>
                <div class="enterprise-filter-actions">
                    <button type="submit" class="btn btn-sm btn-primary">Apply Filters</button>
                    <button type="button" class="btn btn-sm btn-outline-secondary" onclick="window.print();">
                        <i class="fa-solid fa-print me-1"></i> Print Labels
                    </button>
                </div>
            </div>
        </form>
    </div>

    <div class="enterprise-data-panel__body">
        <div class="table-responsive">
            <table class="enterprise-data-table">
                <thead>
                    <tr>
                        <th>Product</th>
                        <th>SKU</th>
                        <th>Barcode</th>
                    </tr>
                </thead>
                <tbody>
                    <?php foreach ($products as $row): ?>
                        <tr>
                            <td><span class="enterprise-data-table__primary"><?= esc($row['name']) ?></span></td>
                            <td><code><?= esc($row['sku']) ?></code></td>
                            <td><code><?= esc($row['barcode'] ?: '—') ?></code></td>
                        </tr>
                    <?php endforeach; ?>
                    <?php if (count($products) === 0): ?>
                        <tr><td colspan="3" class="text-center text-muted py-5">No products found.</td></tr>
                    <?php endif; ?>
                </tbody>
            </table>
        </div>
    </div>
</div>

<div class="barcode-label-grid">
    <?php foreach ($products as $row): ?>
        <?php $code = $row['barcode'] ?: $row['sku']; ?>
        <div class="barcode-label">
            <div class="barcode-label__name"><?= esc($row['name']) ?></div>
            <div class="barcode-label__sku">SKU: <?= esc($row['sku']) ?></div>
            <div class="barcode-label__code"><?= esc($code) ?></div>
        </div>
    <?php endforeach; ?>
</div>

<?= $this->endSection() ?>
