diff --git a/ee/app/assets/javascripts/security_configuration/components/security_attributes/attribute_drawer.vue b/ee/app/assets/javascripts/security_configuration/components/security_attributes/attribute_drawer.vue
index c6925d30a87c9eab80b51bad0d998152e37a7ab6..b1776ec98fe3827642891cbf2d45be8fe687e05c 100644
--- a/ee/app/assets/javascripts/security_configuration/components/security_attributes/attribute_drawer.vue
+++ b/ee/app/assets/javascripts/security_configuration/components/security_attributes/attribute_drawer.vue
@@ -18,8 +18,8 @@ export default {
   i18n: {
     addAttributeTitle: s__('SecurityAttributes|Add security attribute'),
     editAttributeTitle: s__('SecurityAttributes|Edit security attribute'),
-    updateAttributeButton: s__('SecurityAttributes|Update attribute'),
-    createAttributeButton: s__('SecurityAttributes|Add attribute'),
+    updateAttributeButton: s__('SecurityAttributes|Apply changes'),
+    createAttributeButton: s__('SecurityAttributes|Apply changes'),
     cancelButton: s__('SecurityAttributes|Cancel'),
     deleteButton: s__('SecurityAttributes|Delete'),
   },
@@ -111,7 +111,7 @@ export default {
       <div class="flex-fill gl-align-items-center gl-flex gl-justify-between">
         <div class="gl-display-flex gl-gap-3">
           <gl-button
-            category="primary"
+            category="secondary"
             variant="confirm"
             data-testid="submit-btn"
             @click="$refs.form.onSubmit()"
@@ -125,7 +125,7 @@ export default {
 
         <gl-button
           v-if="!isAddMode"
-          category="primary"
+          category="secondary"
           variant="danger"
           data-testid="delete-btn"
           @click="showDeleteModal = true"
diff --git a/ee/app/assets/javascripts/security_configuration/components/security_attributes/category_form.vue b/ee/app/assets/javascripts/security_configuration/components/security_attributes/category_form.vue
index 332ba105ccf27b840d50b43c06d99108e7de3261..22ef450df7c67b4da1fa907fefe1e68197af53ba 100644
--- a/ee/app/assets/javascripts/security_configuration/components/security_attributes/category_form.vue
+++ b/ee/app/assets/javascripts/security_configuration/components/security_attributes/category_form.vue
@@ -52,6 +52,16 @@ export default {
       default: () => defaultCategory,
     },
   },
+  data() {
+    return {
+      formErrors: {
+        name: null,
+        multipleSelection: null,
+        attributes: null,
+      },
+      hasUnsavedChanges: false,
+    };
+  },
   computed: {
     isNew() {
       return !this.category?.id;
@@ -68,14 +78,30 @@ export default {
     areAttributesEditable() {
       return this.category?.canEditAttributes || this.isNew;
     },
-    categoryName() {
-      return this.category?.name;
+    attributes() {
+      return this.securityAttributes.filter(
+        (attribute) => attribute.categoryId === this.category.id,
+      );
     },
-    categoryDescription() {
-      return this.category?.description;
+  },
+  methods: {
+    isFormValid() {
+      this.formErrors.name = this.category.name.trim() === '' ? __('Name is required') : null;
+      this.formErrors.multipleSelection =
+        this.category.multipleSelection === null ? __('Selection type is required') : null;
+      this.formErrors.attributes =
+        this.attributes.length === 0 ? __('At least one attribute is required') : null;
+      return (
+        !this.formErrors.name && !this.formErrors.multipleSelection && !this.formErrors.attributes
+      );
     },
-    attributes() {
-      return this.category?.id ? this.securityAttributes : [];
+    handleSave() {
+      if (!this.isFormValid()) return;
+      this.$emit('updateCategory', this.category);
+      this.hasUnsavedChanges = false;
+    },
+    handleUnsavedChange() {
+      this.hasUnsavedChanges = true;
     },
   },
   attributesTableFields: [
@@ -141,15 +167,32 @@ export default {
       <h3 class="gl-heading-3">{{ s__('SecurityAttributes|Category details') }}</h3>
       <p>{{ s__('SecurityAttributes|View category settings and associated attributes.') }}</p>
       <gl-form>
-        <gl-form-group :label="__('Name')">
-          <gl-form-input v-if="isCategoryEditable" :value="categoryName" />
-          <span v-else>{{ categoryName }}</span>
+        <gl-form-group
+          :label="__('Name')"
+          :state="formErrors.name === null"
+          :invalid-feedback="formErrors.name"
+        >
+          <gl-form-input
+            v-if="isCategoryEditable"
+            v-model="category.name"
+            :state="formErrors.name === null"
+            @input="handleUnsavedChange"
+          />
+          <span v-else>{{ category.name }}</span>
         </gl-form-group>
         <gl-form-group :label="__('Description')">
-          <gl-form-textarea v-if="isCategoryEditable" :value="categoryDescription" />
-          <span v-else>{{ categoryDescription }}</span>
+          <gl-form-textarea
+            v-if="isCategoryEditable"
+            v-model="category.description"
+            @input="handleUnsavedChange"
+          />
+          <span v-else>{{ category.description }}</span>
         </gl-form-group>
-        <gl-form-group>
+        <gl-form-group
+          :state="formErrors.multipleSelection === null"
+          :invalid-feedback="formErrors.multipleSelection"
+          @change="handleUnsavedChange"
+        >
           <template #label>
             {{ s__('SecurityAttributes|Selection type') }}
             <gl-icon
@@ -162,7 +205,7 @@ export default {
               name="information-o"
             />
           </template>
-          <gl-form-radio-group v-if="isNew">
+          <gl-form-radio-group v-if="isNew && !category.saved" v-model="category.multipleSelection">
             <gl-form-radio :value="false">
               {{ s__('SecurityAttributes|Single selection') }}
             </gl-form-radio>
@@ -186,6 +229,8 @@ export default {
         </gl-button>
         <gl-form-group
           :description="s__('SecurityAttributes|View the attributes available in this category')"
+          :state="formErrors.attributes === null"
+          :invalid-feedback="formErrors.attributes"
         >
           <template #label>
             {{ __('Attributes') }}
@@ -221,10 +266,15 @@ export default {
         </crud-component>
       </gl-form>
     </div>
-    <div v-if="!isLocked" class="gl-border-t gl-sticky gl-bottom-0 gl-w-full gl-bg-default gl-p-6">
-      <gl-button category="primary" variant="confirm">
+    <div
+      v-if="!isLocked"
+      class="gl-border-t gl-sticky gl-bottom-0 gl-flex gl-w-full gl-items-center gl-gap-3 gl-bg-default gl-p-6"
+    >
+      <gl-button category="primary" variant="confirm" @click="handleSave">
         {{ s__('SecurityAttributes|Save changes') }}
       </gl-button>
+      <gl-badge v-if="hasUnsavedChanges" :variant="'danger'">{{ __('Unsaved changes') }}</gl-badge>
+      <gl-badge v-else :variant="'success'">{{ __('All changes saved') }}</gl-badge>
     </div>
   </div>
 </template>
diff --git a/ee/app/assets/javascripts/security_configuration/components/security_attributes/category_list.vue b/ee/app/assets/javascripts/security_configuration/components/security_attributes/category_list.vue
index d4fe985cf9b230b8123889de93a37a9d7173a6c2..473ba39a037563aa3c143751bb00c36d566bd8d3 100644
--- a/ee/app/assets/javascripts/security_configuration/components/security_attributes/category_list.vue
+++ b/ee/app/assets/javascripts/security_configuration/components/security_attributes/category_list.vue
@@ -27,7 +27,7 @@ export default {
         category="primary"
         variant="confirm"
         size="small"
-        @click="$emit('selectCategory', {})"
+        @click="$emit('createCategory')"
         >{{ s__('SecurityAttributes|Create category') }}</gl-button
       >
     </div>
@@ -47,7 +47,7 @@ export default {
           {{ category.description }}
         </div>
       </div>
-      <gl-badge>{{ category.attributeCount }}</gl-badge>
+      <gl-badge v-if="category.attributeCount">{{ category.attributeCount }}</gl-badge>
     </div>
   </div>
 </template>
diff --git a/ee/app/assets/javascripts/security_configuration/components/security_attributes/configure_attributes.vue b/ee/app/assets/javascripts/security_configuration/components/security_attributes/configure_attributes.vue
index 787c842068c9b701e1c27db86ffc17f6b26668dc..4e6c2fc252bb530170e38c29821314da2080f012 100644
--- a/ee/app/assets/javascripts/security_configuration/components/security_attributes/configure_attributes.vue
+++ b/ee/app/assets/javascripts/security_configuration/components/security_attributes/configure_attributes.vue
@@ -1,4 +1,6 @@
 <script>
+import { __ } from '~/locale';
+import { confirmAction } from '~/lib/utils/confirm_via_gl_modal/confirm_action';
 import getSecurityAttributesQuery from '../../graphql/client/security_attributes.query.graphql';
 import CategoryList from './category_list.vue';
 import CategoryForm from './category_form.vue';
@@ -19,6 +21,14 @@ export default {
         securityAttributes: { nodes: [] },
       },
       selectedCategory: null,
+      draft: {
+        name: '',
+        description: '',
+        multipleSelection: null,
+        canEditCategory: true,
+        canEditAttributes: true,
+      },
+      draftAttributes: [],
     };
   },
   apollo: {
@@ -37,13 +47,48 @@ export default {
       },
     },
   },
+  computed: {
+    draftCategory() {
+      if (this.draft.saved) return [this.draft];
+      return [];
+    },
+    securityAttributeCategories() {
+      return [...this.draftCategory, ...this.group.securityAttributeCategories.nodes];
+    },
+    securityAttributes() {
+      return [...this.group.securityAttributes.nodes, ...this.draftAttributes];
+    },
+  },
   methods: {
-    selectCategory(category) {
+    createCategory() {
+      this.selectedCategory = {
+        ...defaultCategory,
+      };
+    },
+    async selectCategory(category) {
+      if (this.draft.name && !this.draft.saved) {
+        const confirmed = await confirmAction(
+          __(
+            'Are you sure you want to navigate away and lose any unsaved changes to this category?',
+          ),
+        );
+        if (!confirmed) return;
+        this.draft.name = '';
+        this.draft.description = '';
+        this.draft.multipleSelection = null;
+        this.draftAttributes = [];
+      }
       this.selectedCategory = {
         ...defaultCategory,
         ...category,
       };
     },
+    handleCategoryUpdate(category) {
+      this.draft = {
+        ...category,
+        saved: true,
+      };
+    },
     openDrawer(mode, item) {
       this.$refs.attributeDrawer.open(mode, item);
     },
@@ -56,6 +101,10 @@ export default {
     onSubmit(item) {
       // eslint-disable-next-line no-console
       console.log(item);
+      this.draftAttributes.push({
+        ...item,
+        categoryId: this.selectedCategory.id,
+      });
     },
     onDelete(item) {
       // eslint-disable-next-line no-console
@@ -68,15 +117,17 @@ export default {
   <div class="gl-border-t gl-flex">
     <div class="gl-border-r gl-w-1/4 gl-p-5">
       <category-list
-        :security-attribute-categories="group.securityAttributeCategories.nodes"
+        :security-attribute-categories="securityAttributeCategories"
         :selected-category="selectedCategory"
         @selectCategory="selectCategory"
+        @createCategory="createCategory"
       />
     </div>
     <div class="gl-w-3/4">
       <category-form
-        :security-attributes="group.securityAttributes.nodes"
-        :category="selectedCategory"
+        :security-attributes="securityAttributes"
+        :category="selectedCategory?.id ? selectedCategory : draft"
+        @updateCategory="handleCategoryUpdate"
         @addAttribute="addAttribute"
         @editAttribute="editAttribute"
       />
diff --git a/locale/gitlab.pot b/locale/gitlab.pot
index c7967b153a2b2ecc7837777f3351faab8aefaeaa..f45be940c15a028b4279e8f65a25a154e7067e63 100644
--- a/locale/gitlab.pot
+++ b/locale/gitlab.pot
@@ -6681,6 +6681,9 @@ msgstr ""
 msgid "All branches"
 msgstr ""
 
+msgid "All changes saved"
+msgstr ""
+
 msgid "All child items must be confidential in order to turn on confidentiality."
 msgstr ""
 
@@ -8807,6 +8810,9 @@ msgstr ""
 msgid "Are you sure you want to merge immediately?"
 msgstr ""
 
+msgid "Are you sure you want to navigate away and lose any unsaved changes to this category?"
+msgstr ""
+
 msgid "Are you sure you want to proceed?"
 msgstr ""
 
@@ -9098,6 +9104,9 @@ msgstr ""
 msgid "At least one approval from a code owner is required to change files matching the respective CODEOWNER rules."
 msgstr ""
 
+msgid "At least one attribute is required"
+msgstr ""
+
 msgid "At least one field of %{one_of_required_fields} must be present"
 msgstr ""
 
@@ -40772,6 +40781,9 @@ msgstr ""
 msgid "Name is already taken."
 msgstr ""
 
+msgid "Name is required"
+msgstr ""
+
 msgid "Name of the Jenkins project."
 msgstr ""
 
@@ -55901,10 +55913,10 @@ msgstr ""
 msgid "SecurityApprovals|Requires approval for decreases in test coverage."
 msgstr ""
 
-msgid "SecurityAttributes|Add attribute"
+msgid "SecurityAttributes|Add security attribute"
 msgstr ""
 
-msgid "SecurityAttributes|Add security attribute"
+msgid "SecurityAttributes|Apply changes"
 msgstr ""
 
 msgid "SecurityAttributes|Cancel"
@@ -55976,9 +55988,6 @@ msgstr ""
 msgid "SecurityAttributes|Single selection"
 msgstr ""
 
-msgid "SecurityAttributes|Update attribute"
-msgstr ""
-
 msgid "SecurityAttributes|Use security attributes to categorize projects by business context, security needs, and more. Categories are shared across your groups, enabling consistent and scalable classification of assets. These attributes can help prioritize security efforts, filter dashboards, and apply consistent governance across projects."
 msgstr ""
 
@@ -58691,6 +58700,9 @@ msgstr ""
 msgid "Selecting a GitLab user will add a link to the GitLab user in the descriptions of issues and comments (e.g. \"By %{link_open}@johnsmith%{link_close}\"). It will also associate and/or assign these issues and comments with the selected user."
 msgstr ""
 
+msgid "Selection type is required"
+msgstr ""
+
 msgid "Self hosted AI Gateway URL is not set. It can be changed in the Gitlab Duo configuration."
 msgstr ""
 
@@ -66788,6 +66800,9 @@ msgstr ""
 msgid "Unresolved"
 msgstr ""
 
+msgid "Unsaved changes"
+msgstr ""
+
 msgid "Unschedule job"
 msgstr ""