{% set oManufacturer = oView.getManufacturer() %}
{% set aVariantSelections = oView.getVariantSelections() %}
{% set imageStyle = oViewConf.getViewThemeParam('sImageStyle') %}

{% if aVariantSelections and aVariantSelections.rawselections %}
    {% set _sSelectionHashCollection = "" %}
    {% for iKey, oSelectionList in aVariantSelections.rawselections %}
        {% set _sSelectionHash = "" %}
        {% for iPos, oListItem in oSelectionList %}
            {% set _sSelectionHash = _sSelectionHash ~ iPos ~ ":" ~ oListItem.hash ~ "|" %}
        {% endfor %}
        {% if _sSelectionHash %}
            {% if _sSelectionHashCollection %}{% set _sSelectionHashCollection = _sSelectionHashCollection ~ "," %}{% endif %}
            {% set _sSelectionHashCollection = _sSelectionHashCollection ~ "'" ~ _sSelectionHash ~ "'" %}
        {% endif %}
    {% endfor %}

    <form class="js-oxWidgetReload" action="{{ oView.getWidgetLink()|raw }}" method="get">
        {{ oViewConf.getHiddenSid()|raw }}
        {{ oViewConf.getNavFormParams()|raw }}
        <input type="hidden" name="cl" value="{{ oView.getClassKey() }}">
        <input type="hidden" name="oxwparent" value="{{ oViewConf.getTopActiveClassName() }}">
        <input type="hidden" name="listtype" value="{{ oView.getListType() }}">
        <input type="hidden" name="nocookie" value="1">
        <input type="hidden" name="cnid" value="{{ oView.getCategoryId() }}">
        <input type="hidden" name="anid" value="{% if not oDetailsProduct.oxarticles__oxparentid.value %}{{ oDetailsProduct.oxarticles__oxid.value }}{% else %}{{ oDetailsProduct.oxarticles__oxparentid.value }}{% endif %}">
        <input type="hidden" name="actcontrol" value="{{ oViewConf.getTopActiveClassName() }}">
        {% if preview %}
            <input type="hidden" name="preview" value="{{ preview }}">
        {% endif %}
    </form>
{% endif %}

{% hasrights { ident: "TOBASKET" } %}
    <form class="js-oxProductForm" action="{{ oViewConf.getSelfActionLink()|raw }}" method="post">
            {{ oViewConf.getHiddenSid()|raw }}
            {{ oViewConf.getNavFormParams()|raw }}
            <input type="hidden" name="cl" value="{{ oViewConf.getTopActiveClassName() }}">
            <input type="hidden" name="aid" value="{{ oDetailsProduct.oxarticles__oxid.value }}">
            <input type="hidden" name="anid" value="{{ oDetailsProduct.oxarticles__oxnid.value }}">
            <input type="hidden" name="parentid" value="{% if not oDetailsProduct.oxarticles__oxparentid.value %}{{ oDetailsProduct.oxarticles__oxid.value }}{% else %}{{ oDetailsProduct.oxarticles__oxparentid.value }}{% endif %}">
            <input type="hidden" name="panid" value="">
            {% if not oDetailsProduct.isNotBuyable() %}
                <input type="hidden" name="fnc" value="tobasket">
            {% endif %}
{% endhasrights %}

<div class="details-top">
    <div class="container-xxl">
        <div class="row row-cols-md-2">
            <div class="col-12 col-md-6 col-lg-8 col-xl-9">
                {# article picture with zoom #}
                {% block details_productmain_zoom %}
                    {% include "page/details/inc/gallery.html.twig" %}
                {% endblock %}
            </div>

            <div class="col-12 col-md-6 col-lg-4 col-xl-3">
                {% block details_productmain_manufacturersicon %}
                    {% if oManufacturer %}
                        <a href="{{ oManufacturer.getLink()|raw }}" title="{{ oManufacturer.oxmanufacturers__oxtitle.value }}" class="brand-name">
                            {{ oManufacturer.oxmanufacturers__oxtitle.value }}
                        </a>
                    {% endif %}
                {% endblock %}

                {% block details_productmain_title %}
                    <h1 class="h2 details-title mb-2">
                        {{ oDetailsProduct.oxarticles__oxtitle.value }} {{ oDetailsProduct.oxarticles__oxvarselect.value }}
                    </h1>
                {% endblock %}

                {# ratings #}
                {% if oView.ratingIsActive() %}
                    {% block details_productmain_ratings %}
                        {% include "widget/reviews/rating.html.twig" with {itemid: "anid=" ~ oDetailsProduct.oxarticles__oxnid.value, sRateUrl: oDetailsProduct.getLink()} %}
                    {% endblock %}
                {% endif %}

                {# short description #}
                {% block details_productmain_shortdesc %}
                    {% hasrights { ident: "SHOWSHORTDESCRIPTION" } %}
                        {% if oDetailsProduct.oxarticles__oxshortdesc.value %}
                            <p class="details-shortdesc" id="productShortdesc">{{ oDetailsProduct.oxarticles__oxshortdesc.value }}</p>
                        {% endif %}
                    {% endhasrights %}
                {% endblock %}

                {% set blCanBuy = true %}

                {% if aVariantSelections and aVariantSelections.selections %}
                    {% set blCanBuy = aVariantSelections.blPerfectFit %}
                    {% if not blHasActiveSelections %}
                        {% if not blCanBuy and not oDetailsProduct.isParentNotBuyable() %}
                            {% set blCanBuy = true %}
                        {% endif %}
                    {% endif %}
                {% endif %}

                {# variants | md variants #}
                {% block details_productmain_variantselections %}
                    {% if aVariantSelections and aVariantSelections.selections %}
                        {{ script({ include: "js/variants.min.js", priority: 11, dynamic: __oxid_include_dynamic }) }}

                        <div id="variants" class="variant-dropdown">
                            {# TODO: blHasActiveSelections is used nowhere - check if it can be removed #}
                            {% set blHasActiveSelections = false %}
                            {% for iKey, oList in aVariantSelections.selections %}
                                {% if oList.getActiveSelection() %}
                                    {% set blHasActiveSelections = true %}
                                {% endif %}
                                {% include "widget/product/selectbox.html.twig" with {oSelectionList: oList, iKey: iKey, blInDetails: true} %}
                            {% endfor %}
                        </div>
                    {% endif %}
                {% endblock %}

                {# selection lists #}
                {% block details_productmain_selectlists %}
                    {% if oViewConf.showSelectLists() %}
                        {% set oSelections = oDetailsProduct.getSelections() %}
                        {% if oSelections %}
                            <div class="variant-dropdown" id="productSelections">
                                {% for oList in oSelections %}
                                    {% include "widget/product/selectbox.html.twig" with {blSubmitOnChange: false, oSelectionList: oList, sFieldName: "sel", iKey: loop.index0, blHideDefault: true, sSelType: "seldrop"} %}
                                {% endfor %}
                            </div>
                        {% endif %}
                    {% endif %}
                {% endblock %}

                {# article main info block #}
                <div class="details-information mb-3 mb-md-5 small">

                    {# Weight #}
                    {% if oDetailsProduct.oxarticles__oxweight.value %}
                        <div class="weight" aria-label="{{ translate({ ident: "WEIGHT" }) }}">
                            <svg>
                                <use xlink:href="#weight-hanging"></use>
                            </svg>
                            {% block details_productmain_weight %}
                                {{ translate({ ident: "WEIGHT", suffix: "COLON" }) }}
                                {{ oDetailsProduct.oxarticles__oxweight.value }} {{ translate({ ident: "KG" }) }}
                            {% endblock %}
                        </div>
                    {% endif %}

                    {# Delivery time #}
                    {% block details_productmain_deliverytime %}
                        {% hasrights { ident: "TOBASKET" } %}
                            {% if oDetailsProduct.isBuyable() %}
                                {% include "page/details/inc/deliverytime.html.twig" %}
                            {% endif %}
                        {% endhasrights %}
                    {% endblock %}

                    {# Unit Price #}
                    {% hasrights { ident: "SHOWARTICLEPRICE" } %}
                        {% set oUnitPrice = oDetailsProduct.getUnitPrice() %}
                        {% block details_productmain_priceperunit %}
                            {% if oUnitPrice %}
                                <div class="ppu" aria-label="{{ translate({ ident: "WEIGHT" }) }}">
                                    <svg>
                                        <use xlink:href="#tag"></use>
                                    </svg>
                                    {{ format_price(oUnitPrice, { currency: currency }) }}/{{ oDetailsProduct.getUnitName() }}
                                </div>
                            {% endif %}
                        {% endblock %}
                    {% endhasrights %}

                    {# Stock flag #}
                    {% block details_productmain_stockstatus %}
                        <div class="stockFlag">
                            {% if oDetailsProduct.getStockStatus() == -1 %}
                                <span class="text-danger">●</span>
                                {% if oDetailsProduct.oxarticles__oxnostocktext.value %}
                                    {{ oDetailsProduct.oxarticles__oxnostocktext.value }}
                                {% elseif oViewConf.getStockOffDefaultMessage() %}
                                    {{ translate({ ident: "MESSAGE_NOT_ON_STOCK" }) }}
                                {% endif %}
                                {% if oDetailsProduct.getDeliveryDate() %}
                                    {{ translate({ ident: "AVAILABLE_ON" }) }} {{ oDetailsProduct.getDeliveryDate() }}
                                {% endif %}
                            {% elseif oDetailsProduct.getStockStatus() == 1 %}
                                <span class="text-warning">●</span> {{ translate({ ident: "LOW_STOCK" }) }}
                            {% elseif oDetailsProduct.getStockStatus() == 0 %}
                                <span class="text-success">●</span>
                                {% if oDetailsProduct.oxarticles__oxstocktext.value %}
                                    {{ oDetailsProduct.oxarticles__oxstocktext.value }}
                                {% elseif oViewConf.getStockOnDefaultMessage() %}
                                    {{ translate({ ident: "READY_FOR_SHIPPING" }) }}
                                {% endif %}
                            {% endif %}
                        </div>
                    {% endblock %}

                    {# vpe #}
                    {% block details_productmain_vpe %}
                        {% if oDetailsProduct.oxarticles__oxvpe.value > 1 %}
                            <div class="vpe" aria-label="{{ translate({ ident: "DETAILS_VPE_MESSAGE_1" }) }}">
                                <svg>
                                    <use xlink:href="#boxes-stacked"></use>
                                </svg>
                                {{ translate({ ident: "DETAILS_VPE_MESSAGE_1" }) }} {{ oDetailsProduct.oxarticles__oxvpe.value }} {{ translate({ ident: "DETAILS_VPE_MESSAGE_2" }) }}</div>
                        {% endif %}
                    {% endblock %}
                </div>

                {# pers params #}
                {% block details_productmain_persparams %}
                    {% if oView.isPersParam() %}
                        <div class="mb-3">
                            <label for="persistentParam" class="form-label">{{ translate({ ident: "LABEL" }) }}</label>
                            <input type="text" id="persistentParam" name="persparam[details]" value="{{ oDetailsProduct.aPersistParam.text }}" size="35" class="form-control">
                        </div>
                    {% endif %}
                {% endblock %}

                <div class="price-wrapper h1">
                    {% block details_productmain_watchlist %}{% endblock %}

                    {% block details_productmain_price %}
                        {% hasrights { ident: "SHOWARTICLEPRICE" } %}
                            {% block details_productmain_price_value %}
                                {% if oDetailsProduct.getPrice() %}
                                    <div id="productPrice" class="price-label">
                                        {% set sFrom = "" %}
                                        {% set oPrice = oDetailsProduct.getPrice() %}
                                        {% if oDetailsProduct.isParentNotBuyable() %}
                                            {% set oPrice = oDetailsProduct.getVarMinPrice() %}
                                            {% if oDetailsProduct.isRangePrice() %}
                                                {% set sFrom = "PRICE_FROM"|translate %}
                                            {% endif %}
                                        {% endif %}
                                        <span {% if oDetailsProduct.getTPrice() %} class="text-danger"{% endif %}>
                                            <span class="price-from">{{ sFrom }}</span>
                                            <span class="price">{{ format_price(oPrice, { currency: currency }) }}</span>
                                        </span>
                                    </div>
                                {% endif %}
                            {% endblock %}
                        {% endhasrights %}
                    {% endblock %}

                    {% block details_productmain_tprice %}
                        {% hasrights { ident: "SHOWARTICLEPRICE" } %}
                            {% if oDetailsProduct.getTPrice() %}
                                <del class="price-old">{{ format_price(oDetailsProduct.getTPrice(), { currency: currency }) }}</del>
                            {% endif %}
                        {% endhasrights %}
                    {% endblock %}

                    {% ifcontent ident "oxdeliveryinfo" set oCont %}
                        {% if oView.isVatIncluded() %}
                            <div class="vat-info-text">
                                {{ translate({ ident: "PLUS_SHIPPING" }) }}<a href="{{ oCont.getLink() }}">{{ translate({ ident: "PLUS_SHIPPING2" }) }}</a>
                            </div>
                        {% else %}
                            <div class="vat-info-text">
                                {{ translate({ ident: "PLUS" }) }}<a href="{{ oCont.getLink() }}">{{ translate({ ident: "PLUS_SHIPPING2" }) }}</a>
                            </div>
                        {% endif %}
                    {% endifcontent %}
                </div>

                {% if oDetailsProduct.loadAmountPriceInfo() %}
                    {% include "page/details/inc/priceinfo.html.twig" %}
                {% endif %}

                {% block details_productmain_tobasket %}
                    {% hasrights { ident: "TOBASKET" } %}
                        {% if not oDetailsProduct.isNotBuyable() %}
                            <div class="tobasket-function input-group input-group-lg mb-3">
                                <input type="text" class="form-control" id="amountToBasket" name="am" value="1" aria-label="{{ translate({ ident: "QUANTITY" }) }}">
                                <button id="toBasket" type="submit"{% if not blCanBuy %} disabled{% endif %} class="btn btn-highlight">
                                    {{ translate({ ident: "TO_CART" }) }}
                                </button>
                            </div>
                        {% endif %}
                    {% endhasrights %}
                {% endblock %}

                {% block details_productmain_productlinksselector %}
                    {% block details_productmain_productlinks %}
                        <div class="row g-3 product-links mb-md-5">

                            {% if oViewConf.getShowCompareList() %}
                                <div class="col-6">
                                    {% include_dynamic "page/details/inc/compare_links.html.twig" with {testid: "", type: "compare", aid: oDetailsProduct.oxarticles__oxid.value, anid: oDetailsProduct.oxarticles__oxnid.value, in_list: oDetailsProduct.isOnComparisonList(), page: oView.getActPage(), text_to_id: "COMPARE", text_from_id: "REMOVE_FROM_COMPARE_LIST"} %}
                                </div>
                            {% endif %}

                            {% if oViewConf.getShowListmania() %}
                                <div class="col-6">
                                    {% if oxcmp_user %}
                                        <a class="btn btn-sm btn-light w-100" id="recommList" href="{{ seo_url({ ident: oViewConf.getSelfLink() ~ "cl=recommadd", params: "aid=" ~ oDetailsProduct.oxarticles__oxnid.value ~ "&amp;anid=" ~ oDetailsProduct.oxarticles__oxnid.value ~ oViewConf.getNavUrlParams() ~ "&amp;stoken=" ~ oViewConf.getSessionChallengeToken() }) }}">{{ translate({ ident: "ADD_TO_LISTMANIA_LIST" }) }}</a>
                                    {% else %}
                                        <a class="btn btn-sm btn-light w-100" id="loginToRecommlist" href="{{ seo_url({ ident: oViewConf.getSelfLink() ~ "cl=account", params: "anid=" ~ oDetailsProduct.oxarticles__oxnid.value ~ "&amp;sourcecl=" ~ oViewConf.getTopActiveClassName() ~ oViewConf.getNavUrlParams() }) }}">{{ translate({ ident: "ADD_TO_LISTMANIA_LIST" }) }}</a>
                                    {% endif %}
                                </div>
                            {% endif %}

                            <div class="col-6">
                                {% block details_productmain_addtowishlist %}
                                    {% if oxcmp_user %}
                                        <a class="btn btn-sm btn-light w-100" id="linkToNoticeList" href="{{ seo_url({ ident: oViewConf.getSelfLink() ~ "cl=" ~ oViewConf.getTopActiveClassName(), params: "aid=" ~ oDetailsProduct.oxarticles__oxnid.value ~ "&amp;anid=" ~ oDetailsProduct.oxarticles__oxnid.value ~ "&amp;fnc=tonoticelist&amp;am=1" ~ oViewConf.getNavUrlParams() ~ "&amp;stoken=" ~ oViewConf.getSessionChallengeToken() }) }}">{{ translate({ ident: "ADD_TO_WISH_LIST" }) }}</a>
                                    {% else %}
                                        <a class="btn btn-sm btn-light w-100" id="loginToNotice" href="{{ seo_url({ ident: oViewConf.getSelfLink() ~ "cl=account", params: "anid=" ~ oDetailsProduct.oxarticles__oxnid.value ~ "&amp;sourcecl=" ~ oViewConf.getTopActiveClassName() ~ oViewConf.getNavUrlParams() }) }}">{{ translate({ ident: "ADD_TO_WISH_LIST" }) }}</a>
                                    {% endif %}
                                {% endblock %}
                            </div>

                            {% if oViewConf.getShowWishlist() %}
                                <div class="col-6">
                                    {% if oxcmp_user %}
                                        <a class="btn btn-sm btn-light w-100" id="linkToWishList" href="{{ seo_url({ ident: oViewConf.getSelfLink() ~ "cl=" ~ oViewConf.getTopActiveClassName(), params: "aid=" ~ oDetailsProduct.oxarticles__oxnid.value ~ "&anid=" ~ oDetailsProduct.oxarticles__oxnid.value ~ "&amp;fnc=towishlist&amp;am=1" ~ oViewConf.getNavUrlParams() ~ "&amp;stoken=" ~ oViewConf.getSessionChallengeToken() }) }}">{{ translate({ ident: "ADD_TO_GIFT_REGISTRY" }) }}</a>
                                    {% else %}
                                        <a class="btn btn-sm btn-light w-100" id="loginToWish" href="{{ seo_url({ ident: oViewConf.getSelfLink() ~ "cl=account", params: "anid=" ~ oDetailsProduct.oxarticles__oxnid.value ~ "&amp;sourcecl=" ~ oViewConf.getTopActiveClassName() ~ oViewConf.getNavUrlParams() }) }}">{{ translate({ ident: "ADD_TO_GIFT_REGISTRY" }) }}</a>
                                    {% endif %}
                                </div>
                            {% endif %}
                        </div>
                    {% endblock %}
                {% endblock %}
            </div>
            {% block details_productmain_social %}{% endblock %}
        </div>
    </div>
</div>

{% block details_productmain_content %}{% endblock %}

{% hasrights { ident: "TOBASKET" } %}
    </form>
{% endhasrights %}