.grid
  .grid__cell.grid__cell--50-at-medium
    = render 'workarea/storefront/products/media_carousel', product: product

  .grid__cell.grid__cell--50-at-medium
    .product-details__name
      %h1.product-details__heading= product.name

    .product-prices.product-prices--details
      = render 'workarea/storefront/products/pricing', product: product

    = form_tag cart_items_path, method: 'post', class: 'product-details__add-to-cart-form', data: { dialog_form: { dialogOptions: { closeAll: true, initModules: true } }, analytics: add_to_cart_analytics_data(product).to_json } do
      = hidden_field_tag :product_id, product.id, id: dom_id(product, 'product_id')
      = hidden_field_tag :via, params[:via], id: dom_id(product, 'via')

      .grid.grid--middle
        .grid__cell.grid__cell--60
          .grid
            .grid__cell
              - if product.sku_options.one?
                = hidden_field_tag :sku, product.sku_options.first.second

              - else
                .property
                  = label_tag :sku, nil, class: 'property__name', for: "sku_#{dom_id(product)}" do
                    %span.property__text= t('workarea.storefront.products.select_options')
                  .value
                    = select_tag :sku, options_for_select(product.sku_options, params[:sku]), required: true, id: "sku_#{dom_id(product)}", data: { product_details_sku_select: product.slug }

              = append_partials('storefront.add_to_cart_form', product: product)

            - if product.purchasable?
              .grid__cell
                .product-details__quantity
                  .property
                    = label_tag :quantity, nil, class: 'property__name', for: "quantity#{dom_id(product)}" do
                      %span.property__text= t('workarea.storefront.products.quantity')
                    .quantity-control
                      = button_tag '-', { type: 'button', data: { quantity_control: { 'direction': 'dec', 'autosubmit': false }.to_json }, class: 'quantity-control__button quantity-control__decrement'}
                      .value= number_field_tag :quantity, params[:quantity] || 1, class: 'quantity-control__input text-box text-box--x-small', required: true, min: 1, id: "quantity#{dom_id(product)}"
                      = button_tag '+', { type: 'button', data: { quantity_control: { 'direction': 'inc', 'autosubmit': false }.to_json }, class: 'quantity-control__button quantity-control__increment'}

        .grid__cell
          - if product.purchasable?
            %p.product-details__add-to-cart-action= button_tag t('workarea.storefront.products.add_to_cart'), value: 'add_to_cart', class: 'button'

          - else
            = hidden_field_tag :quantity, params[:quantity] || 1, id: "quantity#{dom_id(product)}"
            %p.product-details__unavailable= t('workarea.storefront.products.unavailable')

      - if params[:sku].present?
        %p.product-details__inventory-status= product.inventory_status


    - if product.description.present?
      .product-details__description
        %p= truncated_product_description(product, t('workarea.storefront.products.read_more'))

    = append_partials('storefront.product_details', product: product)

    %p.product-details__full-details=link_to t('workarea.storefront.products.view_full_details'), product_path(product, color: params[:color]), class: 'text-button'