Ensure form-actions content uses available space

Using pre-defined colunms was a hacky short term solution, this way is more flexible.

app/views/admin/products_v3/_table.html.haml

@@ -7,13 +7,13 @@
   = render(partial: "admin/shared/flashes", locals: { flashes: }) if defined? flashes
   %fieldset.form-actions{ class: ("hidden" unless defined?(error_counts)), 'data-bulk-form-target': "actions" }
     .container
-      .status.eleven.columns
+      .status
         .modified_summary{ 'data-bulk-form-target': "changedSummary", 'data-translation-key': 'admin.products_v3.table.changed_summary'}
         - if defined?(error_counts)
           .error_summary
             -# X products were saved correctly, but Y products could not be saved correctly. Please review errors and try again
             = t('.error_summary.saved', count: error_counts[:saved]) + t('.error_summary.invalid', count: error_counts[:invalid])
-      .form-buttons.five.columns
+      .form-buttons
         = form.submit t('.reset'), type: :reset, class: "medium", 'data-reflex': 'click->products#fetch'
         = form.submit t('.save'), class: "medium"
   %table.products

app/webpacker/css/admin/products_v3.scss

@@ -27,6 +27,16 @@
       left: 0;
       right: 0;
       z-index: 1; // Ensure tom-select and .disabled-section are covered
+
+      .container {
+        .status {
+          flex-grow: 1; // Fill space
+        }
+
+        .form-buttons {
+          flex-shrink: 0; // Don't shrink
+        }
+      }
     }
   }