{% load i18n static %}
<div class="related-widget-wrapper flex flex-row max-sm:flex-wrap justify-start gap-1"
     {% if not model_has_limit_choices_to %}data-model-ref="{{ model }}"{% endif %}>
    <div class="rounded-md flex w-full max-xl:max-w-lg max-lg:max-w-md max-sm:max-w-xs ">
        {{ rendered_widget }}
    </div>
    <!-- Dropdown for links -->
    {% if can_change_related or can_add_related or can_delete_related or can_view_related %}
        <div class="dropdown dropdown-bottom inline-flex align-middle h-max ">
            {% block links %}
                {% spaceless %}
                    <!-- Render the dropdown button only if there are related actions available -->
                    <div tabindex="0" role="button" class="btn btn-sm dropdown-btn">
                        {% trans "Options" %}
                    </div>
                    <ul tabindex="0" class="dropdown-content menu bg-base-100 rounded-box mt-1 z-40 w-max p-2 shadow">
                        {% if can_change_related %}
                            <li>
                                <a class="related-widget-wrapper-link change-related" id="change_id_{{ name }}"
                                   data-href-template="{{ change_related_template_url }}?{{ url_params }}"
                                   data-popup="yes"
                                   data-field-name="{{ name }}"
                                   title="{% blocktranslate %}Change selected {{ model }}{% endblocktranslate %}">
                                    <i class="fa fa-pen-alt text-warning"></i> {% trans "Change" %}
                                </a>
                            </li>
                        {% endif %}
                        {% if can_add_related %}
                            <li>
                                <a class="related-widget-wrapper-link add-related" id="add_id_{{ name }}"
                                   data-popup="yes"
                                   data-field-name="{{ name }}"
                                   href="{{ add_related_url }}?{{ url_params }}"
                                   title="{% blocktranslate %}Add another {{ model }}{% endblocktranslate %}">
                                    <i class="fa fa-plus text-success"></i> {% trans "Add" %}
                                </a>
                            </li>
                        {% endif %}
                        {% if can_delete_related %}
                            <li>
                                <a class="related-widget-wrapper-link delete-related" id="delete_id_{{ name }}"
                                   data-href-template="{{ delete_related_template_url }}?{{ url_params }}"
                                   data-popup="yes"
                                   data-field-name="{{ name }}"
                                   title="{% blocktranslate %}Delete selected {{ model }}{% endblocktranslate %}">
                                    <i class="fa fa-trash text-danger"></i> {% trans "Delete" %}
                                </a>
                            </li>
                        {% endif %}
                        {% if can_view_related %}
                            <li>
                                <a class="related-widget-wrapper-link view-related" id="view_id_{{ name }}"
                                   data-href-template="{{ change_related_template_url }}?{{ view_related_url_params }}"
                                   title="{% blocktranslate %}View selected {{ model }}{% endblocktranslate %}">
                                    <i class="fa fa-eye text-primary"></i> {% trans "View" %}
                                </a>
                            </li>
                        {% endif %}
                    </ul>
                {% endspaceless %}
            {% endblock %}
        </div>
    {% endif %}


</div>
