<?php
// app/order-form.php

require_once __DIR__ . '/db.php';
require_once __DIR__ . '/settings.php';

if (!function_exists('sparrow_order_form_value')) {
    function sparrow_order_form_value(array $values, string $key, string $default = ''): string
    {
        return htmlspecialchars((string)($values[$key] ?? $default), ENT_QUOTES, 'UTF-8');
    }
}

if (!function_exists('sparrow_order_form_checked')) {
    function sparrow_order_form_checked(array $values, string $key): string
    {
        return !empty($values[$key]) ? 'checked' : '';
    }
}

if (!function_exists('sparrow_order_form_selected')) {
    function sparrow_order_form_selected(array $values, string $key, string $option): string
    {
        return (($values[$key] ?? '') === $option) ? 'selected' : '';
    }
}

$values = $values ?? [];
$is_admin = $is_admin ?? false;
$order_form_pdo = sparrow_db();
$order_form_settings = sparrow_get_settings($order_form_pdo, [
    'status_list',
    'default_order_status',
]);

if (!function_exists('sparrow_order_form_setting_options')) {
    function sparrow_order_form_setting_options(PDO $pdo, string $category, array $fallback): array
    {
        $options = array_values(array_filter(array_map(
            static fn(array $row): string => trim((string) ($row['value'] ?? '')),
            sparrow_get_setting_rows($pdo, $category)
        )));

        return $options ?: $fallback;
    }
}

$shirt_sizes = [
    'X-Small',
    'Small',
    'Medium',
    'Large',
    'X-Large',
    '2X-Large',
    '3X-Large',
    '4X-Large',
];

$shirt_specialties = sparrow_order_form_setting_options($order_form_pdo, 'specialty', [
    'None',
    'Glitter',
    'Puff',
    'Gold Foil',
    'Iridescent',
    'Thermochromic',
    'Pearl',
    'Glow in the Dark',
    'Reflective',
]);

$shirt_colors = [
    'White',
    'Off White',
    'Natural',
    'Ash',
    'Sports Grey',
    'Gravel',
    'Graphite Heather',
    'Charcoal',
    'Dark Heather',
    'Heather Dark Grey',
    'Black',
    'Sand',
    'Daisy',
    'Gold',
    'Orange',
    'Safety Orange',
    'Light Pink',
    'Azalea',
    'Safety Pink',
    'Heliconia',
    'Heather Red',
    'Red',
    'Cherry Red',
    'Maroon',
    'Mint Green',
    'Pistachio',
    'Sage',
    'Heather Irish Green',
    'Safety Green',
    'Military Green',
    'Irish Green',
    'Forest Green',
    'Light Blue',
    'Sky Blue',
    'Stone Blue',
    'Heather Royal',
    'Indigo Blue',
    'Carolina Blue',
    'Sapphire',
    'Heather Sapphire',
    'Tropical Blue',
    'Royal Blue',
    'Heather Navy',
    'Navy',
    'Violet',
    'Paragon',
    'Purple',
];

$design_placements = sparrow_order_form_setting_options($order_form_pdo, 'print_location', [
    'Full Front',
    'Full Back',
    'Chest',
    'Sleeve',
    'Front & Back',
	'Chest & Back',
    'Other',
]);

$order_statuses = array_values(array_filter(array_map(
    'trim',
    preg_split('/\r\n|\r|\n/', (string) ($order_form_settings['status_list'] ?? '')) ?: []
)));

if (!$order_statuses) {
    $order_statuses = ['Order Received'];
}

$default_order_status = trim((string) ($order_form_settings['default_order_status'] ?? 'Order Received'));
if ($default_order_status === '') {
    $default_order_status = $order_statuses[0];
}

$admin_customer_lookup = [];

if ($is_admin) {
    $customer_stmt = $order_form_pdo->query("
        SELECT
            customer_name,
            customer_email,
            customer_phone,
            order_date,
            id
        FROM orders
        WHERE COALESCE(trashed, 0) = 0
          AND TRIM(COALESCE(customer_name, '')) != ''
        ORDER BY
            customer_name ASC,
            order_date DESC,
            id DESC
    ");

    foreach (
        $customer_stmt->fetchAll(PDO::FETCH_ASSOC)
        as $customer_row
    ) {
        $customer_name = trim(
            (string) ($customer_row['customer_name'] ?? '')
        );

        if ($customer_name === '') {
            continue;
        }

        $customer_key = strtolower($customer_name);

        /*
         * Because the query is newest-first for each name,
         * keep the newest contact information we find.
         */
        if (isset($admin_customer_lookup[$customer_key])) {
            continue;
        }

        $admin_customer_lookup[$customer_key] = [
            'name' => $customer_name,
            'email' => trim(
                (string) ($customer_row['customer_email'] ?? '')
            ),
            'phone' => trim(
                (string) ($customer_row['customer_phone'] ?? '')
            ),
        ];
    }
}
?>

<style>
.sparrow-order-form {
    max-width: 900px;
}

.sparrow-form-card {
    background: #fff;
    border: 1px solid #f3bfd1;
    border-radius: 12px;
    padding: 18px;
    margin-bottom: 18px;
}

.sparrow-form-card h3,
.sparrow-form-card h4 {
    margin-top: 0;
    color: #3f3f3f;
}

.form-grid.two {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 18px;
}

.form-field {
    margin-bottom: 16px;
}

.form-field label {
    display: block;
    font-size: 12px;
    font-weight: 700;
    margin-bottom: 6px;
    color: #444;
}

.form-field label span,
.sparrow-form-card h3 span {
    color: #cc3366;
}

.form-field input,
.form-field select,
.form-field textarea {
    width: 100%;
    border: 1px solid #efb5cc;
    border-radius: 9px;
    padding: 10px;
    font-size: 14px;
    box-sizing: border-box;
}

.form-field select {
    border-color: #999;
    border-radius: 0;
}

.form-field textarea {
    min-height: 110px;
}

.help-text {
    margin-top: -4px;
    font-size: 13px;
    color: #666;
}

.product-section {
    background: #fafafa;
    border-left: 5px solid #f1d6e2;
    padding: 16px;
    margin: 18px 0;
}

.repeater-item {
    background: #fff;
    border: 1px solid #eee;
    border-radius: 10px;
    padding: 16px;
    margin-bottom: 14px;
}

.agreement-line {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    line-height: 1.7;
}

.agreement-line input {
    margin-top: 6px;
}

.primary-btn,
.secondary-btn,
.remove-item-btn {
    border: 0;
    border-radius: 9px;
    padding: 10px 16px;
    font-weight: 700;
    cursor: pointer;
}

.primary-btn {
    background: #d88fac;
    color: #fff;
}

.secondary-btn {
    background: #fff;
    border: 2px solid #444;
    color: #111;
}

.remove-item-btn {
    background: #fff;
    border: 2px solid #444;
    color: #111;
    margin-top: 5px;
}

.form-actions {
    margin-top: 20px;
}

.admin-only-card {
    border-color: #cbb5ef;
}

@media (max-width: 700px) {
    .form-grid.two {
        grid-template-columns: 1fr;
    }
}
</style>

    <?php if ($is_admin): ?>
        <div class="sparrow-form-card admin-only-card">
            <h3>Admin Order Info</h3>

            <div class="form-grid two">
                <div class="form-field">
                    <label for="order_number">Order Number</label>
                    <input
                        type="text"
                        id="order_number"
                        name="order_number"
                        value="<?= sparrow_order_form_value($values, 'order_number') ?>"
                        placeholder="Auto-created if blank"
                    >
                </div>

                <div class="form-field">
                    <label for="order_status">Order Status</label>
                    <select id="order_status" name="order_status">
                        <?php
                        foreach ($order_statuses as $status):
                        ?>
                            <option value="<?= htmlspecialchars($status) ?>" <?= sparrow_order_form_selected($values, 'order_status', $status) ?>>
                                <?= htmlspecialchars($status) ?>
                            </option>
                        <?php endforeach; ?>
                    </select>
                </div>
            </div>
			<div class="form-field">
    <label for="order_date">Order Date</label>
    <input
        type="date"
        id="order_date"
        name="order_date"
        value="<?= sparrow_order_form_value(
            $values,
            'order_date',
            date('Y-m-d')
        ) ?>"
    >
    <p class="help-text">
        Change this date when entering an older historical order.
    </p>
</div>
        </div>
    <?php else: ?>
        <input type="hidden" name="order_status" value="<?= htmlspecialchars($default_order_status, ENT_QUOTES, 'UTF-8') ?>">
    <?php endif; ?>


    <div class="sparrow-form-card">
        <h3>Customer Information</h3>
		
		<?php if ($is_admin && $admin_customer_lookup): ?>
    <div class="form-field">
        <label for="existing_customer_lookup">
            Existing Customer
        </label>

        <input
            type="text"
            id="existing_customer_lookup"
            list="existing_customer_list"
            placeholder="Start typing a customer name..."
            autocomplete="off"
        >

        <datalist id="existing_customer_list">
            <?php foreach (
                $admin_customer_lookup as $customer
            ): ?>
                <option
                    value="<?= htmlspecialchars(
                        $customer['name'],
                        ENT_QUOTES,
                        'UTF-8'
                    ) ?>"
                    data-name="<?= htmlspecialchars(
                        $customer['name'],
                        ENT_QUOTES,
                        'UTF-8'
                    ) ?>"
                    data-email="<?= htmlspecialchars(
                        $customer['email'],
                        ENT_QUOTES,
                        'UTF-8'
                    ) ?>"
                    data-phone="<?= htmlspecialchars(
                        $customer['phone'],
                        ENT_QUOTES,
                        'UTF-8'
                    ) ?>"
                ></option>
            <?php endforeach; ?>
        </datalist>

        <p class="help-text">
            Choose an existing customer to fill in their
            saved contact information, or enter a new
            customer below.
        </p>
    </div>
<?php endif; ?>

        <div class="form-field">
            <label for="customer_name">Name <span>*</span></label>
            <input
                type="text"
                id="customer_name"
                name="customer_name"
                value="<?= sparrow_order_form_value($values, 'customer_name') ?>"
                required
            >
        </div>

        <div class="form-grid two">
    <div class="form-field">
        <label for="customer_email">Email Address <?php if (!$is_admin): ?><span>*</span><?php endif; ?></label>
<input
    type="email"
    id="customer_email"
    name="customer_email"
    value="<?= sparrow_order_form_value(
        $values,
        'customer_email'
    ) ?>"
    <?php if (!$is_admin): ?>
        required
    <?php endif; ?>
>
    </div>

    <div class="form-field">
        <label for="customer_phone">Phone</label>
        <input
            type="text"
            id="customer_phone"
            name="customer_phone"
            value="<?= sparrow_order_form_value($values, 'customer_phone') ?>"
        >
    </div>
</div>

<div class="form-grid two">
    <div class="form-field">
        <label for="preferred_contact">Preferred Contact</label>
        <select id="preferred_contact" name="preferred_contact">
            <option value="">Select Option Below</option>
            <option value="Text" <?= sparrow_order_form_selected($values, 'preferred_contact', 'Text') ?>>Text</option>
            <option value="Email" <?= sparrow_order_form_selected($values, 'preferred_contact', 'Email') ?>>Email</option>
            <option value="Phone Call" <?= sparrow_order_form_selected($values, 'preferred_contact', 'Phone Call') ?>>Phone Call</option>
        </select>
    </div>

    <div class="form-field">
        <label for="needed_by">Needed By / Event Date</label>
        <input
            type="date"
            id="needed_by"
            name="needed_by"
            value="<?= sparrow_order_form_value($values, 'needed_by') ?>"
        >
    </div>
</div>

        <div class="form-field">
            <label for="group_name">Group Name</label>
            <textarea
                id="group_name"
                name="group_name"
                rows="4"
                placeholder="If you have a specific group to add to order, you may place it here. Example: Sassy Sister, Family Homecoming"
            ><?= sparrow_order_form_value($values, 'group_name') ?></textarea>
        </div>
    </div>


    <div class="sparrow-form-card">
        <h3>Order Details</h3>

        <div class="form-field">
            <label for="product_type">Product Type <span>*</span></label>
            <select id="product_type" name="product_type" required>
                <option value="">Select Option Below</option>
                <option value="Shirt" <?= sparrow_order_form_selected($values, 'product_type', 'Shirt') ?>>Shirt</option>
                <option value="Koozie" <?= sparrow_order_form_selected($values, 'product_type', 'Koozie') ?>>Koozie</option>
            </select>
			</div>
			<p class="help-text">Ordering more than one type of product? Please submit a separate form for each product type. We can combine your requests into one order.</p>


        <div id="shirt_section" class="product-section">
            <h4>Shirt Details</h4>
            <p class="help-text">Please add each size as a separate entry. Example: 2 Medium, 3 Large, 1 XL.</p>

            <div id="shirt_items">
                <div class="repeater-item shirt-item">
                    <div class="form-grid two">
                        <div class="form-field">
                            <label>Size</label>
                            <select name="shirt_size[]">
                                <?php foreach ($shirt_sizes as $size): ?>
                                    <option value="<?= htmlspecialchars($size) ?>"><?= htmlspecialchars($size) ?></option>
                                <?php endforeach; ?>
                            </select>
                        </div>

                        <div class="form-field">
                            <label>Quantity  <span>*</span></label>
                            <input
    type="number"
    name="shirt_quantity[]"
    min="1"
    max="150"
    class="required-product-quantity"
>
                        </div>
                    </div>

                    <div class="form-grid two">
                        <div class="form-field">
                            <label>Specialty</label>
                            <select name="shirt_specialty[]">
                                <?php foreach ($shirt_specialties as $specialty): ?>
                                    <option value="<?= htmlspecialchars($specialty) ?>"><?= htmlspecialchars($specialty) ?></option>
                                <?php endforeach; ?>
                            </select>
                        </div>

                        <div class="form-field shirt-color-field">
    <label>Color</label>
    <select name="shirt_color[]">
        <?php foreach ($shirt_colors as $color): ?>
            <option value="<?= htmlspecialchars($color) ?>">
                <?= htmlspecialchars($color) ?>
            </option>
        <?php endforeach; ?>
    </select>
</div>

<div class="form-field">
    <input
        type="hidden"
        name="shirt_customer_supplied[]"
        value="0"
        class="customer-supplied-value"
    >

    <label class="agreement-line customer-supplied-line">
        <input
            type="checkbox"
            class="customer-supplied-checkbox"
            value="1"
        >
        <span>
            Customer provided their own shirt
        </span>
    </label>

    <p class="help-text">
        Shirt color is not required when the customer supplies the garment.
    </p>
</div>
                    </div>
					
					<div class="form-field">
    <label>Design Placement</label>

    <select
    name="shirt_placement[]"
    class="design-placement-select"
    required
>
    <option value="" selected disabled>
        Select Placement
    </option>

    <?php foreach ($design_placements as $placement): ?>
        <option value="<?= htmlspecialchars($placement) ?>">
            <?= htmlspecialchars($placement) ?>
        </option>
    <?php endforeach; ?>
</select>
</div>
					
					<div class="position-upload-area">
    <p class="help-text">
        Upload artwork or inspiration for the selected placement.
    </p>

<?php
$shirt_upload_positions = [
    'front' => 'Front',
    'back' => 'Back',
    'chest' => 'Chest',
    'sleeve' => 'Sleeve',
    'other' => 'Other',
];
?>

<?php foreach (
    $shirt_upload_positions
    as $upload_position => $upload_label
): ?>
    <div
        class="form-field position-upload-field"
        data-upload-position="<?= htmlspecialchars(
            $upload_position
        ) ?>"
        hidden
    >
        <label>
            Upload <?= htmlspecialchars($upload_label) ?>
            Design/Inspiration
        </label>

        <input
            type="file"
            name="shirt_upload_<?= htmlspecialchars(
                $upload_position
            ) ?>[]"
            accept="image/jpeg,image/png,image/gif,image/webp,application/pdf"
        >

        <?php if ($upload_position === 'sleeve'): ?>
            <p class="help-text">
                Please explain which sleeve this design should
                be placed on in Shirt Notes.
            </p>
        <?php elseif ($upload_position === 'other'): ?>
            <p class="help-text">
                Please explain where this design should be
                placed in Shirt Notes.
            </p>
        <?php endif; ?>
    </div>
<?php endforeach; ?>
</div>		

                    <div class="form-field">
                        <label>Shirt Notes</label>
                        <textarea name="shirt_notes[]" rows="4"></textarea>
                    </div>
					


                    <button type="button" class="remove-item-btn">Remove A Size</button>
                </div>
            </div>

            <button type="button" id="add_shirt_item" class="secondary-btn">Add Another Size</button>
        </div>

        <div id="koozie_section" class="product-section">
            <h4>Koozie Style</h4>

            <div id="koozie_items">
                <div class="repeater-item koozie-item">
                    <div class="form-grid two">
                        <div class="form-field">
                            <label>Quantity  <span>*</span></label>
                            <input
    type="number"
    name="koozie_quantity[]"
    min="1"
    max="150"
    class="required-product-quantity"
>
                        </div>

                        <div class="form-field">
                            <label>Color</label>
                            <input type="text" name="koozie_color[]">
                        </div>
                    </div>
					
										<div class="form-field">
    <label>Design Placement</label>

   <select
    name="koozie_placement[]"
    class="design-placement-select"
    required
>
    <option value="" selected disabled>
        Select Placement
    </option>

    <option value="Front">Front</option>
    <option value="Front & Back">Front &amp; Back</option>
</select>
</div>

<div class="position-upload-area">
    <p class="help-text">
        Upload artwork or inspiration for the selected placement.
    </p>

    <div
        class="form-field position-upload-field"
        data-upload-position="front"
        hidden
    >
        <label>Upload Front Design/Inspiration</label>

        <input
            type="file"
            name="koozie_upload_front[]"
            accept="image/jpeg,image/png,image/gif,image/webp,application/pdf"
        >
    </div>

    <div
        class="form-field position-upload-field"
        data-upload-position="back"
        hidden
    >
        <label>Upload Back Design/Inspiration</label>

        <input
            type="file"
            name="koozie_upload_back[]"
            accept="image/jpeg,image/png,image/gif,image/webp,application/pdf"
        >
    </div>
</div>

                    <div class="form-field">
                        <label>Design Notes</label>
                        <textarea name="koozie_notes[]" rows="4"></textarea>
                    </div>
					
					<button type="button" class="remove-item-btn">
    Remove A Koozie
</button>

</div>
</div>

<button
    type="button"
    id="add_koozie_item"
    class="secondary-btn"
>
    Add Another Koozie
</button>

</div>

        <div class="form-field">
            <label for="order_notes">Full Order Notes</label>
            <textarea
                id="order_notes"
                name="order_notes"
                rows="5"
            ><?= sparrow_order_form_value($values, 'order_notes') ?></textarea>
        </div>
    </div>

    <div class="sparrow-form-card">
        <h3>Agreement and Acknowledgement <span>*</span></h3>

        <label class="agreement-line">
            <input
                type="checkbox"
                name="agreement_checked"
                value="1"
                <?= sparrow_order_form_checked($values, 'agreement_checked') ?>
                required
            >
            <span>
                I understand that custom orders typically require 3–6 weeks after design approval. 
				I acknowledge that a proof or mockup may be provided before production begins and 
				that work will not start until approval is received. I confirm that I have permission 
				to use any artwork, images, or logos I submit. By submitting this request, I agree to 
				the Privacy Policy and <a href="<?= sparrow_escape(sparrow_url('/refund-return-policy.php')) ?>">Refund & Return Policy</a>.
            </span>
        </label>
    </div>

    <div class="form-actions">
        <button type="submit" class="primary-btn">
            <?= $is_admin ? 'Save Order' : 'Submit Order Request' ?>
        </button>
    </div>

<script>
document.addEventListener('DOMContentLoaded', function () {
	
    const productType = document.getElementById('product_type');
    const shirtSection = document.getElementById('shirt_section');
    const koozieSection = document.getElementById('koozie_section');
	
	const customerLookup =
    document.getElementById('existing_customer_lookup');

const customerList =
    document.getElementById('existing_customer_list');

const customerName =
    document.getElementById('customer_name');

const customerEmail =
    document.getElementById('customer_email');

const customerPhone =
    document.getElementById('customer_phone');

function fillExistingCustomer() {
    if (
        !customerLookup ||
        !customerList ||
        !customerName ||
        !customerEmail ||
        !customerPhone
    ) {
        return;
    }

    const lookupValue =
        customerLookup.value.trim().toLowerCase();

    if (lookupValue === '') {
        return;
    }

    const options = Array.from(
        customerList.querySelectorAll('option')
    );

    const match = options.find(function (option) {
        return option.value.trim().toLowerCase()
            === lookupValue;
    });

    if (!match) {
        return;
    }

    customerName.value =
        match.dataset.name || '';

    customerEmail.value =
        match.dataset.email || '';

    customerPhone.value =
        match.dataset.phone || '';
}

if (customerLookup) {
    customerLookup.addEventListener(
        'input',
        fillExistingCustomer
    );

    customerLookup.addEventListener(
        'change',
        fillExistingCustomer
    );
}

    function setProductSectionState(section, enabled) {
    if (!section) {
        return;
    }

    section.style.display = enabled ? 'block' : 'none';

    section.querySelectorAll('input, select, textarea').forEach(function (field) {
        field.disabled = !enabled;

        if (field.classList.contains('required-product-quantity')) {
            field.required = enabled;
        }
    });
}

function updateProductSections() {
    const selected = productType.value;

    setProductSectionState(shirtSection, selected === 'Shirt');
    setProductSectionState(koozieSection, selected === 'Koozie');
}

    if (productType) {
        productType.addEventListener('change', updateProductSections);
        updateProductSections();
    }
	
function updatePositionUploads(item) {
    const placementSelect = item.querySelector(
        '.design-placement-select'
    );

    if (!placementSelect) {
        return;
    }

    const placement = placementSelect.value.toLowerCase();
    const visiblePositions = [];

    if (placement.includes('other')) {
        visiblePositions.push('other');
    } else {
        if (placement.includes('front')) {
            visiblePositions.push('front');
        }

        if (placement.includes('back')) {
            visiblePositions.push('back');
        }

        if (placement.includes('chest')) {
            visiblePositions.push('chest');
        }

        if (placement.includes('sleeve')) {
            visiblePositions.push('sleeve');
        }
    }

    const uploadArea = item.querySelector(
        '.position-upload-area'
    );

    if (uploadArea) {
        uploadArea.hidden = visiblePositions.length === 0;
    }

    item.querySelectorAll(
        '.position-upload-field'
    ).forEach(function (field) {
        const position = field.dataset.uploadPosition;
        const isVisible = visiblePositions.includes(position);
        const fileInput = field.querySelector(
            'input[type="file"]'
        );

        field.hidden = !isVisible;

        if (fileInput) {
            fileInput.disabled = !isVisible;

            if (!isVisible) {
                fileInput.value = '';
            }
        }
    });
}

document.addEventListener('change', function (event) {
    if (
        !event.target.classList.contains(
            'design-placement-select'
        )
    ) {
        return;
    }

    const item = event.target.closest('.repeater-item');

    if (item) {
        updatePositionUploads(item);
    }
});

document.querySelectorAll(
    '#shirt_items .repeater-item, '
    + '#koozie_items .repeater-item'
).forEach(function (item) {
    updatePositionUploads(item);
});

function updateCustomerSuppliedState(item) {
    const checkbox = item.querySelector(
        '.customer-supplied-checkbox'
    );

    const hiddenValue = item.querySelector(
        '.customer-supplied-value'
    );

    const colorSelect = item.querySelector(
        'select[name="shirt_color[]"]'
    );

    if (!checkbox || !hiddenValue || !colorSelect) {
        return;
    }

    hiddenValue.value = checkbox.checked ? '1' : '0';

    if (checkbox.checked) {
        colorSelect.disabled = true;
    } else {
        colorSelect.disabled = false;
    }
}

document.addEventListener('change', function (event) {
    if (
        !event.target.classList.contains(
            'customer-supplied-checkbox'
        )
    ) {
        return;
    }

    const item = event.target.closest('.shirt-item');

    if (item) {
        updateCustomerSuppliedState(item);
    }
});

    function setupRepeater(containerId, addButtonId) {
        const container = document.getElementById(containerId);
        const addButton = document.getElementById(addButtonId);

        if (!container || !addButton) {
            return;
        }

        addButton.addEventListener('click', function () {
            const firstItem = container.querySelector('.repeater-item');

            if (!firstItem) {
                return;
            }

            const clone = firstItem.cloneNode(true);

            clone.querySelectorAll('input, textarea, select').forEach(function (field) {
                if (field.type === 'file') {
    field.value = '';
} else if (field.type === 'checkbox') {
    field.checked = false;
} else if (
    field.classList.contains('customer-supplied-value')
) {
    field.value = '0';
} else if (field.tagName === 'SELECT') {
    field.selectedIndex = 0;
} else {
    field.value = '';
}
            });

            container.appendChild(clone);
			updateCustomerSuppliedState(clone);
updatePositionUploads(clone);
updateProductSections();
        });

        container.addEventListener('click', function (event) {
            if (!event.target.classList.contains('remove-item-btn')) {
                return;
            }

            const items = container.querySelectorAll('.repeater-item');

            if (items.length <= 1) {
                return;
            }

            event.target.closest('.repeater-item').remove();
        });
    }

    setupRepeater('shirt_items', 'add_shirt_item');
    setupRepeater('koozie_items', 'add_koozie_item');
});
</script>
