<div class="fulfillment-header">
    <span>Teezily Product:</span>
    <div ng-if="item.teezily.variant" style="color: #494949; font-weight: 400">
        @{{ item.teezily.variant.reference }} / @{{ item.teezily.variant.name }}
    </div>
    <div ng-if="item.teezily.size && item.teezily.color && !item.teezily.variant">
        <strong class="text-danger">Cannot find Teezily Product</strong>
    </div>
    <img ng-if='item.teezily.loading' class="small-img-loading"  src="@asset('print-suppliers/images/loading-1.gif')">
</div>

<div class="grid-1col print-logistic-chosen" ng-class="{ 'grid-2col' :  item.teezily.sizes.length || item.teezily.colors.length, 'grid-3col' : item.teezily.sizes.length && item.teezily.colors.length }">
    <div class="merchize-chosen-item">
        <select chosen search_contains="true" ng-change="changeTeezilyProduct(item)"
            ng-model="item.teezily.product_id" class="form-control chosse-input" style="display: inline-block;">
            <option value="">-- Choose Product --</option>
            <option ng-repeat="option in teezily.products" value="@{{ option.id }}">
                @{{ option.name }}
            </option>
        </select>
    </div>
    <div class="merchize-chosen-item" ng-if="item.teezily.sizes.length">
        <select chosen search_contains="true" ng-change="changeTeezilySize(item)"
            ng-model="item.teezily.size" class="form-control chosse-input" style="display: inline-block;">
            <option value="">-- Choose Size --</option>
            <option ng-repeat="option in item.teezily.sizes" value="@{{ option }}">
                @{{ option }}
            </option>
        </select>
    </div>
    <div class="merchize-chosen-item" ng-if="item.teezily.colors.length">
        <select chosen search_contains="true" ng-change="changeTeezilyColor(item)"
            ng-model="item.teezily.color" class="form-control chosse-input" style="display: inline-block;">
            <option value="">-- Choose Color --</option>
            <option ng-repeat="option in item.teezily.colors" value="@{{ option }}">
                @{{ option }}
            </option>
        </select>
    </div>
</div>

@include('print-suppliers::suppliers/teezily/components/product-print-artwork')

{{-- @include('print-suppliers::suppliers/print-logistic/components/product-print-skus' --}}