<?php
if ( ! defined( 'ABSPATH' ) ) exit;

$categories = aitd_get_tool_categories();
?>
<?php if ( is_post_type_archive( AITD_POST_TYPE ) ) : get_header(); endif; ?>

<div class="aitd-directory-wrap">
    <div class="aitd-hero">
        <div class="aitd-hero-inner">
            <div class="aitd-hero-badge"><?php echo number_format_i18n( aitd_get_count() ); ?> AI tool listings</div>
            <div class="aitd-search-bar">
                <span class="aitd-search-icon">Search</span>
                <input type="text" id="aitd-search" placeholder="Search AI tools, categories, or use cases..." autocomplete="off" aria-label="Search AI tools">
                <kbd>Enter</kbd>
            </div>
        </div>
    </div>

    <div class="aitd-filter-bar">
        <div class="aitd-filter-inner">
            <div class="aitd-filter-toolbar">
                <div class="aitd-filter-heading">
                    <span class="aitd-filter-label">Browse By Category</span>
                </div>
                <select id="aitd-sort" class="aitd-select">
                    <option value="newest">Latest</option>
                    <option value="featured">Featured</option>
                    <option value="az">A to Z</option>
                    <option value="za">Z to A</option>
                </select>
            </div>

            <div class="aitd-filter-pills-wrap">
                <div class="aitd-filter-pills" id="aitd-category-filters" data-default-visible="4">
                    <button class="aitd-pill active" data-category="0">All</button>
                    <?php foreach ( $categories as $category ) : ?>
                        <button class="aitd-pill" data-category="<?php echo esc_attr( $category->term_id ); ?>"><?php echo esc_html( $category->name ); ?></button>
                    <?php endforeach; ?>
                </div>
            </div>
        </div>
    </div>

    <div class="aitd-results-wrap">
        <div id="aitd-results">
            <div class="aitd-loading">Loading tools...</div>
        </div>
    </div>
</div>

<?php if ( is_post_type_archive( AITD_POST_TYPE ) ) : get_footer(); endif; ?>
