<?php
/**
 * The template for displaying product search form
 *
 * This template can be overridden by copying it to yourtheme/woocommerce/product-searchform.php.
 *
 * @package Pawfect
 */

// Exit if accessed directly
if (!defined('ABSPATH')) {
    exit;
}

$index = isset($index) ? absint($index) : 0;
?>

<form method="get" class="woocommerce-product-search" action="<?php echo esc_url(home_url('/')); ?>">
    <label class="screen-reader-text" for="woocommerce-product-search-field-<?php echo esc_attr( $index ); ?>">
        <?php esc_html_e('Search for:', 'pawfect'); ?>
    </label>
    <input type="search" 
           id="woocommerce-product-search-field-<?php echo esc_attr( $index ); ?>" 
           class="search-field" 
           placeholder="<?php echo esc_attr__('Search products...', 'pawfect'); ?>" 
           value="<?php echo esc_attr( get_search_query() ); ?>" 
           name="s" />
    <button type="submit" value="<?php echo esc_attr_x('Search', 'submit button', 'pawfect'); ?>" class="search-submit" aria-label="<?php esc_attr_e('Search Submit', 'pawfect'); ?>">
        <span class="screen-reader-text"><?php esc_html_e('Search', 'pawfect'); ?></span>
        <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="#ffffff" viewBox="0 0 256 256">
                            <path d="M226.83,221.17l-52.7-52.7a84.1,84.1,0,1,0-5.66,5.66l52.7,52.7a4,4,0,0,0,5.66-5.66ZM36,112a76,76,0,1,1,76,76A76.08,76.08,0,0,1,36,112Z"></path>
                        </svg>
    </button>
    <input type="hidden" name="post_type" value="product" />
</form>
