<div class="wcml-dialog hidden" id="wcml_currency_switcher_options_{{ args.currency_switcher }}" title="{{ args.title }}">

    <div id="wcml_currency_switcher_options_form_{{ args.currency_switcher }}" class="wcml-currency-switcher-options-form">

        <div id="wcml_curr_sel_preview_wrap" class="wcml-currency-preview-wrapper wcml-currency-preview-diaglog">
            <strong class="wcml-currency-preview-label">{{ form.preview }}</strong>
            <input type="hidden" id="wcml_currencies_switcher_preview_nonce" value="{{ form.preview_nonce }}"/>
            <div id="wcml_curr_sel_preview" class="wcml-currency-preview {{ args.currency_switcher }}">
                {{ form.switcher_preview|raw }}
            </div>
        </div>

        <div id="wcml_curr_options_wrap" class="wcml-currency-switcher-options">
            {% if args.currency_switcher == 'new_widget' %}

                    <h4>{{ form.widgets.widget_area }}</h4>
                    <select id="wcml-cs-widget">
                        <option selected disabled>{{ form.widgets.choose_label }}</option>
                        {% for sidebar in form.widgets.available_sidebars %}
                            <option value="{{ sidebar['id'] }}">{{ sidebar['name'] }}</option>
                        {% endfor %}
                    </select>

            {% endif %}

            <h4>{{ form.switcher_style.label }}</h4>
            <ul class="wcml_curr_style">
                <li>
                    <label>
                        <select id="currency_switcher_style">
                            <optgroup label="{{ form.switcher_style.core }}">
                                {% for switcher_template_id,switcher_template in args.switcher_templates['core'] %}
                                    <option value="{{ switcher_template_id }}" {% if( args.switcher_style == switcher_template_id) %}selected="selected"{% endif %}>{{ switcher_template['name'] }}</option>
                                {% endfor %}
                            </optgroup>
                            <optgroup label="{{ form.switcher_style.custom }}">
                                {% for switcher_template_id,switcher_template in args.switcher_templates['custom'] %}
                                    <option value="{{ switcher_template_id }}" {% if( args.switcher_style == switcher_template_id) %}selected="selected"{% endif %}>{{ switcher_template['name'] }}</option>
                                {% endfor %}
                            </optgroup>
                        </select>
                    </label>
                </li>
            </ul>

            <h4>{{ form.template.label }}</h4>
            <input type="text" name="wcml_curr_template" size="50" value="{{ args.template }}"/>
            <p class="explanation-text">
                <span class="display-block">{{ form.template.template_tip }}</span>
                <span class="display-block">{{ form.template.parameters }}: {{  form.template.parameters_list }}</span>
                <span class="display-block js-toggle-cs-style" {% if(args.style != 'list') %}style="display: none;"{% endif %}>{{ form.switcher_style.allowed_tags }}</span>
                <a href="#" class="js-wcml-learn-more-button">
                    <span class="js-wcml-learn-more-text">{{ form.template.learn_more }}</span>
                    <span class="js-wcml-hide-more-text" style="display:none;">{{ form.template.hide_more }}</span>
                    <span class="otgs-ico-caret-down js-arrow-toggle"></span>
                </a>
            </p>
            <input type="hidden" id="currency_switcher_default" value="{{ args.template_default }}"/>
            <div class="js-wcml-learn-more-content learn-more-content-wrap hidden">
                <p>{{ form.template.parameters_description}}</p>
                <ul>
                    <li>{{ form.template.parameter_name|raw }}</li>
                    <li>{{ form.template.parameter_symbol|raw }}</li>
                    <li>{{ form.template.parameter_code|raw }}</li>
                </ul>
                <p>{{ form.template.HTML_tags_available|raw }}</p>
            </div>

            {% if args.currency_switcher != 'product' %}
                <h4>{{ form.widgets.widget_title }}</h4>
                <input type="text" name="wcml_cs_widget_title" size="50" value="{{ args.widget_title }}"/>
            {% endif %}

            <div class="js-wcml-cs-panel-colors wcml-cs-panel-colors">
                <h4>{{ form.colors.label }}</h4>

                <label for="wcml-cs-{{ id }}-colorpicker-preset">{{ form.colors.theme }}</label>
                <select name="wcml-cs-{{ id }}-colorpicker-preset" class="js-wcml-cs-colorpicker-preset">
                    <option selected disabled>-- {{ form.colors.select_option_choose }} --</option>
                    {% for scheme_id, scheme in color_schemes %}
                        <option value="{{ scheme_id }}">{{ scheme.label }}</option>
                    {% endfor %}
                </select>

                <div>
                    <table>
                        <tr>
                            <td>
                            </td>
                            <th>{{ form.colors.normal }}</th>
                            <th>{{ form.colors.hover }}</th>
                        </tr>
                        {% for option_id, option in options %}
                            <tr>
                                <td>{{ option }}</td>
                                {% if args.options[ option_id ~ '_normal' ] is not null %}
                                    <td class="js-wcml-cs-colorpicker-wrapper">
                                        <input class="js-wcml-cs-colorpicker js-wcml-cs-color-{{ option_id }}_normal" type="text" size="7"
                                               id="wcml-cs-{{ option_id }}-normal" name="{{ option_id }}_normal"
                                               value="{{ args.options[ option_id ~ '_normal' ] }}" style="">
                                    </td>
                                {% endif %}
                                {% if args.options[ option_id ~ '_hover' ] is not null %}
                                    <td class="js-wcml-cs-colorpicker-wrapper">
                                        <input class="js-wcml-cs-colorpicker js-wcml-cs-color-{{ option_id }}_hover" type="text" size="7"
                                               id="wcml-cs-{{ option_id }}-hover" name="{{ option_id }}_hover"
                                               value="{{ args.options[ option_id ~ '_hover' ] }}" style="">
                                    </td>
                                {% endif %}
                            </tr>
                        {% endfor %}
                    </table>

                </div>
            </div>
        </div>

    </div>
        <footer class="wpml-dialog-footer">
            <input type="button" class="cancel wcml-dialog-close-button wpml-dialog-close-button alignleft" value="{{ form.cancel }}"/>&nbsp;
            <input type="submit" class="wcml-dialog-close-button wpml-dialog-close-button button-primary currency_switcher_save alignright"
                   value="{{ form.save }}" data-switcher="{{ args.current_switcher }}" data-stay="1" />
            <input type="hidden" id="wcml_currencies_switcher_save_settings_nonce" value="{{ form.save_settings_nonce }}"/>
            <input type="hidden" id="wcml_currencies_switcher_id" value="{{ args.currency_switcher }}"/>
        </footer>

    </div>

