diff --git a/src/components/standalone/FilterableListItemLayout.vue b/src/components/standalone/FilterableListItemLayout.vue
index 1c077b64f..51d3643a2 100644
--- a/src/components/standalone/FilterableListItemLayout.vue
+++ b/src/components/standalone/FilterableListItemLayout.vue
@@ -1,5 +1,5 @@
 <!--
-  Copyright (C) 2024 Nethesis S.r.l.
+  Copyright (C) 2026 Nethesis S.r.l.
   SPDX-License-Identifier: GPL-3.0-or-later
 -->
 
@@ -15,6 +15,8 @@ import {
   NeTextInput,
   getAxiosErrorMessage
 } from '@nethesis/vue-components'
+import { faCircleInfo, faCirclePlus } from '@fortawesome/free-solid-svg-icons'
+import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
 
 const props = defineProps<{
   fetchItemsFunction: () => Promise<T[]>
@@ -99,11 +101,11 @@ onMounted(() => {
       <div class="ml-2 shrink-0">
         <NeButton
           v-if="!readonly && items.length > 0"
-          kind="secondary"
+          kind="primary"
           @click="openCreateEditDrawer()"
         >
           <template #prefix>
-            <font-awesome-icon :icon="['fas', 'circle-plus']" class="h-4 w-4" aria-hidden="true" />
+            <FontAwesomeIcon :icon="faCirclePlus" class="h-4 w-4" aria-hidden="true" />
           </template>
           {{ addItemButtonLabel }}
         </NeButton>
@@ -125,15 +127,11 @@ onMounted(() => {
       <NeEmptyState
         v-if="items.length == 0"
         :title="noItemsFoundMessage"
-        :icon="['fas', 'circle-info']"
+        :icon="faCircleInfo"
         :class="[readonly ? 'pb-2' : '']"
-        ><NeButton v-if="!readonly" kind="primary" @click="openCreateEditDrawer()"
-          ><template #prefix>
-            <font-awesome-icon
-              :icon="['fas', 'circle-plus']"
-              class="h-4 w-4"
-              aria-hidden="true"
-            /> </template
+        ><NeButton v-if="!readonly" kind="primary" @click="openCreateEditDrawer()">
+          <template #prefix>
+            <FontAwesomeIcon :icon="faCirclePlus" class="h-4 w-4" aria-hidden="true" /> </template
           >{{ addItemButtonLabel }}</NeButton
         ></NeEmptyState
       >
@@ -141,7 +139,7 @@ onMounted(() => {
         v-else-if="filteredItems.length == 0"
         :title="noFilteredItemsFoundMessage"
         :description="noFilteredItemsFoundDescription"
-        :icon="['fas', 'circle-info']"
+        :icon="faCircleInfo"
       />
       <slot
         v-else
diff --git a/src/components/standalone/backup_and_restore/MigrationContent.vue b/src/components/standalone/backup_and_restore/MigrationContent.vue
index f23865695..ab8ca98b3 100644
--- a/src/components/standalone/backup_and_restore/MigrationContent.vue
+++ b/src/components/standalone/backup_and_restore/MigrationContent.vue
@@ -1,5 +1,5 @@
 <!--
-  Copyright (C) 2024 Nethesis S.r.l.
+  Copyright (C) 2026 Nethesis S.r.l.
   SPDX-License-Identifier: GPL-3.0-or-later
 -->
 
@@ -10,6 +10,7 @@ import { NeLink, NeInlineNotification, NeButton } from '@nethesis/vue-components
 import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
 import MigrationDrawer from '@/components/standalone/backup_and_restore/MigrationDrawer.vue'
 import FormLayout from '@/components/standalone/FormLayout.vue'
+import { faArrowCircleUp, faArrowUpRightFromSquare } from '@fortawesome/free-solid-svg-icons'
 
 const { t } = useI18n()
 
@@ -38,7 +39,7 @@ function successMigration() {
           {{ t('standalone.backup_and_restore.migration.description') }}
           <div class="mt-4">
             <NeLink href="https://docs.nethsecurity.org/en/latest/migration.html" target="_blank">
-              <FontAwesomeIcon class="mr-2" :icon="['fa', 'arrow-up-right-from-square']" />
+              <FontAwesomeIcon class="mr-2" :icon="faArrowUpRightFromSquare" />
               {{ t('standalone.backup_and_restore.migration.description_link') }}
             </NeLink>
           </div>
@@ -48,13 +49,13 @@ function successMigration() {
         <div class="mr-auto self-start">
           <NeButton
             class="ml-6"
-            kind="secondary"
+            kind="primary"
             size="lg"
             type="submit"
             @click="showMigrationDrawer = true"
           >
             <template #prefix>
-              <FontAwesomeIcon :icon="['fa', 'arrow-circle-up']" />
+              <FontAwesomeIcon :icon="faArrowCircleUp" />
             </template>
             {{ t('standalone.backup_and_restore.migration.upload_file') }}
           </NeButton>
diff --git a/src/components/standalone/backup_and_restore/RestoreContent.vue b/src/components/standalone/backup_and_restore/RestoreContent.vue
index 33fe2d8c5..3a2bb5131 100644
--- a/src/components/standalone/backup_and_restore/RestoreContent.vue
+++ b/src/components/standalone/backup_and_restore/RestoreContent.vue
@@ -1,5 +1,5 @@
 <!--
-  Copyright (C) 2024 Nethesis S.r.l.
+  Copyright (C) 2026 Nethesis S.r.l.
   SPDX-License-Identifier: GPL-3.0-or-later
 -->
 
@@ -28,6 +28,7 @@ import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
 import { validateRequired } from '@/lib/validation'
 import FormLayout from '@/components/standalone/FormLayout.vue'
 import { uploadFile } from '@/lib/standalone/fileUpload'
+import { faRotate } from '@fortawesome/free-solid-svg-icons'
 
 const { t } = useI18n()
 const RESTORE_WAIT_TIME = 45000
@@ -291,13 +292,13 @@ function setRestoreTimer() {
           <div class="mr-auto self-start">
             <NeButton
               class="ml-"
-              kind="secondary"
+              kind="primary"
               size="lg"
               type="submit"
               @click="showRestoreDrawer = true"
             >
               <template #prefix>
-                <FontAwesomeIcon :icon="['fa', 'rotate']" />
+                <FontAwesomeIcon :icon="faRotate" />
               </template>
               {{ t('standalone.backup_and_restore.restore.restore_backup') }}
             </NeButton>
diff --git a/src/components/standalone/dns_dhcp/DnsManager.vue b/src/components/standalone/dns_dhcp/DnsManager.vue
index 913668ed8..767bfc7c6 100644
--- a/src/components/standalone/dns_dhcp/DnsManager.vue
+++ b/src/components/standalone/dns_dhcp/DnsManager.vue
@@ -1,5 +1,5 @@
 <!--
-  Copyright (C) 2024 Nethesis S.r.l.
+  Copyright (C) 2026 Nethesis S.r.l.
   SPDX-License-Identifier: GPL-3.0-or-later
 -->
 
@@ -25,6 +25,8 @@ import {
   validateRequired
 } from '@/lib/validation'
 import { useUciPendingChangesStore } from '@/stores/standalone/uciPendingChanges'
+import { faFloppyDisk } from '@fortawesome/free-solid-svg-icons'
+import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
 
 const { t } = useI18n()
 const uciChangesStore = useUciPendingChangesStore()
@@ -167,18 +169,15 @@ onMounted(() => {
       </NeTextInput>
       <NeToggle v-model="logDnsQueries" :label="t('standalone.dns_dhcp.log_dns_queries')" />
       <hr />
-      <div class="flex justify-end">
+      <div class="flex justify-start">
         <NeButton
           kind="primary"
           :disabled="isUpdatingDnsConfig"
           :loading="isUpdatingDnsConfig"
           @click="updateDnsConfig"
-          ><template #prefix>
-            <font-awesome-icon
-              :icon="['fas', 'floppy-disk']"
-              class="h-4 w-4"
-              aria-hidden="true"
-            /> </template
+        >
+          <template #prefix>
+            <FontAwesomeIcon :icon="faFloppyDisk" class="h-4 w-4" aria-hidden="true" /> </template
           >{{ t('common.save') }}</NeButton
         >
       </div>
diff --git a/src/components/standalone/dns_dhcp/DnsRecordsTable.vue b/src/components/standalone/dns_dhcp/DnsRecordsTable.vue
index d8e817010..515cd2f25 100644
--- a/src/components/standalone/dns_dhcp/DnsRecordsTable.vue
+++ b/src/components/standalone/dns_dhcp/DnsRecordsTable.vue
@@ -1,5 +1,5 @@
 <!--
-  Copyright (C) 2024 Nethesis S.r.l.
+  Copyright (C) 2026 Nethesis S.r.l.
   SPDX-License-Identifier: GPL-3.0-or-later
 -->
 
@@ -9,7 +9,8 @@ import NeTable from '../NeTable.vue'
 import { NeDropdown } from '@nethesis/vue-components'
 import { NeButton } from '@nethesis/vue-components'
 import type { DnsRecord } from './DnsRecords.vue'
-import { faTrash } from '@fortawesome/free-solid-svg-icons'
+import { faCircleCheck, faPenToSquare, faTrash, faXmark } from '@fortawesome/free-solid-svg-icons'
+import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
 
 const { t } = useI18n()
 
@@ -64,9 +65,14 @@ function getDropdownItems(item: DnsRecord) {
     </template>
     <template #wildcard="{ item }: { item: DnsRecord }">
       <div :class="['flex', 'flex-row', 'items-center']">
-        <font-awesome-icon
-          :icon="['fas', item.wildcard ? 'circle-check' : 'circle-xmark']"
-          class="mr-2 h-5 w-5"
+        <FontAwesomeIcon
+          :icon="item.wildcard ? faCircleCheck : faXmark"
+          :class="[
+            'mr-2',
+            'h-5',
+            'w-5',
+            item.wildcard ? 'text-green-700 dark:text-green-500' : 'text-red-700 dark:text-red-500'
+          ]"
           aria-hidden="true"
         />
         {{ item.wildcard ? t('standalone.dns_dhcp.enabled') : t('standalone.dns_dhcp.disabled') }}
@@ -76,11 +82,7 @@ function getDropdownItems(item: DnsRecord) {
       <div class="align-center flex justify-end">
         <NeButton kind="tertiary" @click="emit('record-edit', item)">
           <template #prefix>
-            <font-awesome-icon
-              :icon="['fas', 'pen-to-square']"
-              class="h-4 w-4"
-              aria-hidden="true"
-            />
+            <FontAwesomeIcon :icon="faPenToSquare" class="h-4 w-4" aria-hidden="true" />
           </template>
           {{ t('common.edit') }}
         </NeButton>
diff --git a/src/components/standalone/dns_dhcp/StaticLeases.vue b/src/components/standalone/dns_dhcp/StaticLeases.vue
index 17fc8d311..615a2d6ef 100644
--- a/src/components/standalone/dns_dhcp/StaticLeases.vue
+++ b/src/components/standalone/dns_dhcp/StaticLeases.vue
@@ -1,5 +1,5 @@
 <!--
-  Copyright (C) 2024 Nethesis S.r.l.
+  Copyright (C) 2026 Nethesis S.r.l.
   SPDX-License-Identifier: GPL-3.0-or-later
 -->
 
@@ -151,7 +151,7 @@ function clearFilters() {
         {{ t('standalone.dns_dhcp.static_leases_description') }}
       </p>
       <div class="ml-2 shrink-0">
-        <NeButton v-if="items.length > 0" kind="secondary" @click="openCreateEditDrawer()">
+        <NeButton v-if="items.length > 0" kind="primary" @click="openCreateEditDrawer()">
           <template #prefix>
             <FontAwesomeIcon :icon="faCirclePlus" class="h-4 w-4" aria-hidden="true" />
           </template>
diff --git a/src/components/standalone/dpi/DpiExceptions.vue b/src/components/standalone/dpi/DpiExceptions.vue
index 4b9d3ce91..ad6af6c23 100644
--- a/src/components/standalone/dpi/DpiExceptions.vue
+++ b/src/components/standalone/dpi/DpiExceptions.vue
@@ -1,5 +1,5 @@
 <!--
-  Copyright (C) 2024 Nethesis S.r.l.
+  Copyright (C) 2026 Nethesis S.r.l.
   SPDX-License-Identifier: GPL-3.0-or-later
 -->
 
@@ -18,6 +18,8 @@ import DeleteDpiExceptionModal from './DeleteDpiExceptionModal.vue'
 import { useUciPendingChangesStore } from '@/stores/standalone/uciPendingChanges'
 import DpiExceptionCard from './DpiExceptionCard.vue'
 import CreateOrDeleteDpiExceptionDrawer from './CreateOrDeleteDpiExceptionDrawer.vue'
+import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
+import { faCircleInfo, faCirclePlus } from '@fortawesome/free-solid-svg-icons'
 
 export type DpiException = {
   'config-name': string
@@ -83,13 +85,9 @@ onMounted(() => {
       </p>
       <template v-if="exceptions.length > 0">
         <div class="ml-2 flex shrink-0 flex-col gap-x-0 gap-y-2 sm:flex-row sm:gap-x-2 sm:gap-y-0">
-          <NeButton kind="secondary" @click="openCreateEditDrawer(null)">
+          <NeButton kind="primary" @click="openCreateEditDrawer(null)">
             <template #prefix>
-              <font-awesome-icon
-                :icon="['fas', 'circle-plus']"
-                class="h-4 w-4"
-                aria-hidden="true"
-              />
+              <FontAwesomeIcon :icon="faCirclePlus" class="h-4 w-4" aria-hidden="true" />
             </template>
             {{ t('standalone.dpi.add_exception') }}
           </NeButton>
@@ -110,14 +108,10 @@ onMounted(() => {
       <NeEmptyState
         v-if="exceptions.length == 0"
         :title="t('standalone.dpi.no_exception_found')"
-        :icon="['fas', 'circle-info']"
+        :icon="faCircleInfo"
         ><NeButton kind="primary" @click="openCreateEditDrawer(null)"
           ><template #prefix>
-            <font-awesome-icon
-              :icon="['fas', 'circle-plus']"
-              class="h-4 w-4"
-              aria-hidden="true"
-            /> </template
+            <FontAwesomeIcon :icon="faCirclePlus" class="h-4 w-4" aria-hidden="true" /> </template
           >{{ t('standalone.dpi.add_exception') }}</NeButton
         ></NeEmptyState
       >
diff --git a/src/components/standalone/dpi/DpiRules.vue b/src/components/standalone/dpi/DpiRules.vue
index 495174180..85279359b 100644
--- a/src/components/standalone/dpi/DpiRules.vue
+++ b/src/components/standalone/dpi/DpiRules.vue
@@ -1,5 +1,5 @@
 <!--
-  Copyright (C) 2024 Nethesis S.r.l.
+  Copyright (C) 2026 Nethesis S.r.l.
   SPDX-License-Identifier: GPL-3.0-or-later
 -->
 
@@ -22,6 +22,8 @@ import DeleteDpiRuleModal from '@/components/standalone/dpi/DeleteDpiRuleModal.v
 import { ubusCall } from '@/lib/standalone/ubus'
 import { useFirewallStore } from '@/stores/standalone/firewall'
 import { useUciPendingChangesStore } from '@/stores/standalone/uciPendingChanges'
+import { faCircleInfo, faCirclePlus } from '@fortawesome/free-solid-svg-icons'
+import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
 
 const { t } = useI18n()
 const firewallConfig = useFirewallStore()
@@ -91,13 +93,13 @@ function showDeleteRuleModal(rule: DpiRule) {
       </div>
       <NeButton
         v-if="rules.length"
-        kind="secondary"
+        kind="primary"
         size="lg"
         class="ml-6 shrink-0"
         @click="showCreateRuleModal"
       >
         <template #prefix>
-          <FontAwesomeIcon :icon="['fas', 'circle-plus']" aria-hidden="true" />
+          <FontAwesomeIcon :icon="faCirclePlus" aria-hidden="true" />
         </template>
         {{ t('standalone.dpi.create_rule') }}</NeButton
       >
@@ -125,11 +127,11 @@ function showDeleteRuleModal(rule: DpiRule) {
       <NeEmptyState
         v-if="isEmpty(rules)"
         :title="t('standalone.dpi.no_rules_found')"
-        :icon="['fas', 'circle-info']"
+        :icon="faCircleInfo"
       >
         <NeButton kind="primary" size="lg" @click="showCreateRuleModal">
           <template #prefix>
-            <FontAwesomeIcon :icon="['fas', 'circle-plus']" aria-hidden="true" />
+            <FontAwesomeIcon :icon="faCirclePlus" aria-hidden="true" />
           </template>
           {{ t('standalone.dpi.create_rule') }}</NeButton
         >
diff --git a/src/components/standalone/factory_reset/FactoryResetContent.vue b/src/components/standalone/factory_reset/FactoryResetContent.vue
index bf0afdd0a..dc7ebce31 100644
--- a/src/components/standalone/factory_reset/FactoryResetContent.vue
+++ b/src/components/standalone/factory_reset/FactoryResetContent.vue
@@ -1,5 +1,5 @@
 <!--
-  Copyright (C) 2024 Nethesis S.r.l.
+  Copyright (C) 2026 Nethesis S.r.l.
   SPDX-License-Identifier: GPL-3.0-or-later
 -->
 
@@ -18,6 +18,7 @@ import {
 import { NeModal } from '@nethesis/vue-components'
 import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
 import FormLayout from '@/components/standalone/FormLayout.vue'
+import { faArrowRotateLeft, faCircleInfo } from '@fortawesome/free-solid-svg-icons'
 
 const { t } = useI18n()
 const RESET_WAIT_TIME = 45000
@@ -124,7 +125,7 @@ function setResetTimer() {
           </p>
           <div class="flex">
             <FontAwesomeIcon
-              :icon="['fa', 'circle-info']"
+              :icon="faCircleInfo"
               class="mt-1 mr-2 text-indigo-700 dark:text-indigo-300"
             />
             <p class="mb-8">
@@ -137,9 +138,9 @@ function setResetTimer() {
             {{ t('standalone.factory_reset.current_version') }}: {{ currentVersion }}
           </p>
           <div>
-            <NeButton kind="secondary" @click="showModalFactoryReset = true">
+            <NeButton kind="primary" @click="showModalFactoryReset = true">
               <template #prefix>
-                <FontAwesomeIcon :icon="['fa', 'arrow-rotate-left']" aria-hidden="true" />
+                <FontAwesomeIcon :icon="faArrowRotateLeft" aria-hidden="true" />
               </template>
               {{ t('standalone.factory_reset.perform_factory_reset') }}
             </NeButton>
diff --git a/src/components/standalone/firewall/conntrack/ConntrackContent.vue b/src/components/standalone/firewall/conntrack/ConntrackContent.vue
index 05e251050..15f8de5df 100644
--- a/src/components/standalone/firewall/conntrack/ConntrackContent.vue
+++ b/src/components/standalone/firewall/conntrack/ConntrackContent.vue
@@ -1,5 +1,5 @@
 <!--
-  Copyright (C) 2024 Nethesis S.r.l.
+  Copyright (C) 2026 Nethesis S.r.l.
   SPDX-License-Identifier: GPL-3.0-or-later
 -->
 
@@ -156,7 +156,7 @@ function onRecordDeleted() {
           </template>
           {{ t('standalone.conntrack.delete_all') }}
         </NeButton>
-        <NeButton kind="secondary" size="lg" @click="fetchConntrack()">
+        <NeButton kind="primary" size="lg" @click="fetchConntrack()">
           <template #prefix>
             <FontAwesomeIcon :icon="faRefresh" aria-hidden="true" />
           </template>
diff --git a/src/components/standalone/firewall/nat/NatHelpersTable.vue b/src/components/standalone/firewall/nat/NatHelpersTable.vue
index cf7d1444c..3c023cf6e 100644
--- a/src/components/standalone/firewall/nat/NatHelpersTable.vue
+++ b/src/components/standalone/firewall/nat/NatHelpersTable.vue
@@ -1,5 +1,5 @@
 <!--
-  Copyright (C) 2024 Nethesis S.r.l.
+  Copyright (C) 2026 Nethesis S.r.l.
   SPDX-License-Identifier: GPL-3.0-or-later
 -->
 
@@ -20,6 +20,15 @@ import {
 import { ref, type PropType } from 'vue'
 import { useI18n } from 'vue-i18n'
 import type { NatHelper } from '@/stores/standalone/firewall'
+import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
+import {
+  faCircleCheck,
+  faCircleInfo,
+  faCircleXmark,
+  faPenToSquare,
+  faTable,
+  faTriangleExclamation
+} from '@fortawesome/free-solid-svg-icons'
 
 const props = defineProps({
   filteredNatHelpers: {
@@ -67,7 +76,7 @@ const { currentPage, paginatedItems } = useItemPagination(() => props.filteredNa
         <NeTableCell colspan="4">
           <NeEmptyState
             :title="t('ne_table.no_items')"
-            :icon="['fas', 'table']"
+            :icon="faTable"
             class="bg-white dark:bg-gray-950"
           />
         </NeTableCell>
@@ -78,7 +87,7 @@ const { currentPage, paginatedItems } = useItemPagination(() => props.filteredNa
           <NeEmptyState
             :title="t('standalone.nat_helpers.no_nat_helpers_found')"
             :description="t('common.try_changing_search_filters')"
-            :icon="['fas', 'circle-info']"
+            :icon="faCircleInfo"
             class="bg-white dark:bg-gray-950"
           >
             <NeButton kind="tertiary" @click="emit('clearFilters')">
@@ -93,9 +102,14 @@ const { currentPage, paginatedItems } = useItemPagination(() => props.filteredNa
         </NeTableCell>
         <NeTableCell :data-label="t('standalone.nat_helpers.status')">
           <div class="flex items-center gap-2">
-            <font-awesome-icon
-              :icon="['fas', item.enabled ? 'circle-check' : 'circle-xmark']"
-              :class="['h-4 w-4', { 'text-green-600 dark:text-green-400': item.enabled }]"
+            <FontAwesomeIcon
+              :icon="item.enabled ? faCircleCheck : faCircleXmark"
+              :class="[
+                'h-4 w-4',
+                item.enabled
+                  ? 'text-green-700 dark:text-green-500'
+                  : 'text-red-700 dark:text-red-500'
+              ]"
               aria-hidden="true"
             />
             {{ item.enabled ? t('common.enabled') : t('common.disabled') }}
@@ -113,10 +127,7 @@ const { currentPage, paginatedItems } = useItemPagination(() => props.filteredNa
             <!-- module enabled but not loaded warning -->
             <NeTooltip v-if="item.enabled && !item.loaded">
               <template #trigger>
-                <font-awesome-icon
-                  :icon="['fas', 'triangle-exclamation']"
-                  class="h-4 w-4 text-amber-500"
-                />
+                <FontAwesomeIcon :icon="faTriangleExclamation" class="h-4 w-4 text-amber-500" />
               </template>
               <template #content>
                 <p>
@@ -138,11 +149,7 @@ const { currentPage, paginatedItems } = useItemPagination(() => props.filteredNa
           <div class="-ml-2.5 flex xl:ml-0 xl:justify-end">
             <NeButton kind="tertiary" @click="emit('editNatHelper', item)">
               <template #prefix>
-                <font-awesome-icon
-                  :icon="['fas', 'pen-to-square']"
-                  class="h-4 w-4"
-                  aria-hidden="true"
-                />
+                <FontAwesomeIcon :icon="faPenToSquare" class="h-4 w-4" aria-hidden="true" />
               </template>
               {{ t('common.edit') }}
             </NeButton>
diff --git a/src/components/standalone/firewall/nat/NatRulesContent.vue b/src/components/standalone/firewall/nat/NatRulesContent.vue
index 7968233b5..7e06f27bb 100644
--- a/src/components/standalone/firewall/nat/NatRulesContent.vue
+++ b/src/components/standalone/firewall/nat/NatRulesContent.vue
@@ -1,5 +1,5 @@
 <!--
-  Copyright (C) 2024 Nethesis S.r.l.
+  Copyright (C) 2026 Nethesis S.r.l.
   SPDX-License-Identifier: GPL-3.0-or-later
 -->
 
@@ -21,6 +21,8 @@ import { ubusCall } from '@/lib/standalone/ubus'
 import NatRulesTable from './NatRulesTable.vue'
 import DeleteNatRuleModal from './DeleteNatRuleModal.vue'
 import { useUciPendingChangesStore } from '@/stores/standalone/uciPendingChanges'
+import { faCirclePlus, faNetworkWired } from '@fortawesome/free-solid-svg-icons'
+import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
 
 const { t } = useI18n()
 const uciChangesStore = useUciPendingChangesStore()
@@ -100,7 +102,7 @@ function hideCreateOrEditRuleDrawer() {
         @click="showCreateRuleDrawer"
       >
         <template #prefix>
-          <FontAwesomeIcon :icon="['fas', 'circle-plus']" aria-hidden="true" />
+          <FontAwesomeIcon :icon="faCirclePlus" aria-hidden="true" />
         </template>
         {{ t('standalone.nat.add_nat_rule') }}</NeButton
       >
@@ -125,12 +127,12 @@ function hideCreateOrEditRuleDrawer() {
           <!-- empty state -->
           <NeEmptyState
             :title="t('standalone.nat.no_rules_found')"
-            :icon="['fas', 'network-wired']"
+            :icon="faNetworkWired"
             class="mt-4"
           >
-            <NeButton kind="secondary" size="lg" @click="showCreateRuleDrawer">
+            <NeButton kind="primary" size="lg" @click="showCreateRuleDrawer">
               <template #prefix>
-                <FontAwesomeIcon :icon="['fas', 'circle-plus']" aria-hidden="true" />
+                <FontAwesomeIcon :icon="faCirclePlus" aria-hidden="true" />
               </template>
               {{ t('standalone.nat.add_nat_rule') }}</NeButton
             >
diff --git a/src/components/standalone/firewall/rules/FirewallRulesTable.vue b/src/components/standalone/firewall/rules/FirewallRulesTable.vue
index f5cacfcf9..bb5d8c6ca 100644
--- a/src/components/standalone/firewall/rules/FirewallRulesTable.vue
+++ b/src/components/standalone/firewall/rules/FirewallRulesTable.vue
@@ -525,6 +525,6 @@ tr.drop-target > td {
 }
 
 tr.drop-over > td {
-  @apply bg-primary-900 py-7;
+  @apply bg-cyan-100 py-7 dark:bg-cyan-900;
 }
 </style>
diff --git a/src/components/standalone/hotspot/SettingsContent.vue b/src/components/standalone/hotspot/SettingsContent.vue
index 472cadddb..1c1bd9ae7 100644
--- a/src/components/standalone/hotspot/SettingsContent.vue
+++ b/src/components/standalone/hotspot/SettingsContent.vue
@@ -1,5 +1,5 @@
 <!--
-  Copyright (C) 2024 Nethesis S.r.l.
+  Copyright (C) 2026 Nethesis S.r.l.
   SPDX-License-Identifier: GPL-3.0-or-later
 -->
 
@@ -572,7 +572,7 @@ function goToInterfaces() {
           :title="error.notificationTitle"
           :description="error.notificationDescription"
         />
-        <div class="flex justify-end">
+        <div class="flex justify-start">
           <NeButton :disabled="logging" :loading="logging" kind="primary" size="lg" type="submit">
             <template #prefix>
               <FontAwesomeIcon :icon="faRightToBracket" />
diff --git a/src/components/standalone/ipsec_tunnel/DeleteTunnelModal.vue b/src/components/standalone/ipsec_tunnel/DeleteTunnelModal.vue
index cc07f51ea..b642538f1 100644
--- a/src/components/standalone/ipsec_tunnel/DeleteTunnelModal.vue
+++ b/src/components/standalone/ipsec_tunnel/DeleteTunnelModal.vue
@@ -1,5 +1,5 @@
 <!--
-  Copyright (C) 2024 Nethesis S.r.l.
+  Copyright (C) 2026 Nethesis S.r.l.
   SPDX-License-Identifier: GPL-3.0-or-later
 -->
 
@@ -65,6 +65,8 @@ function close() {
     :primary-button-disabled="isDeleting"
     :primary-button-loading="isDeleting"
     :close-aria-label="t('common.close')"
+    :cancel-label="t('common.cancel')"
+    primary-button-kind="danger"
     @primary-click="deleteTunnel()"
     @close="close()"
   >
diff --git a/src/components/standalone/multi-wan/MultiWanGeneralSettings.vue b/src/components/standalone/multi-wan/MultiWanGeneralSettings.vue
index fe8d5bc23..508cf3dd0 100644
--- a/src/components/standalone/multi-wan/MultiWanGeneralSettings.vue
+++ b/src/components/standalone/multi-wan/MultiWanGeneralSettings.vue
@@ -1,5 +1,5 @@
 <!--
-  Copyright (C) 2024 Nethesis S.r.l.
+  Copyright (C) 2026 Nethesis S.r.l.
   SPDX-License-Identifier: GPL-3.0-or-later
 -->
 
@@ -23,6 +23,7 @@ import type { AxiosResponse } from 'axios'
 import { AxiosError } from 'axios'
 import { MessageBag, validateHost } from '@/lib/validation'
 import { useUciPendingChangesStore } from '@/stores/standalone/uciPendingChanges'
+import { faCirclePlus, faTrash } from '@fortawesome/free-solid-svg-icons'
 
 const { t } = useI18n()
 const uciChangesStore = useUciPendingChangesStore()
@@ -190,7 +191,7 @@ onMounted(() => {
               size="lg"
               @click="data.track_ip.splice(index, 1)"
             >
-              <FontAwesomeIcon :icon="['fas', 'trash']" aria-hidden="true" />
+              <FontAwesomeIcon :icon="faTrash" aria-hidden="true" />
             </NeButton>
           </div>
         </template>
@@ -201,9 +202,14 @@ onMounted(() => {
           </p>
         </template>
         <div class="flex">
-          <NeButton :disabled="sending" class="ml-auto" @click="data.track_ip.push('')">
+          <NeButton
+            :disabled="sending"
+            class="-ml-2.5"
+            kind="tertiary"
+            @click="data.track_ip.push('')"
+          >
             <template #prefix>
-              <FontAwesomeIcon icon="add" />
+              <FontAwesomeIcon :icon="faCirclePlus" class="h-4 w-4" aria-hidden="true" />
             </template>
             {{ t('standalone.multi_wan.add_hostname_or_ip') }}
           </NeButton>
@@ -287,9 +293,11 @@ onMounted(() => {
         />
       </div>
     </FormLayout>
-    <hr />
-    <NeButton :disabled="sending" :loading="sending" kind="primary" @click="sendData()">
-      {{ t('common.save') }}
-    </NeButton>
+    <hr class="my-8" />
+    <FormLayout>
+      <NeButton :disabled="sending" :loading="sending" kind="primary" @click="sendData()">
+        {{ t('common.save') }}
+      </NeButton>
+    </FormLayout>
   </div>
 </template>
diff --git a/src/components/standalone/openvpn_rw/RWAccountsManager.vue b/src/components/standalone/openvpn_rw/RWAccountsManager.vue
index 25318bda6..67eb6c771 100644
--- a/src/components/standalone/openvpn_rw/RWAccountsManager.vue
+++ b/src/components/standalone/openvpn_rw/RWAccountsManager.vue
@@ -1,5 +1,5 @@
 <!--
-  Copyright (C) 2024 Nethesis S.r.l.
+  Copyright (C) 2026 Nethesis S.r.l.
   SPDX-License-Identifier: GPL-3.0-or-later
 -->
 
@@ -28,6 +28,7 @@ import RenewCertificateDrawer from './RenewCertificateDrawer.vue'
 import { useNotificationsStore } from '@/stores/notifications'
 import { downloadFile, deleteFile } from '@/lib/standalone/fileUpload'
 import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
+import { faCircleArrowDown, faCirclePlus, faUserGroup } from '@fortawesome/free-solid-svg-icons'
 
 type ConnectionFilter = 'all' | 'connected' | 'not_connected'
 type ExpirationFilter = 'all' | 'expired' | 'not_expired'
@@ -278,10 +279,10 @@ function clearFilters() {
   >
   <NeSkeleton v-if="isLoading" :lines="8" />
   <template v-else-if="users.length == 0">
-    <NeEmptyState :title="t('standalone.openvpn_rw.no_users_found')" :icon="['fas', 'user-group']">
+    <NeEmptyState :title="t('standalone.openvpn_rw.no_users_found')" :icon="faUserGroup">
       <NeButton kind="primary" @click="openCreateEditDrawer()">
         <template #prefix>
-          <font-awesome-icon :icon="['fas', 'circle-plus']" class="h-4 w-4" aria-hidden="true" />
+          <FontAwesomeIcon :icon="faCirclePlus" class="h-4 w-4" aria-hidden="true" />
         </template>
         {{ t('standalone.openvpn_rw.add_vpn_account') }}
       </NeButton>
@@ -291,7 +292,7 @@ function clearFilters() {
     <div
       class="flex flex-col-reverse items-start justify-between gap-8 xl:flex-row xl:items-center"
     >
-      <div class="flex flex-row gap-x-3">
+      <div class="flex flex-row items-center gap-x-3">
         <NeTextInput v-model="textFilter" :placeholder="t('common.filter')" />
         <NeDropdownFilter
           v-model="expirationFilter"
@@ -322,17 +323,13 @@ function clearFilters() {
       <div class="flex flex-row gap-x-3">
         <NeButton kind="tertiary" @click="downloadAllConfigurations()">
           <template #prefix>
-            <font-awesome-icon
-              :icon="['fas', 'fa-circle-arrow-down']"
-              class="h-4 w-4"
-              aria-hidden="true"
-            />
+            <FontAwesomeIcon :icon="faCircleArrowDown" class="h-4 w-4" aria-hidden="true" />
           </template>
           {{ t('standalone.openvpn_rw.download_all_configs') }}
         </NeButton>
         <NeButton kind="primary" @click="openCreateEditDrawer()">
           <template #prefix>
-            <font-awesome-icon :icon="['fas', 'circle-plus']" class="h-4 w-4" aria-hidden="true" />
+            <FontAwesomeIcon :icon="faCirclePlus" class="h-4 w-4" aria-hidden="true" />
           </template>
           {{ t('standalone.openvpn_rw.add_vpn_account') }}
         </NeButton>
@@ -350,11 +347,7 @@ function clearFilters() {
       @enable-disable="handleToggleAccountEnableRequest"
       @regenerate-certificate="openRenewCertificateDrawer"
     />
-    <NeEmptyState
-      v-else
-      :title="t('standalone.openvpn_rw.no_users_found')"
-      :icon="['fas', 'user-group']"
-    />
+    <NeEmptyState v-else :title="t('standalone.openvpn_rw.no_users_found')" :icon="faUserGroup" />
   </template>
   <DeleteRWAccountModal
     :visible="showDeleteAccountModal"
diff --git a/src/components/standalone/security/ips/IpsDisabledRules.vue b/src/components/standalone/security/ips/IpsDisabledRules.vue
index 9290ad72f..f78f8e98e 100644
--- a/src/components/standalone/security/ips/IpsDisabledRules.vue
+++ b/src/components/standalone/security/ips/IpsDisabledRules.vue
@@ -1,5 +1,5 @@
 <!--
-  Copyright (C) 2025 Nethesis S.r.l.
+  Copyright (C) 2026 Nethesis S.r.l.
   SPDX-License-Identifier: GPL-3.0-or-later
 -->
 
@@ -142,7 +142,7 @@ function handleEnabled() {
     <template v-else-if="rules.length > 0">
       <div class="flex flex-col flex-wrap justify-between gap-4 md:flex-row">
         <NeTextInput v-model.trim="filter" :placeholder="t('common.filter')" is-search />
-        <NeButton v-if="rules.length > 0" kind="secondary" size="lg" @click="disablingRule = true">
+        <NeButton v-if="rules.length > 0" kind="primary" size="lg" @click="disablingRule = true">
           <template #prefix>
             <FontAwesomeIcon :icon="faXmarkCircle" aria-hidden="true" class="h-4 w-4" />
           </template>
diff --git a/src/components/standalone/security/ips/IpsFilterBypass.vue b/src/components/standalone/security/ips/IpsFilterBypass.vue
index 3d217fa46..3633bb67f 100644
--- a/src/components/standalone/security/ips/IpsFilterBypass.vue
+++ b/src/components/standalone/security/ips/IpsFilterBypass.vue
@@ -1,5 +1,5 @@
 <!--
-  Copyright (C) 2025 Nethesis S.r.l.
+  Copyright (C) 2026 Nethesis S.r.l.
   SPDX-License-Identifier: GPL-3.0-or-later
 -->
 
@@ -146,7 +146,7 @@ function handleDeleted() {
         <NeTextInput v-model.trim="filter" :placeholder="t('common.filter')" is-search />
         <NeButton
           v-if="bypasses.length > 0"
-          kind="secondary"
+          kind="primary"
           size="lg"
           @click="creatingBypass = true"
         >
diff --git a/src/components/standalone/security/ips/IpsSuppressedAlerts.vue b/src/components/standalone/security/ips/IpsSuppressedAlerts.vue
index 1d49c8d52..23645a9a2 100644
--- a/src/components/standalone/security/ips/IpsSuppressedAlerts.vue
+++ b/src/components/standalone/security/ips/IpsSuppressedAlerts.vue
@@ -1,5 +1,5 @@
 <!--
-  Copyright (C) 2025 Nethesis S.r.l.
+  Copyright (C) 2026 Nethesis S.r.l.
   SPDX-License-Identifier: GPL-3.0-or-later
 -->
 
@@ -145,7 +145,7 @@ function handleDeleted() {
     <template v-else-if="suppressedAlerts.length > 0">
       <div class="flex flex-col flex-wrap justify-between gap-4 md:flex-row">
         <NeTextInput v-model.trim="filter" :placeholder="t('common.filter')" is-search />
-        <NeButton kind="secondary" size="lg" @click="suppressingAlert = true">
+        <NeButton kind="primary" size="lg" @click="suppressingAlert = true">
           <template #prefix>
             <FontAwesomeIcon :icon="faCirclePlus" aria-hidden="true" class="h-4 w-4" />
           </template>
diff --git a/src/components/standalone/security/threat_shield/AllowlistTab.vue b/src/components/standalone/security/threat_shield/AllowlistTab.vue
index 31254e569..0cbcacd8a 100644
--- a/src/components/standalone/security/threat_shield/AllowlistTab.vue
+++ b/src/components/standalone/security/threat_shield/AllowlistTab.vue
@@ -1,3 +1,8 @@
+<!--
+  Copyright (C) 2026 Nethesis S.r.l.
+  SPDX-License-Identifier: GPL-3.0-or-later
+-->
+
 <script setup lang="ts">
 import { useI18n } from 'vue-i18n'
 import {
@@ -16,6 +21,8 @@ import CreateOrEditAddressDrawer from './CreateOrEditAddressDrawer.vue'
 import { useNotificationsStore } from '@/stores/notifications'
 import type { BanIpLocalAddress } from '@/views/standalone/security/ThreatShieldView.vue'
 import AddressTable from './AddressTable.vue'
+import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
+import { faCirclePlus, faShield } from '@fortawesome/free-solid-svg-icons'
 
 const { t } = useI18n()
 const uciChangesStore = useUciPendingChangesStore()
@@ -75,13 +82,9 @@ onMounted(() => {
       <p class="max-w-2xl text-sm font-normal text-gray-500 dark:text-gray-400">
         {{ t('standalone.threat_shield.allowlist_description') }}
       </p>
-      <NeButton v-if="allowlist.length > 0" kind="secondary" @click="openCreateEditAddressDrawer()"
-        ><template #prefix>
-          <font-awesome-icon
-            :icon="['fas', 'circle-plus']"
-            class="h-4 w-4"
-            aria-hidden="true"
-          /> </template
+      <NeButton v-if="allowlist.length > 0" kind="primary" @click="openCreateEditAddressDrawer()">
+        <template #prefix>
+          <FontAwesomeIcon :icon="faCirclePlus" class="h-4 w-4" aria-hidden="true" /> </template
         >{{ t('standalone.threat_shield.add_address') }}</NeButton
       >
     </div>
@@ -101,14 +104,10 @@ onMounted(() => {
       <NeEmptyState
         v-if="allowlist.length == 0"
         :title="t('standalone.threat_shield.allowlist_is_empty')"
-        :icon="['fas', 'shield']"
-        ><NeButton kind="secondary" @click="openCreateEditAddressDrawer()"
-          ><template #prefix>
-            <font-awesome-icon
-              :icon="['fas', 'circle-plus']"
-              class="h-4 w-4"
-              aria-hidden="true"
-            /> </template
+        :icon="faShield"
+        ><NeButton kind="primary" @click="openCreateEditAddressDrawer()">
+          <template #prefix>
+            <FontAwesomeIcon :icon="faCirclePlus" class="h-4 w-4" aria-hidden="true" /> </template
           >{{ t('standalone.threat_shield.add_address') }}</NeButton
         ></NeEmptyState
       >
diff --git a/src/components/standalone/security/threat_shield/LocalBlocklistTab.vue b/src/components/standalone/security/threat_shield/LocalBlocklistTab.vue
index f7ec73c16..d04874cae 100644
--- a/src/components/standalone/security/threat_shield/LocalBlocklistTab.vue
+++ b/src/components/standalone/security/threat_shield/LocalBlocklistTab.vue
@@ -1,3 +1,8 @@
+<!--
+  Copyright (C) 2026 Nethesis S.r.l.
+  SPDX-License-Identifier: GPL-3.0-or-later
+-->
+
 <script setup lang="ts">
 import { useI18n } from 'vue-i18n'
 import {
@@ -16,6 +21,8 @@ import CreateOrEditAddressDrawer from './CreateOrEditAddressDrawer.vue'
 import { useNotificationsStore } from '@/stores/notifications'
 import type { BanIpLocalAddress } from '@/views/standalone/security/ThreatShieldView.vue'
 import AddressTable from './AddressTable.vue'
+import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
+import { faCirclePlus, faShield } from '@fortawesome/free-solid-svg-icons'
 
 const { t } = useI18n()
 const uciChangesStore = useUciPendingChangesStore()
@@ -77,14 +84,11 @@ onMounted(() => {
       </p>
       <NeButton
         v-if="localBlocklist.length > 0"
-        kind="secondary"
+        kind="primary"
         @click="openCreateEditAddressDrawer()"
-        ><template #prefix>
-          <font-awesome-icon
-            :icon="['fas', 'circle-plus']"
-            class="h-4 w-4"
-            aria-hidden="true"
-          /> </template
+      >
+        <template #prefix>
+          <FontAwesomeIcon :icon="faCirclePlus" class="h-4 w-4" aria-hidden="true" /> </template
         >{{ t('standalone.threat_shield.add_address') }}</NeButton
       >
     </div>
@@ -104,17 +108,13 @@ onMounted(() => {
       <NeEmptyState
         v-if="localBlocklist.length == 0"
         :title="t('standalone.threat_shield.local_blocklist_is_empty')"
-        :icon="['fas', 'shield']"
-        ><NeButton kind="secondary" @click="openCreateEditAddressDrawer()"
+        :icon="faShield"
+        ><NeButton kind="primary" @click="openCreateEditAddressDrawer()"
           ><template #prefix>
-            <font-awesome-icon
-              :icon="['fas', 'circle-plus']"
-              class="h-4 w-4"
-              aria-hidden="true"
-            /> </template
-          >{{ t('standalone.threat_shield.add_address') }}</NeButton
-        ></NeEmptyState
-      >
+            <FontAwesomeIcon :icon="faCirclePlus" class="h-4 w-4" aria-hidden="true" /> </template
+          >{{ t('standalone.threat_shield.add_address') }}
+        </NeButton>
+      </NeEmptyState>
       <AddressTable
         v-else
         :address-list="localBlocklist"
diff --git a/src/components/standalone/security/threat_shield/SearchBannedIp.vue b/src/components/standalone/security/threat_shield/SearchBannedIp.vue
index 4de77f856..0e08898d6 100644
--- a/src/components/standalone/security/threat_shield/SearchBannedIp.vue
+++ b/src/components/standalone/security/threat_shield/SearchBannedIp.vue
@@ -1,5 +1,5 @@
 <!--
-  Copyright (C) 2025 Nethesis S.r.l.
+  Copyright (C) 2026 Nethesis S.r.l.
   SPDX-License-Identifier: GPL-3.0-or-later
 -->
 
@@ -100,7 +100,7 @@ function allowIp() {
 </script>
 
 <template>
-  <NeButton v-bind="$attrs" @click="drawerOpen = true">
+  <NeButton v-bind="$attrs" kind="primary" @click="drawerOpen = true">
     <template #prefix>
       <FontAwesomeIcon :icon="faSearch" aria-hidden="true" class="h-4 w-4" />
     </template>
diff --git a/src/components/standalone/security/threat_shield_dns/FilterBypassPanel.vue b/src/components/standalone/security/threat_shield_dns/FilterBypassPanel.vue
index 223675fd8..a526b8342 100644
--- a/src/components/standalone/security/threat_shield_dns/FilterBypassPanel.vue
+++ b/src/components/standalone/security/threat_shield_dns/FilterBypassPanel.vue
@@ -1,5 +1,5 @@
 <!--
-  Copyright (C) 2025 Nethesis S.r.l.
+  Copyright (C) 2026 Nethesis S.r.l.
   SPDX-License-Identifier: GPL-3.0-or-later
 -->
 
@@ -15,11 +15,12 @@ import {
 } from '@nethesis/vue-components'
 import { computed, onMounted, ref } from 'vue'
 import DeleteModal from '@/components/DeleteModal.vue'
-import { faCheck, faShield, faCirclePlus } from '@fortawesome/free-solid-svg-icons'
+import { faCheck, faShield, faCirclePlus, faCircleInfo } from '@fortawesome/free-solid-svg-icons'
 import BypassCard from './BypassCard.vue'
 import CreateBypassDrawer from './CreateBypassDrawer.vue'
 import { useThreatShieldStore } from '@/stores/standalone/threatShield'
 import TsDisabledEmptyState from './TsDisabledEmptyState.vue'
+import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
 
 const { t } = useI18n()
 const tsStore = useThreatShieldStore()
@@ -109,9 +110,9 @@ function clearFilter() {
               :disabled="tsStore.loadingListDnsBypass || tsStore.loadingListDnsSettings"
               class="max-w-xs sm:max-w-sm"
             />
-            <NeButton kind="secondary" size="lg" @click="showCreateBypassDrawer">
+            <NeButton kind="primary" size="lg" @click="showCreateBypassDrawer">
               <template #prefix>
-                <font-awesome-icon :icon="faCirclePlus" class="h-4 w-4" aria-hidden="true" />
+                <FontAwesomeIcon :icon="faCirclePlus" class="h-4 w-4" aria-hidden="true" />
               </template>
               {{ t('standalone.threat_shield_dns.add_bypass') }}
             </NeButton>
@@ -125,7 +126,7 @@ function clearFilter() {
           >
             <NeButton kind="primary" size="lg" @click="showCreateBypassDrawer">
               <template #prefix>
-                <font-awesome-icon :icon="faCirclePlus" class="h-4 w-4" aria-hidden="true" />
+                <FontAwesomeIcon :icon="faCirclePlus" class="h-4 w-4" aria-hidden="true" />
               </template>
               {{ t('standalone.threat_shield_dns.add_bypass') }}
             </NeButton>
@@ -135,7 +136,7 @@ function clearFilter() {
             v-else-if="!filteredBypasses.length && !tsStore.loadingListDnsBypass"
             :title="t('standalone.threat_shield_dns.no_filter_bypasses_found')"
             :description="t('common.try_changing_search_filters')"
-            :icon="['fas', 'circle-info']"
+            :icon="faCircleInfo"
             class="mt-4"
           >
             <NeButton kind="tertiary" @click="clearFilter">
diff --git a/src/components/standalone/security/threat_shield_dns/LocalAllowlistPanel.vue b/src/components/standalone/security/threat_shield_dns/LocalAllowlistPanel.vue
index 819c02665..16111ad75 100644
--- a/src/components/standalone/security/threat_shield_dns/LocalAllowlistPanel.vue
+++ b/src/components/standalone/security/threat_shield_dns/LocalAllowlistPanel.vue
@@ -1,5 +1,5 @@
 <!--
-  Copyright (C) 2025 Nethesis S.r.l.
+  Copyright (C) 2026 Nethesis S.r.l.
   SPDX-License-Identifier: GPL-3.0-or-later
 -->
 
@@ -19,6 +19,7 @@ import { useThreatShieldStore, type DnsAllowedDomain } from '@/stores/standalone
 import TsDisabledEmptyState from './TsDisabledEmptyState.vue'
 import CreateOrEditAllowedDomainDrawer from './CreateOrEditAllowedDomainDrawer.vue'
 import AllowedDomainsTable from './AllowedDomainsTable.vue'
+import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
 
 const { t } = useI18n()
 const tsStore = useThreatShieldStore()
@@ -113,9 +114,9 @@ function clearFilter() {
               "
               class="max-w-xs sm:max-w-sm"
             />
-            <NeButton kind="secondary" size="lg" @click="showCreateOrEditAllowedDomainDrawer">
+            <NeButton kind="primary" size="lg" @click="showCreateOrEditAllowedDomainDrawer">
               <template #prefix>
-                <font-awesome-icon :icon="faCirclePlus" class="h-4 w-4" aria-hidden="true" />
+                <FontAwesomeIcon :icon="faCirclePlus" class="h-4 w-4" aria-hidden="true" />
               </template>
               {{ t('standalone.threat_shield_dns.add_domain') }}
             </NeButton>
@@ -129,7 +130,7 @@ function clearFilter() {
           >
             <NeButton kind="primary" size="lg" @click="showCreateOrEditAllowedDomainDrawer">
               <template #prefix>
-                <font-awesome-icon :icon="faCirclePlus" class="h-4 w-4" aria-hidden="true" />
+                <FontAwesomeIcon :icon="faCirclePlus" class="h-4 w-4" aria-hidden="true" />
               </template>
               {{ t('standalone.threat_shield_dns.add_domain') }}
             </NeButton>
diff --git a/src/components/standalone/security/threat_shield_dns/LocalBlocklistPanel.vue b/src/components/standalone/security/threat_shield_dns/LocalBlocklistPanel.vue
index a10302e69..f56a6047e 100644
--- a/src/components/standalone/security/threat_shield_dns/LocalBlocklistPanel.vue
+++ b/src/components/standalone/security/threat_shield_dns/LocalBlocklistPanel.vue
@@ -1,5 +1,5 @@
 <!--
-  Copyright (C) 2025 Nethesis S.r.l.
+  Copyright (C) 2026 Nethesis S.r.l.
   SPDX-License-Identifier: GPL-3.0-or-later
 -->
 
@@ -19,6 +19,7 @@ import { useThreatShieldStore, type DnsBlockedDomain } from '@/stores/standalone
 import TsDisabledEmptyState from './TsDisabledEmptyState.vue'
 import CreateOrEditBlockedDomainDrawer from './CreateOrEditBlockedDomainDrawer.vue'
 import BlockedDomainsTable from './BlockedDomainsTable.vue'
+import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
 
 const { t } = useI18n()
 const tsStore = useThreatShieldStore()
@@ -113,9 +114,9 @@ function clearFilter() {
               "
               class="max-w-xs sm:max-w-sm"
             />
-            <NeButton kind="secondary" size="lg" @click="showCreateOrEditBlockedDomainDrawer">
+            <NeButton kind="primary" size="lg" @click="showCreateOrEditBlockedDomainDrawer">
               <template #prefix>
-                <font-awesome-icon :icon="faCirclePlus" class="h-4 w-4" aria-hidden="true" />
+                <FontAwesomeIcon :icon="faCirclePlus" class="h-4 w-4" aria-hidden="true" />
               </template>
               {{ t('standalone.threat_shield_dns.add_domain') }}
             </NeButton>
@@ -129,7 +130,7 @@ function clearFilter() {
           >
             <NeButton kind="primary" size="lg" @click="showCreateOrEditBlockedDomainDrawer">
               <template #prefix>
-                <font-awesome-icon :icon="faCirclePlus" class="h-4 w-4" aria-hidden="true" />
+                <FontAwesomeIcon :icon="faCirclePlus" class="h-4 w-4" aria-hidden="true" />
               </template>
               {{ t('standalone.threat_shield_dns.add_domain') }}
             </NeButton>
diff --git a/src/components/standalone/ssh/SshConfig.vue b/src/components/standalone/ssh/SshConfig.vue
index ede241307..716adf4a6 100644
--- a/src/components/standalone/ssh/SshConfig.vue
+++ b/src/components/standalone/ssh/SshConfig.vue
@@ -1,5 +1,5 @@
 <!--
-  Copyright (C) 2024 Nethesis S.r.l.
+  Copyright (C) 2026 Nethesis S.r.l.
   SPDX-License-Identifier: GPL-3.0-or-later
 -->
 
@@ -21,6 +21,7 @@ import { getUciConfig, ubusCall } from '@/lib/standalone/ubus'
 import { AxiosError } from 'axios'
 import { useUciPendingChangesStore } from '@/stores/standalone/uciPendingChanges'
 import { MessageBag, ValidationError } from '@/lib/validation'
+import { faFloppyDisk } from '@fortawesome/free-solid-svg-icons'
 
 const { t } = useI18n()
 const uciChangesStore = useUciPendingChangesStore()
@@ -155,7 +156,7 @@ function load() {
       </div>
     </form>
     <!-- Save Button -->
-    <div class="flex justify-end">
+    <div class="flex justify-start">
       <NeButton
         :disabled="submitting"
         :loading="submitting"
@@ -164,7 +165,7 @@ function load() {
         @click.prevent="submit()"
       >
         <template #prefix>
-          <FontAwesomeIcon :icon="['fas', 'floppy-disk']" aria-hidden="true" />
+          <FontAwesomeIcon :icon="faFloppyDisk" aria-hidden="true" />
         </template>
         {{ t('common.save') }}
       </NeButton>
diff --git a/src/components/standalone/system_settings/GeneralSettings.vue b/src/components/standalone/system_settings/GeneralSettings.vue
index 972c6baa6..232154223 100644
--- a/src/components/standalone/system_settings/GeneralSettings.vue
+++ b/src/components/standalone/system_settings/GeneralSettings.vue
@@ -1,5 +1,5 @@
 <!--
-  Copyright (C) 2024 Nethesis S.r.l.
+  Copyright (C) 2026 Nethesis S.r.l.
   SPDX-License-Identifier: GPL-3.0-or-later
 -->
 
@@ -7,6 +7,8 @@
 import { getUciConfig, ubusCall } from '@/lib/standalone/ubus'
 import { validateHostname, validateRequired } from '@/lib/validation'
 import { useUciPendingChangesStore } from '@/stores/standalone/uciPendingChanges'
+import { faFloppyDisk } from '@fortawesome/free-solid-svg-icons'
+import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
 import {
   NeCombobox,
   NeButton,
@@ -318,7 +320,7 @@ async function syncWithNtpServer() {
         </div>
       </div>
       <!-- save button -->
-      <div class="flex justify-end py-6">
+      <div class="flex justify-start py-6">
         <NeButton
           kind="primary"
           size="lg"
@@ -327,7 +329,7 @@ async function syncWithNtpServer() {
           @click="save"
         >
           <template #prefix>
-            <font-awesome-icon :icon="['fas', 'floppy-disk']" class="h-4 w-4" aria-hidden="true" />
+            <FontAwesomeIcon :icon="faFloppyDisk" class="h-4 w-4" aria-hidden="true" />
           </template>
           {{ t('common.save') }}
         </NeButton>
diff --git a/src/components/standalone/system_settings/TimeSynchronization.vue b/src/components/standalone/system_settings/TimeSynchronization.vue
index ff812ae2d..10868182c 100644
--- a/src/components/standalone/system_settings/TimeSynchronization.vue
+++ b/src/components/standalone/system_settings/TimeSynchronization.vue
@@ -1,5 +1,5 @@
 <!--
-  Copyright (C) 2024 Nethesis S.r.l.
+  Copyright (C) 2026 Nethesis S.r.l.
   SPDX-License-Identifier: GPL-3.0-or-later
 -->
 
@@ -22,6 +22,8 @@ import { computed, onMounted, ref, type Ref, watch } from 'vue'
 import { useI18n } from 'vue-i18n'
 import FormLayout from '@/components/standalone/FormLayout.vue'
 import NeMultiTextInput from '../NeMultiTextInput.vue'
+import { faFloppyDisk } from '@fortawesome/free-solid-svg-icons'
+import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
 
 const { t } = useI18n()
 const uciChangesStore = useUciPendingChangesStore()
@@ -331,7 +333,8 @@ function resetNtpServerErrors() {
         </div>
       </Transition>
       <!-- save button -->
-      <div class="flex justify-end py-6">
+      <hr class="my-8" />
+      <FormLayout>
         <NeButton
           kind="primary"
           size="lg"
@@ -340,11 +343,11 @@ function resetNtpServerErrors() {
           @click="save"
         >
           <template #prefix>
-            <font-awesome-icon :icon="['fas', 'floppy-disk']" class="h-4 w-4" aria-hidden="true" />
+            <FontAwesomeIcon :icon="faFloppyDisk" class="h-4 w-4" aria-hidden="true" />
           </template>
           {{ t('common.save') }}
         </NeButton>
-      </div>
+      </FormLayout>
     </div>
   </div>
 </template>
diff --git a/src/components/standalone/users_database/UsersDatabaseManager.vue b/src/components/standalone/users_database/UsersDatabaseManager.vue
index fdf210529..075abe484 100644
--- a/src/components/standalone/users_database/UsersDatabaseManager.vue
+++ b/src/components/standalone/users_database/UsersDatabaseManager.vue
@@ -1,5 +1,5 @@
 <!--
-  Copyright (C) 2024 Nethesis S.r.l.
+  Copyright (C) 2026 Nethesis S.r.l.
   SPDX-License-Identifier: GPL-3.0-or-later
 -->
 
@@ -26,7 +26,13 @@ import CreateOrEditUserDrawer from './CreateOrEditUserDrawer.vue'
 import { useUciPendingChangesStore } from '@/stores/standalone/uciPendingChanges'
 import { CanceledError } from 'axios'
 import { onUnmounted } from 'vue'
-import { faDatabase, faTrash } from '@fortawesome/free-solid-svg-icons'
+import {
+  faCirclePlus,
+  faDatabase,
+  faPenToSquare,
+  faTrash,
+  faUserGroup
+} from '@fortawesome/free-solid-svg-icons'
 import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
 
 export type User = {
@@ -181,11 +187,7 @@ onMounted(() => {
           @click="showEditDatabaseDrawer = true"
         >
           <template #prefix>
-            <font-awesome-icon
-              :icon="['fas', 'pen-to-square']"
-              class="h-4 w-4"
-              aria-hidden="true"
-            />
+            <FontAwesomeIcon :icon="faPenToSquare" class="h-4 w-4" aria-hidden="true" />
           </template>
           {{ t('common.edit') }}
         </NeButton>
@@ -216,16 +218,13 @@ onMounted(() => {
       </div>
       <NeButton
         v-if="database.type === 'local' && users.length > 0"
-        kind="secondary"
+        kind="primary"
         @click="openCreateEditUserDrawer()"
         ><template #prefix>
-          <font-awesome-icon
-            :icon="['fas', 'circle-plus']"
-            class="h-4 w-4"
-            aria-hidden="true"
-          /> </template
-        >{{ t('standalone.users_database.add_user') }}</NeButton
-      >
+          <FontAwesomeIcon :icon="faCirclePlus" class="h-4 w-4" aria-hidden="true" />
+        </template>
+        {{ t('standalone.users_database.add_user') }}
+      </NeButton>
     </div>
     <NeInlineNotification
       v-if="error.notificationDescription"
@@ -243,21 +242,18 @@ onMounted(() => {
       <NeEmptyState
         v-if="users.length == 0"
         :title="t('standalone.users_database.no_users_found')"
-        :icon="['fas', 'user-group']"
+        :icon="faUserGroup"
         :class="[database.type == 'local' ? '' : 'pb-3']"
         ><NeButton
           v-if="database.type === 'local'"
-          kind="secondary"
+          kind="primary"
           @click="openCreateEditUserDrawer()"
           ><template #prefix>
-            <font-awesome-icon
-              :icon="['fas', 'circle-plus']"
-              class="h-4 w-4"
-              aria-hidden="true"
-            /> </template
-          >{{ t('standalone.users_database.add_user') }}</NeButton
-        ></NeEmptyState
-      >
+            <FontAwesomeIcon :icon="faCirclePlus" class="h-4 w-4" aria-hidden="true" />
+          </template>
+          {{ t('standalone.users_database.add_user') }}
+        </NeButton>
+      </NeEmptyState>
       <UsersTable
         v-else
         :is-ldap-database="database.type === 'ldap'"
diff --git a/src/components/standalone/users_database/UsersTable.vue b/src/components/standalone/users_database/UsersTable.vue
index 1451bf606..d62c81713 100644
--- a/src/components/standalone/users_database/UsersTable.vue
+++ b/src/components/standalone/users_database/UsersTable.vue
@@ -1,5 +1,5 @@
 <!--
-  Copyright (C) 2024 Nethesis S.r.l.
+  Copyright (C) 2026 Nethesis S.r.l.
   SPDX-License-Identifier: GPL-3.0-or-later
 -->
 
@@ -19,8 +19,16 @@ import {
   NeTooltip
 } from '@nethesis/vue-components'
 import type { User } from './UsersDatabaseManager.vue'
-import { faCircleMinus, faCrown, faTrash } from '@fortawesome/free-solid-svg-icons'
+import {
+  faCircleCheck,
+  faCircleMinus,
+  faCircleXmark,
+  faCrown,
+  faPenToSquare,
+  faTrash
+} from '@fortawesome/free-solid-svg-icons'
 import { ref } from 'vue'
+import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
 
 const props = defineProps<{
   users: User[]
@@ -113,9 +121,16 @@ function getDropdownItems(item: User) {
         <template v-if="!props.isLdapDatabase">
           <NeTableCell :data-label="t('standalone.users_database.password')">
             <div :class="['flex', 'flex-row', 'items-center']">
-              <font-awesome-icon
-                :icon="['fas', item.password ? 'circle-check' : 'circle-xmark']"
-                class="mr-2 h-5 w-5"
+              <FontAwesomeIcon
+                :icon="item.password ? faCircleCheck : faCircleXmark"
+                :class="[
+                  'mr-2',
+                  'h-5',
+                  'w-5',
+                  item.password
+                    ? 'text-green-700 dark:text-green-500'
+                    : 'text-red-700 dark:text-red-500'
+                ]"
                 aria-hidden="true"
               />
               <p>
@@ -131,11 +146,7 @@ function getDropdownItems(item: User) {
             <div class="align-center -ml-2.5 flex gap-2 xl:ml-0 xl:justify-end">
               <NeButton kind="tertiary" @click="emit('edit', item)">
                 <template #prefix>
-                  <font-awesome-icon
-                    :icon="['fas', 'pen-to-square']"
-                    class="h-4 w-4"
-                    aria-hidden="true"
-                  />
+                  <FontAwesomeIcon :icon="faPenToSquare" class="h-4 w-4" aria-hidden="true" />
                 </template>
                 {{ t('common.edit') }}
               </NeButton>
diff --git a/src/components/standalone/users_objects/DomainSets.vue b/src/components/standalone/users_objects/DomainSets.vue
index 54c2eaf81..bd3ff758f 100644
--- a/src/components/standalone/users_objects/DomainSets.vue
+++ b/src/components/standalone/users_objects/DomainSets.vue
@@ -1,5 +1,5 @@
 <!--
-  Copyright (C) 2024 Nethesis S.r.l.
+  Copyright (C) 2026 Nethesis S.r.l.
   SPDX-License-Identifier: GPL-3.0-or-later
 -->
 
@@ -24,6 +24,8 @@ import ObjectUsagesModal from './ObjectUsagesModal.vue'
 import { useDomainSets, type DomainSet } from '@/composables/useDomainSets'
 import { useObjectStore } from '@/stores/standalone/objects'
 import type { IpVersionFilter } from '@/views/standalone/users_objects/ObjectsView.vue'
+import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
+import { faCircleInfo, faCirclePlus } from '@fortawesome/free-solid-svg-icons'
 
 const { t } = useI18n()
 const uciChangesStore = useUciPendingChangesStore()
@@ -126,14 +128,14 @@ function clearFilters() {
       </div>
       <NeButton
         v-if="loadingListDomainSets || domainSets.length"
-        kind="secondary"
+        kind="primary"
         size="lg"
         :disabled="loadingListDomainSets"
         class="shrink-0"
         @click="showCreateDomainSetDrawer"
       >
         <template #prefix>
-          <FontAwesomeIcon :icon="['fas', 'circle-plus']" aria-hidden="true" />
+          <FontAwesomeIcon :icon="faCirclePlus" aria-hidden="true" />
         </template>
         {{ t('standalone.objects.add_domain_set') }}
       </NeButton>
@@ -179,18 +181,18 @@ function clearFilters() {
       <NeEmptyState
         v-if="!domainSets.length && !loadingListDomainSets"
         :title="t('standalone.objects.no_domain_sets')"
-        :icon="['fas', 'circle-info']"
+        :icon="faCircleInfo"
         class="mt-4"
       >
         <NeButton
-          kind="secondary"
+          kind="primary"
           size="lg"
           class="shrink-0"
           :disabled="loadingListDomainSets"
           @click="showCreateDomainSetDrawer"
         >
           <template #prefix>
-            <FontAwesomeIcon :icon="['fas', 'circle-plus']" aria-hidden="true" />
+            <FontAwesomeIcon :icon="faCirclePlus" aria-hidden="true" />
           </template>
           {{ t('standalone.objects.add_domain_set') }}
         </NeButton>
@@ -200,7 +202,7 @@ function clearFilters() {
         v-else-if="!filteredDomainSets.length && !loadingListDomainSets"
         :title="t('standalone.objects.no_domain_sets_found')"
         :description="t('common.try_changing_search_filters')"
-        :icon="['fas', 'circle-info']"
+        :icon="faCircleInfo"
         class="mt-4"
       >
         <NeButton kind="tertiary" @click="clearFilters">
diff --git a/src/components/standalone/users_objects/HostSets.vue b/src/components/standalone/users_objects/HostSets.vue
index 0bd80c08a..e1515c988 100644
--- a/src/components/standalone/users_objects/HostSets.vue
+++ b/src/components/standalone/users_objects/HostSets.vue
@@ -1,5 +1,5 @@
 <!--
-  Copyright (C) 2024 Nethesis S.r.l.
+  Copyright (C) 2026 Nethesis S.r.l.
   SPDX-License-Identifier: GPL-3.0-or-later
 -->
 
@@ -24,6 +24,8 @@ import CannotDeleteObjectModal from './CannotDeleteObjectModal.vue'
 import { useHostSets, type HostSet } from '@/composables/useHostSets'
 import { useObjectStore } from '@/stores/standalone/objects'
 import type { IpVersionFilter } from '@/views/standalone/users_objects/ObjectsView.vue'
+import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
+import { faCircleInfo, faCirclePlus } from '@fortawesome/free-solid-svg-icons'
 
 type ObjectTypeFilter =
   | 'host'
@@ -176,14 +178,14 @@ function clearFilters() {
       </div>
       <NeButton
         v-if="loadingListHostSets || hostSets.length"
-        kind="secondary"
+        kind="primary"
         size="lg"
         class="shrink-0"
         :disabled="loadingListHostSets"
         @click="showCreateHostSetDrawer"
       >
         <template #prefix>
-          <FontAwesomeIcon :icon="['fas', 'circle-plus']" aria-hidden="true" />
+          <FontAwesomeIcon :icon="faCirclePlus" aria-hidden="true" />
         </template>
         {{ t('standalone.objects.add_host_set') }}
       </NeButton>
@@ -240,7 +242,7 @@ function clearFilters() {
       <NeEmptyState
         v-if="!hostSets.length && !loadingListHostSets"
         :title="t('standalone.objects.no_host_sets')"
-        :icon="['fas', 'circle-info']"
+        :icon="faCircleInfo"
         class="mt-4"
       >
         <NeButton
@@ -251,7 +253,7 @@ function clearFilters() {
           @click="showCreateHostSetDrawer"
         >
           <template #prefix>
-            <FontAwesomeIcon :icon="['fas', 'circle-plus']" aria-hidden="true" />
+            <FontAwesomeIcon :icon="faCirclePlus" aria-hidden="true" />
           </template>
           {{ t('standalone.objects.add_host_set') }}
         </NeButton>
@@ -261,7 +263,7 @@ function clearFilters() {
         v-else-if="!filteredHostSets.length && !loadingListHostSets"
         :title="t('standalone.objects.no_hosts_found')"
         :description="t('common.try_changing_search_filters')"
-        :icon="['fas', 'circle-info']"
+        :icon="faCircleInfo"
         class="mt-4"
       >
         <NeButton kind="tertiary" @click="clearFilters"> {{ t('common.clear_filters') }}</NeButton>
diff --git a/src/components/standalone/wireguard/PeerTableRow.vue b/src/components/standalone/wireguard/PeerTableRow.vue
index 7102cb1b7..e437566c0 100644
--- a/src/components/standalone/wireguard/PeerTableRow.vue
+++ b/src/components/standalone/wireguard/PeerTableRow.vue
@@ -1,3 +1,8 @@
+<!--
+  Copyright (C) 2026 Nethesis S.r.l.
+  SPDX-License-Identifier: GPL-3.0-or-later
+-->
+
 <script lang="ts" setup>
 import type { Peer } from '@/views/standalone/vpn/WireguardTunnelView.vue'
 import {
@@ -110,11 +115,14 @@ const peerActions: NeDropdownItem[] = [
     <NeTableCell :data-label="t('standalone.wireguard_tunnel.status')">
       <div class="flex items-center gap-1">
         <template v-if="peer.enabled">
-          <FontAwesomeIcon :icon="faCircleCheck" class="size-4 text-enabled" />
+          <FontAwesomeIcon
+            :icon="faCircleCheck"
+            class="size-4 text-green-700 dark:text-green-500"
+          />
           {{ t('common.enabled') }}
         </template>
         <template v-else>
-          <FontAwesomeIcon :icon="faCircleXmark" class="size-4 text-disabled" />
+          <FontAwesomeIcon :icon="faCircleXmark" class="size-4 text-red-700 dark:text-red-500" />
           {{ t('common.disabled') }}
         </template>
       </div>
@@ -122,11 +130,14 @@ const peerActions: NeDropdownItem[] = [
     <NeTableCell :data-label="t('standalone.wireguard_tunnel.connection')">
       <div class="flex items-center gap-2">
         <template v-if="peer.active">
-          <FontAwesomeIcon :icon="faCircleCheck" class="size-4 text-enabled" />
+          <FontAwesomeIcon
+            :icon="faCircleCheck"
+            class="size-4 text-green-700 dark:text-green-500"
+          />
           {{ t('common.connected') }}
         </template>
         <template v-else>
-          <FontAwesomeIcon :icon="faCircleXmark" class="size-4 text-disabled" />
+          <FontAwesomeIcon :icon="faCircleXmark" class="size-4 text-red-700 dark:text-red-500" />
           {{ t('common.not_connected') }}
         </template>
         <template v-if="peer.latest_handshake != undefined">
diff --git a/src/components/standalone/wireguard/WireguardPeerTunnelList.vue b/src/components/standalone/wireguard/WireguardPeerTunnelList.vue
index 237ea3750..4f4eabd8e 100644
--- a/src/components/standalone/wireguard/WireguardPeerTunnelList.vue
+++ b/src/components/standalone/wireguard/WireguardPeerTunnelList.vue
@@ -1,3 +1,8 @@
+<!--
+  Copyright (C) 2026 Nethesis S.r.l.
+  SPDX-License-Identifier: GPL-3.0-or-later
+-->
+
 <script lang="ts" setup>
 import { computed, ref } from 'vue'
 import {
@@ -231,11 +236,17 @@ useIntervalFn(
           <NeTableCell :data-label="t('standalone.wireguard_peers.status')">
             <div class="flex items-center gap-2">
               <template v-if="instance.enabled">
-                <FontAwesomeIcon :icon="faCircleCheck" class="size-4 text-enabled" />
+                <FontAwesomeIcon
+                  :icon="faCircleCheck"
+                  class="size-4 text-green-700 dark:text-green-500"
+                />
                 {{ t('common.enabled') }}
               </template>
               <template v-else>
-                <FontAwesomeIcon :icon="faCircleXmark" class="size-4 text-disabled" />
+                <FontAwesomeIcon
+                  :icon="faCircleXmark"
+                  class="size-4 text-red-700 dark:text-red-500"
+                />
                 {{ t('common.disabled') }}
               </template>
             </div>
@@ -243,11 +254,17 @@ useIntervalFn(
           <NeTableCell :data-label="t('standalone.wireguard_peers.connection')">
             <div class="flex items-center gap-2">
               <template v-if="instance.active">
-                <FontAwesomeIcon :icon="faCircleCheck" class="size-4 text-enabled" />
+                <FontAwesomeIcon
+                  :icon="faCircleCheck"
+                  class="size-4 text-green-700 dark:text-green-500"
+                />
                 {{ t('common.connected') }}
               </template>
               <template v-else>
-                <FontAwesomeIcon :icon="faCircleXmark" class="size-4 text-disabled" />
+                <FontAwesomeIcon
+                  :icon="faCircleXmark"
+                  class="size-4 text-red-700 dark:text-red-500"
+                />
                 {{ t('common.not_connected') }}
               </template>
               <template v-if="instance.latest_handshake != undefined">
diff --git a/src/components/standalone/wireguard/WireguardTunnelDetailCard.vue b/src/components/standalone/wireguard/WireguardTunnelDetailCard.vue
index 5a4761e5c..7c42f1450 100644
--- a/src/components/standalone/wireguard/WireguardTunnelDetailCard.vue
+++ b/src/components/standalone/wireguard/WireguardTunnelDetailCard.vue
@@ -1,3 +1,8 @@
+<!--
+  Copyright (C) 2026 Nethesis S.r.l.
+  SPDX-License-Identifier: GPL-3.0-or-later
+-->
+
 <script lang="ts" setup>
 import {
   NeBadgeV2,
@@ -94,7 +99,7 @@ function openPeerDrawer() {
   <NeCard>
     <div class="space-y-6">
       <div class="flex flex-wrap gap-8">
-        <div class="mr-auto space-y-2">
+        <div class="mr-auto space-y-4">
           <div class="flex items-center gap-8">
             <NeHeading tag="h4">{{ instance.name }}</NeHeading>
             <NeBadgeV2 v-if="instance.enabled" kind="green" size="xs">
@@ -132,7 +137,12 @@ function openPeerDrawer() {
           </div>
         </div>
         <div class="flex items-start gap-2">
-          <NeButton v-if="instance.peers.length > 0" kind="secondary" @click="openPeerDrawer">
+          <NeButton
+            v-if="instance.peers.length > 0"
+            kind="primary"
+            size="lg"
+            @click="openPeerDrawer"
+          >
             <template #prefix>
               <FontAwesomeIcon :icon="faCirclePlus" aria-hidden="true" class="h-4 w-4" />
             </template>
diff --git a/src/views/standalone/monitoring/PingLatencyMonitorView.vue b/src/views/standalone/monitoring/PingLatencyMonitorView.vue
index 0f42325d7..272e922d9 100644
--- a/src/views/standalone/monitoring/PingLatencyMonitorView.vue
+++ b/src/views/standalone/monitoring/PingLatencyMonitorView.vue
@@ -1,5 +1,5 @@
 <!--
-  Copyright (C) 2024 Nethesis S.r.l.
+  Copyright (C) 2026 Nethesis S.r.l.
   SPDX-License-Identifier: GPL-3.0-or-later
 -->
 
@@ -106,7 +106,7 @@ const {
           :description="t(getAxiosErrorMessage(mutateError))"
         />
         <hr />
-        <div class="flex justify-end">
+        <div class="flex justify-start">
           <NeButton :disabled="isSaving" kind="primary" :loading="isSaving" type="submit">
             <template #prefix>
               <FontAwesomeIcon :icon="faFloppyDisk" class="h-4 w-4" aria-hidden="true" />
diff --git a/src/views/standalone/network/InterfacesAndDevicesView.vue b/src/views/standalone/network/InterfacesAndDevicesView.vue
index a278d5bf4..efa9156a6 100644
--- a/src/views/standalone/network/InterfacesAndDevicesView.vue
+++ b/src/views/standalone/network/InterfacesAndDevicesView.vue
@@ -1,5 +1,5 @@
 <!--
-  Copyright (C) 2024 Nethesis S.r.l.
+  Copyright (C) 2026 Nethesis S.r.l.
   SPDX-License-Identifier: GPL-3.0-or-later
 -->
 
@@ -60,7 +60,14 @@ import { zonesSorting } from '@/stores/standalone/firewall'
 import DeleteBondModal from '@/components/standalone/interfaces_and_devices/DeleteBondModal.vue'
 import DeviceButtons from '@/components/standalone/interfaces_and_devices/DeviceButtons.vue'
 import type { UciNetworkConfig } from '@/composables/useUciNetworkConfig'
-import { faTrash } from '@fortawesome/free-solid-svg-icons'
+import {
+  faCircleCheck,
+  faTrash,
+  faPenToSquare,
+  faCirclePlus,
+  faChevronUp,
+  faChevronDown
+} from '@fortawesome/free-solid-svg-icons'
 
 const LIST_DEVICES_INTERVAL_TIME = 10000
 const { t, te } = useI18n()
@@ -582,13 +589,13 @@ function formatPackets(packets: number) {
       <div class="flex justify-end gap-4">
         <NeButton kind="tertiary" size="lg" @click="showCreateVlanDeviceDrawer">
           <template #prefix>
-            <font-awesome-icon :icon="['fas', 'plus']" class="h-4 w-4" aria-hidden="true" />
+            <FontAwesomeIcon :icon="faCirclePlus" class="h-4 w-4" aria-hidden="true" />
           </template>
           {{ t('standalone.interfaces_and_devices.create_vlan_device') }}
         </NeButton>
-        <NeButton size="lg" @click="showCreateLogicalInterfaceDrawer">
+        <NeButton kind="primary" size="lg" @click="showCreateLogicalInterfaceDrawer">
           <template #prefix>
-            <font-awesome-icon :icon="['fas', 'plus']" class="h-4 w-4" aria-hidden="true" />
+            <FontAwesomeIcon :icon="faCirclePlus" class="h-4 w-4" aria-hidden="true" />
           </template>
           {{ t('standalone.interfaces_and_devices.create_logical_interface') }}
         </NeButton>
@@ -652,7 +659,7 @@ function formatPackets(packets: number) {
                               device
                             )}`"
                           >
-                            <font-awesome-icon
+                            <FontAwesomeIcon
                               :icon="['fas', getInterfaceIconName(device)]"
                               aria-hidden="true"
                               :class="`h-5 w-5 ${getIconForegroundStyle(device)}`"
@@ -692,13 +699,12 @@ function formatPackets(packets: number) {
                               @click="toggleExpandAlias(device)"
                             >
                               <template #suffix>
-                                <font-awesome-icon
-                                  :icon="[
-                                    'fas',
+                                <FontAwesomeIcon
+                                  :icon="
                                     isExpandedAlias[getName(device) || '']
-                                      ? 'chevron-up'
-                                      : 'chevron-down'
-                                  ]"
+                                      ? faChevronUp
+                                      : faChevronDown
+                                  "
                                   class="h-3 w-3"
                                   aria-hidden="true"
                                 />
@@ -719,13 +725,12 @@ function formatPackets(packets: number) {
                               @click="toggleExpandBridge(device)"
                             >
                               <template #suffix>
-                                <font-awesome-icon
-                                  :icon="[
-                                    'fas',
+                                <FontAwesomeIcon
+                                  :icon="
                                     isExpandedBridge[device.name || '']
-                                      ? 'chevron-up'
-                                      : 'chevron-down'
-                                  ]"
+                                      ? faChevronUp
+                                      : faChevronDown
+                                  "
                                   class="h-3 w-3"
                                   aria-hidden="true"
                                 />
@@ -742,13 +747,12 @@ function formatPackets(packets: number) {
                               @click="toggleExpandBond(device)"
                             >
                               <template #suffix>
-                                <font-awesome-icon
-                                  :icon="[
-                                    'fas',
+                                <FontAwesomeIcon
+                                  :icon="
                                     isExpandedBond[getName(device) || '']
-                                      ? 'chevron-up'
-                                      : 'chevron-down'
-                                  ]"
+                                      ? faChevronUp
+                                      : faChevronDown
+                                  "
                                   class="h-3 w-3"
                                   aria-hidden="true"
                                 />
@@ -914,9 +918,9 @@ function formatPackets(packets: number) {
                             v-if="isDeviceUp(device, allDevices)"
                             class="mb-2 flex items-center gap-2"
                           >
-                            <font-awesome-icon
-                              :icon="['fas', 'circle-check']"
-                              class="h-4 w-4"
+                            <FontAwesomeIcon
+                              :icon="faCircleCheck"
+                              class="h-4 w-4 text-green-700 dark:text-green-500"
                               aria-hidden="true"
                             />
                             <span>{{ t('standalone.interfaces_and_devices.up') }}</span>
@@ -983,8 +987,8 @@ function formatPackets(packets: number) {
                               @click="showEditAliasInterfaceDrawer(alias, device)"
                             >
                               <template #prefix>
-                                <font-awesome-icon
-                                  :icon="['fas', 'pen-to-square']"
+                                <FontAwesomeIcon
+                                  :icon="faPenToSquare"
                                   class="h-4 w-4"
                                   aria-hidden="true"
                                 />
@@ -1031,8 +1035,8 @@ function formatPackets(packets: number) {
                                 @click="showEditAliasInterfaceDrawer(alias, device)"
                               >
                                 <template #prefix>
-                                  <font-awesome-icon
-                                    :icon="['fas', 'pen-to-square']"
+                                  <FontAwesomeIcon
+                                    :icon="faPenToSquare"
                                     class="h-4 w-4"
                                     aria-hidden="true"
                                   />
diff --git a/src/views/standalone/network/QoSView.vue b/src/views/standalone/network/QoSView.vue
index d5f016e5e..d5526e79d 100644
--- a/src/views/standalone/network/QoSView.vue
+++ b/src/views/standalone/network/QoSView.vue
@@ -1,5 +1,5 @@
 <!--
-  Copyright (C) 2024 Nethesis S.r.l.
+  Copyright (C) 2026 Nethesis S.r.l.
   SPDX-License-Identifier: GPL-3.0-or-later
 -->
 
@@ -21,6 +21,8 @@ import QoSInterfaceTable from '@/components/standalone/qos/QoSInterfaceTable.vue
 import DeleteQoSInterfaceModal from '@/components/standalone/qos/DeleteQoSInterfaceModal.vue'
 import CreateOrEditQoSInterfaceDrawer from '@/components/standalone/qos/CreateOrEditQoSInterfaceDrawer.vue'
 import { useFirewallStore } from '@/stores/standalone/firewall'
+import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
+import { faChartSimple, faCirclePlus } from '@fortawesome/free-solid-svg-icons'
 
 export type QoSInterface = {
   interface: string
@@ -112,14 +114,10 @@ onMounted(() => {
       </p>
       <NeButton
         v-if="qosInterfaces.length > 0"
-        kind="secondary"
+        kind="primary"
         @click="openCreateEditInterfaceDrawer()"
         ><template #prefix>
-          <font-awesome-icon
-            :icon="['fas', 'circle-plus']"
-            class="h-4 w-4"
-            aria-hidden="true"
-          /> </template
+          <FontAwesomeIcon :icon="faCirclePlus" class="h-4 w-4" aria-hidden="true" /> </template
         >{{ t('standalone.qos.add_qos_interface') }}</NeButton
       >
     </div>
@@ -145,14 +143,10 @@ onMounted(() => {
       <NeEmptyState
         v-if="qosInterfaces.length == 0"
         :title="t('standalone.qos.no_interface_found')"
-        :icon="['fas', 'chart-simple']"
-        ><NeButton kind="secondary" @click="openCreateEditInterfaceDrawer()"
+        :icon="faChartSimple"
+        ><NeButton kind="primary" @click="openCreateEditInterfaceDrawer()"
           ><template #prefix>
-            <font-awesome-icon
-              :icon="['fas', 'circle-plus']"
-              class="h-4 w-4"
-              aria-hidden="true"
-            /> </template
+            <FontAwesomeIcon :icon="faCirclePlus" class="h-4 w-4" aria-hidden="true" /> </template
           >{{ t('standalone.qos.add_qos_interface') }}</NeButton
         ></NeEmptyState
       >
diff --git a/src/views/standalone/network/ReverseProxyView.vue b/src/views/standalone/network/ReverseProxyView.vue
index 65eebf92c..2892b06ca 100644
--- a/src/views/standalone/network/ReverseProxyView.vue
+++ b/src/views/standalone/network/ReverseProxyView.vue
@@ -1,5 +1,5 @@
 <!--
-  Copyright (C) 2024 Nethesis S.r.l.
+  Copyright (C) 2026 Nethesis S.r.l.
   SPDX-License-Identifier: GPL-3.0-or-later
 -->
 
@@ -113,7 +113,7 @@ onMounted(() => {
       </p>
       <template v-if="proxies.length > 0">
         <div class="ml-2 flex shrink-0 flex-col gap-x-0 gap-y-2 sm:flex-row sm:gap-x-2 sm:gap-y-0">
-          <NeButton kind="secondary" @click="openCreateEditDrawer(null)">
+          <NeButton kind="primary" @click="openCreateEditDrawer(null)">
             <template #prefix>
               <FontAwesomeIcon :icon="faCirclePlus" class="h-4 w-4" aria-hidden="true" />
             </template>
diff --git a/src/views/standalone/system/CertificatesView.vue b/src/views/standalone/system/CertificatesView.vue
index 52f230824..abfc1b3c1 100644
--- a/src/views/standalone/system/CertificatesView.vue
+++ b/src/views/standalone/system/CertificatesView.vue
@@ -1,5 +1,5 @@
 <!--
-  Copyright (C) 2024 Nethesis S.r.l.
+  Copyright (C) 2026 Nethesis S.r.l.
   SPDX-License-Identifier: GPL-3.0-or-later
 -->
 
@@ -145,7 +145,7 @@ onMounted(() => {
             </template>
             {{ t('standalone.certificates.import_certificate') }}
           </NeButton>
-          <NeButton kind="secondary" @click="showCreateCertificateDrawer = true">
+          <NeButton kind="primary" @click="showCreateCertificateDrawer = true">
             <template #prefix>
               <FontAwesomeIcon :icon="faCirclePlus" aria-hidden="true" class="h-4 w-4" />
             </template>
diff --git a/src/views/standalone/system/RebootAndShutdownView.vue b/src/views/standalone/system/RebootAndShutdownView.vue
index 0b694d402..3c550392e 100644
--- a/src/views/standalone/system/RebootAndShutdownView.vue
+++ b/src/views/standalone/system/RebootAndShutdownView.vue
@@ -1,5 +1,5 @@
 <!--
-  Copyright (C) 2024 Nethesis S.r.l.
+  Copyright (C) 2026 Nethesis S.r.l.
   SPDX-License-Identifier: GPL-3.0-or-later
 -->
 
@@ -18,6 +18,7 @@ import { onMounted, onUnmounted } from 'vue'
 import { ref } from 'vue'
 import { useI18n } from 'vue-i18n'
 import { useUciPendingChangesStore } from '@/stores/standalone/uciPendingChanges'
+import { faArrowsRotate, faPowerOff } from '@fortawesome/free-solid-svg-icons'
 
 type requestType = 'poweroff' | 'reboot'
 const POLL_INTERVAL = 3000
@@ -139,9 +140,9 @@ onUnmounted(() => {
       <NeSkeleton v-if="loading" :lines="6" />
       <template v-else>
         <div>
-          <NeButton kind="secondary" size="lg" @click="showRebootModal = true">
+          <NeButton kind="primary" size="lg" @click="showRebootModal = true">
             <template #prefix>
-              <FontAwesomeIcon :icon="['fas', 'arrows-rotate']" aria-hidden="true" />
+              <FontAwesomeIcon :icon="faArrowsRotate" aria-hidden="true" />
             </template>
             {{ t('standalone.reboot_and_shutdown.reboot_unit') }}
           </NeButton>
@@ -156,7 +157,7 @@ onUnmounted(() => {
         <div>
           <NeButton kind="secondary" size="lg" @click="showShutdownModal = true">
             <template #prefix>
-              <FontAwesomeIcon :icon="['fas', 'power-off']" aria-hidden="true" />
+              <FontAwesomeIcon :icon="faPowerOff" aria-hidden="true" />
             </template>
             {{ t('standalone.reboot_and_shutdown.shut_down_unit') }}
           </NeButton>