{if !empty($error)}
<h1 class="js-bread-crumbs"><a href="#/shipping/" title="[`Shipping`]"><i class="fas fa-arrow-circle-left gray"></i></a>&nbsp;[`Error`]</h1>
<span class="state-error">{$error|escape}</span>
{else}
<form>
    <!-- GENERAL SHIPPING OPTION PARAMS -->
    <h1 class="js-bread-crumbs h3-mobile">
        <a href="#/shipping/" title="[`Shipping`]"><i class="fas fa-arrow-circle-left gray"></i></a>&nbsp;{$plugin.name|escape}

        <span class="hint">id:{$plugin.plugin|escape}</span>
    </h1>

    <div class="fields">
        <div class="fields-group">
            <div class="field">
                <div class="name">
                    <label for="s-shipping-plugin-status">[`Enabled`]</label>
                </div>

                <div class="value">
                    <input name="shipping[id]" type="hidden" value="{$plugin_id|escape}">
                    <input name="shipping[plugin]" type="hidden" value="{$plugin.plugin|escape}">
                    <label>
                        <span class="wa-checkbox">
                            <input name="shipping[status]" type="checkbox"{if !empty($plugin.status)} checked="checked"{/if} id="s-shipping-plugin-status" value="1">
                            <span>
                                <span class="icon">
                                    <i class="fas fa-check"></i>
                                </span>
                            </span>
                        </span>
                    </label>
                </div>
            </div>

            <div class="field">
                <div class="name">
                    <label for="s-shipping-plugin-name">[`Shipping option name`]</label>
                </div>

                <div class="value">
                    <input type="text" name="shipping[name]" class="small bold full-width-mobile long" id="s-shipping-plugin-name" value="{$plugin.name|escape}">
                </div>
            </div>

            <div class="field">
                <div class="name">
                    <label for="s-shipping-plugin-description">[`Description`]</label>
                </div>

                <div class="value">
                    <textarea name="shipping[description]" class="small full-width-mobile" id="s-shipping-plugin-description">{$plugin.description|escape}</textarea>

                    <div class="hint custom-mt-4">[`HTML. Shipping option description is shown to customer during the checkout.`]</div>
                </div>
            </div>

            <div class="field">
                <div class="name">
                    <label for="s-shipping-plugin-logo">[`Logo URL`]</label>
                </div>

                <div class="value">
                    <div class="flexbox">
                        <div>
                            <input type="text" name="shipping[logo]" class="small long" value="{$plugin.logo|default:''|escape}" id="s-shipping-plugin-logo">
                        </div>

                        <div>
                            <img src="{$plugin.logo|default:''|escape}" class="s-payment-shipping-logo">
                        </div>
                    </div>
                </div>
            </div>

            {if !empty($taxes)}
            <div class="field">
                <div class="name">
                    <label for="s-shipping-plugin-taxable">[`Taxable`]</label>
                </div>

                <div class="value">
                    <div class="wa-select small">
                        <select name="shipping[options][tax_id]" id="s-shipping-plugin-taxable">
                            <option value=""{if empty($plugin.options.tax_id)} selected{/if}>[`No`]</option>
                            {foreach $taxes as $tax}
                            <option value="{$tax.id|escape}"{if !empty($plugin.options.tax_id) && ($tax.id==$plugin.options.tax_id)} selected{/if}>{$tax.name|escape}</option>
                            {/foreach}
                        </select>
                    </div>

                    <div class="hint custom-mt-4">[`Select a tax rule to be applied to shipping rates calculated by this plugin.`]</div>
                </div>
            </div>
            {/if}

            <div class="field">
                <div class="name">
                    <label for="s-shipping-plugin-">[`Additional order picking time`]</label>
                </div>

                <div class="value">
                    <input type="number" name="shipping[options][assembly_time]" class="shortest" value="{if isset($plugin['options']['assembly_time'])}{max(0, intval($plugin['options']['assembly_time']))}{/if}" id="">

                    <div class="hint custom-mt-4">[`Specify a period of time expressed in hours. It will be added to order ready time calculated by storefront business hours.`]</div>
                </div>
            </div>

        </div>

        <!-- CUSTOM SHIPPING MODULE PARAMS -->
        {if !empty($settings_html)}
        <div class="fields-group">
            {$settings_html}
        </div>
        {/if}

        {if !empty($guide_html)}
        <div class="fields-group">
            {$guide_html}
        </div>
        {/if}

        <div class="fields-group">
            <h4>[`Checkout`]</h4>
            <div class="field">
                <div class="name">[`Offer shipping to customer types`]</div>
                <div class="value">
                    <label>
                        <span class="wa-radio">
                            <input type="radio" name="shipping[options][customer_type]" value="" {if empty($plugin.options.customer_type)} checked{/if}>
                            <span></span>
                        </span>
                        [`All`]
                    </label>

                    <div class="custom-mt-4">
                        <label>
                            <span class="wa-radio">
                                <input type="radio" name="shipping[options][customer_type]" value="person" {if (!empty($plugin.options.customer_type) && ($plugin.options.customer_type eq 'person'))} checked{/if}>
                                <span></span>
                            </span>
                            [`Individuals`]
                        </label>
                    </div>

                    <div class="custom-mt-4">
                        <label>
                            <span class="wa-radio">
                                <input type="radio" name="shipping[options][customer_type]" value="company" {if (!empty($plugin.options.customer_type) && ($plugin.options.customer_type eq 'company'))} checked{/if}>
                                <span></span>
                            </span>
                            [`Organizations`]
                        </label>
                    </div>

                    <div class="hint custom-mt-4">{sprintf('[`In  “%s” mode shipping is offered only to selected customer types.<br>In “%s” mode this setting is ignored and shipping is always offered to all customer types.`]', '[`In-cart checkout`]', '[`Multi-step checkout`]')}</div>
                </div>
            </div>
            <div class="field">
                <div class="name">[`Minimal shipping rate`]</div>
                <div class="value">
                    <input type="text" name="shipping[options][min_shipping_cost]" value="{ifset($plugin, 'options', 'min_shipping_cost', '')}" placeholder="0" class="number shorter"> {$def_cur}
                    <div class="hint custom-mt-4">[`Secure your store from underestimated shipping expenses by setting the minimal fallback rate.`]</div>
                </div>
            </div>
        </div>

    </div>

    <div class="bottombar sticky s-settings-fixed-bottombar">
        <div class="flexbox space-12">
            <div class="wide value">
                <button type="submit" class="button green">
                    [`Save`]
                </button>
                <span id="settings-shipping-form-status" class="js-form-status" style="display:none">
                    <!-- message placeholder -->
                </span>
                <a href="#/shipping/" class="button light-gray">[`Cancel`]</a>
            </div>

            {if isset($plugin.status) && !empty($plugin.id)}
            <div>
                <a href="#/shipping/plugin/delete/{$plugin.id}/" class="button outlined small red js-action js-confirm" data-confirm-text="[`This will permanently delete this shipping option. Are you sure?`]" data-cancel="[`Cancel`]" title="[`Delete this shipping option`]" data-title="[`Delete`]">
                    <i class="fas fa-trash-alt"></i>
                    [`Delete this shipping option`]
                </a>
            </div>
            {/if}
        </div>
    </div>
</form>
{/if}