Twig\Error\RuntimeError {#16825
  -lineno: 14
  -rawMessage: "An exception has been thrown during the rendering of a template ("Warning: Undefined array key "pole"")."
  -source: Twig\Source {#17594
    -code: """
      {# @var \App\Service\Environment environment\n
      {# @var \App\Model\DataObject\Product product\n
      {# @var \Pimcore\Bundle\EcommerceFrameworkBundle\IndexService\ProductList\ProductListInterface variantProductList\n
      {# @var \Pimcore\Model\DataObject\FilterDefinition variantFilterDefinition #}\n
      {# @var array variantFilterParams #}\n
      {# @var \Pimcore\Bundle\EcommerceFrameworkBundle\FilterService\FilterService filterService #}\n
      \n
      {% do jsConfig().add('affix', true) %}\n
      {% do jsConfig().add('anchorTabs', true) %}\n
      {% do jsConfig().add('scrollTo', true) %}\n
      {% do jsConfig().add('formAutoSubmit', true) %}\n
      \n
      {% set mobileTag =  pimcore_device().isPhone() ? 'div' : 'template' %}\n
       {% set combinedArticleWithAccessories = get_accessories_from_combined_articles(product, combinedArticles, combinedArticlesValue) %}\n
      \n
      {# Mounting options hover/click dropdown with links #}\n
      {% set mountingOptions = product.mountingOptions %}\n
      {% if mountingOptions and mountingOptions|length > 0 %}\n
          {% set firstOption = mountingOptions|first %}\n
          {% set chapterName = product.chapterName|default('') %}\n
          {% set svgFile = '' %}\n
          {# Map chapterName to SVG filename #}\n
          {% if 'wall surface' in chapterName|lower %}\n
              {% set svgFile = 'wall Surface.svg' %}\n
          {% elseif 'wall recessed' in chapterName|lower %}\n
              {% set svgFile = 'Wall recessed.svg' %}\n
          {% elseif 'track' in chapterName|lower %}\n
              {% set svgFile = 'Tracks.svg' %}\n
          {% elseif 'table' in chapterName|lower or 'floor' in chapterName|lower %}\n
              {% set svgFile = 'table - floor.svg' %}\n
          {% elseif 'ceiling suspended' in chapterName|lower %}\n
              {% set svgFile = 'Ceiling suspended.svg' %}\n
          {% elseif 'ceiling surface' in chapterName|lower %}\n
              {% set svgFile = 'Ceiling Surface.svg' %}\n
          {% elseif 'ceiling recessed' in chapterName|lower %}\n
              {% set svgFile = 'Ceiling recessed.svg' %}\n
          {% else %}\n
              {% set svgFile = 'wall Surface.svg' %}\n
          {% endif %}\n
      \n
          \n
          <script>\n
              document.addEventListener('DOMContentLoaded', function() {\n
                  var trigger = document.querySelector('.mounting-options-trigger');\n
                  if (!trigger) return;\n
                  trigger.addEventListener('click', function(e) {\n
                      e.stopPropagation();\n
                      trigger.classList.toggle('open');\n
                  });\n
                  // Track if dragging occurred to prevent dropdown from closing\n
                  var hasDraggedInDropdown = false;\n
                  \n
                  document.addEventListener('click', function(e) {\n
                      if (!trigger.contains(e.target) && !hasDraggedInDropdown) {\n
                          trigger.classList.remove('open');\n
                      }\n
                      // Reset the drag flag after click\n
                      hasDraggedInDropdown = false;\n
                  });\n
                   // Add slideshow functionality (only for mobile)\n
                  var dropdownContent = document.querySelector('.mounting-options-dropdown-content');\n
                  var leftButton = document.querySelector('.scroll-indicator-left');\n
                  var rightButton = document.querySelector('.scroll-indicator-right');\n
                  \n
                  function isMobile() {\n
                      return window.innerWidth <= 767;\n
                  }\n
                  \n
                  if (dropdownContent && isMobile()) {\n
                      var currentIndex = 0;\n
                      var itemWidth = 0;\n
                      var visibleItems = 2; // Show 2 items at a time on mobile\n
                      \n
                      // Calculate item width (including gap)\n
                      function calculateItemWidth() {\n
                          var firstItem = dropdownContent.querySelector('.mounting-option');\n
                          if (firstItem && firstItem.offsetWidth > 0) {\n
                              itemWidth = firstItem.offsetWidth + 10; // 10px gap\n
                          } else {\n
                              // Fallback width for mobile\n
                              itemWidth = 50 + 10; // 50px item + 10px gap\n
                          }\n
                      }\n
                      \n
                      // Function to scroll to specific item\n
                      function scrollToItem(index) {\n
                          var maxIndex = Math.max(0, dropdownContent.children.length - visibleItems);\n
                          currentIndex = Math.max(0, Math.min(index, maxIndex));\n
                          var scrollPosition = currentIndex * itemWidth;\n
                          dropdownContent.scrollLeft = scrollPosition;\n
                          updateButtons();\n
                      }\n
                      \n
                      // Function to update button visibility\n
                      function updateButtons() {\n
                          if (!leftButton || !rightButton) return;\n
                          \n
                          var maxIndex = Math.max(0, dropdownContent.children.length - visibleItems);\n
                          \n
                          if (currentIndex <= 0) {\n
                              leftButton.style.opacity = '0';\n
                          } else {\n
                              leftButton.style.opacity = '1';\n
                          }\n
                          \n
                          if (currentIndex >= maxIndex) {\n
                              rightButton.style.opacity = '0';\n
                          } else {\n
                              rightButton.style.opacity = '1';\n
                          }\n
                      }\n
                      \n
                      // Left button click\n
                      if (leftButton) {\n
                          leftButton.addEventListener('click', function(e) {\n
                              e.preventDefault();\n
                              e.stopPropagation();\n
                              scrollToItem(currentIndex - 1);\n
                          });\n
                      }\n
                      \n
                      // Right button click\n
                      if (rightButton) {\n
                          rightButton.addEventListener('click', function(e) {\n
                              e.preventDefault();\n
                              e.stopPropagation();\n
                              scrollToItem(currentIndex + 1);\n
                          });\n
                      }\n
                      \n
                      // Add drag scrolling functionality\n
                      var isDown = false;\n
                      var hasDragged = false;\n
                      var startX;\n
                      var scrollLeft;\n
                      \n
                      dropdownContent.addEventListener('mousedown', function(e) {\n
                          isDown = true;\n
                          hasDragged = false;\n
                          dropdownContent.style.cursor = 'grabbing';\n
                          startX = e.pageX - dropdownContent.offsetLeft;\n
                          scrollLeft = dropdownContent.scrollLeft;\n
                      });\n
                      \n
                      dropdownContent.addEventListener('mouseleave', function() {\n
                          isDown = false;\n
                          dropdownContent.style.cursor = 'grab';\n
                      });\n
                      \n
                      dropdownContent.addEventListener('mouseup', function() {\n
                          isDown = false;\n
                          dropdownContent.style.cursor = 'grab';\n
                      });\n
                      \n
                      dropdownContent.addEventListener('mousemove', function(e) {\n
                          if (!isDown) return;\n
                          hasDragged = true;\n
                          hasDraggedInDropdown = true; // Prevent dropdown from closing\n
                          e.preventDefault();\n
                          var x = e.pageX - dropdownContent.offsetLeft;\n
                          var walk = (x - startX) * 2;\n
                          dropdownContent.scrollLeft = scrollLeft - walk;\n
                          \n
                          // Update current index based on scroll position\n
                          currentIndex = Math.round(dropdownContent.scrollLeft / itemWidth);\n
                          updateButtons();\n
                      });\n
                      \n
                      // Prevent clicks only when dragging occurred\n
                      dropdownContent.addEventListener('click', function(e) {\n
                          if (hasDragged) {\n
                              e.preventDefault();\n
                              e.stopPropagation();\n
                          }\n
                      });\n
                      \n
                      // Prevent link clicks only when dragging occurred\n
                      dropdownContent.addEventListener('click', function(e) {\n
                          var link = e.target.closest('a');\n
                          if (link && hasDragged) {\n
                              e.preventDefault();\n
                              e.stopPropagation();\n
                              return false;\n
                          }\n
                      });\n
                      \n
                      // Touch events for mobile\n
                      dropdownContent.addEventListener('touchstart', function(e) {\n
                          hasDragged = false;\n
                          startX = e.touches[0].pageX - dropdownContent.offsetLeft;\n
                          scrollLeft = dropdownContent.scrollLeft;\n
                      }, { passive: true });\n
                      \n
                      dropdownContent.addEventListener('touchmove', function(e) {\n
                          hasDragged = true;\n
                          hasDraggedInDropdown = true; // Prevent dropdown from closing\n
                          e.preventDefault();\n
                          var x = e.touches[0].pageX - dropdownContent.offsetLeft;\n
                          var walk = (x - startX) * 2;\n
                          dropdownContent.scrollLeft = scrollLeft - walk;\n
                          \n
                          // Update current index based on scroll position\n
                          currentIndex = Math.round(dropdownContent.scrollLeft / itemWidth);\n
                          updateButtons();\n
                      });\n
                      \n
                      // Handle touch events on links\n
                      var links = dropdownContent.querySelectorAll('a');\n
                      links.forEach(function(link) {\n
                          link.addEventListener('touchend', function(e) {\n
                              if (hasDragged) {\n
                                  e.preventDefault();\n
                                  e.stopPropagation();\n
                                  return false;\n
                              }\n
                              // If no dragging occurred, allow normal link behavior\n
                          });\n
                      });\n
                      \n
                      // Initialize with a small delay to ensure DOM is ready\n
                      setTimeout(function() {\n
                          calculateItemWidth();\n
                          updateButtons();\n
                      }, 100);\n
                      \n
                      // Recalculate on window resize\n
                      window.addEventListener('resize', function() {\n
                          if (isMobile()) {\n
                              calculateItemWidth();\n
                              scrollToItem(currentIndex);\n
                          }\n
                      });\n
                  }\n
                  \n
              });\n
          </script>\n
      {% endif %}\n
      \n
      <div class="row">\n
          <div class="col">\n
              <h1 class="product-detail__title">{{ product.oSName() }}</h1>\n
          </div>\n
          {% if not product.isArchiveItem %}\n
              <div class="col-auto">\n
                  {% if mountingOptions and mountingOptions|length > 0 %}\n
                      <div class="mounting-options-trigger" tabindex="0">\n
                          {# Use the mapped SVG as <img> or fallback #}\n
                          {% if svgFile %}\n
                              <img src="/static/icons/mountingOptionsSvg/{{ svgFile }}" alt="{{ chapterName }} icon" />\n
                          {% else %}\n
                              <div style="width:40px;height:40px;background:#bbb;border-radius:4px;"></div>\n
                          {% endif %}\n
                          <div class="mounting-options-dropdown">\n
                                  <small class="text-bold product-detail__mounting-options-title">{{ t("product-detail.mounting-options") }}</small>\n
                                  <div class="mounting-options-container" style="position: relative;">\n
                                      {% if mountingOptions|length > 2 %}\n
                                          <button class="scroll-indicator scroll-indicator-left" style="position: absolute; left: -10px; top: 50%; transform: translateY(-50%); z-index: 10; background: rgba(255,255,255,0.9); border: none; border-radius: 50%; width: 20px; height: 20px; display: flex; align-items: center; justify-content: center; font-size: 12px; color: #666; opacity: 0; transition: opacity 0.3s; cursor: pointer; padding-bottom: 0.2em">‹</button>\n
                                          <button class="scroll-indicator scroll-indicator-right" style="position: absolute; right: -10px; top: 50%; transform: translateY(-50%); z-index: 10; background: rgba(255,255,255,0.9); border: none; border-radius: 50%; width: 20px; height: 20px; display: flex; align-items: center; justify-content: center; font-size: 12px; color: #666; opacity: 0; transition: opacity 0.3s; cursor: pointer; padding-bottom: 0.2em">›</button>\n
                                      {% endif %}\n
                                      <div class="mounting-options-dropdown-content">\n
                                  {% for option in mountingOptions %}\n
                                      <div class="mounting-option" style="flex-shrink: 0;">\n
                                          <div class="mounting-option-img">\n
                                              {% if option.mainImage %}\n
                                                  <a href="{{ pimcore_url({ object: option }) }}">\n
                                                      {{ option.mainImage.thumbnail('product-teaser-img').html({\n
                                                          imgAttributes: {\n
                                                              class: 'js-lazy-img img-fluid',\n
                                                              alt: option.oSName ? option.oSName : ''\n
                                                          },\n
                                                          lowQualityPlaceholder: true\n
                                                      }) | raw }}\n
                                                  </a>\n
                                              {% else %}\n
                                                  <a href="{{ pimcore_url({ object: option }) }}">\n
                                                      <div style="width:40px;height:40px;background:#f3f3f3;"></div>\n
                                                  </a>\n
                                              {% endif %}\n
                                          </div>\n
                                      </div>\n
                                  {% endfor %}\n
                                  {# Dummy items for testing #}\n
                                  {# <div class="mounting-option" style="flex-shrink: 0;">\n
                                      <div class="mounting-option-img">\n
                                          <a href="#">\n
                                              <div style="width:40px;height:40px;background:#e3f2fd;border:2px solid #2196f3;border-radius:4px;display:flex;align-items:center;justify-content:center;color:#2196f3;font-size:12px;font-weight:bold;">T1</div>\n
                                          </a>\n
                                      </div>\n
                                  </div>\n
                                  <div class="mounting-option" style="flex-shrink: 0;">\n
                                      <div class="mounting-option-img">\n
                                          <a href="#">\n
                                              <div style="width:40px;height:40px;background:#f3e5f5;border:2px solid #9c27b0;border-radius:4px;display:flex;align-items:center;justify-content:center;color:#9c27b0;font-size:12px;font-weight:bold;">T2</div>\n
                                          </a>\n
                                      </div>\n
                                  </div>\n
                                  <div class="mounting-option" style="flex-shrink: 0;">\n
                                      <div class="mounting-option-img">\n
                                          <a href="#">\n
                                              <div style="width:40px;height:40px;background:#e8f5e8;border:2px solid #4caf50;border-radius:4px;display:flex;align-items:center;justify-content:center;color:#4caf50;font-size:12px;font-weight:bold;">T3</div>\n
                                          </a>\n
                                      </div>\n
                                  </div> #}\n
                                  </div>\n
                              </div>\n
                          </div>\n
                      </div>\n
                  {% endif %}\n
                  <ul class="list-unstyled product-detail__btn-list" style="display: inline-block;">\n
                      <li class="list-inline-item">{{ include("shared/wishlist/buttons.html.twig", { id: product.id }) }}</li>\n
                  </ul>\n
              </div>\n
          {% endif %}\n
      </div>\n
              {% if combinedArticleWithAccessories %}\n
                  <div class="product-detail__article-nr">\n
                      {{ product.oSProductNumber() | replace({' ': ' | '}) }}\n
                      {% for entry in combinedArticleWithAccessories %}\n
                          {% if entry.currentAccessory %}\n
                          | \n
                              {{entry.currentAccessory.oSProductNumber()}} \n
                          {% endif %}\n
                      {% endfor %}\n
                  </div>\n
              {% else %}\n
                  <div class="product-detail__article-nr">{{ product.oSProductNumber() | replace({' ': ' | '}) }}</div>\n
              {% endif %}\n
              <{{ mobileTag }} class="js-matchmedia-viewer" data-matchmedia="(max-width: 767px)">\n
                  {{ include("shop/product/includes/image_grid.html.twig") }}\n
              </{{ mobileTag }}>\n
      \n
              {% if not product.isArchiveItem %}\n
              <form action="{{ url("app_shop_product_select_variant") }}#detail-variant-selection" method="post" class="product-detail-filter mt-md-5 mt-4" id="variantForm">\n
                  {% if pimcore_device().isPhone() %}\n
                      <div id="detail-variant-selection" style="position: relative; top: -150px;"></div>\n
                  {% endif %}\n
      \n
                  <input type="hidden" name="currentProductId" value="{{ product.id }}"/>\n
                  <input type="hidden" name="lastFilterField" class="js-last-filter-field" value=""/>\n
                  <input type="hidden" name="lastFilterValue" class="js-last-filter-value" value=""/>\n
                  {% if combinedArticleWithAccessories %}\n
                      {% for entry in combinedArticleWithAccessories %}\n
                          {% if entry.currentAccessory %}\n
                              <input type="hidden" name="combinedArticlesValue[{{entry.identifier}}]" value="{{combinedArticlesValue[entry.identifier]}}">\n
                              <input type="hidden" name="combinedArticles[{{entry.identifier}}]" value="{{entry.currentAccessory.id}}">\n
                          {% endif %}\n
                      {% endfor %}\n
                  {% endif %}\n
                  <div class="vertical-gutter--2">\n
                      {% for filter in variantFilterDefinition.filters %}\n
      \n
                          {{ filterService.filterFrontend(filter, variantProductList, variantFilterParams, product, includedAccessories) | raw }}\n
                      {% endfor %}\n
                  </div>\n
              </form>\n
              <div class="vertical-gutter--2 mt-3">\n
              {% if combinedArticleWithAccessories %}\n
              <form action="#detail-variant-selection" class="js-combined-article-form" method="get">\n
                  {{ include("shop/product/includes/combined.html.twig", {entries: combinedArticleWithAccessories, currentProduct: product}) }}\n
                  </form>\n
              {% endif %}\n
      \n
              </div>\n
              {% endif %}\n
      \n
              {% set relatedProductHint = '' %}\n
      \n
              {% if product.successorProduct and product.successorProduct.active %}\n
      \n
                  {% if product.isSalesItem %}\n
                      {% set relatedProductHint =\n
                          t("product-detail.successor-hint-sale", {\n
                              '{{successorLink}}': "\n
                                  <a href=" ~ pimcore_url({ object: product.successorProduct }) ~ ">\n
                                      " ~ product.successorProduct.itemNumber ~ "\n
                                  </a>\n
                              "\n
                          })\n
                      %}\n
                  {% else %}\n
                      {% set relatedProductHint = t("product-detail.successor-hint") %}\n
                  {% endif %}\n
      \n
              {% elseif product.predecessorProduct and product.predecessorProduct.isSalesItem %}\n
      \n
                  {% set relatedProductHint =\n
                      t("product-detail.predecessor-hint-sale", {\n
                          '{{predecessorLink}}': "\n
                                  <a href=" ~ pimcore_url({ object: product.predecessorProduct }) ~ ">\n
                                      " ~ product.predecessorProduct.itemNumber ~ "\n
                                  </a>\n
                              "\n
                      })\n
                  %}\n
      \n
              {% endif %}\n
      \n
              {% if (product.hint or relatedProductHint) and not product.isArchiveItem %}\n
                  <div class="product-detail__hint m-0 wysiwyg">\n
                      <span class="product-detail__hint-symbol"><span class="icon icon-notice" aria-label="Attention"></span></span>\n
                      {% if relatedProductHint %}\n
                          <div>\n
                              {{ product.hint ? product.hint | raw : '' }}\n
                              {{ relatedProductHint | raw }}\n
                          </div>\n
                      {% else %}\n
                          {{ product.hint | raw }}\n
                      {% endif %}\n
                  </div>\n
              {% endif %}\n
      \n
      \n
              {{ include("shared/shop/sellable_archive_item.html.twig", {sellable: product}) }}\n
              {% if product_is_loxone(product) and security().isGranted("shop") and not user_is_allowed_for_loxone() %}\n
                  {{ include("shared/shop/request_loxone.html.twig", {sellable: product, selectCartModal: true, includedAccessories: includedAccessories }) }}\n
              {% else %}\n
                  {{ include("shared/shop/sellable_to_cart.html.twig", {sellable: product, selectCartModal: true, includedAccessories: includedAccessories, combinedArticleWithAccessories : combinedArticleWithAccessories }) }}\n
              {% endif %}\n
      \n
      \n
              {# Availability check #}\n
              {{ include("shared/availability-check/availability_check.html.twig", {sellable: product, selectCartModal: true, combinedArticleWithAccessories: combinedArticleWithAccessories}) }}\n
      \n
              {# <ul class="list-unstyled product-detail__achnor-links">\n
                  <li class="list-inline-item mt-3">\n
                      <a href="#tab-description" class="js-scroll-to" data-scrollto-offset="-400">\n
                          {{ t("product-detail.description") }}\n
                      </a>\n
                  </li>\n
      \n
                  {% if hasProjects and not product.isArchiveItem %}\n
                      <li class="list-inline-item mt-3">\n
                          <a href="#projects" class="js-scroll-to" data-scrollto-offset="-220">\n
                              {{ t("product-detail.projects") }}\n
                          </a>\n
                      </li>\n
                  {% endif %}\n
              </ul> #}\n
      \n
              <ul class="list-unstyled btn-list mb-3 button-list">\n
                  {% if product.aggregatedDocuments(true, null, true) | length %}\n
                      <li class="list-inline-item mt-3">\n
                          <a href="#tab-downloads" class="btn btn-icon-text btn-outline js-scroll-to" data-scrollto-offset="-200">\n
                              {{ t("product-details.downloads") }}\n
                          </a>\n
                      </li>\n
                  {% endif %}\n
      \n
                  {% if not product.isArchiveItem %}\n
                      {% if product.hasAccessories() %}\n
                          <li class="list-inline-item mt-3">\n
                              <a href="#accessories" class="btn btn-icon-text btn-outline js-scroll-to" data-scrollto-offset="-200">\n
                                  <span class="icon icon-lamp btn-icon-text__icon" aria-hidden="true"></span>{{ t("product-details.accessories") }}\n
                              </a>\n
                          </li>\n
                      {% endif %}\n
      \n
                      {% if product.configuratorLink and not product.configuratorLink.empty %}\n
                          <li class="list-inline-item mt-3">\n
                              <a href="{{ product.configuratorLink.href }}" target="{{ product.configuratorLink.target }}" class="btn btn-icon-text btn-outline">\n
                                  {{ product.configuratorLink.text }}\n
                              </a>\n
                          </li>\n
                      {% endif %}\n
                  {% endif %}\n
              </ul>\n
          </div>\n
      \n
       {% if product_is_loxone(product) and not user_is_allowed_for_loxone() %}\n
                  {{ include("shared/shop/request_modal-loxone.html.twig") }}\n
      {% endif %}\n
      <script>\n
      _paq.push(['trackPageView']);\n
      \n
      var prod = {\n
          number: '{{ product.oSProductNumber() }}',\n
          name: '{{ product.oSName() }}',\n
          type: '{{ product.getAnnotationForExclusion() }}',\n
          price: '{{ product.getOSPrice() }}',\n
          color: '{{ product.getColor() }}',\n
          colorTemp: '{{ product.getColorTemperature() }}',\n
          scope: '{{ product.getScope() }}',\n
          mounting: '{{ product.getMountingText() }}',\n
          detailColor1: '{{ product.getDetailColor1() }}',\n
          detailColor2: '{{ product.getDetailColor2() }}',\n
          detailColor3: '{{ product.getDetailColor3() }}',\n
          ipRating: '{{ product.getIPRating() }}',\n
          opticsCategory: '{{ product.getDConOpticsCategory() }}',\n
          cableLength: '{{ product.getCableLength() }}',\n
          converterText: '{{ product.getConverterText() }}'\n
      };\n
      \n
      _paq.push(['setEcommerceView',\n
          prod.number,\n
          prod.name,\n
          prod.type,\n
          prod.price,\n
          {\n
              "Spaces": prod.scope,\n
              "Product Colour": prod.color,\n
              "Detail Colour 1": prod.detailColor1,\n
              "Detail Colour 2": prod.detailColor2,\n
              "Detail Colour 3": prod.detailColor3,\n
              "Result Light Colour Temperature": prod.colorTemp,\n
              "Converter Text": prod.converterText,\n
              "Mounting Text": prod.mounting,\n
              "Cable Length": prod.cableLength,\n
              "D Con Optics Category": prod.opticsCategory,\n
              "IP Rating": prod.ipRating\n
          }\n
      ]);\n
      </script>
      """
    -name: "shop/product/includes/main_info.html.twig"
    -path: "/home/testiwbz/www.testing.weverducre.com/www/templates/shop/product/includes/main_info.html.twig"
  }
  -phpFile: "/home/testiwbz/www.testing.weverducre.com/www/vendor/twig/twig/src/Template.php"
  -phpLine: 416
}