From 977adfdcee9468fd866eae99a4b466e57af6d343 Mon Sep 17 00:00:00 2001
From: Christian Beeznest <christian.fasanando@beeznest.com>
Date: Thu, 30 Oct 2025 13:34:42 -0500
Subject: [PATCH] Internal: Enforce 8px gap between action buttons in toolbar

---
 .../components/basecomponents/BaseToolbar.vue | 22 +++++++++++++++++++
 1 file changed, 22 insertions(+)

diff --git a/assets/vue/components/basecomponents/BaseToolbar.vue b/assets/vue/components/basecomponents/BaseToolbar.vue
index 96b17edba45..56b9a89201d 100644
--- a/assets/vue/components/basecomponents/BaseToolbar.vue
+++ b/assets/vue/components/basecomponents/BaseToolbar.vue
@@ -45,3 +45,25 @@ onMounted(() => {
   hasEndSlot.value = !!slots.end
 })
 </script>
+<style scoped>
+/* Ensure 8px spacing between items in PrimeVue Toolbar groups */
+/* PrimeVue ≥9 (group-* names) */
+:deep(.p-toolbar-group-start),
+:deep(.p-toolbar-group-center),
+:deep(.p-toolbar-group-end) {
+  display: flex;
+  align-items: center;
+  flex-wrap: wrap;
+  gap: 0.5rem; /* 8px */
+}
+
+/* PrimeVue 8.x fallback (start/end names) */
+:deep(.p-toolbar-start),
+:deep(.p-toolbar-center),
+:deep(.p-toolbar-end) {
+  display: flex;
+  align-items: center;
+  flex-wrap: wrap;
+  gap: 0.5rem;
+}
+</style>