{%-liquid
  unless product
    assign product = section.settings.product
  endunless
-%}
{%- unless block.settings.title == blank or product.has_only_default_variant -%}
  <!--item-title>
  <button aria-current="{%- if block.settings.open %}true{% else %}false{% endif %}" class="hdt-s-text hdt-relative hdt-font-semibold">{{ block.settings.title | escape }}</button>
  -->
  <div class="hdt-tab-item" tab-item {%- if block.settings.open %} tab-selected{% endif %} data-type={{ block.type }} {{ block.shopify_attributes }}>
      <table>
        <tbody>
          {%- for product_option in product.options_with_values -%}
          <tr class="hdt-attr_pa_{{ product_option.name | handle }}">
            <th class="hdt-attr__label">{{ product_option.name }}</th>
            <td class="hdt-attr__value">
              <p>{% for value in product_option.values %}{{ value }}{% unless forloop.last == true %}, {% endunless %}{% endfor %}</p>
            </td>
          </tr>
          {%- endfor -%}
        </tbody>
      </table>
  </div>
{%- endunless -%}
{% schema %}
  {
    "name": "t:sections.main-product-tabs.blocks.tab_add.name",
    "tag": null,
    "settings": [
      {
        "type": "checkbox",
        "id": "open",
        "label": "Open",
        "default": false
      },
      {
        "type": "text",
        "id": "title",
        "label": "t:sections.main-product-tabs.blocks.title.label",
        "default": "Additional Information"
      }
    ],
    "presets": [
      { 
        "name": "t:sections.main-product-tabs.blocks.tab_add.name" ,
      }
    ]
  }
{% endschema %}