{% 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 %}

<div class="row">
    {# product main infos left #}
    <div class="col-12 col-md-6 col-lg-4 c4s-details-main-col-left">

        {# product picture with zoom #}
        {% block details_productmain_zoom %}
            {% include "page/details/inc/picture.html.twig" %}
        {% endblock %}

        {# more product pictures #}
        {% block details_productmain_morepics %}
            {% include "page/details/inc/morepics.html.twig" %}
        {% endblock %}
    </div>

    {# product main infos center #}
    <div class="col-12 col-md-6 col-lg-5 c4s-details-main-col-middle">

        {# product title #}
        {% block details_productmain_title %}
            <h1 class="c4s-details-article-title">
                {{ oDetailsProduct.oxarticles__oxtitle.value }} {# oDetailsProduct.oxarticles__oxvarselect.value #}
            </h1>
        {% endblock %}

        {# product number #}
        {% block details_productmain_artnumber %}
            <div class="small text-muted mb-3 c4s-details-article-artnum">{{ translate({ ident: "ARTNUM", suffix: "COLON" }) }} {{ oDetailsProduct.oxarticles__oxartnum.value }}</div>
        {% endblock %}

        {# product ratings #}
        {% block details_productmain_ratings %}
            {% if oView.ratingIsActive() %}
                <div class="mb-3 c4s-details-article-rating"> {# todo #}
                    {% include "widget/reviews/rating.html.twig" with {itemid: "anid=" ~ oDetailsProduct.oxarticles__oxnid.value, sRateUrl: oDetailsProduct.getLink()|raw} %}
                </div>
            {% endif %}
        {% endblock %}

        {# product short description #}
        {% block details_productmain_shortdesc %}
            {% hasrights { ident: "SHOWSHORTDESCRIPTION" } %}
                {% if oDetailsProduct.oxarticles__oxshortdesc.rawValue %}
                    <div class="mb-3 c4s-details-article-short-desc">{{ oDetailsProduct.oxarticles__oxshortdesc.rawValue }}</div>
                {% endif %}
            {% endhasrights %}
        {% endblock %}

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

                <div id="c4s-details-article-variants" class="c4s-details-article-variants">
                    {% set blHasActiveSelections = false %}
                    {% for iKey, oVariantList in aVariantSelections.selections %}
                        {% if oVariantList.getActiveSelection() %}
                            {% set blHasActiveSelections = true %}
                        {% endif %}
                        {% include "widget/product/selectbox.html.twig" with {oSelectionList: oVariantList, iKey: iKey, blInDetails: true} %}
                    {% endfor %}
                    {% if blHasActiveSelections %}
                        <div class="c4s-details-article-variants-reset">
                            <a class="btn btn-link btn-sm">{{ translate({ ident: "C4S_RESET_VARIANT_SELECTION_BTN" }) }}</a>
                        </div>
                    {% endif %}
                </div>
            {% endif %}
        {% endblock %}

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

        {# product stock information #}
        {% block details_productmain_stockstatus %}
            {% include "page/details/inc/stockstatus.html.twig" %}
        {% endblock %}

        {# product stock delivery time #}
        {% block details_productmain_deliverytime %}
            {% include "page/details/inc/deliverytime.html.twig" %}
        {% endblock %}

        {# includes nothing usable and is used anywhere, only for "compatibility" with outdated modules - deprecated #}
        {% block details_productmain_social %}{% endblock %}
    </div>

    {# product main infos right #}
    <div class="col-12 col-lg-3 c4s-details-main-col-right">

        {# product buybox #}
        {% block details_productmain_buybox %}
            {% if not oDetailsProduct.isParentNotBuyable() %}
                {% include "page/details/inc/buybox.html.twig" %}
            {% endif %}
        {% endblock %}

        {# product manufacturer infos #}
        {% block details_productmain_manufacturer %}
            {% include "page/details/inc/manufacturer.html.twig" %}
        {% endblock %}

        {# product links and options #}
        {% block details_productmain_productlinks %}
            {% include "page/details/inc/productlinks.html.twig" %}
        {% endblock %}

    </div>
</div>