From 1a11ef20d1d22774d0b21163ed800830b73977c0 Mon Sep 17 00:00:00 2001
From: ykulynych <gg.kulynych@gmail.com>
Date: Thu, 9 Jul 2026 17:07:51 +0200
Subject: [PATCH 1/3] [sc-14993] Reworked account navigation

---
 libs/common/common.babel                      | 314 ++++++++++++++++++
 libs/common/src/assets/i18n/ca.json           |  13 +
 libs/common/src/assets/i18n/en.json           |  19 +-
 libs/common/src/assets/i18n/es.json           |  13 +
 libs/common/src/assets/i18n/fr.json           |  13 +
 .../account-administration.component.html     |  38 +++
 .../account-administration.component.scss     |   1 +
 .../account-administration.component.ts       |  16 +
 .../account-arag/account-arag.component.ts    |   3 +-
 .../arag-list/arag-list.component.html        |  48 ++-
 .../arag-list/arag-list.component.scss        |  23 +-
 .../account-configuration.component.html      |  28 ++
 .../account-configuration.component.scss      |   1 +
 .../account-configuration.component.ts        |  15 +
 .../account-consumption.component.html        |  59 ++++
 .../account-consumption.component.scss        |  87 +++++
 .../account-consumption.component.ts          |  84 +++++
 .../account-settings.component.html           |  54 +++
 .../account-settings.component.scss           |  12 +
 .../account-settings.component.ts             |  38 +++
 .../simple-account-home.component.html        |   2 +-
 .../kb-list/kb-list.component.html            |  35 +-
 .../kb-list/kb-list.component.scss            |  19 +-
 .../account-manage.component.html             | 260 +++++++--------
 .../account-manage.component.scss             |   5 +-
 .../account-manage.component.ts               |  11 +-
 .../account-models.component.html             | 240 +++++++------
 .../account-models.component.scss             |  32 +-
 .../account-models.component.ts               |   4 +-
 .../account-nua/account-nua.component.html    |  30 +-
 .../account-nua/account-nua.component.scss    |   7 +-
 .../src/lib/account/account-page-base.ts      |  55 +++
 .../account-page-layout.component.html        |  26 ++
 .../account-page-layout.component.scss        |  50 +++
 .../account-page-layout.component.ts          |  16 +
 .../account-users.component.html              |  19 +-
 .../account-users.component.scss              |  35 +-
 .../account-users/account-users.component.ts  |  21 +-
 libs/common/src/lib/account/account.module.ts | 133 ++++----
 libs/common/src/lib/account/account.scss      |  10 +
 .../account/billing/billing.component.html    |   7 +-
 .../lib/account/billing/billing.component.ts  |  29 +-
 .../billing/checkout/checkout.component.html  |   2 +-
 .../billing/checkout/checkout.component.scss  |   9 +-
 .../billing/checkout/checkout.component.ts    |   6 +-
 .../billing/history/history.component.html    |   8 +-
 .../billing/history/history.component.scss    |   5 +
 .../my-subscription.component.html            |  30 +-
 .../my-subscription.component.scss            |   3 +-
 .../unsubscribe.component.html                |   4 +-
 .../unsubscribe.component.scss                |   3 +-
 .../lib/account/billing/redirect.component.ts |   2 +-
 .../aws-subscription.component.html           |   2 +-
 .../aws-subscription.component.scss           |   3 +-
 .../manual-subscription.component.html        |   2 +-
 .../manual-subscription.component.scss        |   1 +
 .../subscriptions.component.html              |  26 +-
 .../subscriptions.component.scss              |   1 +
 .../subscriptions/subscriptions.component.ts  |   2 +-
 .../billing/usage/usage-table.component.html  |   2 +-
 .../billing/usage/usage-table.component.scss  |   1 +
 .../dashboard-layout.component.ts             |  11 +-
 .../kb-creation/kb-creation.component.html    |  23 +-
 .../kb-creation/kb-creation.component.scss    |  21 ++
 .../lib/kb-creation/kb-creation.component.ts  |  35 +-
 .../src/lib/navbar/navbar.component.html      | 148 ---------
 .../common/src/lib/navbar/navbar.component.ts |  29 +-
 .../src/lib/profile/profile.component.html    |  22 +-
 .../src/lib/profile/profile.component.scss    |  28 +-
 .../src/lib/profile/profile.component.spec.ts |   2 +
 .../src/lib/profile/profile.component.ts      |   5 +-
 .../common/src/lib/topbar/topbar.component.ts |  45 ++-
 .../topbar/user-menu/user-menu.component.html | 122 +++----
 .../topbar/user-menu/user-menu.component.scss |  18 +
 .../topbar/user-menu/user-menu.component.ts   | 287 +++++++++++-----
 .../src/lib/services/navigation.service.ts    |   4 -
 76 files changed, 1960 insertions(+), 877 deletions(-)
 create mode 100644 libs/common/src/lib/account/account-administration/account-administration.component.html
 create mode 100644 libs/common/src/lib/account/account-administration/account-administration.component.scss
 create mode 100644 libs/common/src/lib/account/account-administration/account-administration.component.ts
 create mode 100644 libs/common/src/lib/account/account-configuration/account-configuration.component.html
 create mode 100644 libs/common/src/lib/account/account-configuration/account-configuration.component.scss
 create mode 100644 libs/common/src/lib/account/account-configuration/account-configuration.component.ts
 create mode 100644 libs/common/src/lib/account/account-home/account-consumption.component.html
 create mode 100644 libs/common/src/lib/account/account-home/account-consumption.component.scss
 create mode 100644 libs/common/src/lib/account/account-home/account-consumption.component.ts
 create mode 100644 libs/common/src/lib/account/account-home/account-settings.component.html
 create mode 100644 libs/common/src/lib/account/account-home/account-settings.component.scss
 create mode 100644 libs/common/src/lib/account/account-home/account-settings.component.ts
 create mode 100644 libs/common/src/lib/account/account-page-base.ts
 create mode 100644 libs/common/src/lib/account/account-page-layout/account-page-layout.component.html
 create mode 100644 libs/common/src/lib/account/account-page-layout/account-page-layout.component.scss
 create mode 100644 libs/common/src/lib/account/account-page-layout/account-page-layout.component.ts
 create mode 100644 libs/common/src/lib/account/account.scss

diff --git a/libs/common/common.babel b/libs/common/common.babel
index 15bf139410..81802b057a 100644
--- a/libs/common/common.babel
+++ b/libs/common/common.babel
@@ -22,6 +22,29 @@
 					<folder_node>
 						<name>account</name>
 						<children>
+							<concept_node>
+								<name>account-title</name>
+								<description/>
+								<comment/>
+								<translations>
+									<translation>
+										<language>ca-ES</language>
+										<approved>false</approved>
+									</translation>
+									<translation>
+										<language>en-US</language>
+										<approved>false</approved>
+									</translation>
+									<translation>
+										<language>es-ES</language>
+										<approved>false</approved>
+									</translation>
+									<translation>
+										<language>fr-FR</language>
+										<approved>false</approved>
+									</translation>
+								</translations>
+							</concept_node>
 							<concept_node>
 								<name>account_name_invalid</name>
 								<description/>
@@ -119,6 +142,52 @@
 									</concept_node>
 								</children>
 							</folder_node>
+							<concept_node>
+								<name>administration</name>
+								<description/>
+								<comment/>
+								<translations>
+									<translation>
+										<language>ca-ES</language>
+										<approved>false</approved>
+									</translation>
+									<translation>
+										<language>en-US</language>
+										<approved>false</approved>
+									</translation>
+									<translation>
+										<language>es-ES</language>
+										<approved>false</approved>
+									</translation>
+									<translation>
+										<language>fr-FR</language>
+										<approved>false</approved>
+									</translation>
+								</translations>
+							</concept_node>
+							<concept_node>
+								<name>administration-description</name>
+								<description/>
+								<comment/>
+								<translations>
+									<translation>
+										<language>ca-ES</language>
+										<approved>false</approved>
+									</translation>
+									<translation>
+										<language>en-US</language>
+										<approved>false</approved>
+									</translation>
+									<translation>
+										<language>es-ES</language>
+										<approved>false</approved>
+									</translation>
+									<translation>
+										<language>fr-FR</language>
+										<approved>false</approved>
+									</translation>
+								</translations>
+							</concept_node>
 							<concept_node>
 								<name>allow_kb_management</name>
 								<description/>
@@ -658,6 +727,29 @@
 									</translation>
 								</translations>
 							</concept_node>
+							<concept_node>
+								<name>configuration-description</name>
+								<description/>
+								<comment/>
+								<translations>
+									<translation>
+										<language>ca-ES</language>
+										<approved>false</approved>
+									</translation>
+									<translation>
+										<language>en-US</language>
+										<approved>false</approved>
+									</translation>
+									<translation>
+										<language>es-ES</language>
+										<approved>false</approved>
+									</translation>
+									<translation>
+										<language>fr-FR</language>
+										<approved>false</approved>
+									</translation>
+								</translations>
+							</concept_node>
 							<concept_node>
 								<name>consumption</name>
 								<description/>
@@ -2471,6 +2563,57 @@
 									</translation>
 								</translations>
 							</concept_node>
+							<folder_node>
+								<name>manage_users-kb-cta</name>
+								<children>
+									<concept_node>
+										<name>action</name>
+										<description/>
+										<comment/>
+										<translations>
+											<translation>
+												<language>ca-ES</language>
+												<approved>false</approved>
+											</translation>
+											<translation>
+												<language>en-US</language>
+												<approved>false</approved>
+											</translation>
+											<translation>
+												<language>es-ES</language>
+												<approved>false</approved>
+											</translation>
+											<translation>
+												<language>fr-FR</language>
+												<approved>false</approved>
+											</translation>
+										</translations>
+									</concept_node>
+									<concept_node>
+										<name>prompt</name>
+										<description/>
+										<comment/>
+										<translations>
+											<translation>
+												<language>ca-ES</language>
+												<approved>false</approved>
+											</translation>
+											<translation>
+												<language>en-US</language>
+												<approved>false</approved>
+											</translation>
+											<translation>
+												<language>es-ES</language>
+												<approved>false</approved>
+											</translation>
+											<translation>
+												<language>fr-FR</language>
+												<approved>false</approved>
+											</translation>
+										</translations>
+									</concept_node>
+								</children>
+							</folder_node>
 							<folder_node>
 								<name>models</name>
 								<children>
@@ -17884,6 +18027,29 @@
 									</translation>
 								</translations>
 							</concept_node>
+							<concept_node>
+								<name>configuration</name>
+								<description/>
+								<comment/>
+								<translations>
+									<translation>
+										<language>ca-ES</language>
+										<approved>false</approved>
+									</translation>
+									<translation>
+										<language>en-US</language>
+										<approved>false</approved>
+									</translation>
+									<translation>
+										<language>es-ES</language>
+										<approved>false</approved>
+									</translation>
+									<translation>
+										<language>fr-FR</language>
+										<approved>false</approved>
+									</translation>
+								</translations>
+							</concept_node>
 							<concept_node>
 								<name>confirm_password</name>
 								<description/>
@@ -70957,6 +71123,154 @@
 							</concept_node>
 						</children>
 					</folder_node>
+					<folder_node>
+						<name>user-menu</name>
+						<children>
+							<concept_node>
+								<name>account-settings</name>
+								<description/>
+								<comment/>
+								<translations>
+									<translation>
+										<language>ca-ES</language>
+										<approved>false</approved>
+									</translation>
+									<translation>
+										<language>en-US</language>
+										<approved>false</approved>
+									</translation>
+									<translation>
+										<language>es-ES</language>
+										<approved>false</approved>
+									</translation>
+									<translation>
+										<language>fr-FR</language>
+										<approved>false</approved>
+									</translation>
+								</translations>
+							</concept_node>
+							<folder_node>
+								<name>section</name>
+								<children>
+									<concept_node>
+										<name>account</name>
+										<description/>
+										<comment/>
+										<translations>
+											<translation>
+												<language>ca-ES</language>
+												<approved>false</approved>
+											</translation>
+											<translation>
+												<language>en-US</language>
+												<approved>false</approved>
+											</translation>
+											<translation>
+												<language>es-ES</language>
+												<approved>false</approved>
+											</translation>
+											<translation>
+												<language>fr-FR</language>
+												<approved>false</approved>
+											</translation>
+										</translations>
+									</concept_node>
+									<concept_node>
+										<name>administration</name>
+										<description/>
+										<comment/>
+										<translations>
+											<translation>
+												<language>ca-ES</language>
+												<approved>false</approved>
+											</translation>
+											<translation>
+												<language>en-US</language>
+												<approved>false</approved>
+											</translation>
+											<translation>
+												<language>es-ES</language>
+												<approved>false</approved>
+											</translation>
+											<translation>
+												<language>fr-FR</language>
+												<approved>false</approved>
+											</translation>
+										</translations>
+									</concept_node>
+									<concept_node>
+										<name>configuration</name>
+										<description/>
+										<comment/>
+										<translations>
+											<translation>
+												<language>ca-ES</language>
+												<approved>false</approved>
+											</translation>
+											<translation>
+												<language>en-US</language>
+												<approved>false</approved>
+											</translation>
+											<translation>
+												<language>es-ES</language>
+												<approved>false</approved>
+											</translation>
+											<translation>
+												<language>fr-FR</language>
+												<approved>false</approved>
+											</translation>
+										</translations>
+									</concept_node>
+									<concept_node>
+										<name>personal</name>
+										<description/>
+										<comment/>
+										<translations>
+											<translation>
+												<language>ca-ES</language>
+												<approved>false</approved>
+											</translation>
+											<translation>
+												<language>en-US</language>
+												<approved>false</approved>
+											</translation>
+											<translation>
+												<language>es-ES</language>
+												<approved>false</approved>
+											</translation>
+											<translation>
+												<language>fr-FR</language>
+												<approved>false</approved>
+											</translation>
+										</translations>
+									</concept_node>
+									<concept_node>
+										<name>support</name>
+										<description/>
+										<comment/>
+										<translations>
+											<translation>
+												<language>ca-ES</language>
+												<approved>false</approved>
+											</translation>
+											<translation>
+												<language>en-US</language>
+												<approved>false</approved>
+											</translation>
+											<translation>
+												<language>es-ES</language>
+												<approved>false</approved>
+											</translation>
+											<translation>
+												<language>fr-FR</language>
+												<approved>false</approved>
+											</translation>
+										</translations>
+									</concept_node>
+								</children>
+							</folder_node>
+						</children>
+					</folder_node>
 					<folder_node>
 						<name>validation</name>
 						<children>
diff --git a/libs/common/src/assets/i18n/ca.json b/libs/common/src/assets/i18n/ca.json
index b7eb37aa77..87ae86c86e 100644
--- a/libs/common/src/assets/i18n/ca.json
+++ b/libs/common/src/assets/i18n/ca.json
@@ -1,8 +1,11 @@
 {
+	"account.account-title": "Compte",
 	"account.account_name_invalid": "El nom del compte no és vàlid",
 	"account.add_user": "Afegir usuari",
 	"account.admin.make_admin": "Fer Administrador",
 	"account.admin.warning": "Si converteixes aquest usuari en administrador podrà accedir i editar a totes les opcions.",
+	"account.administration": "Administració",
+	"account.administration-description": "Gestiona els quadres de coneixement i els usuaris a nivell de compte.",
 	"account.allow_kb_management": "Permetre la gestió de Knowledge Boxes",
 	"account.assume-role.account-id": "ID del compte",
 	"account.assume-role.create-role": "Crea un nou rol",
@@ -26,6 +29,7 @@
 	"account.assume-role.step-2-4": "Introdueix un <strong>policy name</strong> (per exemple, \"progress-agentic-rag\") i fes clic a <strong>Create policy</strong>",
 	"account.assume-role.step-3-1": "Introdueix l'ARN del rol creat:",
 	"account.billing": "Pagament i subscripció",
+	"account.configuration-description": "Gestiona les claus NUA, els agents de recuperació i les configuracions del model.",
 	"account.consumption": "Consum",
 	"account.consumption-description": "Consum basat en la teva activitat.",
 	"account.create_nua_key": "Creeu una nova clau Agentic RAG Understanding API",
@@ -102,6 +106,8 @@
 	"account.manage": "Gestió del compte",
 	"account.manage_users": "Gestiona els usuaris",
 	"account.manage_users-description": "Gestiona els col·laboradors i els permisos d'accés al compte.",
+	"account.manage_users-kb-cta.action": "Gestiona els usuaris de Knowledge Box",
+	"account.manage_users-kb-cta.prompt": "Cal gestionar l'accés per a la Knowledge Box actual?",
 	"account.models.bedrock.delete-confirm.description": "Estàs segur que vols eliminar aquesta integració?",
 	"account.models.bedrock.delete-confirm.title": "Eliminar integració AWS Bedrock",
 	"account.models.bedrock.description": "Integra tu AWS Bedrock en Agentic RAG",
@@ -748,6 +754,7 @@
 	"generic.clear_all": "Esborrar tot",
 	"generic.close": "Tanca",
 	"generic.color": "Color",
+	"generic.configuration": "Configuració",
 	"generic.confirm_password": "Confirmar contrasenya",
 	"generic.content": "Contingut",
 	"generic.continue": "Continuar",
@@ -2925,6 +2932,12 @@
 	"upload.warning-spreadsheet-title": "Estas a punt de pujar {{num}} fitxers de full de càlcul",
 	"upload.warning-spreadsheets-description": "És possible que la indexació d’embeddings d’aquests fitxersno sigui òptima en funció del seu format i estructura. Consulteu la <a href=\"{{url}}\" target=\"_blank\" rel=\"noopener noreferrer\">documentació</a> per a més informació.",
 	"user.logout": "Sortir",
+	"user-menu.account-settings": "Configuració del compte",
+	"user-menu.section.account": "Compte",
+	"user-menu.section.administration": "Administració",
+	"user-menu.section.configuration": "Configuració",
+	"user-menu.section.personal": "Personal",
+	"user-menu.section.support": "Suport",
 	"validation.invalid-slug": "Slug no vàlid",
 	"validation.name_required": "Introdueix el nom i cognoms",
 	"validation.url_required": "Introdueix una URL vàlida (per exemple https://progress.com)",
diff --git a/libs/common/src/assets/i18n/en.json b/libs/common/src/assets/i18n/en.json
index 79eb5f7b7b..29e0d6730e 100644
--- a/libs/common/src/assets/i18n/en.json
+++ b/libs/common/src/assets/i18n/en.json
@@ -1,8 +1,11 @@
 {
+	"account.account-title": "Account",
 	"account.account_name_invalid": "Invalid account name",
 	"account.add_user": "Add user",
 	"account.admin.make_admin": "Make Administrator",
 	"account.admin.warning": "If you give the administrator role to this user, they will be able to access and edit all options.",
+	"account.administration": "Administration",
+	"account.administration-description": "Manage Knowledge Boxes and account-level users.",
 	"account.allow_kb_management": "Allow management of Knowledge Boxes",
 	"account.assume-role.account-id": "Account ID",
 	"account.assume-role.create-role": "Create new role",
@@ -26,6 +29,7 @@
 	"account.assume-role.step-2-4": "Set a <strong>policy name</strong> (eg. \"progress-agentic-rag\") and click <strong>Create policy</strong>",
 	"account.assume-role.step-3-1": "Enter the ARN of the created role:",
 	"account.billing": "Payment & Subscription",
+	"account.configuration-description": "Manage NUA keys, retrieval agents, and model configurations.",
 	"account.consumption": "Consumption",
 	"account.consumption-description": "Consumption based on your activity.",
 	"account.create_nua_key": "Create new Agentic RAG Understanding API key ",
@@ -101,7 +105,9 @@
 	"account.knowledgeboxes": "Knowledge Boxes",
 	"account.manage": "Manage account",
 	"account.manage_users": "Manage users",
-	"account.manage_users-description": "Manage collaborators and account access permissions.",
+	"account.manage_users-description": "Manage account-level users and permissions. Users added here can later be invited to individual Knowledge Boxes.",
+	"account.manage_users-kb-cta.action": "Manage Knowledge Box Users",
+	"account.manage_users-kb-cta.prompt": "Need to manage access for the current Knowledge Box?",
 	"account.models.bedrock.delete-confirm.description": "Are you sure you want to delete this integration?",
 	"account.models.bedrock.delete-confirm.title": "Delete AWS Bedrock integration",
 	"account.models.bedrock.description": "Integrate your AWS Bedrock into Agentic RAG",
@@ -173,7 +179,7 @@
 	"account.nuclia-tokens.total": "Total",
 	"account.preferences": "Preferences",
 	"account.preferences-description": "Update your profile information and personal preferences.",
-	"account.related_kbs": "Account's Knowledge Boxes",
+	"account.related_kbs": "Knowledge Boxes",
 	"account.retrieval-agents.confirm-deletion": "Are you sure you want to delete \"{{name}}\" agent?",
 	"account.retrieval-agents.count-of-max": "{{count}} of {{max}}",
 	"account.retrieval-agents.create": "Create retrieval agent",
@@ -202,7 +208,7 @@
 	"account.saml.sso-url": "Single Sign-On URL",
 	"account.saml.title": "Single Sign-On configuration",
 	"account.saml.x509-cert": "X.509 certificate",
-	"account.settings-description": "Track consumption, manage subscriptions, users and preferences.",
+	"account.settings-description": "Manage consumption, subscriptions, user preferences, and account settings.",
 	"account.slug-unavailable": "The chosen slug is unavailable",
 	"account.subscriptions": "Subscriptions",
 	"account.title": "Name",
@@ -748,6 +754,7 @@
 	"generic.clear_all": "Clear All",
 	"generic.close": "Close",
 	"generic.color": "Color",
+	"generic.configuration": "Configuration",
 	"generic.confirm_password": "Confirm password",
 	"generic.content": "Content",
 	"generic.continue": "Continue",
@@ -2925,6 +2932,12 @@
 	"upload.warning-spreadsheet-title": "You are about to upload {{num}} spreadsheet files",
 	"upload.warning-spreadsheets-description": "The embeddings indexing of these files might not be optimal depending on their format and structure. See the <a href=\"{{url}}\" target=\"_blank\" rel=\"noopener noreferrer\">documentation</a> for more information.",
 	"user.logout": "Log out",
+	"user-menu.account-settings": "Account settings",
+	"user-menu.section.account": "Account",
+	"user-menu.section.administration": "Administration",
+	"user-menu.section.configuration": "Configuration",
+	"user-menu.section.personal": "Personal",
+	"user-menu.section.support": "Support",
 	"validation.invalid-slug": "Invalid slug",
 	"validation.name_required": "Add your name and surnames",
 	"validation.url_required": "Enter a valid URL (e.g. https://progress.com)",
diff --git a/libs/common/src/assets/i18n/es.json b/libs/common/src/assets/i18n/es.json
index fbcf773fc0..edb78c865d 100644
--- a/libs/common/src/assets/i18n/es.json
+++ b/libs/common/src/assets/i18n/es.json
@@ -1,8 +1,11 @@
 {
+	"account.account-title": "Cuenta",
 	"account.account_name_invalid": "El nombre de la cuenta no es válido",
 	"account.add_user": "Añadir usuario",
 	"account.admin.make_admin": "Hacer administrador",
 	"account.admin.warning": "Si le otorgas a este usuario un rol de administrador, el usuario podrá acceder y editar todas las opciones.",
+	"account.administration": "Administración",
+	"account.administration-description": "Gestionar los cuadros de conocimiento y los usuarios a nivel de cuenta.",
 	"account.allow_kb_management": "Permitir la gestión de Knowledge Boxes",
 	"account.assume-role.account-id": "ID de la cuenta",
 	"account.assume-role.create-role": "Crea un nuevo rol",
@@ -26,6 +29,7 @@
 	"account.assume-role.step-2-4": "Introduce un nombre de política (por ejemplo, \"progress-agentic-rag\") y haz clic en <strong>Crear política</strong>.",
 	"account.assume-role.step-3-1": "Introduce el ARN del rol creado:",
 	"account.billing": "Pago y suscripción",
+	"account.configuration-description": "Gestionar las claves NUA, los agentes de recuperación y las configuraciones de los modelos.",
 	"account.consumption": "Consumo",
 	"account.consumption-description": "Consumo en función de tu actividad.",
 	"account.create_nua_key": "Crear una nueva clave Agentic RAG Understanding API",
@@ -102,6 +106,8 @@
 	"account.manage": "Gestión de la cuenta",
 	"account.manage_users": "Administrar usuarios",
 	"account.manage_users-description": "Gestiona los colaboradores y los permisos de acceso a la cuenta.",
+	"account.manage_users-kb-cta.action": "Administrar usuarios de Knowledge Box",
+	"account.manage_users-kb-cta.prompt": "¿Necesita gestionar el acceso a la Caja de Conocimiento actual?",
 	"account.models.bedrock.delete-confirm.description": "¿Está seguro de que quieres eliminar esta integración?",
 	"account.models.bedrock.delete-confirm.title": "Eliminar integración AWS Bedrock",
 	"account.models.bedrock.description": "Integra el teu AWS Bedrock a Agentic RAG",
@@ -748,6 +754,7 @@
 	"generic.clear_all": "Borrar todo",
 	"generic.close": "Cerca",
 	"generic.color": "Color",
+	"generic.configuration": "Configuración",
 	"generic.confirm_password": "Confirmar contraseña",
 	"generic.content": "Contenido",
 	"generic.continue": "Continuar",
@@ -2925,6 +2932,12 @@
 	"upload.warning-spreadsheet-title": "Estás a punto de cargar {{num}} archivos de hoja de cálculo",
 	"upload.warning-spreadsheets-description": "Es posible que la indexación de embeddings de estos archivos no sea óptima en funcion de su formato y estructura. Consulte la <a href=\"{{url}}\" target=\"_blank\" rel=\"noopener noreferrer\">documentación</a> para obtener más información.",
 	"user.logout": "Salir",
+	"user-menu.account-settings": "Configuraciones de la Cuenta",
+	"user-menu.section.account": "Cuenta",
+	"user-menu.section.administration": "Administración",
+	"user-menu.section.configuration": "Configuración",
+	"user-menu.section.personal": "Personal",
+	"user-menu.section.support": "Apoyo",
 	"validation.invalid-slug": "Slug no válido",
 	"validation.name_required": "Añade tu nombre y apellidos",
 	"validation.url_required": "Introduce una URL válida (por ejemplo https://progress.com)",
diff --git a/libs/common/src/assets/i18n/fr.json b/libs/common/src/assets/i18n/fr.json
index d737354592..518ff16a39 100644
--- a/libs/common/src/assets/i18n/fr.json
+++ b/libs/common/src/assets/i18n/fr.json
@@ -1,8 +1,11 @@
 {
+	"account.account-title": "Compte",
 	"account.account_name_invalid": "Nom de compte invalide",
 	"account.add_user": "Ajouter un utilisateur",
 	"account.admin.make_admin": "Faire administrateur",
 	"account.admin.warning": "Si vous donnez le rôle d’administrateur à cet utilisateur, il pourra accéder à toutes les options et les modifier.",
+	"account.administration": "Administration",
+	"account.administration-description": "Gérer les boîtes à connaissances et les utilisateurs au niveau du compte.",
 	"account.allow_kb_management": "Autoriser la gestion des Knowledge Boxes",
 	"account.assume-role.account-id": "ID du compte",
 	"account.assume-role.create-role": "Créer un nouveau rôle",
@@ -26,6 +29,7 @@
 	"account.assume-role.step-2-4": "Définissez un <strong>nom de la politique</strong> (par exemple, « progress-agentic-rag ») et cliquez sur <strong>Créer une politique</strong>",
 	"account.assume-role.step-3-1": "Saisissez l'ARN du rôle créé :",
 	"account.billing": "Paiement et abonnement",
+	"account.configuration-description": "Gérer les clés NUA, les agents de récupération et les configurations de modèles.",
 	"account.consumption": "Consommation",
 	"account.consumption-description": "Consommation en fonction de votre activité.",
 	"account.create_nua_key": "Créer une nouvelle clé Agentic RAG Understanding API",
@@ -102,6 +106,8 @@
 	"account.manage": "Gérer le compte",
 	"account.manage_users": "Gérer les utilisateurs",
 	"account.manage_users-description": "Gérer les collaborateurs et les autorisations d'accès aux comptes.",
+	"account.manage_users-kb-cta.action": "Gérer les utilisateurs de la boîte à connaissances",
+	"account.manage_users-kb-cta.prompt": "Besoin de gérer l'accès à la Knowledge Box actuelle ?",
 	"account.models.bedrock.delete-confirm.description": "Êtes-vous sûr de vouloir supprimer cette intégration ?",
 	"account.models.bedrock.delete-confirm.title": "Supprimer intégration AWS Bedrock",
 	"account.models.bedrock.description": "Intégrez votre AWS Bedrock à Agentic RAG",
@@ -748,6 +754,7 @@
 	"generic.clear_all": "Effacer tout",
 	"generic.close": "Fermer",
 	"generic.color": "Couleur",
+	"generic.configuration": "Configuration",
 	"generic.confirm_password": "Confirmer le mot de passe",
 	"generic.content": "Contenu",
 	"generic.continue": "Continuer",
@@ -2925,6 +2932,12 @@
 	"upload.warning-spreadsheet-title": "Vous êtes sur le point d’importer {{num}} fichiers de feuille de calcul",
 	"upload.warning-spreadsheets-description": "L’indexation d’embeddings de ces fichiers peut ne pas être optimale en fonction de leur format et de leur structure. Consultez la <a href=\"{{url}}\" target=\"_blank\" rel=\"noopener noreferrer\">documentation</a> pour plus d’informations.",
 	"user.logout": "Déconnexion",
+	"user-menu.account-settings": "Paramètres du compte",
+	"user-menu.section.account": "Compte",
+	"user-menu.section.administration": "Administration",
+	"user-menu.section.configuration": "Configuration",
+	"user-menu.section.personal": "Personnel",
+	"user-menu.section.support": "Soutien",
 	"validation.invalid-slug": "Slug invalide",
 	"validation.name_required": "Ajoutez vos nom et prénom",
 	"validation.url_required": "Saisir une URL valide (par exemple https://progress.com)",
diff --git a/libs/common/src/lib/account/account-administration/account-administration.component.html b/libs/common/src/lib/account/account-administration/account-administration.component.html
new file mode 100644
index 0000000000..a6027daf39
--- /dev/null
+++ b/libs/common/src/lib/account/account-administration/account-administration.component.html
@@ -0,0 +1,38 @@
+<app-account-page-layout
+  [title]="'account.administration' | translate"
+  [description]="'account.administration-description' | translate"
+  [backLink]="backLink | async"
+  panelId="administration-section-panel">
+  <pa-tabs
+    tabs
+    class="settings-tabs">
+    <pa-tab
+      routerLink="knowledge-boxes"
+      routerLinkActive
+      #rla0="routerLinkActive"
+      [active]="rla0.isActive"
+      ariaControls="administration-section-panel">
+      {{ 'account.related_kbs' | translate }}
+    </pa-tab>
+    @if (isRetrievalAgentsEnabled | async) {
+      <pa-tab
+        routerLink="retrieval-agents"
+        routerLinkActive
+        #rla1="routerLinkActive"
+        [active]="rla1.isActive"
+        ariaControls="administration-section-panel">
+        {{ 'navbar.account-retrieval-agents' | translate }}
+      </pa-tab>
+    }
+    @if (isAccountManager | async) {
+      <pa-tab
+        routerLink="users"
+        routerLinkActive
+        #rla2="routerLinkActive"
+        [active]="rla2.isActive"
+        ariaControls="administration-section-panel">
+        {{ 'account.manage_users' | translate }}
+      </pa-tab>
+    }
+  </pa-tabs>
+</app-account-page-layout>
diff --git a/libs/common/src/lib/account/account-administration/account-administration.component.scss b/libs/common/src/lib/account/account-administration/account-administration.component.scss
new file mode 100644
index 0000000000..73e6cd373f
--- /dev/null
+++ b/libs/common/src/lib/account/account-administration/account-administration.component.scss
@@ -0,0 +1 @@
+@use 'apps/dashboard/src/variables' as *;
diff --git a/libs/common/src/lib/account/account-administration/account-administration.component.ts b/libs/common/src/lib/account/account-administration/account-administration.component.ts
new file mode 100644
index 0000000000..777024e577
--- /dev/null
+++ b/libs/common/src/lib/account/account-administration/account-administration.component.ts
@@ -0,0 +1,16 @@
+import { ChangeDetectionStrategy, Component, inject } from '@angular/core';
+import { FeaturesService } from '@flaps/core';
+import { AccountPageBase } from '../account-page-base';
+
+@Component({
+  selector: 'app-account-administration',
+  templateUrl: './account-administration.component.html',
+  styleUrl: './account-administration.component.scss',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  standalone: false,
+})
+export class AccountAdministrationComponent extends AccountPageBase {
+  private features = inject(FeaturesService);
+  isAccountManager = this.features.isAccountManager;
+  isRetrievalAgentsEnabled = this.features.unstable.retrievalAgents;
+}
diff --git a/libs/common/src/lib/account/account-arag/account-arag.component.ts b/libs/common/src/lib/account/account-arag/account-arag.component.ts
index f0bf31f9c8..173a0e08a5 100644
--- a/libs/common/src/lib/account/account-arag/account-arag.component.ts
+++ b/libs/common/src/lib/account/account-arag/account-arag.component.ts
@@ -1,11 +1,12 @@
 import { ChangeDetectionStrategy, Component } from '@angular/core';
+import { RouterOutlet } from '@angular/router';
 
 @Component({
   selector: 'app-account-arag',
   template: `
     <router-outlet></router-outlet>
   `,
+  imports: [RouterOutlet],
   changeDetection: ChangeDetectionStrategy.OnPush,
-  standalone: false,
 })
 export class AccountAragComponent {}
diff --git a/libs/common/src/lib/account/account-arag/arag-list/arag-list.component.html b/libs/common/src/lib/account/account-arag/arag-list/arag-list.component.html
index 7d5504426a..5a4d88527e 100644
--- a/libs/common/src/lib/account/account-arag/arag-list/arag-list.component.html
+++ b/libs/common/src/lib/account/account-arag/arag-list/arag-list.component.html
@@ -5,25 +5,14 @@
 }
 
 @if (account && retrievalAgents) {
-  <div class="account-arag page-spacing">
+  <div class="account-arag">
     <div class="account-arag-header">
-      <div>
-        <h1 class="page-title">
-          {{ 'account.retrieval-agents.title' | translate }}
-          <nsi-badge kind="tertiary">{{ 'generic.badge.beta' | translate }}</nsi-badge>
-        </h1>
+      <h2 class="page-subtitle">
+        {{ 'account.retrieval-agents.title' | translate }}
+        <nsi-badge kind="tertiary">{{ 'generic.badge.beta' | translate }}</nsi-badge>
+      </h2>
 
-        <p class="page-description">{{ 'account.retrieval-agents.description' | translate }}</p>
-      </div>
-
-      @if (canAddArag | async) {
-        <pa-button
-          data-cy="add-arag"
-          [disabled]="retrievalAgents.length >= maxRetrievalAgents && maxRetrievalAgents !== -1"
-          (click)="createArag()">
-          {{ 'account.retrieval-agents.create' | translate }}
-        </pa-button>
-      }
+      <p class="page-description">{{ 'account.retrieval-agents.description' | translate }}</p>
     </div>
 
     <div class="account-arag-content">
@@ -81,16 +70,23 @@ <h1 class="page-title">
             </pa-table-row>
           }
         </pa-table>
+      }
 
-        <nsi-sticky-footer>
-          @if (retrievalAgents.length > 0 && maxRetrievalAgents !== -1) {
-            <div
-              footerNote
-              class="account-kbs-counter">
-              {{ 'account.kb.count' | translate: { count: retrievalAgents.length, max: maxRetrievalAgents } }}
-            </div>
-          }
-        </nsi-sticky-footer>
+      @if (canAddArag | async) {
+        @if (retrievalAgents.length > 0 && maxRetrievalAgents !== -1) {
+          <div class="account-arag-counter">
+            {{ 'account.kb.count' | translate: { count: retrievalAgents.length, max: maxRetrievalAgents } }}
+          </div>
+        }
+
+        <pa-button
+          kind="primary"
+          class="create-arag-button"
+          data-cy="add-arag"
+          [disabled]="retrievalAgents.length >= maxRetrievalAgents && maxRetrievalAgents !== -1"
+          (click)="createArag()">
+          {{ 'account.retrieval-agents.create' | translate }}
+        </pa-button>
       }
     </div>
   </div>
diff --git a/libs/common/src/lib/account/account-arag/arag-list/arag-list.component.scss b/libs/common/src/lib/account/account-arag/arag-list/arag-list.component.scss
index 6d989022a6..0f805528cf 100644
--- a/libs/common/src/lib/account/account-arag/arag-list/arag-list.component.scss
+++ b/libs/common/src/lib/account/account-arag/arag-list/arag-list.component.scss
@@ -1,13 +1,32 @@
 @use 'apps/dashboard/src/variables' as *;
+@use '../../account';
 
 .account-arag {
+  min-height: auto;
+  padding: 0;
+
+  .page-subtitle {
+    display: flex;
+    align-items: center;
+    gap: rhythm(1);
+  }
+
   .account-arag-header {
     display: flex;
-    justify-content: space-between;
-    gap: rhythm(4);
+    flex-direction: column;
     margin-bottom: rhythm(4);
   }
 
+  .account-arag-counter {
+    font-weight: var(--stf-font-weight-semibold);
+    margin-top: rhythm(4);
+    margin-bottom: rhythm(2);
+  }
+
+  .create-arag-button {
+    margin-top: rhythm(3);
+  }
+
   .go-to-arag {
     @include body-s();
     cursor: pointer;
diff --git a/libs/common/src/lib/account/account-configuration/account-configuration.component.html b/libs/common/src/lib/account/account-configuration/account-configuration.component.html
new file mode 100644
index 0000000000..5a326b58ab
--- /dev/null
+++ b/libs/common/src/lib/account/account-configuration/account-configuration.component.html
@@ -0,0 +1,28 @@
+<app-account-page-layout
+  [title]="'generic.configuration' | translate"
+  [description]="'account.configuration-description' | translate"
+  [backLink]="backLink | async"
+  panelId="configuration-section-panel">
+  <pa-tabs
+    tabs
+    class="settings-tabs">
+    <pa-tab
+      routerLink="nua"
+      routerLinkActive
+      #rla0="routerLinkActive"
+      [active]="rla0.isActive"
+      ariaControls="configuration-section-panel">
+      {{ 'navbar.nua-keys' | translate }}
+    </pa-tab>
+    @if (isModelManagementEnabled | async) {
+      <pa-tab
+        routerLink="models"
+        routerLinkActive
+        #rla1="routerLinkActive"
+        [active]="rla1.isActive"
+        ariaControls="configuration-section-panel">
+        {{ 'navbar.models' | translate }}
+      </pa-tab>
+    }
+  </pa-tabs>
+</app-account-page-layout>
diff --git a/libs/common/src/lib/account/account-configuration/account-configuration.component.scss b/libs/common/src/lib/account/account-configuration/account-configuration.component.scss
new file mode 100644
index 0000000000..73e6cd373f
--- /dev/null
+++ b/libs/common/src/lib/account/account-configuration/account-configuration.component.scss
@@ -0,0 +1 @@
+@use 'apps/dashboard/src/variables' as *;
diff --git a/libs/common/src/lib/account/account-configuration/account-configuration.component.ts b/libs/common/src/lib/account/account-configuration/account-configuration.component.ts
new file mode 100644
index 0000000000..65c5c53145
--- /dev/null
+++ b/libs/common/src/lib/account/account-configuration/account-configuration.component.ts
@@ -0,0 +1,15 @@
+import { ChangeDetectionStrategy, Component, inject } from '@angular/core';
+import { FeaturesService } from '@flaps/core';
+import { AccountPageBase } from '../account-page-base';
+
+@Component({
+  selector: 'app-account-configuration',
+  templateUrl: './account-configuration.component.html',
+  styleUrl: './account-configuration.component.scss',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  standalone: false,
+})
+export class AccountConfigurationComponent extends AccountPageBase {
+  private features = inject(FeaturesService);
+  isModelManagementEnabled = this.features.unstable.modelManagement;
+}
diff --git a/libs/common/src/lib/account/account-home/account-consumption.component.html b/libs/common/src/lib/account/account-home/account-consumption.component.html
new file mode 100644
index 0000000000..964668df00
--- /dev/null
+++ b/libs/common/src/lib/account/account-home/account-consumption.component.html
@@ -0,0 +1,59 @@
+<h2 class="page-subtitle">{{ 'account.consumption' | translate }}</h2>
+<p class="page-description">{{ 'account.consumption-description' | translate }}</p>
+
+<app-nuclia-tokens
+  [usage]="usage"
+  [selectedPeriod]="selectedPeriod | async"
+  (selectPeriod)="selectedPeriod.next($event)"></app-nuclia-tokens>
+
+<div class="consumption-summary">
+  <div class="summary-section">
+    <h3 class="title-m">{{ 'account.knowledgeboxes' | translate }}</h3>
+    @if (kbs | async; as kbList) {
+      @if (kbList.length > 0) {
+        <ul class="kb-summary-list">
+          @for (kb of kbList; track kb.id) {
+            <li
+              class="kb-summary-item"
+              [class.disabled]="!kb.role_on_kb">
+              <div class="kb-info">
+                <span class="kb-title">{{ kb.title }}</span>
+                @if (kb.state === 'PRIVATE') {
+                  <pa-icon
+                    size="small"
+                    name="lock"
+                    class="lock-icon"></pa-icon>
+                }
+              </div>
+              @if (tokensCount?.[kb.id]; as tokens) {
+                @if (tokens > 0) {
+                  <span class="kb-tokens">({{ tokens | number: '1.0-0' }} tokens)</span>
+                }
+              }
+            </li>
+          }
+        </ul>
+      }
+    }
+  </div>
+
+  <div class="summary-section">
+    @if (totalQueries | async; as count) {
+      <h3 class="title-m">{{ 'account.total_queries' | translate }}</h3>
+      <div class="queries-grid">
+        <div class="query-stat">
+          <div class="title-xxs">{{ 'metrics.period.last-30-days' | translate }}</div>
+          <div class="display-s">{{ count.month | number }}</div>
+        </div>
+        <div class="query-stat">
+          <div class="title-xxs">{{ 'metrics.period.last-12-months' | translate }}</div>
+          <div class="display-s">{{ count.year | number }}</div>
+        </div>
+        <div class="query-stat">
+          <div class="title-xxs">{{ 'metrics.period.since-creation' | translate }}</div>
+          <div class="display-s">{{ count.sinceCreation | number }}</div>
+        </div>
+      </div>
+    }
+  </div>
+</div>
diff --git a/libs/common/src/lib/account/account-home/account-consumption.component.scss b/libs/common/src/lib/account/account-home/account-consumption.component.scss
new file mode 100644
index 0000000000..84480475a4
--- /dev/null
+++ b/libs/common/src/lib/account/account-home/account-consumption.component.scss
@@ -0,0 +1,87 @@
+@use 'apps/dashboard/src/variables' as *;
+@use '../account';
+
+.consumption-summary {
+  display: flex;
+  flex-direction: column;
+  gap: rhythm(4);
+  margin-top: rhythm(4);
+}
+
+.summary-section {
+  display: flex;
+  flex-direction: column;
+  gap: 0;
+
+  h3 {
+    margin: 0;
+  }
+
+  .title-s {
+    margin: 0;
+  }
+}
+
+.kb-summary-list {
+  list-style: none;
+  padding: 0;
+  margin: 0;
+  display: flex;
+  flex-direction: column;
+  gap: rhythm(1.5);
+  max-width: 300px;
+}
+
+.kb-summary-item {
+  display: flex;
+  justify-content: flex-start;
+  align-items: center;
+  padding: rhythm(1.5) 0;
+  background: $color-light-stronger;
+  border-radius: rhythm(0.5);
+  color: inherit;
+  cursor: pointer;
+  gap: rhythm(1.5);
+
+  &.disabled {
+    opacity: 0.5;
+    cursor: not-allowed;
+  }
+
+  .kb-info {
+    display: flex;
+    align-items: center;
+    gap: rhythm(1);
+
+    .kb-title {
+      word-break: break-word;
+    }
+
+    .lock-icon {
+      flex-shrink: 0;
+    }
+  }
+
+  .kb-tokens {
+    color: $color-neutral-regular;
+    font-size: 0.875rem;
+    flex-shrink: 0;
+  }
+}
+
+.queries-grid {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  gap: rhythm(2);
+  margin-top: rhythm(1);
+  max-width: 500px;
+}
+
+.query-stat {
+  display: flex;
+  flex-direction: column;
+  gap: rhythm(0.5);
+  padding: rhythm(2) 0;
+  background: $color-light-stronger;
+  border-radius: rhythm(0.5);
+}
diff --git a/libs/common/src/lib/account/account-home/account-consumption.component.ts b/libs/common/src/lib/account/account-home/account-consumption.component.ts
new file mode 100644
index 0000000000..432b13fa53
--- /dev/null
+++ b/libs/common/src/lib/account/account-home/account-consumption.component.ts
@@ -0,0 +1,84 @@
+import { ChangeDetectionStrategy, ChangeDetectorRef, Component, inject, OnDestroy, OnInit } from '@angular/core';
+import { SDKService } from '@flaps/core';
+import { UsagePoint, UsageType } from '@nuclia/core';
+import { combineLatest, forkJoin, map, ReplaySubject, shareReplay, Subject, switchMap, takeUntil } from 'rxjs';
+import { MetricsService } from '../metrics.service';
+
+@Component({
+  selector: 'app-account-consumption',
+  templateUrl: './account-consumption.component.html',
+  styleUrl: './account-consumption.component.scss',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  standalone: false,
+})
+export class AccountConsumptionComponent implements OnInit, OnDestroy {
+  private metrics = inject(MetricsService);
+  private sdk = inject(SDKService);
+  private cdr = inject(ChangeDetectorRef);
+
+  private unsubscribeAll = new Subject<void>();
+
+  selectedPeriod = new ReplaySubject<{ start: Date; end: Date }>(1);
+
+  usage?: { [key: string]: UsagePoint[] };
+  tokensCount?: { [key: string]: number };
+
+  kbs = this.sdk.kbList;
+  totalQueries = this.metrics.getUsageCount(UsageType.SEARCHES_PERFORMED);
+
+  ngOnInit() {
+    this.metrics.period.pipe(takeUntil(this.unsubscribeAll)).subscribe((period) => {
+      this.selectedPeriod.next(period);
+    });
+
+    this.getUsageMap()
+      .pipe(takeUntil(this.unsubscribeAll))
+      .subscribe((usage) => {
+        this.usage = usage;
+        this.tokensCount = Object.entries(usage).reduce(
+          (acc, [key, value]) => {
+            if (key !== 'account') {
+              acc[key] = value[0]?.metrics?.find((m) => m.name === 'nuclia_tokens_billed')?.value || 0;
+            }
+            return acc;
+          },
+          {} as { [key: string]: number },
+        );
+        this.cdr.markForCheck();
+      });
+  }
+
+  ngOnDestroy() {
+    this.unsubscribeAll.next();
+    this.unsubscribeAll.complete();
+  }
+
+  private getUsageMap() {
+    return combineLatest([this.metrics.account$, this.selectedPeriod, this.kbs]).pipe(
+      switchMap(([account, period, kbs]) => {
+        const requests = kbs
+          .map((kb) =>
+            this.sdk.nuclia.db
+              .getUsage(account.id, period.start.toISOString(), period.end.toISOString(), kb.id)
+              .pipe(map((usage) => ({ key: kb.id, usage }))),
+          )
+          .concat([
+            this.sdk.nuclia.db
+              .getUsage(account.id, period.start.toISOString(), period.end.toISOString())
+              .pipe(map((usage) => ({ key: 'account', usage }))),
+          ]);
+        return forkJoin(requests);
+      }),
+      map((usage) =>
+        usage.reduce(
+          (acc, curr) => {
+            acc[curr.key] = curr.usage;
+            return acc;
+          },
+          {} as { [key: string]: UsagePoint[] },
+        ),
+      ),
+      shareReplay(1),
+    );
+  }
+}
diff --git a/libs/common/src/lib/account/account-home/account-settings.component.html b/libs/common/src/lib/account/account-home/account-settings.component.html
new file mode 100644
index 0000000000..ea959e3287
--- /dev/null
+++ b/libs/common/src/lib/account/account-home/account-settings.component.html
@@ -0,0 +1,54 @@
+<app-account-page-layout
+  [title]="'account.account-title' | translate"
+  [description]="'account.settings-description' | translate"
+  [backLink]="backLink | async"
+  panelId="settings-section-panel">
+  @if (isTrial | async) {
+    <div
+      top
+      class="trial-status-top">
+      <app-account-status (upgradeClick)="navigateTo('subscriptions')"></app-account-status>
+    </div>
+  }
+
+  <pa-tabs
+    tabs
+    class="settings-tabs">
+    <pa-tab
+      routerLink="consumption"
+      routerLinkActive
+      #rla0="routerLinkActive"
+      [active]="rla0.isActive"
+      ariaControls="settings-section-panel">
+      {{ 'account.consumption' | translate }}
+    </pa-tab>
+    @if (showSubscriptionsTab | async) {
+      <pa-tab
+        routerLink="subscriptions"
+        routerLinkActive
+        #rla1="routerLinkActive"
+        [active]="rla1.isActive"
+        ariaControls="settings-section-panel">
+        {{ 'account.billing' | translate }}
+      </pa-tab>
+    }
+    <pa-tab
+      routerLink="preferences"
+      routerLinkActive
+      #rla2="routerLinkActive"
+      [active]="rla2.isActive"
+      ariaControls="settings-section-panel">
+      {{ 'generic.user_preferences' | translate }}
+    </pa-tab>
+    @if (showAccountSettingsTab | async) {
+      <pa-tab
+        routerLink="account-settings"
+        routerLinkActive
+        #rla3="routerLinkActive"
+        [active]="rla3.isActive"
+        ariaControls="settings-section-panel">
+        {{ 'account.manage' | translate }}
+      </pa-tab>
+    }
+  </pa-tabs>
+</app-account-page-layout>
diff --git a/libs/common/src/lib/account/account-home/account-settings.component.scss b/libs/common/src/lib/account/account-home/account-settings.component.scss
new file mode 100644
index 0000000000..b2790002a5
--- /dev/null
+++ b/libs/common/src/lib/account/account-home/account-settings.component.scss
@@ -0,0 +1,12 @@
+@use 'apps/dashboard/src/variables' as *;
+
+.trial-status-top {
+  background: $color-light-stronger;
+  border: 1px solid $color-neutral-lighter;
+  border-radius: rhythm(1);
+  display: inline-block;
+  max-width: 100%;
+  margin-bottom: rhythm(4);
+  padding: rhythm(2) rhythm(2.5) rhythm(1.5);
+  width: fit-content;
+}
diff --git a/libs/common/src/lib/account/account-home/account-settings.component.ts b/libs/common/src/lib/account/account-home/account-settings.component.ts
new file mode 100644
index 0000000000..963f9421a3
--- /dev/null
+++ b/libs/common/src/lib/account/account-home/account-settings.component.ts
@@ -0,0 +1,38 @@
+import { ChangeDetectionStrategy, Component, inject } from '@angular/core';
+import { BackendConfigurationService, FeaturesService } from '@flaps/core';
+import { combineLatest, map, shareReplay } from 'rxjs';
+import { AccountPageBase } from '../account-page-base';
+
+@Component({
+  selector: 'app-account-settings',
+  templateUrl: './account-settings.component.html',
+  styleUrl: './account-settings.component.scss',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  standalone: false,
+})
+export class AccountSettingsComponent extends AccountPageBase {
+  private features = inject(FeaturesService);
+  private backendConfig = inject(BackendConfigurationService);
+
+  isTrial = this.features.isTrial;
+  isCowork = this.sdk.currentAccount.pipe(
+    map((account) => account.workflow === 'cowork'),
+    shareReplay(1),
+  );
+  isBillingEnabled = this.features.unstable.billing;
+  noStripe = this.backendConfig.noStripe();
+
+  showSubscriptionsTab = combineLatest([this.isBillingEnabled, this.features.isAccountManager]).pipe(
+    map(([billing, isManager]) => !!billing && !!isManager && !this.noStripe),
+    shareReplay(1),
+  );
+
+  showAccountSettingsTab = combineLatest([this.features.isAccountManager, this.isCowork]).pipe(
+    map(([isManager, isCowork]) => !!isManager && !isCowork),
+    shareReplay(1),
+  );
+
+  navigateTo(path: string) {
+    this.router.navigate([path], { relativeTo: this.route });
+  }
+}
diff --git a/libs/common/src/lib/account/account-home/simple-account-home.component.html b/libs/common/src/lib/account/account-home/simple-account-home.component.html
index 4018535e1d..dfbf90d3b8 100644
--- a/libs/common/src/lib/account/account-home/simple-account-home.component.html
+++ b/libs/common/src/lib/account/account-home/simple-account-home.component.html
@@ -6,7 +6,7 @@
   }
 
   <div class="settings-header">
-    <h1 class="page-title">{{ 'generic.settings' | translate }}</h1>
+    <h1 class="page-title">{{ 'account.account-title' | translate }}</h1>
     <p class="page-description">{{ 'account.settings-description' | translate }}</p>
   </div>
 
diff --git a/libs/common/src/lib/account/account-kbs/kb-list/kb-list.component.html b/libs/common/src/lib/account/account-kbs/kb-list/kb-list.component.html
index 3c8f0e9c1d..8505655dae 100644
--- a/libs/common/src/lib/account/account-kbs/kb-list/kb-list.component.html
+++ b/libs/common/src/lib/account/account-kbs/kb-list/kb-list.component.html
@@ -5,8 +5,8 @@
 }
 
 @if (account && knowledgeBoxes) {
-  <div class="account-kbs page-spacing">
-    <h1 class="page-title">{{ 'account.related_kbs' | translate }}</h1>
+  <div class="account-kbs">
+    <h2 class="page-subtitle">{{ 'account.related_kbs' | translate }}</h2>
 
     <p class="page-description">{{ 'account.kb-description' | translate }}</p>
 
@@ -67,24 +67,21 @@ <h1 class="page-title">{{ 'account.related_kbs' | translate }}</h1>
     }
 
     @if (canAddKb | async) {
-      <nsi-sticky-footer>
-        @if (knowledgeBoxes.length > 0 && maxKnowledgeBoxes !== -1) {
-          <div
-            footerNote
-            class="account-kbs-counter">
-            {{ 'account.kb.count' | translate: { count: knowledgeBoxes.length, max: maxKnowledgeBoxes } }}
-          </div>
-        }
+      @if (knowledgeBoxes.length > 0 && maxKnowledgeBoxes !== -1) {
+        <div class="account-kbs-counter">
+          {{ 'account.kb.count' | translate: { count: knowledgeBoxes.length, max: maxKnowledgeBoxes } }}
+        </div>
+      }
 
-        <pa-button
-          aspect="basic"
-          size="small"
-          data-cy="add-kb"
-          [disabled]="knowledgeBoxes.length >= maxKnowledgeBoxes && maxKnowledgeBoxes !== -1"
-          routerLink="./create">
-          {{ 'account.kb.create' | translate }}
-        </pa-button>
-      </nsi-sticky-footer>
+      <pa-button
+        kind="primary"
+        aspect="solid"
+        data-cy="add-kb"
+        [disabled]="knowledgeBoxes.length >= maxKnowledgeBoxes && maxKnowledgeBoxes !== -1"
+        [routerLink]="['/at', account.slug, 'manage', 'administration', 'knowledge-boxes', 'create']"
+        class="add-kb-button">
+        {{ 'account.kb.create' | translate }}
+      </pa-button>
     }
   </div>
 }
diff --git a/libs/common/src/lib/account/account-kbs/kb-list/kb-list.component.scss b/libs/common/src/lib/account/account-kbs/kb-list/kb-list.component.scss
index ca582a61df..e67d173aed 100644
--- a/libs/common/src/lib/account/account-kbs/kb-list/kb-list.component.scss
+++ b/libs/common/src/lib/account/account-kbs/kb-list/kb-list.component.scss
@@ -1,13 +1,17 @@
 @use 'apps/dashboard/src/variables' as *;
+@use '../../account';
 
 .account-kbs {
+  min-height: auto;
+  padding: 0;
+
   h2 {
     margin: 0 0 rhythm(1) 0;
   }
 
   .account-kbs-list {
     margin-top: rhythm(5);
-    max-width: $width-large-screen;
+    max-width: 640px;
   }
 
   .account-kb {
@@ -37,17 +41,16 @@
 
   &-counter {
     font-weight: var(--stf-font-weight-semibold);
+    margin-top: rhythm(4);
+    margin-bottom: rhythm(2);
   }
 
-  &-empty {
-    font-style: italic;
+  .add-kb-button {
+    margin-top: rhythm(3);
   }
 
-  .add-kb-container {
-    align-items: center;
-    display: flex;
-    gap: rhythm(3);
-    margin-top: rhythm(3);
+  &-empty {
+    font-style: italic;
   }
 }
 
diff --git a/libs/common/src/lib/account/account-manage/account-manage.component.html b/libs/common/src/lib/account/account-manage/account-manage.component.html
index 31b5db1341..f6381f511e 100644
--- a/libs/common/src/lib/account/account-manage/account-manage.component.html
+++ b/libs/common/src/lib/account/account-manage/account-manage.component.html
@@ -1,148 +1,146 @@
-<div class="page-spacing">
-  <div
-    class="section"
-    id="account">
-    <div class="section-container">
-      <h1>{{ 'account.manage' | translate }}</h1>
-      <form
-        [formGroup]="accountForm"
-        (ngSubmit)="saveAccount()">
-        <pa-input
-          id="account-uid"
-          formControlName="id"
-          readonly>
-          {{ 'generic.uid' | translate }}
-        </pa-input>
-        <pa-input
-          id="account-slug"
-          formControlName="slug">
-          {{ 'generic.slug' | translate }}
-        </pa-input>
-        <pa-input
-          id="account-title"
-          formControlName="title"
-          [errorMessages]="validationMessages.title">
-          {{ 'account.title' | translate }}
-        </pa-input>
+<div
+  class="section"
+  id="account">
+  <div class="section-container">
+    <h2 class="page-subtitle">{{ 'account.manage' | translate }}</h2>
+    <form
+      [formGroup]="accountForm"
+      (ngSubmit)="saveAccount()">
+      <pa-input
+        id="account-uid"
+        formControlName="id"
+        readonly>
+        {{ 'generic.uid' | translate }}
+      </pa-input>
+      <pa-input
+        id="account-slug"
+        formControlName="slug">
+        {{ 'generic.slug' | translate }}
+      </pa-input>
+      <pa-input
+        id="account-title"
+        formControlName="title"
+        [errorMessages]="validationMessages.title">
+        {{ 'account.title' | translate }}
+      </pa-input>
 
-        <pa-textarea
-          id="account-description"
-          formControlName="description"
-          [rows]="4">
-          {{ 'generic.description' | translate }}
-        </pa-textarea>
+      <pa-textarea
+        id="account-description"
+        formControlName="description"
+        [rows]="4">
+        {{ 'generic.description' | translate }}
+      </pa-textarea>
 
-        <div class="account-form-cta">
+      <div class="account-form-cta">
+        <pa-button
+          type="submit"
+          kind="primary"
+          [disabled]="accountForm.invalid || accountForm.pristine">
+          {{ 'generic.save' | translate }}
+        </pa-button>
+
+        @if (!accountForm.pristine) {
           <pa-button
-            type="submit"
-            kind="primary"
-            [disabled]="accountForm.invalid || accountForm.pristine">
-            {{ 'generic.save' | translate }}
+            aspect="basic"
+            (click)="initAccountForm()">
+            {{ 'generic.cancel' | translate }}
           </pa-button>
-
-          @if (!accountForm.pristine) {
-            <pa-button
-              aspect="basic"
-              (click)="initAccountForm()">
-              {{ 'generic.cancel' | translate }}
-            </pa-button>
-          }
-        </div>
-      </form>
-    </div>
+        }
+      </div>
+    </form>
   </div>
+</div>
 
-  <div class="section">
-    <div class="section-container">
-      <h3 class="title-m">{{ 'account.saml.title' | translate }}</h3>
-      <form
-        [formGroup]="samlForm"
-        (ngSubmit)="saveSaml()">
-        <pa-input
-          formControlName="domains"
-          [help]="'account.saml.domains-help' | translate">
-          {{ 'account.saml.domains' | translate }}
-        </pa-input>
-        <pa-input formControlName="entity_id">
-          {{ 'account.saml.entity-id' | translate }}
-        </pa-input>
-        <pa-input formControlName="sso_url">
-          {{ 'account.saml.sso-url' | translate }}
-        </pa-input>
-        <pa-textarea
-          formControlName="x509_cert"
-          rows="3">
-          {{ 'account.saml.x509-cert' | translate }}
-        </pa-textarea>
-        <pa-select
-          formControlName="authn_context"
-          [label]="'account.saml.authn_context' | translate">
-          <pa-option value="">&mdash;</pa-option>
-          <pa-option value="exact">exact</pa-option>
-          <pa-option value="minimum">minimum</pa-option>
-          <pa-option value="better">better</pa-option>
-          <pa-option value="maximum">maximum</pa-option>
-        </pa-select>
-        <div class="account-form-cta">
+<div class="section">
+  <div class="section-container">
+    <h2 class="page-subtitle">{{ 'account.saml.title' | translate }}</h2>
+    <form
+      [formGroup]="samlForm"
+      (ngSubmit)="saveSaml()">
+      <pa-input
+        formControlName="domains"
+        [help]="'account.saml.domains-help' | translate">
+        {{ 'account.saml.domains' | translate }}
+      </pa-input>
+      <pa-input formControlName="entity_id">
+        {{ 'account.saml.entity-id' | translate }}
+      </pa-input>
+      <pa-input formControlName="sso_url">
+        {{ 'account.saml.sso-url' | translate }}
+      </pa-input>
+      <pa-textarea
+        formControlName="x509_cert"
+        rows="3">
+        {{ 'account.saml.x509-cert' | translate }}
+      </pa-textarea>
+      <pa-select
+        formControlName="authn_context"
+        [label]="'account.saml.authn_context' | translate">
+        <pa-option value="">&mdash;</pa-option>
+        <pa-option value="exact">exact</pa-option>
+        <pa-option value="minimum">minimum</pa-option>
+        <pa-option value="better">better</pa-option>
+        <pa-option value="maximum">maximum</pa-option>
+      </pa-select>
+      <div class="account-form-cta">
+        <pa-button
+          type="submit"
+          kind="primary"
+          [disabled]="samlForm.invalid || samlForm.pristine">
+          {{ 'generic.save' | translate }}
+        </pa-button>
+        <pa-button
+          kind="destructive"
+          (click)="removeSaml()">
+          {{ 'generic.delete' | translate }}
+        </pa-button>
+        @if (!samlForm.pristine) {
           <pa-button
-            type="submit"
-            kind="primary"
-            [disabled]="samlForm.invalid || samlForm.pristine">
-            {{ 'generic.save' | translate }}
+            aspect="basic"
+            (click)="initSamlForm()">
+            {{ 'generic.cancel' | translate }}
           </pa-button>
+        }
+      </div>
+    </form>
+  </div>
+</div>
+
+<div class="section">
+  <div class="section-container">
+    <div class="dangerous-zone">
+      <h2 class="page-subtitle">{{ 'account.delete_account' | translate }}</h2>
+      @if ((cannotDeleteAccount | async) === false) {
+        <div>
+          <p class="page-description">{{ 'account.delete_account_warning_1' | translate }}</p>
+          <ul>
+            <li>{{ 'account.delete_account_warning_2' | translate }}</li>
+            <li>{{ 'account.delete_account_warning_3' | translate }}</li>
+            <li>{{ 'account.delete_account_warning_4' | translate }}</li>
+          </ul>
           <pa-button
             kind="destructive"
-            (click)="removeSaml()">
+            (click)="deleteAccount()">
             {{ 'generic.delete' | translate }}
           </pa-button>
-          @if (!samlForm.pristine) {
-            <pa-button
-              aspect="basic"
-              (click)="initSamlForm()">
-              {{ 'generic.cancel' | translate }}
-            </pa-button>
+        </div>
+      } @else if ((cannotDeleteAccount | async) === true) {
+        <div>
+          <p class="page-description">{{ 'account.delete.active-subscription' | translate }}</p>
+          @if (isSubscribedToStripe | async) {
+            <p>
+              {{ 'account.delete.subscription-details' | translate }}
+              <a [routerLink]="stripeSubscriptionUrl | async">{{ 'billing.my-subscription' | translate }}</a>
+            </p>
+          }
+          @if (isSubscribedToAws | async) {
+            <p>
+              {{ 'account.delete.subscription-details' | translate }}
+              <a [routerLink]="awsSubscriptionUrl | async">{{ 'navbar.subscription' | translate }}</a>
+            </p>
           }
         </div>
-      </form>
-    </div>
-  </div>
-
-  <div class="section">
-    <div class="section-container">
-      <div class="dangerous-zone">
-        <h3>{{ 'account.delete_account' | translate }}</h3>
-        @if ((cannotDeleteAccount | async) === false) {
-          <div>
-            <p>{{ 'account.delete_account_warning_1' | translate }}</p>
-            <ul>
-              <li>{{ 'account.delete_account_warning_2' | translate }}</li>
-              <li>{{ 'account.delete_account_warning_3' | translate }}</li>
-              <li>{{ 'account.delete_account_warning_4' | translate }}</li>
-            </ul>
-            <pa-button
-              kind="destructive"
-              (click)="deleteAccount()">
-              {{ 'generic.delete' | translate }}
-            </pa-button>
-          </div>
-        } @else if ((cannotDeleteAccount | async) === true) {
-          <div>
-            <p>{{ 'account.delete.active-subscription' | translate }}</p>
-            @if (isSubscribedToStripe | async) {
-              <p>
-                {{ 'account.delete.subscription-details' | translate }}
-                <a [routerLink]="stripeSubscriptionUrl | async">{{ 'billing.my-subscription' | translate }}</a>
-              </p>
-            }
-            @if (isSubscribedToAws | async) {
-              <p>
-                {{ 'account.delete.subscription-details' | translate }}
-                <a [routerLink]="awsSubscriptionUrl | async">{{ 'navbar.subscription' | translate }}</a>
-              </p>
-            }
-          </div>
-        }
-      </div>
+      }
     </div>
   </div>
 </div>
diff --git a/libs/common/src/lib/account/account-manage/account-manage.component.scss b/libs/common/src/lib/account/account-manage/account-manage.component.scss
index a81f9f3d04..f297928596 100644
--- a/libs/common/src/lib/account/account-manage/account-manage.component.scss
+++ b/libs/common/src/lib/account/account-manage/account-manage.component.scss
@@ -1,7 +1,8 @@
 @use 'apps/dashboard/src/variables' as *;
+@use '../account';
 
-h1 {
-  margin-bottom: rhythm(4);
+.page-subtitle {
+  margin-bottom: rhythm(2);
 }
 .section {
   border-bottom: 1px solid $color-neutral-light;
diff --git a/libs/common/src/lib/account/account-manage/account-manage.component.ts b/libs/common/src/lib/account/account-manage/account-manage.component.ts
index 5d8148dd9b..b629c840c1 100644
--- a/libs/common/src/lib/account/account-manage/account-manage.component.ts
+++ b/libs/common/src/lib/account/account-manage/account-manage.component.ts
@@ -1,9 +1,16 @@
-import { ChangeDetectionStrategy, ChangeDetectorRef, Component, OnDestroy, OnInit } from '@angular/core';
+import { ChangeDetectionStrategy, ChangeDetectorRef, Component, inject, OnDestroy, OnInit } from '@angular/core';
 import { UntypedFormBuilder, Validators } from '@angular/forms';
 import { Router } from '@angular/router';
 import { Subject } from 'rxjs';
 import { catchError, concatMap, map, shareReplay, takeUntil, tap } from 'rxjs/operators';
-import { AccountVerificationService, BillingService, NavigationService, SDKService, STFUtils, SubscriptionStatus } from '@flaps/core';
+import {
+  AccountVerificationService,
+  BillingService,
+  NavigationService,
+  SDKService,
+  STFUtils,
+  SubscriptionStatus,
+} from '@flaps/core';
 import { Account, SamlConfig } from '@nuclia/core';
 import { IErrorMessages } from '@guillotinaweb/pastanaga-angular';
 import { SisModalService, SisToastService } from '@nuclia/sistema';
diff --git a/libs/common/src/lib/account/account-models/account-models.component.html b/libs/common/src/lib/account/account-models/account-models.component.html
index e805b8f596..c24364f13d 100644
--- a/libs/common/src/lib/account/account-models/account-models.component.html
+++ b/libs/common/src/lib/account/account-models/account-models.component.html
@@ -1,151 +1,133 @@
-<div class="account-models page-spacing">
-  <div class="account-models-header">
-    <div>
-      <h1 class="page-title">{{ 'account.models.title' | translate }}</h1>
-      <p class="page-description">{{ 'account.models.description' | translate }}</p>
+<div class="account-models">
+  <div class="models-section">
+    <div class="models-section-header">
+      <div class="models-section-title">
+        <h2 class="page-subtitle">{{ 'account.models.model-configs.title' | translate }}</h2>
+        <p class="page-description">{{ 'account.models.model-configs.description' | translate }}</p>
+      </div>
+    </div>
+    <div class="configs">
+      @if (modelConfigs | async; as configs) {
+        @if (configs.length > 0) {
+          <pa-table
+            columns="1fr 35% 1fr 60px"
+            border>
+            <pa-table-header>
+              <pa-table-cell header>
+                {{ 'account.models.model-configs.generative-model' | translate }}
+              </pa-table-cell>
+              <pa-table-cell header>{{ 'generic.description' | translate }}</pa-table-cell>
+              <pa-table-cell header>{{ 'generic.zone' | translate }}</pa-table-cell>
+              <pa-table-cell header></pa-table-cell>
+            </pa-table-header>
+            @for (config of configs; track config.id) {
+              <pa-table-row
+                clickable
+                (click)="displayConfig(config)">
+                <pa-table-cell class="body-m">{{ config.default_model_id }}</pa-table-cell>
+                <pa-table-cell class="body-s">
+                  <span paEllipsisTooltip>{{ config.description }}</span>
+                </pa-table-cell>
+                <pa-table-cell class="body-m">{{ config.zone }}</pa-table-cell>
+                <pa-table-cell>
+                  <pa-button
+                    icon="trash"
+                    kind="destructive"
+                    aspect="basic"
+                    size="small"
+                    (click)="deleteConfig(config, $event)">
+                    {{ 'generic.delete' | translate }}
+                  </pa-button>
+                </pa-table-cell>
+              </pa-table-row>
+            }
+          </pa-table>
+        }
+      }
+      <pa-button
+        iconAndText
+        icon="circle-plus"
+        aspect="basic"
+        class="create-model-button"
+        (click)="createConfig()">
+        {{ 'account.models.model-configs.create' | translate }}
+      </pa-button>
     </div>
   </div>
 
-  <pa-tabs notFullWidth>
-    <pa-tab
-      [active]="selectedTab === 'settings'"
-      (click)="selectedTab = 'settings'">
-      {{ 'generic.settings' | translate }}
-    </pa-tab>
-    <pa-tab
-      [active]="selectedTab === 'restrictions'"
-      (click)="selectedTab = 'restrictions'">
-      {{ 'account.models.restrictions.title' | translate }}
-    </pa-tab>
-  </pa-tabs>
-
-  @if (selectedTab === 'settings') {
+  @if ((isBedrockIntegrationEnabled | async) && ((awsZones | async) || []).length > 0) {
     <nsi-two-columns-configuration-item
-      itemTitle="account.models.model-configs.title"
-      description="account.models.model-configs.description"
-      noTopBorder>
-      <div class="configs">
-        @if (modelConfigs | async; as configs) {
-          @if (configs.length > 0) {
+      itemTitle="account.models.bedrock.title"
+      description="account.models.bedrock.description">
+      @if (loadingBedrock) {
+        <nsi-spinner></nsi-spinner>
+      } @else {
+        <div>
+          @if (bedrockIntegrations | async; as integrations) {
             <pa-table
-              columns="1fr 35% 1fr 60px"
+              columns="1fr 1fr 1fr"
               border>
               <pa-table-header>
-                <pa-table-cell header>
-                  {{ 'account.models.model-configs.generative-model' | translate }}
-                </pa-table-cell>
-                <pa-table-cell header>{{ 'generic.description' | translate }}</pa-table-cell>
                 <pa-table-cell header>{{ 'generic.zone' | translate }}</pa-table-cell>
+                <pa-table-cell header>{{ 'generic.status' | translate }}</pa-table-cell>
                 <pa-table-cell header></pa-table-cell>
               </pa-table-header>
-              @for (config of configs; track config.id) {
-                <pa-table-row
-                  clickable
-                  (click)="displayConfig(config)">
-                  <pa-table-cell class="body-m">{{ config.default_model_id }}</pa-table-cell>
-                  <pa-table-cell class="body-s">
-                    <span paEllipsisTooltip>{{ config.description }}</span>
+              @for (integration of integrations; track integration.zone.slug) {
+                <pa-table-row>
+                  <pa-table-cell class="body-m">{{ integration.zone.slug }}</pa-table-cell>
+                  <pa-table-cell class="body-m">
+                    <div class="status">
+                      @if (integration.status === 'none') {
+                        -
+                      } @else {
+                        {{ 'account.models.bedrock.status.' + integration.status | translate }}
+                        @if (integration.errorMessage) {
+                          <pa-icon
+                            class="error"
+                            name="info"
+                            size="small"
+                            [paPopover]="error"></pa-icon>
+                          <pa-popover #error>
+                            <div class="body-s">{{ integration.errorMessage }}</div>
+                          </pa-popover>
+                        }
+                      }
+                    </div>
                   </pa-table-cell>
-                  <pa-table-cell class="body-m">{{ config.zone }}</pa-table-cell>
                   <pa-table-cell>
-                    <pa-button
-                      icon="trash"
-                      kind="destructive"
-                      aspect="basic"
-                      size="small"
-                      (click)="deleteConfig(config, $event)">
-                      {{ 'generic.delete' | translate }}
-                    </pa-button>
+                    <div class="align-right">
+                      @if (integration.status === 'none') {
+                        <pa-button
+                          iconAndText
+                          icon="gear"
+                          aspect="basic"
+                          size="small"
+                          (click)="setupIntegration(integration.zone.slug)">
+                          {{ 'account.models.bedrock.set-up' | translate }}
+                        </pa-button>
+                      } @else {
+                        <pa-button
+                          icon="trash"
+                          kind="destructive"
+                          aspect="basic"
+                          size="small"
+                          (click)="deleteIntegration(integration.zone.slug)">
+                          {{ 'generic.delete' | translate }}
+                        </pa-button>
+                      }
+                    </div>
                   </pa-table-cell>
                 </pa-table-row>
               }
             </pa-table>
           }
-        }
-        <div class="create">
-          <pa-button
-            iconAndText
-            icon="circle-plus"
-            aspect="basic"
-            (click)="createConfig()">
-            {{ 'account.models.model-configs.create' | translate }}
-          </pa-button>
         </div>
-      </div>
+      }
     </nsi-two-columns-configuration-item>
-
-    @if ((isBedrockIntegrationEnabled | async) && ((awsZones | async) || []).length > 0) {
-      <nsi-two-columns-configuration-item
-        itemTitle="account.models.bedrock.title"
-        description="account.models.bedrock.description">
-        @if (loadingBedrock) {
-          <nsi-spinner></nsi-spinner>
-        } @else {
-          <div>
-            @if (bedrockIntegrations | async; as integrations) {
-              <pa-table
-                columns="1fr 1fr 1fr"
-                border>
-                <pa-table-header>
-                  <pa-table-cell header>{{ 'generic.zone' | translate }}</pa-table-cell>
-                  <pa-table-cell header>{{ 'generic.status' | translate }}</pa-table-cell>
-                  <pa-table-cell header></pa-table-cell>
-                </pa-table-header>
-                @for (integration of integrations; track integration.zone.slug) {
-                  <pa-table-row>
-                    <pa-table-cell class="body-m">{{ integration.zone.slug }}</pa-table-cell>
-                    <pa-table-cell class="body-m">
-                      <div class="status">
-                        @if (integration.status === 'none') {
-                          -
-                        } @else {
-                          {{ 'account.models.bedrock.status.' + integration.status | translate }}
-                          @if (integration.errorMessage) {
-                            <pa-icon
-                              class="error"
-                              name="info"
-                              size="small"
-                              [paPopover]="error"></pa-icon>
-                            <pa-popover #error>
-                              <div class="body-s">{{ integration.errorMessage }}</div>
-                            </pa-popover>
-                          }
-                        }
-                      </div>
-                    </pa-table-cell>
-                    <pa-table-cell>
-                      <div class="align-right">
-                        @if (integration.status === 'none') {
-                          <pa-button
-                            iconAndText
-                            icon="gear"
-                            aspect="basic"
-                            size="small"
-                            (click)="setupIntegration(integration.zone.slug)">
-                            {{ 'account.models.bedrock.set-up' | translate }}
-                          </pa-button>
-                        } @else {
-                          <pa-button
-                            icon="trash"
-                            kind="destructive"
-                            aspect="basic"
-                            size="small"
-                            (click)="deleteIntegration(integration.zone.slug)">
-                            {{ 'generic.delete' | translate }}
-                          </pa-button>
-                        }
-                      </div>
-                    </pa-table-cell>
-                  </pa-table-row>
-                }
-              </pa-table>
-            }
-          </div>
-        }
-      </nsi-two-columns-configuration-item>
-    }
   }
-  @if (selectedTab === 'restrictions') {
+
+  <div class="models-section">
+    <h2 class="page-subtitle">{{ 'account.models.restrictions.title' | translate }}</h2>
     <app-model-restrictions></app-model-restrictions>
-  }
+  </div>
 </div>
diff --git a/libs/common/src/lib/account/account-models/account-models.component.scss b/libs/common/src/lib/account/account-models/account-models.component.scss
index 846bf20550..469b1a9ab8 100644
--- a/libs/common/src/lib/account/account-models/account-models.component.scss
+++ b/libs/common/src/lib/account/account-models/account-models.component.scss
@@ -1,19 +1,41 @@
 @use 'apps/dashboard/src/variables' as *;
+@use '../account';
 
 .account-models {
-  .account-models-header {
-    margin-bottom: rhythm(4);
+  .models-section {
+    margin-bottom: rhythm(3);
+
+    &:first-of-type {
+      margin-top: rhythm(1);
+    }
   }
 
-  pa-tabs {
-    display: block;
-    margin-bottom: rhythm(4);
+  .models-section-header {
+    display: flex;
+    align-items: flex-start;
+    justify-content: space-between;
+    gap: rhythm(2);
+    margin-bottom: rhythm(2);
+
+    pa-button {
+      flex-shrink: 0;
+    }
   }
 
   .configs {
     display: flex;
     flex-direction: column;
     gap: rhythm(2);
+
+    .create-model-button {
+      display: block;
+      margin-top: rhythm(3);
+    }
+  }
+
+  .models-section-title p {
+    margin: 0;
+    opacity: 0.75;
   }
 
   .create {
diff --git a/libs/common/src/lib/account/account-models/account-models.component.ts b/libs/common/src/lib/account/account-models/account-models.component.ts
index 4725117998..9a3145c9ae 100644
--- a/libs/common/src/lib/account/account-models/account-models.component.ts
+++ b/libs/common/src/lib/account/account-models/account-models.component.ts
@@ -15,7 +15,6 @@ import {
   PaIconModule,
   PaPopupModule,
   PaTableModule,
-  PaTabsModule,
   PaTooltipModule,
 } from '@guillotinaweb/pastanaga-angular';
 import { TranslateModule } from '@ngx-translate/core';
@@ -49,7 +48,6 @@ interface BedrockIntegration extends BedrockStatus {
     PaIconModule,
     PaPopupModule,
     PaTableModule,
-    PaTabsModule,
     PaTooltipModule,
     SisProgressModule,
     TranslateModule,
@@ -68,8 +66,8 @@ export class AccountModelsComponent implements OnInit {
   private toaster = inject(SisToastService);
   private cdr = inject(ChangeDetectorRef);
 
+  // Always rendered as a tab inside AccountConfigurationComponent
   modelConfigs = new ReplaySubject<ModelConfigurationWithZone[]>(1);
-  selectedTab: 'settings' | 'restrictions' = 'settings';
   zones = this.zoneService.getZones().pipe(shareReplay(1));
 
   awsZones = this.zones.pipe(
diff --git a/libs/common/src/lib/account/account-nua/account-nua.component.html b/libs/common/src/lib/account/account-nua/account-nua.component.html
index 8a324470ae..b243e1cae0 100644
--- a/libs/common/src/lib/account/account-nua/account-nua.component.html
+++ b/libs/common/src/lib/account/account-nua/account-nua.component.html
@@ -1,20 +1,10 @@
-<div class="page-spacing">
-  <h1>{{ 'account.nua_keys' | translate }}</h1>
-  <div class="warning">
-    <pa-icon name="warning"></pa-icon>
-    {{ 'api-key-management.description' | translate }}
-  </div>
+<h2 class="page-subtitle">{{ 'account.nua_keys' | translate }}</h2>
+<p class="page-description">{{ 'api-key-management.description' | translate }}</p>
 
-  <pa-button
-    class="create-nua-button"
-    data-cy="open-create-nua-key-dialog"
-    (click)="openDialog()">
-    {{ 'account.create_nua_key' | translate }}
-  </pa-button>
-
-  @if (clients$ | async; as clients) {
+@if (clients$ | async; as clients) {
+  @if (clients.length > 0) {
     <div class="container">
-      <h4>{{ 'account.existing_keys' | translate }}</h4>
+      <h3 class="title-s">{{ 'account.existing_keys' | translate }}</h3>
       @for (client of clients; track client.client_id) {
         <div class="client-row">
           <div
@@ -65,4 +55,12 @@ <h4>{{ 'account.existing_keys' | translate }}</h4>
       }
     </div>
   }
-</div>
+
+  <pa-button
+    kind="primary"
+    class="create-nua-button"
+    data-cy="open-create-nua-key-dialog"
+    (click)="openDialog()">
+    {{ 'account.create_nua_key' | translate }}
+  </pa-button>
+}
diff --git a/libs/common/src/lib/account/account-nua/account-nua.component.scss b/libs/common/src/lib/account/account-nua/account-nua.component.scss
index d0ccdca6f3..3ed8407a5e 100644
--- a/libs/common/src/lib/account/account-nua/account-nua.component.scss
+++ b/libs/common/src/lib/account/account-nua/account-nua.component.scss
@@ -1,4 +1,5 @@
 @use 'apps/dashboard/src/variables' as *;
+@use '../account';
 
 h2 {
   margin: 0 0 rhythm(1) 0;
@@ -11,7 +12,8 @@ h2 {
 }
 
 .create-nua-button {
-  margin: rhythm(3) 0 rhythm(6);
+  display: block;
+  margin-top: rhythm(3);
 }
 
 h4 {
@@ -20,7 +22,8 @@ h4 {
 
 .container {
   max-width: $width-large-screen;
-  padding: rhythm(1) rhythm(2) rhythm(2);
+  margin-top: rhythm(3);
+  margin-bottom: rhythm(3);
 }
 
 .client-row {
diff --git a/libs/common/src/lib/account/account-page-base.ts b/libs/common/src/lib/account/account-page-base.ts
new file mode 100644
index 0000000000..9358952ae6
--- /dev/null
+++ b/libs/common/src/lib/account/account-page-base.ts
@@ -0,0 +1,55 @@
+import { AfterViewInit, DestroyRef, Directive, inject } from '@angular/core';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { ActivatedRoute, Router } from '@angular/router';
+import { NavigationService, SDKService } from '@flaps/core';
+import { combineLatest, filter, fromEvent, map, of, shareReplay, startWith, switchMap } from 'rxjs';
+
+/**
+ * Abstract base for account settings pages (home, administration, configuration).
+ * Provides the shared back-link observable, sticky-nav resize fix, and lifecycle
+ * teardown so each page only needs to declare its own feature flags.
+ */
+@Directive()
+export abstract class AccountPageBase implements AfterViewInit {
+  protected sdk = inject(SDKService);
+  protected navigation = inject(NavigationService);
+  protected route = inject(ActivatedRoute);
+  protected router = inject(Router);
+
+  protected readonly destroyRef = inject(DestroyRef);
+
+  backLink = combineLatest([this.sdk.currentAccount, this.sdk.currentKb.pipe(startWith(null))]).pipe(
+    switchMap(([account, kb]) => {
+      if (!kb) {
+        return of(this.navigation.getKbSelectUrl(account.slug));
+      }
+      // Both currentKb and aragList are ReplaySubjects — isArag emits synchronously
+      // when aragList is already loaded (which it is whenever a KB/ARAG has been entered).
+      return this.sdk.isArag.pipe(
+        map((isArag) =>
+          isArag
+            ? this.navigation.getRetrievalAgentUrl(account.slug, kb.slug as string)
+            : this.navigation.getKbUrl(account.slug, (this.sdk.nuclia.options.standalone ? kb.id : kb.slug) as string),
+        ),
+      );
+    }),
+    shareReplay(1),
+  );
+
+  ngAfterViewInit(): void {
+    // When navigating to this page via SPA (from a page that had the sidebar visible),
+    // .dashboard-content width transitions over ~0.8s to full-width. pa-tabs captures
+    // _xPosition in ngAfterContentInit (< 1 tick), which is mid-animation and therefore
+    // wrong. Dispatching a resize event after the transition ends forces pa-tabs to
+    // recapture the correct position.
+    const content = document.querySelector('.dashboard-content');
+    if (content) {
+      fromEvent<TransitionEvent>(content, 'transitionend')
+        .pipe(
+          filter((e) => e.propertyName === 'width' && e.target === content),
+          takeUntilDestroyed(this.destroyRef),
+        )
+        .subscribe(() => window.dispatchEvent(new Event('resize')));
+    }
+  }
+}
diff --git a/libs/common/src/lib/account/account-page-layout/account-page-layout.component.html b/libs/common/src/lib/account/account-page-layout/account-page-layout.component.html
new file mode 100644
index 0000000000..fa5383def3
--- /dev/null
+++ b/libs/common/src/lib/account/account-page-layout/account-page-layout.component.html
@@ -0,0 +1,26 @@
+<div class="account-page-layout page-spacing">
+  <!-- Optional slot for content above the header (e.g. trial status banner) -->
+  <ng-content select="[top]"></ng-content>
+
+  <div class="settings-header">
+    <h1 class="page-title">{{ title() }}</h1>
+    <p class="page-description">{{ description() }}</p>
+  </div>
+
+  <div class="settings-navigation">
+    <nsi-back-button
+      class="back-home-button"
+      [link]="backLink()">
+      {{ 'generic.back_to_home' | translate }}
+    </nsi-back-button>
+    <!-- Project pa-tabs here using the [tabs] attribute selector -->
+    <ng-content select="[tabs]"></ng-content>
+  </div>
+
+  <div
+    class="settings-section"
+    [attr.id]="panelId()"
+    role="tabpanel">
+    <router-outlet></router-outlet>
+  </div>
+</div>
diff --git a/libs/common/src/lib/account/account-page-layout/account-page-layout.component.scss b/libs/common/src/lib/account/account-page-layout/account-page-layout.component.scss
new file mode 100644
index 0000000000..c86bd604ed
--- /dev/null
+++ b/libs/common/src/lib/account/account-page-layout/account-page-layout.component.scss
@@ -0,0 +1,50 @@
+@use 'apps/dashboard/src/variables' as *;
+
+:host {
+  display: block;
+}
+
+.account-page-layout {
+  margin: 0 auto;
+  max-width: calc(#{rhythm(90)} * 2);
+  width: 100%;
+}
+
+.settings-header {
+  margin-bottom: rhythm(3);
+
+  .page-title {
+    margin-bottom: rhythm(1);
+  }
+
+  .page-description {
+    color: $color-neutral-regular;
+    margin-bottom: 0;
+  }
+}
+
+.settings-navigation {
+  background: $color-light-stronger;
+  display: flex;
+  flex-direction: column;
+  gap: rhythm(2);
+  margin-bottom: rhythm(2);
+  padding-top: rhythm(2);
+  position: sticky;
+  top: 0;
+  z-index: 1;
+}
+
+.back-home-button {
+  display: block;
+}
+
+// Projected pa-tabs needs matching background for seamless sticky-nav appearance.
+// ::ng-deep is required because projected content is styled by the parent's encapsulation.
+::ng-deep .settings-tabs {
+  background: $color-light-stronger;
+}
+
+.settings-section {
+  padding-top: rhythm(3);
+}
diff --git a/libs/common/src/lib/account/account-page-layout/account-page-layout.component.ts b/libs/common/src/lib/account/account-page-layout/account-page-layout.component.ts
new file mode 100644
index 0000000000..79426d158f
--- /dev/null
+++ b/libs/common/src/lib/account/account-page-layout/account-page-layout.component.ts
@@ -0,0 +1,16 @@
+import { ChangeDetectionStrategy, Component, input } from '@angular/core';
+
+@Component({
+  selector: 'app-account-page-layout',
+  templateUrl: './account-page-layout.component.html',
+  styleUrl: './account-page-layout.component.scss',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  standalone: false,
+})
+export class AccountPageLayoutComponent {
+  title = input('');
+  description = input('');
+  backLink = input<string | null>(null);
+  /** ARIA id for the tab-panel div, linked via ariaControls on each pa-tab. */
+  panelId = input<string | undefined>(undefined);
+}
diff --git a/libs/common/src/lib/account/account-users/account-users.component.html b/libs/common/src/lib/account/account-users/account-users.component.html
index 95e9622794..cbf260f0fb 100644
--- a/libs/common/src/lib/account/account-users/account-users.component.html
+++ b/libs/common/src/lib/account/account-users/account-users.component.html
@@ -1,8 +1,24 @@
 @if (users) {
   <div class="account-users">
-    <h1 class="page-title">{{ 'account.manage_users' | translate }}</h1>
+    <h2 class="page-subtitle">{{ 'account.manage_users' | translate }}</h2>
     <p class="page-description">{{ 'account.manage_users-description' | translate }}</p>
 
+    @if (showKbUsersCta | async) {
+      <div class="kb-users-callout">
+        <div class="kb-users-callout-text">
+          <div class="title-xxs">{{ 'account.manage_users-kb-cta.prompt' | translate }}</div>
+        </div>
+        <pa-button
+          kind="secondary"
+          aspect="basic"
+          iconAndText
+          icon="users"
+          (click)="goToCurrentKbUsers()">
+          {{ 'account.manage_users-kb-cta.action' | translate }}
+        </pa-button>
+      </div>
+    }
+
     <div>
       <div class="users-amount">
         {{ 'account.users_amount' | translate }}
@@ -35,6 +51,7 @@ <h1 class="page-title">{{ 'account.manage_users' | translate }}</h1>
           }
         </pa-select>
         <pa-button
+          kind="primary"
           [disabled]="form.invalid"
           (click)="addUser()">
           {{ 'account.add_user' | translate }}
diff --git a/libs/common/src/lib/account/account-users/account-users.component.scss b/libs/common/src/lib/account/account-users/account-users.component.scss
index 42d5d3605b..a79cc4e282 100644
--- a/libs/common/src/lib/account/account-users/account-users.component.scss
+++ b/libs/common/src/lib/account/account-users/account-users.component.scss
@@ -1,13 +1,42 @@
 @use 'apps/dashboard/src/variables' as *;
+@use '../account';
 
 .account-users {
-  padding: var(--app-layout-padding-top) var(--app-layout-padding-right) var(--app-layout-padding-bottom)
-    var(--app-layout-padding-left);
-
+  padding: 0;
   .page-description {
     color: $color-neutral-regular;
     margin-bottom: rhythm(3);
   }
+
+  .kb-users-callout {
+    align-items: center;
+    background: $color-light-stronger;
+    border: 1px solid $color-neutral-lighter;
+    border-radius: rhythm(1);
+    display: flex;
+    flex-wrap: nowrap;
+    gap: rhythm(2);
+    justify-content: space-between;
+    margin-bottom: rhythm(3);
+    max-width: 100%;
+    min-width: 640px;
+    width: 640px;
+    padding: rhythm(2);
+    align-self: flex-start;
+  }
+
+  .kb-users-callout-text {
+    color: $color-neutral-regular;
+    display: block;
+    flex: 1 1 auto;
+    white-space: nowrap;
+    min-width: 0;
+
+    .title-xxs {
+      margin: 0;
+    }
+  }
+
   .users-left,
   .users-amount {
     strong {
diff --git a/libs/common/src/lib/account/account-users/account-users.component.ts b/libs/common/src/lib/account/account-users/account-users.component.ts
index 001cfdbad3..fdd388a6aa 100644
--- a/libs/common/src/lib/account/account-users/account-users.component.ts
+++ b/libs/common/src/lib/account/account-users/account-users.component.ts
@@ -1,9 +1,10 @@
 import { ChangeDetectionStrategy, ChangeDetectorRef, Component, OnDestroy, OnInit } from '@angular/core';
 import { FormControl, FormGroup, Validators } from '@angular/forms';
 import { TranslateService } from '@ngx-translate/core';
-import { forkJoin, Observable, of, Subject, take } from 'rxjs';
+import { forkJoin, combineLatest, Observable, of, Subject, take } from 'rxjs';
 import { catchError, filter, map, switchMap, takeUntil, tap } from 'rxjs/operators';
-import { SDKService } from '@flaps/core';
+import { NavigationService, SDKService } from '@flaps/core';
+import { Router } from '@angular/router';
 import {
   Account,
   AccountRoles,
@@ -37,9 +38,13 @@ export class AccountUsersComponent implements OnDestroy, OnInit {
   };
 
   account$ = this.sdk.currentAccount;
+  currentKb = this.sdk.currentKb;
   canAddUsers = this.account$.pipe(
     map((account) => account!.max_users == null || (account!.current_users || 0) < account!.max_users),
   );
+  showKbUsersCta = combineLatest([this.account$, this.currentKb]).pipe(
+    map(([, kb]) => !!kb?.slug && !!(kb.admin || kb.contrib)),
+  );
 
   unsubscribeAll = new Subject<void>();
 
@@ -50,6 +55,8 @@ export class AccountUsersComponent implements OnDestroy, OnInit {
   constructor(
     private translate: TranslateService,
     private sdk: SDKService,
+    private navigation: NavigationService,
+    private router: Router,
     private toaster: SisToastService,
     private cdr: ChangeDetectorRef,
     private modalService: SisModalService,
@@ -94,6 +101,16 @@ export class AccountUsersComponent implements OnDestroy, OnInit {
     });
   }
 
+  goToCurrentKbUsers(): void {
+    combineLatest([this.account$.pipe(take(1)), this.currentKb.pipe(take(1))])
+      .pipe(filter(([, kb]) => !!kb?.slug && !!(kb.admin || kb.contrib)))
+      .subscribe(([account, kb]) => {
+        this.sdk.nuclia.options.zone = kb.zone;
+        this.sdk.nuclia.options.knowledgeBox = kb.id;
+        this.router.navigate([this.navigation.getKbUsersUrl(account.slug, kb.slug!)]);
+      });
+  }
+
   changeRole(user: FullAccountUser, role: string): void {
     if (role === 'AMEMBER') {
       this._changeRole(user, role)
diff --git a/libs/common/src/lib/account/account.module.ts b/libs/common/src/lib/account/account.module.ts
index 8089b3f643..e483d79da5 100644
--- a/libs/common/src/lib/account/account.module.ts
+++ b/libs/common/src/lib/account/account.module.ts
@@ -23,7 +23,11 @@ import { BackButtonComponent, DropdownButtonComponent, SisProgressModule } from
 import { UsersManageModule } from '../users-manage';
 import { AccountAragComponent } from './account-arag/account-arag.component';
 import { AragListComponent } from './account-arag/arag-list/arag-list.component';
+import { AccountAdministrationComponent } from './account-administration/account-administration.component';
+import { AccountConfigurationComponent } from './account-configuration/account-configuration.component';
 import { AccountHomeComponent } from './account-home/account-home.component';
+import { AccountSettingsComponent } from './account-home/account-settings.component';
+import { AccountPageLayoutComponent } from './account-page-layout/account-page-layout.component';
 import { AccountKbsComponent } from './account-kbs/account-kbs.component';
 import { KbListComponent } from './account-kbs/kb-list/kb-list.component';
 import { UsersDialogComponent } from './account-kbs/users-dialog/users-dialog.component';
@@ -54,6 +58,7 @@ import { ChartsModule } from '../charts';
 import { NavbarModule } from '../navbar';
 import { HintModule } from '../hint';
 import { ProfileComponent } from '../profile/profile.component';
+import { AccountConsumptionComponent } from './account-home/account-consumption.component';
 
 const routes: Routes = [
   {
@@ -61,94 +66,86 @@ const routes: Routes = [
     redirectTo: 'home',
     pathMatch: 'full',
   },
+  // /settings is now a tab — redirect to the account-settings tab
   {
     path: 'settings',
-    component: AccountManageComponent,
-    canActivate: [accountOwnerGuard],
+    redirectTo: 'home/account-settings',
   },
+  // Simple home (matches when simpleMode is true)
   {
     path: 'home',
     canMatch: [canMatchSimpleMode],
     component: SimpleAccountHomeComponent,
     canActivate: [accountOwnerGuard],
   },
+  // Home page — tab shell with child routes
   {
     path: 'home',
-    component: AccountHomeComponent,
-    canActivate: [accountOwnerGuard],
-  },
-  {
-    path: 'nua',
-    component: AccountNUAComponent,
-    canActivate: [accountOwnerGuard],
-  },
-  {
-    path: 'nua/:id/activity',
-    component: NuaActivityComponent,
+    component: AccountSettingsComponent,
     canActivate: [accountOwnerGuard],
+    children: [
+      { path: '', redirectTo: 'consumption', pathMatch: 'full' },
+      { path: 'consumption', component: AccountConsumptionComponent },
+      {
+        path: 'subscriptions',
+        component: BillingComponent,
+        children: [
+          { path: '', pathMatch: 'full', component: RedirectComponent },
+          { path: 'plans', component: SubscriptionsComponent },
+          { path: 'checkout', component: CheckoutComponent },
+          { path: 'my-subscription', component: MySubscriptionComponent },
+          { path: 'usage', component: UsageTableComponent },
+          { path: 'history', component: HistoryComponent },
+        ],
+      },
+      { path: 'preferences', component: ProfileComponent, data: { embedded: true } },
+      { path: 'account-settings', component: AccountManageComponent, data: { embedded: true } },
+    ],
   },
+  // Administration page — tab shell with child routes
   {
-    path: 'kbs',
-    component: AccountKbsComponent,
+    path: 'administration',
+    component: AccountAdministrationComponent,
     canActivate: [accountOwnerGuard],
     children: [
+      { path: '', redirectTo: 'knowledge-boxes', pathMatch: 'full' },
+      { path: 'knowledge-boxes', component: KbListComponent },
       {
-        path: '',
-        component: KbListComponent,
-      },
-      {
-        path: 'create',
+        path: 'knowledge-boxes/create',
         component: KbCreationComponent,
+        data: { embedded: true },
       },
+      { path: 'users', component: AccountUsersComponent },
+      { path: 'retrieval-agents', component: AragListComponent, canActivate: [agentFeatureEnabledGuard] },
     ],
   },
+  // Configuration page — tab shell with child routes
   {
-    path: 'arag',
-    component: AccountAragComponent,
-    canActivate: [accountOwnerGuard, agentFeatureEnabledGuard],
-    children: [{ path: '', component: AragListComponent }],
-  },
-  {
-    path: 'models',
-    component: AccountModelsComponent,
-    canActivate: [accountOwnerGuard],
-  },
-  {
-    path: 'users',
-    component: AccountUsersComponent,
+    path: 'configuration',
+    component: AccountConfigurationComponent,
     canActivate: [accountOwnerGuard],
-  },
-  {
-    path: 'billing',
-    component: BillingComponent,
     children: [
-      {
-        path: '',
-        pathMatch: 'full',
-        component: RedirectComponent,
-      },
-      {
-        path: 'subscriptions',
-        component: SubscriptionsComponent,
-      },
-      {
-        path: 'checkout',
-        component: CheckoutComponent,
-      },
-      {
-        path: 'my-subscription',
-        component: MySubscriptionComponent,
-      },
-      {
-        path: 'usage',
-        component: UsageTableComponent,
-      },
-      {
-        path: 'history',
-        component: HistoryComponent,
-      },
+      { path: '', redirectTo: 'nua', pathMatch: 'full' },
+      { path: 'nua', component: AccountNUAComponent },
+      { path: 'nua/:id/activity', component: NuaActivityComponent },
+      { path: 'models', component: AccountModelsComponent },
     ],
   },
+  // Legacy redirect routes (backward compatibility for bookmarked URLs)
+  { path: 'nua', redirectTo: 'configuration/nua' },
+  { path: 'nua/:id/activity', redirectTo: ({ params }) => `configuration/nua/${params['id']}/activity` },
+  { path: 'kbs', pathMatch: 'full', redirectTo: 'administration/knowledge-boxes' },
+  { path: 'kbs/create', pathMatch: 'full', redirectTo: 'administration/knowledge-boxes/create' },
+  { path: 'arag', redirectTo: 'administration/retrieval-agents' },
+  { path: 'models', redirectTo: 'configuration/models' },
+  { path: 'users', redirectTo: 'administration/users' },
+  // Legacy billing redirects — all billing content lives under /home/subscriptions now
+  { path: 'billing', pathMatch: 'full', redirectTo: 'home/subscriptions' },
+  { path: 'billing/subscriptions', redirectTo: 'home/subscriptions/plans' },
+  { path: 'billing/checkout', redirectTo: 'home/subscriptions/checkout' },
+  { path: 'billing/my-subscription', redirectTo: 'home/subscriptions/my-subscription' },
+  { path: 'billing/usage', redirectTo: 'home/subscriptions/usage' },
+  { path: 'billing/history', redirectTo: 'home/subscriptions/history' },
 ];
 
 @NgModule({
@@ -189,19 +186,27 @@ const routes: Routes = [
     OtpInputComponent,
     AccountDeleteComponent,
     ProfileComponent,
+    AragListComponent,
+    AccountModelsComponent,
+    KbListComponent,
+    KbCreationComponent,
   ],
   declarations: [
+    AccountAdministrationComponent,
     AccountHomeComponent,
+    AccountPageLayoutComponent,
+    AccountConsumptionComponent,
+    AccountSettingsComponent,
     AccountManageComponent,
     AccountKbsComponent,
-    AccountAragComponent,
     UsersDialogComponent,
     AccountNUAComponent,
+    AccountConfigurationComponent,
     ClientDialogComponent,
     AccountUsersComponent,
     NuaActivityComponent,
     SimpleAccountHomeComponent,
   ],
-  exports: [AccountHomeComponent, AccountManageComponent, SimpleAccountHomeComponent],
+  exports: [AccountHomeComponent, AccountSettingsComponent, AccountManageComponent, SimpleAccountHomeComponent],
 })
 export class AccountModule {}
diff --git a/libs/common/src/lib/account/account.scss b/libs/common/src/lib/account/account.scss
new file mode 100644
index 0000000000..8f23472f67
--- /dev/null
+++ b/libs/common/src/lib/account/account.scss
@@ -0,0 +1,10 @@
+@use 'apps/dashboard/src/variables' as *;
+
+// Section-level heading for account tab panels.
+// Smaller than the layout's h1.page-title (display-s) — these headings
+// live inside tabs, not at the top of a standalone page.
+.page-subtitle {
+  font-size: 1.125rem;
+  line-height: 1.5;
+  margin-bottom: rhythm(1);
+}
diff --git a/libs/common/src/lib/account/billing/billing.component.html b/libs/common/src/lib/account/billing/billing.component.html
index 7a30e0e252..0680b43f9c 100644
--- a/libs/common/src/lib/account/billing/billing.component.html
+++ b/libs/common/src/lib/account/billing/billing.component.html
@@ -1,6 +1 @@
-<div class="billing page-spacing">
-  @if (showBackToHome | async) {
-    <nsi-back-button [link]="backLink | async">{{ 'generic.back_to_home' | translate }}</nsi-back-button>
-  }
-  <router-outlet></router-outlet>
-</div>
+<router-outlet></router-outlet>
diff --git a/libs/common/src/lib/account/billing/billing.component.ts b/libs/common/src/lib/account/billing/billing.component.ts
index 9b06481454..320bdd97b5 100644
--- a/libs/common/src/lib/account/billing/billing.component.ts
+++ b/libs/common/src/lib/account/billing/billing.component.ts
@@ -1,8 +1,6 @@
 import { Component, ChangeDetectionStrategy, OnDestroy, OnInit, Inject } from '@angular/core';
-import { injectScript, NavigationService, SDKService } from '@flaps/core';
-import { NavigationEnd, Router } from '@angular/router';
+import { injectScript } from '@flaps/core';
 import { WINDOW } from '@ng-web-apis/common';
-import { combineLatest, defer, filter, map, merge, of, shareReplay } from 'rxjs';
 
 @Component({
   selector: 'app-billing',
@@ -12,30 +10,7 @@ import { combineLatest, defer, filter, map, merge, of, shareReplay } from 'rxjs'
   standalone: false,
 })
 export class BillingComponent implements OnInit, OnDestroy {
-  isCowork = this.sdk.currentAccount.pipe(
-    map((account) => account.workflow === 'cowork'),
-    shareReplay(1),
-  );
-  kbUrl = this.navigation.kbUrl;
-  backLink = this.navigation.kbUrl.pipe(map((url) => `${url}/simple`));
-  private currentUrl = merge(
-    defer(() => of(this.router.url)),
-    this.router.events.pipe(
-      filter((event) => event instanceof NavigationEnd),
-      map((event) => (event as NavigationEnd).urlAfterRedirects),
-    ),
-  );
-  showBackToHome = combineLatest([this.isCowork, this.currentUrl]).pipe(
-    map(([isCowork, url]) => isCowork && !url.includes('/billing/checkout')),
-    shareReplay({ bufferSize: 1, refCount: true }),
-  );
-
-  constructor(
-    @Inject(WINDOW) private window: Window,
-    private sdk: SDKService,
-    private navigation: NavigationService,
-    private router: Router,
-  ) {}
+  constructor(@Inject(WINDOW) private window: Window) {}
 
   ngOnInit() {
     const hubSpotApi = (this.window as any)?.HubSpotConversations;
diff --git a/libs/common/src/lib/account/billing/checkout/checkout.component.html b/libs/common/src/lib/account/billing/checkout/checkout.component.html
index c61baf3ac8..f0be4fc5c0 100644
--- a/libs/common/src/lib/account/billing/checkout/checkout.component.html
+++ b/libs/common/src/lib/account/billing/checkout/checkout.component.html
@@ -3,7 +3,7 @@
     {{ ((simpleMode | async) ? 'generic.back_to_settings' : 'generic.back') | translate }}
   </nsi-back-button>
   <div>
-    <h1>{{ 'billing.payment_details' | translate }}</h1>
+    <h2 class="page-subtitle">{{ 'billing.payment_details' | translate }}</h2>
     <p class="page-description">{{ 'billing.payment_details-description' | translate }}</p>
   </div>
 
diff --git a/libs/common/src/lib/account/billing/checkout/checkout.component.scss b/libs/common/src/lib/account/billing/checkout/checkout.component.scss
index b67a3a4a9f..b650522498 100644
--- a/libs/common/src/lib/account/billing/checkout/checkout.component.scss
+++ b/libs/common/src/lib/account/billing/checkout/checkout.component.scss
@@ -1,19 +1,14 @@
 @use 'apps/dashboard/src/variables' as *;
+@use '../../account';
 
 .checkout {
   display: flex;
   flex-direction: column;
-  gap: rhythm(6);
-  margin: 0 auto;
+  gap: rhythm(4);
   max-width: calc(rhythm(90) + rhythm(32));
   width: 100%;
 }
 
-h1,
-h2 {
-  margin: 0;
-}
-
 .page-description {
   color: $color-neutral-regular;
   margin: rhythm(1) 0 0;
diff --git a/libs/common/src/lib/account/billing/checkout/checkout.component.ts b/libs/common/src/lib/account/billing/checkout/checkout.component.ts
index aa9212c466..112527439b 100644
--- a/libs/common/src/lib/account/billing/checkout/checkout.component.ts
+++ b/libs/common/src/lib/account/billing/checkout/checkout.component.ts
@@ -97,8 +97,8 @@ export class CheckoutComponent implements OnDestroy, OnInit {
   );
   usage = this.billingService.getAccountUsage().pipe(shareReplay(1));
   simpleMode = this.navigation.simpleMode;
-  backToSettingsLink = combineLatest([this.navigation.simpleMode, this.sdk.currentAccount]).pipe(
-    map(([isSimple, account]) => this.navigation.getAccountManageUrl(account.slug) + (isSimple ? '/home' : '/billing')),
+  backToSettingsLink = this.sdk.currentAccount.pipe(
+    map((account) => `${this.navigation.getAccountManageUrl(account.slug)}/home/subscriptions`),
   );
 
   updateCurrency = new Subject<string>();
@@ -412,7 +412,7 @@ export class CheckoutComponent implements OnDestroy, OnInit {
                   return of(`${this.navigation.getKbSelectUrl(newAccount.slug)}`);
                 }
               } else {
-                return of(`${this.navigation.getAccountUrl(newAccount.slug)}/manage/home`);
+                return of(`${this.navigation.getAccountManageUrl(newAccount.slug)}/home/subscriptions`);
               }
             }),
           );
diff --git a/libs/common/src/lib/account/billing/history/history.component.html b/libs/common/src/lib/account/billing/history/history.component.html
index 39733e9a4c..dd9e079fa6 100644
--- a/libs/common/src/lib/account/billing/history/history.component.html
+++ b/libs/common/src/lib/account/billing/history/history.component.html
@@ -1,5 +1,5 @@
 <div class="history">
-  <h2>{{ 'billing.history.title' | translate }}</h2>
+  <h2 class="page-subtitle">{{ 'billing.history.title' | translate }}</h2>
 
   <pa-table
     border
@@ -28,15 +28,13 @@ <h2>{{ 'billing.history.title' | translate }}</h2>
             icon="download"
             aspect="basic"
             size="small"
-          (click)="openPdf(invoice.pdf)"></pa-button>
+            (click)="openPdf(invoice.pdf)"></pa-button>
         </pa-table-cell>
       </pa-table-row>
     }
   </pa-table>
   @if (invoices.items.length > 0 && invoices.pagination.has_more) {
-    <div
-      class="load-more"
-      >
+    <div class="load-more">
       <pa-button
         size="small"
         [disabled]="loading"
diff --git a/libs/common/src/lib/account/billing/history/history.component.scss b/libs/common/src/lib/account/billing/history/history.component.scss
index 27e1487805..beabd7ddcf 100644
--- a/libs/common/src/lib/account/billing/history/history.component.scss
+++ b/libs/common/src/lib/account/billing/history/history.component.scss
@@ -1,9 +1,14 @@
 @use 'apps/dashboard/src/variables' as *;
+@use '../../account';
 
 .history {
   max-width: calc(rhythm(90) + rhythm(24));
 }
 
+.page-subtitle {
+  margin-bottom: rhythm(3);
+}
+
 // pa-table hacks
 :host ::ng-deep .pa-table-grid--cell {
   font-size: $font-size-body-s;
diff --git a/libs/common/src/lib/account/billing/my-subscription/my-subscription.component.html b/libs/common/src/lib/account/billing/my-subscription/my-subscription.component.html
index 44ed4db28f..4d1da580f4 100644
--- a/libs/common/src/lib/account/billing/my-subscription/my-subscription.component.html
+++ b/libs/common/src/lib/account/billing/my-subscription/my-subscription.component.html
@@ -1,11 +1,9 @@
 <div class="my-subscription">
-  <h2>{{ 'billing.my-subscription' | translate }}</h2>
+  <h2 class="page-subtitle">{{ 'billing.my-subscription' | translate }}</h2>
 
   @if (!(cancelScheduled | async)) {
     @if (prices$ | async; as prices) {
-      <div
-        class="subscription-info"
-        >
+      <div class="subscription-info">
         <div class="subscription-tier">
           <div class="title-l">{{ 'account.type.' + (type | async) | translate }}</div>
           @if (!doNotShowPrice.includes((type | async) || '')) {
@@ -23,9 +21,7 @@ <h2>{{ 'billing.my-subscription' | translate }}</h2>
         </div>
         @if (isDeprecatedAccount | async) {
           @if (currency$ | async; as currency) {
-            <pa-table
-              columns="auto auto auto"
-              >
+            <pa-table columns="auto auto auto">
               <pa-table-header>
                 <pa-table-cell header>{{ 'billing.quotas_label' | translate }}</pa-table-cell>
                 <pa-table-cell header></pa-table-cell>
@@ -37,9 +33,7 @@ <h2>{{ 'billing.my-subscription' | translate }}</h2>
                 </pa-table-cell>
                 <pa-table-cell>
                   @if ((defaults | async)?.max_kbs; as maxKbs) {
-                    <span
-                      class="body-m"
-                      >
+                    <span class="body-m">
                       {{ maxKbs === -1 ? ('billing.unlimited' | translate) : maxKbs }}
                     </span>
                   }
@@ -59,7 +53,9 @@ <h2>{{ 'billing.my-subscription' | translate }}</h2>
                   </pa-table-cell>
                   <pa-table-cell>
                     <span>
-                      <span class="body-m">{{ prices.usage[param]?.price | currency: currency : 'symbol' : '1.2-6' }}</span>
+                      <span class="body-m">
+                        {{ prices.usage[param]?.price | currency: currency : 'symbol' : '1.2-6' }}
+                      </span>
                       <span class="unit">
                         /{{ (['media', 'training'].includes(param) ? 'billing.hour' : 'billing.unit') | translate }}
                       </span>
@@ -71,22 +67,18 @@ <h2>{{ 'billing.my-subscription' | translate }}</h2>
           }
         }
         @if (activeSubscription | async) {
-          <div
-            class="title-s"
-            >
+          <div class="title-s">
             {{ 'billing.next-payment' | translate }}:
             <pa-datetime
               [datetime]="(subscription | async)?.end_billing_period || ''"
               format="human"
-            dateOnly></pa-datetime>
+              dateOnly></pa-datetime>
           </div>
         }
       </div>
     }
     @if (activeSubscription | async) {
-      <div
-        class="cancel-subscription"
-        >
+      <div class="cancel-subscription">
         <div>
           <h3 class="title-s">{{ 'billing.end-service' | translate }}</h3>
           <div>{{ 'billing.cancel-renewal' | translate }}</div>
@@ -106,7 +98,7 @@ <h3 class="title-s">{{ 'billing.end-service' | translate }}</h3>
       <pa-datetime
         [datetime]="(subscription | async)?.end_billing_period || ''"
         format="human"
-      dateOnly></pa-datetime>
+        dateOnly></pa-datetime>
     </div>
     <div class="renewal">
       <h3 class="title-s">{{ 'billing.renew-subscription' | translate }}</h3>
diff --git a/libs/common/src/lib/account/billing/my-subscription/my-subscription.component.scss b/libs/common/src/lib/account/billing/my-subscription/my-subscription.component.scss
index 014f75092d..a32ec1b9d6 100644
--- a/libs/common/src/lib/account/billing/my-subscription/my-subscription.component.scss
+++ b/libs/common/src/lib/account/billing/my-subscription/my-subscription.component.scss
@@ -1,4 +1,5 @@
 @use 'apps/dashboard/src/variables' as *;
+@use '../../account';
 
 .my-subscription {
   display: flex;
@@ -7,7 +8,7 @@
   max-width: rhythm(80);
 }
 
-h2 {
+.page-subtitle {
   margin: 0;
 }
 
diff --git a/libs/common/src/lib/account/billing/my-subscription/unsubscribe.component.html b/libs/common/src/lib/account/billing/my-subscription/unsubscribe.component.html
index e9a5286a92..a45499572b 100644
--- a/libs/common/src/lib/account/billing/my-subscription/unsubscribe.component.html
+++ b/libs/common/src/lib/account/billing/my-subscription/unsubscribe.component.html
@@ -1,6 +1,6 @@
 <pa-modal-dialog>
   <pa-modal-title>
-    <h2>{{ 'billing.unsubscribe-title' | translate }}</h2>
+    <h2 class="page-subtitle">{{ 'billing.unsubscribe-title' | translate }}</h2>
   </pa-modal-title>
   <pa-modal-content>
     <div>{{ 'billing.unsubscribe-help' | translate }}</div>
@@ -10,7 +10,7 @@ <h2>{{ 'billing.unsubscribe-title' | translate }}</h2>
         <pa-datetime
           [datetime]="data?.endBillingPeriod || ''"
           format="human"
-        dateOnly></pa-datetime>
+          dateOnly></pa-datetime>
       </div>
     </div>
     @if (!!data && data.overCost > 0) {
diff --git a/libs/common/src/lib/account/billing/my-subscription/unsubscribe.component.scss b/libs/common/src/lib/account/billing/my-subscription/unsubscribe.component.scss
index e363955c6c..b986d5fa49 100644
--- a/libs/common/src/lib/account/billing/my-subscription/unsubscribe.component.scss
+++ b/libs/common/src/lib/account/billing/my-subscription/unsubscribe.component.scss
@@ -1,6 +1,7 @@
 @use 'apps/dashboard/src/variables' as *;
+@use '../../account';
 
-h2 {
+.page-subtitle {
   margin: 0;
   text-align: center;
 }
diff --git a/libs/common/src/lib/account/billing/redirect.component.ts b/libs/common/src/lib/account/billing/redirect.component.ts
index 36bcae9c2d..36a5181ce2 100644
--- a/libs/common/src/lib/account/billing/redirect.component.ts
+++ b/libs/common/src/lib/account/billing/redirect.component.ts
@@ -14,7 +14,7 @@ export class RedirectComponent {
     private route: ActivatedRoute,
   ) {
     this.billingService.isSubscribedToStripe.pipe(take(1)).subscribe((isSubscribed) => {
-      this.router.navigate([isSubscribed ? './usage' : './subscriptions'], {
+      this.router.navigate([isSubscribed ? './usage' : './plans'], {
         replaceUrl: true,
         relativeTo: this.route,
       });
diff --git a/libs/common/src/lib/account/billing/subscriptions/aws-subscription/aws-subscription.component.html b/libs/common/src/lib/account/billing/subscriptions/aws-subscription/aws-subscription.component.html
index 6ce294f1c5..4443f29d71 100644
--- a/libs/common/src/lib/account/billing/subscriptions/aws-subscription/aws-subscription.component.html
+++ b/libs/common/src/lib/account/billing/subscriptions/aws-subscription/aws-subscription.component.html
@@ -1,6 +1,6 @@
 <div class="aws-subscription">
   <div>
-    <h2>{{ 'navbar.subscription' | translate }}</h2>
+    <h2 class="page-subtitle">{{ 'navbar.subscription' | translate }}</h2>
     <div class="body-m">
       {{ 'billing.modify-aws-subscription' | translate }}
       <a
diff --git a/libs/common/src/lib/account/billing/subscriptions/aws-subscription/aws-subscription.component.scss b/libs/common/src/lib/account/billing/subscriptions/aws-subscription/aws-subscription.component.scss
index ed232bff90..a368e27342 100644
--- a/libs/common/src/lib/account/billing/subscriptions/aws-subscription/aws-subscription.component.scss
+++ b/libs/common/src/lib/account/billing/subscriptions/aws-subscription/aws-subscription.component.scss
@@ -1,6 +1,7 @@
 @use 'apps/dashboard/src/variables' as *;
+@use '../../../account';
 
-h2 {
+.page-subtitle {
   margin: 0 0 rhythm(1);
 }
 
diff --git a/libs/common/src/lib/account/billing/subscriptions/manual-subscription/manual-subscription.component.html b/libs/common/src/lib/account/billing/subscriptions/manual-subscription/manual-subscription.component.html
index ce4e2e25a0..c9906dbc15 100644
--- a/libs/common/src/lib/account/billing/subscriptions/manual-subscription/manual-subscription.component.html
+++ b/libs/common/src/lib/account/billing/subscriptions/manual-subscription/manual-subscription.component.html
@@ -2,7 +2,7 @@
   <div class="usage">
     <header>
       <div>
-        <h2>{{ 'billing.usage.title' | translate }}</h2>
+        <h2 class="page-subtitle">{{ 'billing.usage.title' | translate }}</h2>
         <div>
           {{ 'billing.usage.interval' | translate: { to: (usage | async)?.end_billing_date | date: 'YYYY-MM-dd' } }}
         </div>
diff --git a/libs/common/src/lib/account/billing/subscriptions/manual-subscription/manual-subscription.component.scss b/libs/common/src/lib/account/billing/subscriptions/manual-subscription/manual-subscription.component.scss
index 3942996d9f..b4d889d4e0 100644
--- a/libs/common/src/lib/account/billing/subscriptions/manual-subscription/manual-subscription.component.scss
+++ b/libs/common/src/lib/account/billing/subscriptions/manual-subscription/manual-subscription.component.scss
@@ -1,4 +1,5 @@
 @use 'apps/dashboard/src/variables' as *;
+@use '../../../account';
 
 .manual-subscription {
   display: flex;
diff --git a/libs/common/src/lib/account/billing/subscriptions/subscriptions.component.html b/libs/common/src/lib/account/billing/subscriptions/subscriptions.component.html
index 2e6c3a618a..c9ada57f09 100644
--- a/libs/common/src/lib/account/billing/subscriptions/subscriptions.component.html
+++ b/libs/common/src/lib/account/billing/subscriptions/subscriptions.component.html
@@ -3,7 +3,7 @@
 } @else if ((isManuallySubscribed | async) === true) {
   <app-manual-subscription></app-manual-subscription>
 } @else {
-  <h1 class="page-title">{{ 'billing.subscription.title' | translate }}</h1>
+  <h2 class="page-subtitle">{{ 'billing.subscription.title' | translate }}</h2>
   <p class="page-description">{{ 'billing.subscription.help' | translate }}</p>
   <div class="header">
     @if (canSelectCurrency) {
@@ -49,7 +49,11 @@ <h1 class="page-title">{{ 'billing.subscription.title' | translate }}</h1>
               } @else if ((accountType | async) === 'cowork') {
                 <ng-container *ngTemplateOutlet="subscribed"></ng-container>
               } @else {
-                <pa-button (click)="contact()">{{ 'billing.contact' | translate }}</pa-button>
+                <pa-button
+                  kind="primary"
+                  (click)="contact()">
+                  {{ 'billing.contact' | translate }}
+                </pa-button>
               }
             </th>
           } @else {
@@ -70,7 +74,11 @@ <h1 class="page-title">{{ 'billing.subscription.title' | translate }}</h1>
               } @else if ((accountType | async) === 'v3starter') {
                 <ng-container *ngTemplateOutlet="subscribed"></ng-container>
               } @else {
-                <pa-button (click)="contact()">{{ 'billing.contact' | translate }}</pa-button>
+                <pa-button
+                  kind="primary"
+                  (click)="contact()">
+                  {{ 'billing.contact' | translate }}
+                </pa-button>
               }
             </th>
             <th class="plan">
@@ -90,7 +98,11 @@ <h1 class="page-title">{{ 'billing.subscription.title' | translate }}</h1>
               } @else if ((accountType | async) === 'v3pro') {
                 <ng-container *ngTemplateOutlet="subscribed"></ng-container>
               } @else {
-                <pa-button (click)="contact()">{{ 'billing.contact' | translate }}</pa-button>
+                <pa-button
+                  kind="primary"
+                  (click)="contact()">
+                  {{ 'billing.contact' | translate }}
+                </pa-button>
               }
             </th>
             <th class="plan">
@@ -101,7 +113,11 @@ <h1 class="page-title">{{ 'billing.subscription.title' | translate }}</h1>
               @if ((accountType | async) === 'v3enterprise') {
                 <ng-container *ngTemplateOutlet="subscribed"></ng-container>
               } @else {
-                <pa-button (click)="contact()">{{ 'billing.contact' | translate }}</pa-button>
+                <pa-button
+                  kind="primary"
+                  (click)="contact()">
+                  {{ 'billing.contact' | translate }}
+                </pa-button>
               }
             </th>
           }
diff --git a/libs/common/src/lib/account/billing/subscriptions/subscriptions.component.scss b/libs/common/src/lib/account/billing/subscriptions/subscriptions.component.scss
index b1356f2a6d..9b762ef069 100644
--- a/libs/common/src/lib/account/billing/subscriptions/subscriptions.component.scss
+++ b/libs/common/src/lib/account/billing/subscriptions/subscriptions.component.scss
@@ -1,4 +1,5 @@
 @use 'apps/dashboard/src/variables' as *;
+@use '../../account';
 
 .header {
   margin-bottom: rhythm(5);
diff --git a/libs/common/src/lib/account/billing/subscriptions/subscriptions.component.ts b/libs/common/src/lib/account/billing/subscriptions/subscriptions.component.ts
index ac4bf76a89..4d569022d7 100644
--- a/libs/common/src/lib/account/billing/subscriptions/subscriptions.component.ts
+++ b/libs/common/src/lib/account/billing/subscriptions/subscriptions.component.ts
@@ -88,7 +88,7 @@ export class SubscriptionsComponent implements OnDestroy {
 
   goToPaymentDetails(type: AccountTypes) {
     this.sdk.currentAccount.pipe(take(1)).subscribe((account) => {
-      this.router.navigate([`${this.navigation.getAccountManageUrl(account.slug)}/billing/checkout`], {
+      this.router.navigate([`${this.navigation.getAccountManageUrl(account.slug)}/home/subscriptions/checkout`], {
         queryParams: { type },
       });
     });
diff --git a/libs/common/src/lib/account/billing/usage/usage-table.component.html b/libs/common/src/lib/account/billing/usage/usage-table.component.html
index dc1957961a..4895e38d43 100644
--- a/libs/common/src/lib/account/billing/usage/usage-table.component.html
+++ b/libs/common/src/lib/account/billing/usage/usage-table.component.html
@@ -2,7 +2,7 @@
   @if (usageData | async; as usage) {
     <header>
       <div>
-        <h2>{{ 'billing.usage.title' | translate }}</h2>
+        <h2 class="page-subtitle">{{ 'billing.usage.title' | translate }}</h2>
         <div>
           <div>{{ 'billing.usage.description' | translate }}</div>
           <em>{{ 'billing.usage.interval' | translate: { to: usage.end_billing_date | date: 'yyyy-MM-dd' } }}</em>
diff --git a/libs/common/src/lib/account/billing/usage/usage-table.component.scss b/libs/common/src/lib/account/billing/usage/usage-table.component.scss
index 111da4c7d6..c4863a4b50 100644
--- a/libs/common/src/lib/account/billing/usage/usage-table.component.scss
+++ b/libs/common/src/lib/account/billing/usage/usage-table.component.scss
@@ -1,4 +1,5 @@
 @use 'apps/dashboard/src/variables' as *;
+@use '../../account';
 
 .container {
   max-width: calc(rhythm(90) + rhythm(6));
diff --git a/libs/common/src/lib/base/dashboard-layout/dashboard-layout.component.ts b/libs/common/src/lib/base/dashboard-layout/dashboard-layout.component.ts
index dda150ca2f..d9654b64e8 100644
--- a/libs/common/src/lib/base/dashboard-layout/dashboard-layout.component.ts
+++ b/libs/common/src/lib/base/dashboard-layout/dashboard-layout.component.ts
@@ -25,7 +25,12 @@ export class DashboardLayoutComponent {
     map(([showLimit, showProgress]) => showLimit || showProgress),
   );
   collapsedNav = this.layoutService.collapsedNav;
-  noNavBar = combineLatest([this.navigationService.simpleMode, this.navigationService.inArag()]).pipe(
-    map(([simple, inArag]) => simple && !inArag),
-  );
+  // The sidebar is hidden when in simple mode (ContextBox/cowork) outside an ARAG space,
+  // OR when anywhere under /manage (all account-management routes are full-width).
+  // IN_ACCOUNT_MANAGEMENT regex matches ALL /manage/* paths, so no manage route has a sidebar.
+  noNavBar = combineLatest([
+    this.navigationService.simpleMode,
+    this.navigationService.inArag(),
+    this.navigationService.inAccount,
+  ]).pipe(map(([simple, inArag, inHome]) => (simple && !inArag) || inHome));
 }
diff --git a/libs/common/src/lib/kb-creation/kb-creation.component.html b/libs/common/src/lib/kb-creation/kb-creation.component.html
index 86d1aa00e7..4ca1ca8b5e 100644
--- a/libs/common/src/lib/kb-creation/kb-creation.component.html
+++ b/libs/common/src/lib/kb-creation/kb-creation.component.html
@@ -1,4 +1,6 @@
-<div class="page-spacing">
+<div
+  class="page-spacing"
+  [class.embedded]="embedded">
   @if (saving) {
     <div class="loader-backdrop">
       <div class="spinner-container">
@@ -8,10 +10,25 @@
   }
 
   <header>
-    <nsi-back-button [link]="backPath">{{ 'account.kb.creation-form.back-button' | translate }}</nsi-back-button>
+    @if (embedded) {
+      <a
+        class="embedded-back-link title-xs"
+        [routerLink]="embeddedBackCommands">
+        <pa-icon
+          name="chevron-left"
+          size="small"></pa-icon>
+        {{ 'account.kb.creation-form.back-button' | translate }}
+      </a>
+    } @else {
+      <nsi-back-button [link]="backPath">{{ 'account.kb.creation-form.back-button' | translate }}</nsi-back-button>
+    }
 
     <div>
-      <h1 class="page-title">{{ 'account.kb.creation-form.title' | translate }}</h1>
+      @if (embedded) {
+        <h2 class="page-subtitle">{{ 'account.kb.creation-form.title' | translate }}</h2>
+      } @else {
+        <h1 class="page-title">{{ 'account.kb.creation-form.title' | translate }}</h1>
+      }
       <div class="page-description">{{ 'account.kb.creation-form.description' | translate }}</div>
     </div>
   </header>
diff --git a/libs/common/src/lib/kb-creation/kb-creation.component.scss b/libs/common/src/lib/kb-creation/kb-creation.component.scss
index 2a4a7024ec..34ae549c3c 100644
--- a/libs/common/src/lib/kb-creation/kb-creation.component.scss
+++ b/libs/common/src/lib/kb-creation/kb-creation.component.scss
@@ -1,4 +1,12 @@
 @use 'apps/dashboard/src/variables' as *;
+@use '../account/account';
+
+.page-spacing {
+  &.embedded {
+    min-height: auto;
+    padding: 0;
+  }
+}
 
 header {
   display: flex;
@@ -7,6 +15,19 @@ header {
   margin-bottom: rhythm(4);
 }
 
+.embedded-back-link {
+  align-items: center;
+  color: $color-dark-stronger;
+  display: flex;
+  gap: rhythm(1);
+  padding-right: rhythm(1);
+  width: fit-content;
+
+  pa-icon {
+    display: flex;
+  }
+}
+
 .toggle-container {
   background-color: $color-neutral-lightest;
   border-radius: rhythm(1);
diff --git a/libs/common/src/lib/kb-creation/kb-creation.component.ts b/libs/common/src/lib/kb-creation/kb-creation.component.ts
index 80fd0b58cc..06a5b01969 100644
--- a/libs/common/src/lib/kb-creation/kb-creation.component.ts
+++ b/libs/common/src/lib/kb-creation/kb-creation.component.ts
@@ -1,9 +1,15 @@
 import { CommonModule } from '@angular/common';
 import { ChangeDetectionStrategy, ChangeDetectorRef, Component, inject, OnDestroy, OnInit } from '@angular/core';
 import { FormControl, FormGroup, ReactiveFormsModule, Validators } from '@angular/forms';
-import { ActivatedRoute, Router } from '@angular/router';
+import { ActivatedRoute, Router, RouterLink } from '@angular/router';
 import { NavigationService, SDKService, standaloneSimpleAccount, STFUtils, ZoneService } from '@flaps/core';
-import { IErrorMessages, PaButtonModule, PaTextFieldModule, PaTogglesModule } from '@guillotinaweb/pastanaga-angular';
+import {
+  IErrorMessages,
+  PaButtonModule,
+  PaIconModule,
+  PaTextFieldModule,
+  PaTogglesModule,
+} from '@guillotinaweb/pastanaga-angular';
 import { TranslateModule, TranslateService } from '@ngx-translate/core';
 import { KnowledgeBoxCreation, LearningConfigurations } from '@nuclia/core';
 import {
@@ -24,10 +30,12 @@ import { EmbeddingsModelFormComponent, LearningConfigurationForm } from '../onbo
     CommonModule,
     BackButtonComponent,
     ReactiveFormsModule,
+    RouterLink,
     TranslateModule,
     TwoColumnsConfigurationItemComponent,
     StickyFooterComponent,
     PaButtonModule,
+    PaIconModule,
     PaTextFieldModule,
     PaTogglesModule,
     EmbeddingsModelFormComponent,
@@ -48,6 +56,9 @@ export class KbCreationComponent implements OnInit, OnDestroy {
   private navigationService = inject(NavigationService);
   private translate = inject(TranslateService);
 
+  embedded = !!this.route.snapshot.data['embedded'];
+  embeddedBackCommands: string[] = [];
+
   private unsubscribeAll = new Subject<void>();
 
   standalone = this.sdk.nuclia.options.standalone;
@@ -85,6 +96,14 @@ export class KbCreationComponent implements OnInit, OnDestroy {
   learningSchema = new ReplaySubject<LearningConfigurations>(1);
 
   ngOnInit() {
+    this.account.pipe(take(1)).subscribe((account) => {
+      if (this.embedded) {
+        this.embeddedBackCommands = ['/at', account.slug, 'manage', 'administration', 'knowledge-boxes'];
+        this.backPath = `${this.navigationService.getAccountManageUrl(account.slug)}/administration`;
+        this.cdr.markForCheck();
+      }
+    });
+
     if (this.sdk.nuclia.options.standalone) {
       this.sdk.nuclia.db.getLearningSchema().subscribe({
         next: (schema) => {
@@ -188,7 +207,11 @@ export class KbCreationComponent implements OnInit, OnDestroy {
       .subscribe({
         next: (nextPath) => {
           this.sdk.refreshKbList();
-          this.router.navigate([nextPath], { relativeTo: this.route });
+          if (this.sdk.nuclia.options.standalone || this.embedded) {
+            this.router.navigateByUrl(this.embedded ? `${nextPath}/knowledge-boxes` : nextPath);
+          } else {
+            this.router.navigate([nextPath], { relativeTo: this.route });
+          }
         },
         error: () => {
           this.toaster.error('kb.create.error');
@@ -205,6 +228,10 @@ export class KbCreationComponent implements OnInit, OnDestroy {
   }
 
   cancel() {
-    this.router.navigate([this.backPath], { relativeTo: this.route });
+    if (this.sdk.nuclia.options.standalone || this.embedded) {
+      this.router.navigateByUrl(this.embedded ? `${this.backPath}/knowledge-boxes` : this.backPath);
+    } else {
+      this.router.navigate([this.backPath], { relativeTo: this.route });
+    }
   }
 }
diff --git a/libs/common/src/lib/navbar/navbar.component.html b/libs/common/src/lib/navbar/navbar.component.html
index 6dea70adcd..cf732ab2b7 100644
--- a/libs/common/src/lib/navbar/navbar.component.html
+++ b/libs/common/src/lib/navbar/navbar.component.html
@@ -426,153 +426,5 @@
         </div>
       }
     }
-    @if (!standalone && isInAccount && (showAccountNav | async)) {
-      <div class="navbar-content dark">
-        <div class="nav-group">
-          <div class="group-items">
-            <a
-              [routerLink]="(accountUrl | async) + '/home'"
-              routerLinkActive="active"
-              data-cy="go-to-account-home"
-              class="nav-link">
-              <pa-icon name="home"></pa-icon>
-              <span class="nav-link-title">{{ 'navbar.account-home' | translate }}</span>
-            </a>
-          </div>
-          <div class="group-items">
-            <a
-              [routerLink]="(accountUrl | async) + '/settings'"
-              routerLinkActive="active"
-              data-cy="go-to-account-settings"
-              class="nav-link">
-              <pa-icon name="gear"></pa-icon>
-              <span class="nav-link-title">{{ 'navbar.account-settings' | translate }}</span>
-            </a>
-          </div>
-          @if (inDashboard) {
-            <div class="group-items">
-              <a
-                [routerLink]="(accountUrl | async) + '/kbs'"
-                routerLinkActive="active"
-                data-cy="go-to-account-kbs"
-                class="nav-link">
-                <pa-icon name="knowledge-box"></pa-icon>
-                <span class="nav-link-title">{{ 'navbar.manage-kbs' | translate }}</span>
-              </a>
-            </div>
-          }
-          <div class="group-items">
-            <a
-              [routerLink]="(accountUrl | async) + '/users'"
-              routerLinkActive="active"
-              data-cy="go-to-account-users"
-              class="nav-link">
-              <pa-icon name="users"></pa-icon>
-              <span class="nav-link-title">{{ 'navbar.users' | translate }}</span>
-            </a>
-          </div>
-          @if (!(simpleMode | async)) {
-            <div class="group-items">
-              <a
-                [routerLink]="(accountUrl | async) + '/nua'"
-                routerLinkActive="active"
-                data-cy="go-to-nua-keys"
-                class="nav-link">
-                <pa-icon name="key"></pa-icon>
-                <span class="nav-link-title">{{ 'navbar.nua-keys' | translate }}</span>
-              </a>
-            </div>
-          }
-          @if ((isRetrievalAgentsEnabled | async) && (inDashboard || inRaoApp) && !(simpleMode | async)) {
-            <div class="group-items">
-              <a
-                [routerLink]="(accountUrl | async) + '/arag'"
-                routerLinkActive="active"
-                data-cy="go-to-retrieval-agents"
-                class="nav-link">
-                <pa-icon name="workflows"></pa-icon>
-                <span class="nav-link-title">{{ 'navbar.account-retrieval-agents' | translate }}</span>
-              </a>
-            </div>
-          }
-          @if ((isModelManagementEnabled | async) && !(simpleMode | async)) {
-            <div class="group-items">
-              <a
-                [routerLink]="(accountUrl | async) + '/models'"
-                routerLinkActive="active"
-                data-cy="go-to-models"
-                class="nav-link">
-                <pa-icon name="settings"></pa-icon>
-                <span class="nav-link-title">{{ 'navbar.models' | translate }}</span>
-              </a>
-            </div>
-          }
-          @if ((isBillingEnabled | async) && !noStripe) {
-            <div class="group-items">
-              <a
-                [routerLink]="(accountUrl | async) + '/billing/subscriptions'"
-                routerLinkActive="active"
-                data-cy="go-to-billing"
-                class="nav-link"
-                [class.sub-item]="inBilling | async">
-                <pa-icon name="payment"></pa-icon>
-                <span class="nav-link-title">{{ 'navbar.subscription' | translate }}</span>
-              </a>
-            </div>
-          }
-          @if ((isSubscribed | async) && (inBilling | async)) {
-            <div class="nav-group">
-              <div class="group-items">
-                <a
-                  [routerLink]="(accountUrl | async) + '/billing/checkout'"
-                  routerLinkActive="active"
-                  data-cy="go-to-checkout"
-                  class="nav-link sub-item">
-                  <pa-icon name="payment-details"></pa-icon>
-                  <span class="nav-link-title">{{ 'billing.payment_details' | translate }}</span>
-                </a>
-                <a
-                  [routerLink]="(accountUrl | async) + '/billing/my-subscription'"
-                  routerLinkActive="active"
-                  data-cy="go-to-my-subscription"
-                  class="nav-link sub-item">
-                  <pa-icon name="info"></pa-icon>
-                  <span class="nav-link-title">{{ 'billing.my-subscription' | translate }}</span>
-                </a>
-                <a
-                  [routerLink]="(accountUrl | async) + '/billing/usage'"
-                  routerLinkActive="active"
-                  data-cy="go-to-usage"
-                  class="nav-link sub-item">
-                  <pa-icon name="chart"></pa-icon>
-                  <span class="nav-link-title">{{ 'billing.usage.consumption' | translate }}</span>
-                </a>
-                <a
-                  [routerLink]="(accountUrl | async) + '/billing/history'"
-                  routerLinkActive="active"
-                  data-cy="go-to-history"
-                  class="nav-link sub-item">
-                  <pa-icon name="history"></pa-icon>
-                  <span class="nav-link-title">{{ 'billing.history.link' | translate }}</span>
-                </a>
-              </div>
-            </div>
-          }
-        </div>
-        @if ((kb | async) || (inAccount | async)) {
-          <div class="nav-group">
-            <div class="group-items">
-              <a
-                [routerLink]="kbUrl"
-                data-cy="go-to-home-from-account"
-                class="nav-link">
-                <pa-icon name="chevron-left"></pa-icon>
-                <span class="nav-link-title">{{ 'generic.back' | translate }}</span>
-              </a>
-            </div>
-          </div>
-        }
-      </div>
-    }
   </div>
 </div>
diff --git a/libs/common/src/lib/navbar/navbar.component.ts b/libs/common/src/lib/navbar/navbar.component.ts
index 2c3ab52943..bf0918c51f 100644
--- a/libs/common/src/lib/navbar/navbar.component.ts
+++ b/libs/common/src/lib/navbar/navbar.component.ts
@@ -1,13 +1,7 @@
 import { ChangeDetectionStrategy, ChangeDetectorRef, Component, OnDestroy, OnInit } from '@angular/core';
 import { NavigationEnd, Router } from '@angular/router';
-import {
-  BackendConfigurationService,
-  BillingService,
-  FeaturesService,
-  NavigationService,
-  SDKService,
-} from '@flaps/core';
-import { combineLatest, filter, map, merge, Observable, of, shareReplay, Subject, switchMap, takeUntil } from 'rxjs';
+import { BackendConfigurationService, FeaturesService, NavigationService, SDKService } from '@flaps/core';
+import { combineLatest, filter, map, merge, Observable, of, Subject, switchMap, takeUntil } from 'rxjs';
 import { StandaloneService } from '../services';
 
 @Component({
@@ -62,14 +56,6 @@ export class NavbarComponent implements OnInit, OnDestroy {
     ),
   );
 
-  inBilling: Observable<boolean> = merge(
-    of(this.navigationService.inAccountBilling(location.pathname)),
-    this.router.events.pipe(
-      filter((event) => event instanceof NavigationEnd),
-      map((event) => this.navigationService.inAccountBilling((event as NavigationEnd).url)),
-      takeUntil(this.unsubscribeAll),
-    ),
-  );
   simpleMode = this.navigationService.simpleMode;
   showSettings = false;
   showMetrics = false;
@@ -85,15 +71,6 @@ export class NavbarComponent implements OnInit, OnDestroy {
   isKbAdmin = this.features.isKbAdmin;
   isAragAdmin = this.features.isAragAdmin;
   isAccountManager = this.features.isAccountManager;
-  isCowork = this.sdk.currentAccount.pipe(
-    map((account) => account.workflow === 'cowork'),
-    shareReplay(1),
-  );
-  showAccountNav = combineLatest([this.isCowork, this.isAccountManager]).pipe(
-    map(([isCowork, isAccountManager]) => isAccountManager && !isCowork),
-    shareReplay(1),
-  );
-  isBillingEnabled = this.features.unstable.billing;
   noStripe = this.backendConfig.noStripe();
   isRemiMetricsEnabled = this.features.authorized.remiMetrics;
   isRetrievalAgentsEnabled = this.features.unstable.retrievalAgents;
@@ -105,7 +82,6 @@ export class NavbarComponent implements OnInit, OnDestroy {
 
   standalone = this.standaloneService.standalone;
   invalidKey = this.standaloneService.hasValidKey.pipe(map((hasValidKey) => this.standalone && !hasValidKey));
-  isSubscribed = this.billing.isSubscribedToStripe;
 
   constructor(
     private cdr: ChangeDetectorRef,
@@ -114,7 +90,6 @@ export class NavbarComponent implements OnInit, OnDestroy {
     private router: Router,
     private navigationService: NavigationService,
     private standaloneService: StandaloneService,
-    private billing: BillingService,
     private backendConfig: BackendConfigurationService,
   ) {}
 
diff --git a/libs/common/src/lib/profile/profile.component.html b/libs/common/src/lib/profile/profile.component.html
index 69012415b8..49d52787cf 100644
--- a/libs/common/src/lib/profile/profile.component.html
+++ b/libs/common/src/lib/profile/profile.component.html
@@ -1,13 +1,17 @@
-<div class="profile">
+<div
+  class="profile"
+  [class.embedded]="embedded">
   <div class="profile-container">
-    <pa-button
-      class="close-button"
-      icon="cross"
-      aspect="basic"
-      (click)="goBack()">
-      {{ 'generic.close' | translate }}
-    </pa-button>
-    <h1 class="page-title">{{ 'account.preferences' | translate }}</h1>
+    @if (!embedded) {
+      <pa-button
+        class="close-button"
+        icon="cross"
+        aspect="basic"
+        (click)="goBack()">
+        {{ 'generic.close' | translate }}
+      </pa-button>
+    }
+    <h2 class="page-subtitle">{{ 'account.preferences' | translate }}</h2>
     <p class="page-description">{{ 'account.preferences-description' | translate }}</p>
     <form [formGroup]="profileForm">
       <div class="field">
diff --git a/libs/common/src/lib/profile/profile.component.scss b/libs/common/src/lib/profile/profile.component.scss
index 4e5d76485e..3dbf4ac282 100644
--- a/libs/common/src/lib/profile/profile.component.scss
+++ b/libs/common/src/lib/profile/profile.component.scss
@@ -1,4 +1,5 @@
 @use 'apps/dashboard/src/variables' as *;
+@use '../account/account';
 
 .profile {
   position: relative;
@@ -16,10 +17,6 @@
     flex-direction: column;
   }
 
-  .page-title {
-    margin-bottom: rhythm(1);
-  }
-
   .page-description {
     color: $color-neutral-regular;
     margin-bottom: rhythm(3);
@@ -50,4 +47,27 @@
     top: rhythm(3);
     right: rhythm(3);
   }
+
+  &.embedded {
+    padding: 0;
+
+    .profile-container {
+      background-color: transparent;
+      border-radius: 0;
+      margin: 0;
+      padding: 0;
+      width: 100%;
+    }
+
+    form {
+      min-height: auto;
+      padding: 0;
+    }
+
+    .actions {
+      margin-top: rhythm(2);
+      padding-top: rhythm(2);
+      text-align: left;
+    }
+  }
 }
diff --git a/libs/common/src/lib/profile/profile.component.spec.ts b/libs/common/src/lib/profile/profile.component.spec.ts
index d179d25f05..e947288643 100644
--- a/libs/common/src/lib/profile/profile.component.spec.ts
+++ b/libs/common/src/lib/profile/profile.component.spec.ts
@@ -8,6 +8,7 @@ import { ProfileComponent } from './profile.component';
 import { PaButtonModule, PaTextFieldModule, PaTogglesModule } from '@guillotinaweb/pastanaga-angular';
 import { SvgIconRegistryService } from 'angular-svg-icon';
 import { MockModule } from 'ng-mocks';
+import { provideRouter } from '@angular/router';
 
 describe('ProfileComponent', () => {
   let component: ProfileComponent;
@@ -29,6 +30,7 @@ describe('ProfileComponent', () => {
         }),
       ],
       providers: [
+        provideRouter([]),
         TranslateService,
         {
           provide: UserService,
diff --git a/libs/common/src/lib/profile/profile.component.ts b/libs/common/src/lib/profile/profile.component.ts
index 523a8e443a..2d3634e99a 100644
--- a/libs/common/src/lib/profile/profile.component.ts
+++ b/libs/common/src/lib/profile/profile.component.ts
@@ -8,6 +8,7 @@ import {
   Output,
 } from '@angular/core';
 import { Location } from '@angular/common';
+import { ActivatedRoute } from '@angular/router';
 import { FormsModule, ReactiveFormsModule, UntypedFormBuilder, Validators } from '@angular/forms';
 import { TranslateModule, TranslateService } from '@ngx-translate/core';
 import { filter, Subject, switchMap, takeUntil } from 'rxjs';
@@ -18,11 +19,13 @@ import { PaButtonModule, PaTextFieldModule, PaTogglesModule } from '@guillotinaw
 @Component({
   selector: 'nus-profile',
   templateUrl: './profile.component.html',
-  styleUrls: ['./profile.component.scss'],
+  styleUrl: './profile.component.scss',
   changeDetection: ChangeDetectionStrategy.OnPush,
   imports: [TranslateModule, PaTextFieldModule, FormsModule, ReactiveFormsModule, PaTogglesModule, PaButtonModule],
 })
 export class ProfileComponent implements OnInit {
+  embedded = !!inject(ActivatedRoute).snapshot.data['embedded'];
+
   @Output() saved = new EventEmitter<void>();
 
   private location = inject(Location);
diff --git a/libs/common/src/lib/topbar/topbar.component.ts b/libs/common/src/lib/topbar/topbar.component.ts
index 2e00ecc162..5e412e1c2a 100644
--- a/libs/common/src/lib/topbar/topbar.component.ts
+++ b/libs/common/src/lib/topbar/topbar.component.ts
@@ -46,9 +46,6 @@ export class TopbarComponent {
         !!accountType && accountType !== 'v3enterprise' && !isTypeEnforced && isAccountManager,
     ),
   );
-  billingUrl = this.sdk.currentAccount.pipe(
-    map((account) => this.navigationService.getAccountManageUrl(account.slug) + '/billing'),
-  );
   isTrial = this.features.isTrial;
   inPlatformApp = this.navigationService.inPlatformApp;
   inDashboard = this.navigationService.inDashboard;
@@ -96,6 +93,35 @@ export class TopbarComponent {
   ) {}
 
   goToHome(): void {
+    // When in account management use the same logic as the "Back to homepage"
+    // button in AccountSettingsComponent: resolve from currentKb (startWith null
+    // so we always get one emission even if no KB is in context).
+    if (this.navigationService.inAccountManagement(location.pathname)) {
+      this.sdk.currentAccount
+        .pipe(
+          take(1),
+          switchMap((account) => {
+            if (!this.sdk.isKbLoaded) {
+              return of(this.navigationService.getKbSelectUrl(account.slug));
+            }
+            // currentKb and aragList are both in ReplaySubjects already — isArag emits synchronously
+            return combineLatest([this.sdk.currentKb, this.sdk.isArag]).pipe(
+              take(1),
+              map(([kb, isArag]) =>
+                isArag
+                  ? this.navigationService.getRetrievalAgentUrl(account.slug, kb.slug as string)
+                  : this.navigationService.getKbUrl(
+                      account.slug,
+                      (this.sdk.nuclia.options.standalone ? kb.id : kb.slug) as string,
+                    ),
+              ),
+            );
+          }),
+        )
+        .subscribe((url) => this.router.navigate([url]));
+      return;
+    }
+
     const simpleHomeUrl$ = this.sdk.isKbLoaded
       ? this.navigationService.kbUrl
       : of(this.navigationService.getAccountSelectUrl());
@@ -122,15 +148,8 @@ export class TopbarComponent {
   }
 
   goToSubscriptions() {
-    combineLatest([this.simpleMode.pipe(take(1)), this.sdk.currentAccount.pipe(take(1))]).subscribe(
-      ([isSimple, account]) => {
-        if (isSimple) {
-          const homeUrl = this.navigationService.getAccountManageUrl(account.slug) + '/home';
-          this.router.navigate([homeUrl], { queryParams: { tab: 'subscriptions' } });
-        } else {
-          this.router.navigate([this.navigationService.getAccountManageUrl(account.slug) + '/billing']);
-        }
-      },
-    );
+    this.sdk.currentAccount.pipe(take(1)).subscribe((account) => {
+      this.router.navigate([`${this.navigationService.getAccountManageUrl(account.slug)}/home/subscriptions`]);
+    });
   }
 }
diff --git a/libs/common/src/lib/topbar/user-menu/user-menu.component.html b/libs/common/src/lib/topbar/user-menu/user-menu.component.html
index f1ea2f07f6..33c8260799 100644
--- a/libs/common/src/lib/topbar/user-menu/user-menu.component.html
+++ b/libs/common/src/lib/topbar/user-menu/user-menu.component.html
@@ -5,92 +5,48 @@
   openOnFocus
   [attr.aria-label]="'generic.user_menu' | translate"
   [paPopup]="userMenu">
-  <pa-avatar
-    size="small"
-    [avatar]="avatar"></pa-avatar>
+  <span class="avatar-wrapper">
+    <pa-avatar
+      size="small"
+      [avatar]="avatar" />
+    <nsi-badge
+      icon="gear"
+      [paTooltip]="'user-menu.account-settings' | translate"></nsi-badge>
+  </span>
 </button>
 
 <pa-dropdown #userMenu>
-  @if (!(simpleMode | async)) {
-    <!-- Advanced mode menu -->
-    <pa-option
-      icon="user"
-      (click)="goProfile()">
-      {{ 'generic.user_preferences' | translate }}
-    </pa-option>
-    @if ((isBillingEnabled | async) && (isAccountManager | async) && !noStripe) {
-      <pa-separator></pa-separator>
-      <pa-option
-        icon="payment"
-        (click)="goToBilling()">
-        {{ 'account.billing' | translate }}
-      </pa-option>
-    }
-    @if (accounts.length > 1 || standalone) {
-      <pa-separator></pa-separator>
-      <pa-option
-        icon="reload"
-        (click)="switchAccount()">
-        {{ 'generic.switch_account' | translate }}
-      </pa-option>
-    }
-    @if (isKbAdmin | async) {
-      <pa-option
-        data-cy="go-to-manage-users"
-        icon="users"
-        (click)="goToManageUsers()">
-        {{ 'account.manage_users' | translate }}
-      </pa-option>
-    }
-    @if (!standalone && (isAccountManager | async) === true && !(isCowork | async)) {
-      <pa-option
-        data-cy="go-to-manage-account"
-        icon="account"
-        (click)="goToManageAccount()">
-        {{ 'account.manage' | translate }}
-      </pa-option>
-    }
-    @if ((isCowork | async) && (isAccountManager | async)) {
-      <pa-option
-        data-cy="delete-account"
-        destructive
-        icon="trash"
-        (click)="openDeleteAccount()">
-        {{ 'account.delete_account' | translate }}
-      </pa-option>
+  @for (section of sections; track $index) {
+    @if (!section.visible$ || (section.visible$ | async)) {
+      @if (section.prependSeparator) {
+        <pa-separator></pa-separator>
+      }
+      @if (section.header) {
+        <pa-option-header>{{ section.header | translate }}</pa-option-header>
+      }
+      @for (item of section.items; track item.label) {
+        @if (!item.visible$ || (item.visible$ | async)) {
+          @if (item.destructive) {
+            <pa-option
+              [icon]="item.icon"
+              [attr.data-cy]="item.dataCy ?? null"
+              destructive
+              (click)="item.action()">
+              {{ item.label | translate }}
+            </pa-option>
+          } @else {
+            <pa-option
+              [icon]="item.icon"
+              [attr.data-cy]="item.dataCy ?? null"
+              (click)="item.action()">
+              {{ item.label | translate }}
+            </pa-option>
+          }
+        }
+      }
+      @if (section.appendSeparator) {
+        <pa-separator></pa-separator>
+      }
     }
-
-    <pa-separator></pa-separator>
-  } @else {
-    <!-- Simple mode menu (non-advanced) -->
-    <pa-option
-      data-cy="go-to-settings"
-      icon="gear"
-      (click)="goToManageAccount()">
-      {{ 'generic.settings' | translate }}
-    </pa-option>
-    <pa-separator></pa-separator>
-  }
-
-  <pa-option
-    icon="warning"
-    (click)="goToSupport()">
-    {{ 'generic.report_bug' | translate }}
-  </pa-option>
-  @if ((simpleMode | async) && (isAccountManager | async)) {
-    <pa-option
-      data-cy="delete-account"
-      destructive
-      icon="trash"
-      (click)="openDeleteAccount()">
-      {{ 'account.delete_account' | translate }}
-    </pa-option>
   }
-  <pa-separator></pa-separator>
-  <pa-option
-    data-cy="logout"
-    icon="log-out"
-    (click)="logout()">
-    {{ 'generic.logout' | translate }}
-  </pa-option>
 </pa-dropdown>
diff --git a/libs/common/src/lib/topbar/user-menu/user-menu.component.scss b/libs/common/src/lib/topbar/user-menu/user-menu.component.scss
index 169c77ce32..d9e53b4371 100644
--- a/libs/common/src/lib/topbar/user-menu/user-menu.component.scss
+++ b/libs/common/src/lib/topbar/user-menu/user-menu.component.scss
@@ -13,6 +13,20 @@
     border-radius: 50%;
   }
 
+  .avatar-wrapper {
+    position: relative;
+    display: inline-flex;
+
+    nsi-badge {
+      position: absolute;
+      bottom: -4px;
+      right: -4px;
+      cursor: pointer;
+      gap: 0;
+      text-transform: unset;
+    }
+  }
+
   pa-avatar ::ng-deep .pa-avatar {
     cursor: pointer;
     height: rhythm(5);
@@ -25,4 +39,8 @@
       font-weight: $font-weight-thin;
     }
   }
+
+  ::ng-deep pa-dropdown .pa-popup-wrapper {
+    max-height: calc(100vh - 120px);
+  }
 }
diff --git a/libs/common/src/lib/topbar/user-menu/user-menu.component.ts b/libs/common/src/lib/topbar/user-menu/user-menu.component.ts
index cfec8c9504..39ad77deb0 100644
--- a/libs/common/src/lib/topbar/user-menu/user-menu.component.ts
+++ b/libs/common/src/lib/topbar/user-menu/user-menu.component.ts
@@ -1,14 +1,5 @@
 import { CommonModule } from '@angular/common';
-import {
-  ChangeDetectionStrategy,
-  ChangeDetectorRef,
-  Component,
-  EventEmitter,
-  Input,
-  OnDestroy,
-  OnInit,
-  Output,
-} from '@angular/core';
+import { ChangeDetectionStrategy, Component, EventEmitter, inject, Input, OnInit, Output } from '@angular/core';
 import { Router } from '@angular/router';
 import {
   AccountVerificationService,
@@ -24,13 +15,31 @@ import {
   PaFocusableModule,
   PaIconModule,
   PaPopupModule,
+  PaTooltipModule,
 } from '@guillotinaweb/pastanaga-angular';
 import { TranslateModule } from '@ngx-translate/core';
-import { Account, Welcome } from '@nuclia/core';
-import { SisModalService } from '@nuclia/sistema';
-import { map, shareReplay, Subject, takeUntil } from 'rxjs';
+import { Welcome } from '@nuclia/core';
+import { SisModalService, BadgeComponent } from '@nuclia/sistema';
+import { BehaviorSubject, combineLatest, map, Observable, shareReplay, take } from 'rxjs';
 import { AccountDeleteComponent } from '../../account/account-manage/account-delete/account-delete.component';
 
+interface MenuItem {
+  label: string;
+  icon: string;
+  action: () => void;
+  visible$?: Observable<boolean>;
+  dataCy?: string;
+  destructive?: boolean;
+}
+
+interface MenuSection {
+  header?: string;
+  items: MenuItem[];
+  visible$?: Observable<boolean>;
+  prependSeparator?: boolean;
+  appendSeparator?: boolean;
+}
+
 @Component({
   selector: 'app-user-menu',
   imports: [
@@ -41,16 +50,26 @@ import { AccountDeleteComponent } from '../../account/account-manage/account-del
     PaDropdownModule,
     PaFocusableModule,
     PaPopupModule,
-    AccountDeleteComponent,
+    PaTooltipModule,
+    BadgeComponent,
   ],
   templateUrl: './user-menu.component.html',
   styleUrls: ['./user-menu.component.scss'],
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
-export class UserMenuComponent implements OnInit, OnDestroy {
+export class UserMenuComponent implements OnInit {
+  private readonly router = inject(Router);
+  private readonly navigation = inject(NavigationService);
+  private readonly sdk = inject(SDKService);
+  private readonly features = inject(FeaturesService);
+  private readonly backendConfig = inject(BackendConfigurationService);
+  private readonly accountVerification = inject(AccountVerificationService);
+  private readonly modalService = inject(SisModalService);
+
   @Input() set userInfo(userInfo: Welcome | undefined | null) {
     if (userInfo) {
       this.accounts = userInfo.accounts || [];
+      this.showSwitchAccount$.next(this.accounts.length > 1 || !!this.standalone);
       if (userInfo.preferences) {
         this.avatar = {
           userName: userInfo.preferences.name,
@@ -64,39 +83,169 @@ export class UserMenuComponent implements OnInit, OnDestroy {
 
   avatar: AvatarModel = {};
   accounts: string[] = [];
-  account: Account | null = null;
-  isAccountManager = this.features.isAccountManager;
-  isCowork = this.sdk.currentAccount.pipe(
+
+  private readonly standalone = this.sdk.nuclia.options.standalone;
+  private readonly noStripe = this.backendConfig.noStripe();
+
+  private readonly isAccountManager = this.features.isAccountManager;
+  private readonly isBillingEnabled = this.features.unstable.billing;
+  private readonly isRetrievalAgentsEnabled = this.features.unstable.retrievalAgents;
+  private readonly isModelManagementEnabled = this.features.unstable.modelManagement;
+
+  private readonly isCowork = this.sdk.currentAccount.pipe(
     map((account) => account.workflow === 'cowork'),
     shareReplay(1),
   );
-  isKbAdmin = this.features.isKbAdmin;
-  isBillingEnabled = this.features.unstable.billing;
-  noStripe = this.backendConfig.noStripe();
-  standalone = this.sdk.nuclia.options.standalone;
-  simpleMode = this.navigation.simpleMode;
-  kbUrl = '';
-
-  private unsubscribeAll = new Subject<void>();
-
-  constructor(
-    private router: Router,
-    private navigation: NavigationService,
-    private sdk: SDKService,
-    private features: FeaturesService,
-    private cdr: ChangeDetectorRef,
-    private backendConfig: BackendConfigurationService,
-    private accountVerification: AccountVerificationService,
-    private modalService: SisModalService,
-  ) {
-    this.sdk.currentAccount.pipe(takeUntil(this.unsubscribeAll)).subscribe((account) => {
-      this.account = account;
-      this.cdr.markForCheck();
-    });
-    this.navigation.kbUrl.pipe(takeUntil(this.unsubscribeAll)).subscribe((url) => {
-      this.kbUrl = url;
-    });
-  }
+
+  private readonly simpleMode = this.navigation.simpleMode;
+
+  private readonly showAccountGroup = this.isAccountManager.pipe(
+    map((isAccountManager) => !this.standalone && !!isAccountManager),
+    shareReplay(1),
+  );
+
+  // True in advanced (non-simple) mode AND user has account-level access
+  private readonly showAdvancedAccountSections = combineLatest([
+    this.simpleMode.pipe(map((s) => !s)),
+    this.showAccountGroup,
+  ]).pipe(
+    map(([advanced, group]) => advanced && group),
+    shareReplay(1),
+  );
+
+  private readonly showSwitchAccount$ = new BehaviorSubject<boolean>(!!this.standalone);
+
+  readonly sections: MenuSection[] = [
+    // ── Account ────────────────────────────────────────────────────────────
+    {
+      header: 'user-menu.section.account',
+      visible$: this.showAccountGroup,
+      items: [
+        {
+          label: 'account.consumption',
+          icon: 'chart',
+          action: () => this.go('home/consumption'),
+          visible$: this.isAccountManager.pipe(map((m) => !this.standalone && !!m)),
+        },
+        {
+          label: 'account.billing',
+          icon: 'payment',
+          action: () => this.go('home/subscriptions'),
+          visible$: combineLatest([this.isBillingEnabled, this.isAccountManager]).pipe(
+            map(([billing, manager]) => !!billing && !!manager && !this.noStripe),
+          ),
+        },
+        {
+          label: 'account.manage',
+          icon: 'gear',
+          dataCy: 'go-to-account-settings',
+          action: () => this.go('home/account-settings'),
+          visible$: combineLatest([this.isAccountManager, this.isCowork]).pipe(
+            map(([manager, cowork]) => !this.standalone && !!manager && !cowork),
+          ),
+        },
+      ],
+    },
+    // ── Administration ─────────────────────────────────────────────────────
+    {
+      header: 'user-menu.section.administration',
+      visible$: this.showAdvancedAccountSections,
+      prependSeparator: true,
+      items: [
+        {
+          label: 'account.related_kbs',
+          icon: 'knowledge-box',
+          action: () => this.go('administration/knowledge-boxes'),
+        },
+        {
+          label: 'navbar.account-retrieval-agents',
+          icon: 'workflows',
+          action: () => this.go('administration/retrieval-agents'),
+          visible$: this.isRetrievalAgentsEnabled,
+        },
+        {
+          label: 'account.manage_users',
+          icon: 'users',
+          dataCy: 'go-to-manage-users',
+          action: () => this.go('administration/users'),
+          visible$: this.isAccountManager,
+        },
+      ],
+    },
+    // ── Configuration ──────────────────────────────────────────────────────
+    {
+      header: 'user-menu.section.configuration',
+      visible$: this.showAdvancedAccountSections,
+      prependSeparator: true,
+      items: [
+        {
+          label: 'navbar.nua-keys',
+          icon: 'key',
+          action: () => this.go('configuration/nua'),
+        },
+        {
+          label: 'navbar.models',
+          icon: 'settings',
+          action: () => this.go('configuration/models'),
+          visible$: this.isModelManagementEnabled,
+        },
+      ],
+    },
+    // ── User preferences — visible for all users in all modes ─────────────
+    {
+      prependSeparator: true,
+      appendSeparator: true,
+      items: [
+        {
+          label: 'generic.user_preferences',
+          icon: 'user',
+          action: () => this.navigateToProfile(),
+        },
+      ],
+    },
+    // ── Support ────────────────────────────────────────────────────────────
+    {
+      header: 'user-menu.section.support',
+      items: [
+        {
+          label: 'generic.report_bug',
+          icon: 'warning',
+          // intentionally no menuClose — mailto opens externally, page stays
+          action: () => {
+            location.href = 'mailto:Sales.AgenticRAG@progress.com';
+          },
+        },
+        {
+          label: 'account.delete_account',
+          icon: 'trash',
+          dataCy: 'delete-account',
+          destructive: true,
+          action: () => this.openDeleteAccount(),
+          visible$: combineLatest([this.simpleMode, this.isAccountManager]).pipe(
+            map(([simple, manager]) => !!simple && !!manager),
+          ),
+        },
+      ],
+    },
+    // ── Session ────────────────────────────────────────────────────────────
+    {
+      prependSeparator: true,
+      items: [
+        {
+          label: 'generic.switch_account',
+          icon: 'reload',
+          action: () => this.switchAccount(),
+          visible$: this.showSwitchAccount$,
+        },
+        {
+          label: 'generic.logout',
+          icon: 'log-out',
+          dataCy: 'logout',
+          action: () => this.logout(),
+        },
+      ],
+    },
+  ];
 
   ngOnInit(): void {
     if (this.accountVerification.hasPendingDelete() && this.accountVerification.isRecentlyVerified()) {
@@ -105,50 +254,38 @@ export class UserMenuComponent implements OnInit, OnDestroy {
     }
   }
 
-  ngOnDestroy(): void {
-    this.unsubscribeAll.next();
-    this.unsubscribeAll.complete();
-  }
-
-  goProfile() {
+  private go(path: string): void {
     this.menuClose.emit();
-    this.router.navigate(['/user/profile']);
+    this.sdk.currentAccount.pipe(take(1)).subscribe((account) => {
+      this.router.navigate([`${this.navigation.getAccountManageUrl(account.slug)}/${path}`]);
+    });
   }
 
-  goToBilling() {
+  // Account managers navigate to the preferences tab; other users go to the standalone profile page.
+  private navigateToProfile(): void {
     this.menuClose.emit();
-    this.router.navigate([`${this.navigation.getAccountManageUrl(this.account?.slug || '')}/billing`]);
+    this.sdk.currentAccount.pipe(take(1)).subscribe((account) => {
+      if (account.can_manage_account) {
+        this.router.navigate([`${this.navigation.getAccountManageUrl(account.slug)}/home/preferences`]);
+      } else {
+        this.router.navigate(['/user/profile']);
+      }
+    });
   }
 
-  switchAccount() {
+  private switchAccount(): void {
     this.menuClose.emit();
     this.sdk.cleanAccount();
     this.router.navigate([this.navigation.getAccountSelectUrl()]);
   }
 
-  logout() {
+  private openDeleteAccount(): void {
     this.menuClose.emit();
-    this.sdk.nuclia.auth.logout();
-  }
-
-  goToSupport() {
-    location.href = 'mailto:Sales.AgenticRAG@progress.com';
-  }
-
-  goToManageAccount() {
-    this.menuClose.emit();
-    if (this.account) {
-      this.router.navigate([this.navigation.getAccountManageUrl(this.account.slug) + '/home']);
-    }
-  }
-
-  goToManageUsers() {
-    this.menuClose.emit();
-    this.router.navigate([this.kbUrl + '/users']);
+    this.modalService.openModal(AccountDeleteComponent);
   }
 
-  openDeleteAccount() {
+  private logout(): void {
     this.menuClose.emit();
-    this.modalService.openModal(AccountDeleteComponent);
+    this.sdk.nuclia.auth.logout();
   }
 }
diff --git a/libs/core/src/lib/services/navigation.service.ts b/libs/core/src/lib/services/navigation.service.ts
index 89583fad03..4ccdbdda04 100644
--- a/libs/core/src/lib/services/navigation.service.ts
+++ b/libs/core/src/lib/services/navigation.service.ts
@@ -18,7 +18,6 @@ import {
 
 const IN_ARAG = /at\/[^/]+\/[^/]+\/arag/;
 const IN_ACCOUNT_MANAGEMENT = /\/at\/[^/]+\/manage/;
-const IN_ACCOUNT_BILLING = /\/at\/[^/]+\/manage\/billing/;
 
 @Injectable({
   providedIn: 'root',
@@ -111,9 +110,6 @@ export class NavigationService {
     const pattern = `${kbUrl}/upload`;
     return new RegExp(pattern).test(path);
   }
-  inAccountBilling(path: string): boolean {
-    return IN_ACCOUNT_BILLING.test(path);
-  }
 
   getAccountUrl(accountSlug: string): string {
     return `/at/${accountSlug}`;

From 8964525a7b5b6382260a81016fd5dc16723f69b3 Mon Sep 17 00:00:00 2001
From: ykulynych <gg.kulynych@gmail.com>
Date: Fri, 10 Jul 2026 10:01:16 +0200
Subject: [PATCH 2/3] [sc-14993] Moved 'user preferences' under the account
 group

---
 .../account-settings.component.html           | 16 +++++++-------
 .../topbar/user-menu/user-menu.component.ts   | 22 +++++++++----------
 2 files changed, 18 insertions(+), 20 deletions(-)

diff --git a/libs/common/src/lib/account/account-home/account-settings.component.html b/libs/common/src/lib/account/account-home/account-settings.component.html
index ea959e3287..853db21f54 100644
--- a/libs/common/src/lib/account/account-home/account-settings.component.html
+++ b/libs/common/src/lib/account/account-home/account-settings.component.html
@@ -32,14 +32,6 @@
         {{ 'account.billing' | translate }}
       </pa-tab>
     }
-    <pa-tab
-      routerLink="preferences"
-      routerLinkActive
-      #rla2="routerLinkActive"
-      [active]="rla2.isActive"
-      ariaControls="settings-section-panel">
-      {{ 'generic.user_preferences' | translate }}
-    </pa-tab>
     @if (showAccountSettingsTab | async) {
       <pa-tab
         routerLink="account-settings"
@@ -50,5 +42,13 @@
         {{ 'account.manage' | translate }}
       </pa-tab>
     }
+    <pa-tab
+      routerLink="preferences"
+      routerLinkActive
+      #rla2="routerLinkActive"
+      [active]="rla2.isActive"
+      ariaControls="settings-section-panel">
+      {{ 'generic.user_preferences' | translate }}
+    </pa-tab>
   </pa-tabs>
 </app-account-page-layout>
diff --git a/libs/common/src/lib/topbar/user-menu/user-menu.component.ts b/libs/common/src/lib/topbar/user-menu/user-menu.component.ts
index 39ad77deb0..57d24bff21 100644
--- a/libs/common/src/lib/topbar/user-menu/user-menu.component.ts
+++ b/libs/common/src/lib/topbar/user-menu/user-menu.component.ts
@@ -146,6 +146,16 @@ export class UserMenuComponent implements OnInit {
         },
       ],
     },
+    // ── User preferences — visible for all users in all modes ─────────────
+    {
+      items: [
+        {
+          label: 'generic.user_preferences',
+          icon: 'user',
+          action: () => this.navigateToProfile(),
+        },
+      ],
+    },
     // ── Administration ─────────────────────────────────────────────────────
     {
       header: 'user-menu.section.administration',
@@ -191,18 +201,6 @@ export class UserMenuComponent implements OnInit {
         },
       ],
     },
-    // ── User preferences — visible for all users in all modes ─────────────
-    {
-      prependSeparator: true,
-      appendSeparator: true,
-      items: [
-        {
-          label: 'generic.user_preferences',
-          icon: 'user',
-          action: () => this.navigateToProfile(),
-        },
-      ],
-    },
     // ── Support ────────────────────────────────────────────────────────────
     {
       header: 'user-menu.section.support',

From 681b1fe66fc5d23ef1c46f0067f14ca90e780e70 Mon Sep 17 00:00:00 2001
From: ykulynych <gg.kulynych@gmail.com>
Date: Fri, 10 Jul 2026 14:53:56 +0200
Subject: [PATCH 3/3] [sc-14993] Added billing page and related menu items

---
 libs/common/common.babel                      | 117 +++++++++++++++++-
 libs/common/src/assets/i18n/ca.json           |   7 +-
 libs/common/src/assets/i18n/en.json           |   7 +-
 libs/common/src/assets/i18n/es.json           |   7 +-
 libs/common/src/assets/i18n/fr.json           |   7 +-
 .../account-arag/account-arag.component.ts    |  12 --
 .../account-billing.component.html            |  51 ++++++++
 .../account-billing.component.scss            |  12 ++
 .../account-billing.component.ts              |  35 ++++++
 .../account-settings.component.html           |  18 ---
 .../account-settings.component.scss           |  11 --
 .../account-settings.component.ts             |  15 +--
 libs/common/src/lib/account/account.module.ts |  37 +++---
 .../account/billing/billing.component.html    |   1 -
 .../account/billing/billing.component.scss    |  10 --
 .../lib/account/billing/billing.component.ts  |  27 ----
 .../src/lib/account/billing/billing.module.ts |   2 -
 .../billing/checkout/checkout.component.html  |   9 +-
 .../billing/checkout/checkout.component.ts    |   7 +-
 .../lib/account/billing/redirect.component.ts |   2 +-
 .../subscriptions.component.html              |   2 -
 .../subscriptions/subscriptions.component.ts  |   2 +-
 .../common/src/lib/topbar/topbar.component.ts |   2 +-
 .../topbar/user-menu/user-menu.component.ts   |  65 ++++++++--
 24 files changed, 326 insertions(+), 139 deletions(-)
 delete mode 100644 libs/common/src/lib/account/account-arag/account-arag.component.ts
 create mode 100644 libs/common/src/lib/account/account-billing/account-billing.component.html
 create mode 100644 libs/common/src/lib/account/account-billing/account-billing.component.scss
 create mode 100644 libs/common/src/lib/account/account-billing/account-billing.component.ts
 delete mode 100644 libs/common/src/lib/account/billing/billing.component.html
 delete mode 100644 libs/common/src/lib/account/billing/billing.component.scss
 delete mode 100644 libs/common/src/lib/account/billing/billing.component.ts

diff --git a/libs/common/common.babel b/libs/common/common.babel
index 81802b057a..6433485dfe 100644
--- a/libs/common/common.babel
+++ b/libs/common/common.babel
@@ -12732,6 +12732,52 @@
 									</translation>
 								</translations>
 							</concept_node>
+							<concept_node>
+								<name>page-description</name>
+								<description/>
+								<comment/>
+								<translations>
+									<translation>
+										<language>ca-ES</language>
+										<approved>false</approved>
+									</translation>
+									<translation>
+										<language>en-US</language>
+										<approved>false</approved>
+									</translation>
+									<translation>
+										<language>es-ES</language>
+										<approved>false</approved>
+									</translation>
+									<translation>
+										<language>fr-FR</language>
+										<approved>false</approved>
+									</translation>
+								</translations>
+							</concept_node>
+							<concept_node>
+								<name>page-title</name>
+								<description/>
+								<comment/>
+								<translations>
+									<translation>
+										<language>ca-ES</language>
+										<approved>false</approved>
+									</translation>
+									<translation>
+										<language>en-US</language>
+										<approved>false</approved>
+									</translation>
+									<translation>
+										<language>es-ES</language>
+										<approved>false</approved>
+									</translation>
+									<translation>
+										<language>fr-FR</language>
+										<approved>false</approved>
+									</translation>
+								</translations>
+							</concept_node>
 							<concept_node>
 								<name>paragraphs_per_file</name>
 								<description/>
@@ -13082,6 +13128,29 @@
 									</translation>
 								</translations>
 							</concept_node>
+							<concept_node>
+								<name>plan-subscription</name>
+								<description/>
+								<comment/>
+								<translations>
+									<translation>
+										<language>ca-ES</language>
+										<approved>false</approved>
+									</translation>
+									<translation>
+										<language>en-US</language>
+										<approved>false</approved>
+									</translation>
+									<translation>
+										<language>es-ES</language>
+										<approved>false</approved>
+									</translation>
+									<translation>
+										<language>fr-FR</language>
+										<approved>false</approved>
+									</translation>
+								</translations>
+							</concept_node>
 							<concept_node>
 								<name>postal_code</name>
 								<description/>
@@ -14439,6 +14508,29 @@
 											</translation>
 										</translations>
 									</concept_node>
+									<concept_node>
+										<name>label</name>
+										<description/>
+										<comment/>
+										<translations>
+											<translation>
+												<language>ca-ES</language>
+												<approved>false</approved>
+											</translation>
+											<translation>
+												<language>en-US</language>
+												<approved>false</approved>
+											</translation>
+											<translation>
+												<language>es-ES</language>
+												<approved>false</approved>
+											</translation>
+											<translation>
+												<language>fr-FR</language>
+												<approved>false</approved>
+											</translation>
+										</translations>
+									</concept_node>
 									<concept_node>
 										<name>over_consume</name>
 										<description/>
@@ -17770,7 +17862,7 @@
 								</translations>
 							</concept_node>
 							<concept_node>
-								<name>back_to_settings</name>
+								<name>back_to_subscription</name>
 								<description/>
 								<comment/>
 								<translations>
@@ -71198,6 +71290,29 @@
 											</translation>
 										</translations>
 									</concept_node>
+									<concept_node>
+										<name>billing</name>
+										<description/>
+										<comment/>
+										<translations>
+											<translation>
+												<language>ca-ES</language>
+												<approved>false</approved>
+											</translation>
+											<translation>
+												<language>en-US</language>
+												<approved>false</approved>
+											</translation>
+											<translation>
+												<language>es-ES</language>
+												<approved>false</approved>
+											</translation>
+											<translation>
+												<language>fr-FR</language>
+												<approved>false</approved>
+											</translation>
+										</translations>
+									</concept_node>
 									<concept_node>
 										<name>configuration</name>
 										<description/>
diff --git a/libs/common/src/assets/i18n/ca.json b/libs/common/src/assets/i18n/ca.json
index 87ae86c86e..99317d1d8e 100644
--- a/libs/common/src/assets/i18n/ca.json
+++ b/libs/common/src/assets/i18n/ca.json
@@ -534,6 +534,8 @@
 	"billing.not_company": "No soc una empresa",
 	"billing.on_premise_cost": "Amb <strong>NucliaDB Hybrid</strong> no comporta cap cost addicional.",
 	"billing.order_number": "Número de comanda",
+	"billing.page-description": "Gestiona la teva subscripció, els pagaments i l'historial d'ús.",
+	"billing.page-title": "Facturació",
 	"billing.paragraphs_per_file": "Un fitxer de text de 10 pàgines conté aproximadament 300 blocs de text",
 	"billing.parameter.ai-tokens-used": "Peticions de cerca",
 	"billing.parameter.files": "Quants documents?",
@@ -549,6 +551,7 @@
 	"billing.payment_method": "Mètode de pagament",
 	"billing.phone": "Número de telèfon",
 	"billing.phone_placeholder": "e.g. +34 000 000 000",
+	"billing.plan-subscription": "Pagament i subscripció",
 	"billing.postal_code": "Còdi postal",
 	"billing.preprocessing": "Preprocessament Agentic RAG",
 	"billing.prices_vat": "L’IVA podria ser aplicable",
@@ -607,6 +610,7 @@
 	"billing.usage.cost": "Cost",
 	"billing.usage.description": "El cost mensual actual corresponent al consum fins a la data.",
 	"billing.usage.interval": "La propera factura es generarà el dia {{to}}",
+	"billing.usage.label": "Ús",
 	"billing.usage.over_consume": "Sobreconsum",
 	"billing.usage.requests": "Peticions",
 	"billing.usage.tier_included": "Inclòs al nivell",
@@ -743,7 +747,7 @@
 	"generic.back": "Enrere",
 	"generic.back_to_accounts": "Tornar a Comptes",
 	"generic.back_to_home": "Tornar a la Home",
-	"generic.back_to_settings": "Torna a Configuració",
+	"generic.back_to_subscription": "Torna a la subscripció",
 	"generic.badge.advanced": "Avançat",
 	"generic.badge.beta": "Beta",
 	"generic.badge.optional": "Opcional",
@@ -2935,6 +2939,7 @@
 	"user-menu.account-settings": "Configuració del compte",
 	"user-menu.section.account": "Compte",
 	"user-menu.section.administration": "Administració",
+	"user-menu.section.billing": "Facturació",
 	"user-menu.section.configuration": "Configuració",
 	"user-menu.section.personal": "Personal",
 	"user-menu.section.support": "Suport",
diff --git a/libs/common/src/assets/i18n/en.json b/libs/common/src/assets/i18n/en.json
index 29e0d6730e..a7826b80e1 100644
--- a/libs/common/src/assets/i18n/en.json
+++ b/libs/common/src/assets/i18n/en.json
@@ -534,6 +534,8 @@
 	"billing.not_company": "I’m not a company",
 	"billing.on_premise_cost": "With <strong>NucliaDB Hybrid</strong> does not carry any extra cost.",
 	"billing.order_number": "Order number",
+	"billing.page-description": "Manage your subscription, payments, and usage history.",
+	"billing.page-title": "Billing",
 	"billing.paragraphs_per_file": "A 10-page text file contains approximately 300 text blocks",
 	"billing.parameter.ai-tokens-used": "Search requests",
 	"billing.parameter.files": "How many documents?",
@@ -549,6 +551,7 @@
 	"billing.payment_method": "Payment method",
 	"billing.phone": "Phone number",
 	"billing.phone_placeholder": "e.g. +34 000 000 000",
+	"billing.plan-subscription": "Payment & subscription",
 	"billing.postal_code": "ZIP",
 	"billing.preprocessing": "Agentic RAG preprocessing",
 	"billing.prices_vat": "VAT might be applicable",
@@ -607,6 +610,7 @@
 	"billing.usage.cost": "Cost",
 	"billing.usage.description": "The current monthly cost corresponding to the consumption to date.",
 	"billing.usage.interval": "Next invoice will be generated on {{to}}",
+	"billing.usage.label": "Usage",
 	"billing.usage.over_consume": "Over consume",
 	"billing.usage.requests": "Requests",
 	"billing.usage.tier_included": "Tier included",
@@ -743,7 +747,7 @@
 	"generic.back": "Back",
 	"generic.back_to_accounts": "Back to Accounts",
 	"generic.back_to_home": "Back to Home Page",
-	"generic.back_to_settings": "Back to Settings",
+	"generic.back_to_subscription": "Back to Subscription",
 	"generic.badge.advanced": "Advanced",
 	"generic.badge.beta": "Beta",
 	"generic.badge.optional": "Optional",
@@ -2935,6 +2939,7 @@
 	"user-menu.account-settings": "Account settings",
 	"user-menu.section.account": "Account",
 	"user-menu.section.administration": "Administration",
+	"user-menu.section.billing": "Billing",
 	"user-menu.section.configuration": "Configuration",
 	"user-menu.section.personal": "Personal",
 	"user-menu.section.support": "Support",
diff --git a/libs/common/src/assets/i18n/es.json b/libs/common/src/assets/i18n/es.json
index edb78c865d..673a17f034 100644
--- a/libs/common/src/assets/i18n/es.json
+++ b/libs/common/src/assets/i18n/es.json
@@ -534,6 +534,8 @@
 	"billing.not_company": "No soy una empresa",
 	"billing.on_premise_cost": "Con <strong>NucliaDB Hybrid</strong> no conlleva ningún coste extra.",
 	"billing.order_number": "Número de pedido",
+	"billing.page-description": "Gestiona tu suscripción, pagos e historial de uso.",
+	"billing.page-title": "FACTURACIÓN",
 	"billing.paragraphs_per_file": "Un archivo de texto de 10 páginas contiene aproximadamente 300 bloques de texto.",
 	"billing.parameter.ai-tokens-used": "Peticiones de búsqueda",
 	"billing.parameter.files": "¿Cuántos documentos?",
@@ -549,6 +551,7 @@
 	"billing.payment_method": "Método de pago",
 	"billing.phone": "Número de teléfono",
 	"billing.phone_placeholder": "e.g. +34 000 000 000",
+	"billing.plan-subscription": "Pago y suscripción",
 	"billing.postal_code": "Código postal",
 	"billing.preprocessing": "Preprocesamiento de Agentic RAG",
 	"billing.prices_vat": "El IVA podría ser aplicable",
@@ -607,6 +610,7 @@
 	"billing.usage.cost": "Coste",
 	"billing.usage.description": "El costo mensual actual correspondiente al consumo hasta la fecha.",
 	"billing.usage.interval": "La próxima factura se generará el {{to}}",
+	"billing.usage.label": "Uso",
 	"billing.usage.over_consume": "Sobreconsumo",
 	"billing.usage.requests": "Peticiones",
 	"billing.usage.tier_included": "Incluido en el nivel",
@@ -743,7 +747,7 @@
 	"generic.back": "Volver",
 	"generic.back_to_accounts": "Volver a Cuentas",
 	"generic.back_to_home": "Volver a la Home",
-	"generic.back_to_settings": "Volver a Configuración",
+	"generic.back_to_subscription": "Volver a la suscripción",
 	"generic.badge.advanced": "Avanzado",
 	"generic.badge.beta": "Beta",
 	"generic.badge.optional": "Opcional",
@@ -2935,6 +2939,7 @@
 	"user-menu.account-settings": "Configuraciones de la Cuenta",
 	"user-menu.section.account": "Cuenta",
 	"user-menu.section.administration": "Administración",
+	"user-menu.section.billing": "FACTURACIÓN",
 	"user-menu.section.configuration": "Configuración",
 	"user-menu.section.personal": "Personal",
 	"user-menu.section.support": "Apoyo",
diff --git a/libs/common/src/assets/i18n/fr.json b/libs/common/src/assets/i18n/fr.json
index 518ff16a39..dfdba91a7a 100644
--- a/libs/common/src/assets/i18n/fr.json
+++ b/libs/common/src/assets/i18n/fr.json
@@ -534,6 +534,8 @@
 	"billing.not_company": "Je ne suis pas une entreprise",
 	"billing.on_premise_cost": "Avec <strong>NucliaDB Hybrid</strong> n’entraîne aucun coût supplémentaire.\n",
 	"billing.order_number": "Numéro de commande",
+	"billing.page-description": "Gérez votre abonnement, vos paiements et votre historique d'utilisation.",
+	"billing.page-title": "Facturation",
 	"billing.paragraphs_per_file": "Un fichier texte de 10 pages contient environ 300 blocs de texte",
 	"billing.parameter.ai-tokens-used": "Demandes de recherche",
 	"billing.parameter.files": "Combien de documents ?",
@@ -549,6 +551,7 @@
 	"billing.payment_method": "Mode de paiement",
 	"billing.phone": "Numéro de téléphone",
 	"billing.phone_placeholder": "par exemple. +34 000 000 000",
+	"billing.plan-subscription": "Paiement et abonnement",
 	"billing.postal_code": "Zip *: français",
 	"billing.preprocessing": "Prétraitement Agentic RAG",
 	"billing.prices_vat": "La TVA peut être applicable",
@@ -607,6 +610,7 @@
 	"billing.usage.cost": "Coût",
 	"billing.usage.description": "Le coût mensuel actuel correspondant à la consommation à ce jour.",
 	"billing.usage.interval": "La prochaine facture sera générée le {{to}}",
+	"billing.usage.label": "Usage",
 	"billing.usage.over_consume": "Surconsommer",
 	"billing.usage.requests": "Demandes",
 	"billing.usage.tier_included": "Niveau inclus",
@@ -743,7 +747,7 @@
 	"generic.back": "Retour",
 	"generic.back_to_accounts": "Retour aux comptes",
 	"generic.back_to_home": "Retour à la page d’accueil",
-	"generic.back_to_settings": "Retour aux paramètres",
+	"generic.back_to_subscription": "Retour à l'abonnement",
 	"generic.badge.advanced": "Avancé",
 	"generic.badge.beta": "Beta",
 	"generic.badge.optional": "Optionnel",
@@ -2935,6 +2939,7 @@
 	"user-menu.account-settings": "Paramètres du compte",
 	"user-menu.section.account": "Compte",
 	"user-menu.section.administration": "Administration",
+	"user-menu.section.billing": "Facturation",
 	"user-menu.section.configuration": "Configuration",
 	"user-menu.section.personal": "Personnel",
 	"user-menu.section.support": "Soutien",
diff --git a/libs/common/src/lib/account/account-arag/account-arag.component.ts b/libs/common/src/lib/account/account-arag/account-arag.component.ts
deleted file mode 100644
index 173a0e08a5..0000000000
--- a/libs/common/src/lib/account/account-arag/account-arag.component.ts
+++ /dev/null
@@ -1,12 +0,0 @@
-import { ChangeDetectionStrategy, Component } from '@angular/core';
-import { RouterOutlet } from '@angular/router';
-
-@Component({
-  selector: 'app-account-arag',
-  template: `
-    <router-outlet></router-outlet>
-  `,
-  imports: [RouterOutlet],
-  changeDetection: ChangeDetectionStrategy.OnPush,
-})
-export class AccountAragComponent {}
diff --git a/libs/common/src/lib/account/account-billing/account-billing.component.html b/libs/common/src/lib/account/account-billing/account-billing.component.html
new file mode 100644
index 0000000000..ac6bccccd3
--- /dev/null
+++ b/libs/common/src/lib/account/account-billing/account-billing.component.html
@@ -0,0 +1,51 @@
+<app-account-page-layout
+  [title]="((isSubscribed | async) ? 'billing.page-title' : 'billing.subscription.title') | translate"
+  [description]="((isSubscribed | async) ? 'billing.page-description' : 'billing.subscription.help') | translate"
+  [backLink]="backLink | async"
+  panelId="billing-section-panel">
+  @if (isTrial | async) {
+    <div
+      top
+      class="trial-status-top">
+      <app-account-status></app-account-status>
+    </div>
+  }
+  @if (isSubscribed | async) {
+    <pa-tabs
+      tabs
+      class="settings-tabs">
+      <pa-tab
+        routerLink="usage"
+        routerLinkActive
+        #rla3="routerLinkActive"
+        [active]="rla3.isActive"
+        ariaControls="billing-section-panel">
+        {{ 'billing.usage.label' | translate }}
+      </pa-tab>
+      <pa-tab
+        routerLink="checkout"
+        routerLinkActive
+        #rla1="routerLinkActive"
+        [active]="rla1.isActive"
+        ariaControls="billing-section-panel">
+        {{ 'billing.payment_details' | translate }}
+      </pa-tab>
+      <pa-tab
+        routerLink="my-subscription"
+        routerLinkActive
+        #rla2="routerLinkActive"
+        [active]="rla2.isActive"
+        ariaControls="billing-section-panel">
+        {{ 'billing.my-subscription' | translate }}
+      </pa-tab>
+      <pa-tab
+        routerLink="history"
+        routerLinkActive
+        #rla4="routerLinkActive"
+        [active]="rla4.isActive"
+        ariaControls="billing-section-panel">
+        {{ 'billing.history.link' | translate }}
+      </pa-tab>
+    </pa-tabs>
+  }
+</app-account-page-layout>
diff --git a/libs/common/src/lib/account/account-billing/account-billing.component.scss b/libs/common/src/lib/account/account-billing/account-billing.component.scss
new file mode 100644
index 0000000000..b2790002a5
--- /dev/null
+++ b/libs/common/src/lib/account/account-billing/account-billing.component.scss
@@ -0,0 +1,12 @@
+@use 'apps/dashboard/src/variables' as *;
+
+.trial-status-top {
+  background: $color-light-stronger;
+  border: 1px solid $color-neutral-lighter;
+  border-radius: rhythm(1);
+  display: inline-block;
+  max-width: 100%;
+  margin-bottom: rhythm(4);
+  padding: rhythm(2) rhythm(2.5) rhythm(1.5);
+  width: fit-content;
+}
diff --git a/libs/common/src/lib/account/account-billing/account-billing.component.ts b/libs/common/src/lib/account/account-billing/account-billing.component.ts
new file mode 100644
index 0000000000..c8399d2f60
--- /dev/null
+++ b/libs/common/src/lib/account/account-billing/account-billing.component.ts
@@ -0,0 +1,35 @@
+import { ChangeDetectionStrategy, Component, inject, OnDestroy, OnInit } from '@angular/core';
+import { BackendConfigurationService, BillingService, FeaturesService, injectScript } from '@flaps/core';
+import { WINDOW } from '@ng-web-apis/common';
+import { AccountPageBase } from '../account-page-base';
+
+@Component({
+  selector: 'app-account-billing',
+  templateUrl: './account-billing.component.html',
+  styleUrl: './account-billing.component.scss',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  standalone: false,
+})
+export class AccountBillingComponent extends AccountPageBase implements OnInit, OnDestroy {
+  private readonly billing = inject(BillingService);
+  private readonly features = inject(FeaturesService);
+  private readonly window = inject(WINDOW);
+  private readonly backendConfig = inject(BackendConfigurationService);
+
+  isSubscribed = this.billing.isSubscribedToStripe;
+  isTrial = this.features.isTrial;
+  noStripe = this.backendConfig.noStripe();
+
+  ngOnInit(): void {
+    const hubSpotApi = (this.window as any)?.HubSpotConversations;
+    if (hubSpotApi) {
+      hubSpotApi.widget?.load();
+    } else {
+      injectScript('//js-eu1.hs-scripts.com/139773752.js').subscribe();
+    }
+  }
+
+  ngOnDestroy(): void {
+    (this.window as any)?.HubSpotConversations?.widget?.remove();
+  }
+}
diff --git a/libs/common/src/lib/account/account-home/account-settings.component.html b/libs/common/src/lib/account/account-home/account-settings.component.html
index 853db21f54..dc657706f7 100644
--- a/libs/common/src/lib/account/account-home/account-settings.component.html
+++ b/libs/common/src/lib/account/account-home/account-settings.component.html
@@ -3,14 +3,6 @@
   [description]="'account.settings-description' | translate"
   [backLink]="backLink | async"
   panelId="settings-section-panel">
-  @if (isTrial | async) {
-    <div
-      top
-      class="trial-status-top">
-      <app-account-status (upgradeClick)="navigateTo('subscriptions')"></app-account-status>
-    </div>
-  }
-
   <pa-tabs
     tabs
     class="settings-tabs">
@@ -22,16 +14,6 @@
       ariaControls="settings-section-panel">
       {{ 'account.consumption' | translate }}
     </pa-tab>
-    @if (showSubscriptionsTab | async) {
-      <pa-tab
-        routerLink="subscriptions"
-        routerLinkActive
-        #rla1="routerLinkActive"
-        [active]="rla1.isActive"
-        ariaControls="settings-section-panel">
-        {{ 'account.billing' | translate }}
-      </pa-tab>
-    }
     @if (showAccountSettingsTab | async) {
       <pa-tab
         routerLink="account-settings"
diff --git a/libs/common/src/lib/account/account-home/account-settings.component.scss b/libs/common/src/lib/account/account-home/account-settings.component.scss
index b2790002a5..73e6cd373f 100644
--- a/libs/common/src/lib/account/account-home/account-settings.component.scss
+++ b/libs/common/src/lib/account/account-home/account-settings.component.scss
@@ -1,12 +1 @@
 @use 'apps/dashboard/src/variables' as *;
-
-.trial-status-top {
-  background: $color-light-stronger;
-  border: 1px solid $color-neutral-lighter;
-  border-radius: rhythm(1);
-  display: inline-block;
-  max-width: 100%;
-  margin-bottom: rhythm(4);
-  padding: rhythm(2) rhythm(2.5) rhythm(1.5);
-  width: fit-content;
-}
diff --git a/libs/common/src/lib/account/account-home/account-settings.component.ts b/libs/common/src/lib/account/account-home/account-settings.component.ts
index 963f9421a3..b82243c7bc 100644
--- a/libs/common/src/lib/account/account-home/account-settings.component.ts
+++ b/libs/common/src/lib/account/account-home/account-settings.component.ts
@@ -1,5 +1,5 @@
 import { ChangeDetectionStrategy, Component, inject } from '@angular/core';
-import { BackendConfigurationService, FeaturesService } from '@flaps/core';
+import { FeaturesService } from '@flaps/core';
 import { combineLatest, map, shareReplay } from 'rxjs';
 import { AccountPageBase } from '../account-page-base';
 
@@ -12,27 +12,14 @@ import { AccountPageBase } from '../account-page-base';
 })
 export class AccountSettingsComponent extends AccountPageBase {
   private features = inject(FeaturesService);
-  private backendConfig = inject(BackendConfigurationService);
 
-  isTrial = this.features.isTrial;
   isCowork = this.sdk.currentAccount.pipe(
     map((account) => account.workflow === 'cowork'),
     shareReplay(1),
   );
-  isBillingEnabled = this.features.unstable.billing;
-  noStripe = this.backendConfig.noStripe();
-
-  showSubscriptionsTab = combineLatest([this.isBillingEnabled, this.features.isAccountManager]).pipe(
-    map(([billing, isManager]) => !!billing && !!isManager && !this.noStripe),
-    shareReplay(1),
-  );
 
   showAccountSettingsTab = combineLatest([this.features.isAccountManager, this.isCowork]).pipe(
     map(([isManager, isCowork]) => !!isManager && !isCowork),
     shareReplay(1),
   );
-
-  navigateTo(path: string) {
-    this.router.navigate([path], { relativeTo: this.route });
-  }
 }
diff --git a/libs/common/src/lib/account/account.module.ts b/libs/common/src/lib/account/account.module.ts
index e483d79da5..a77e5cc78a 100644
--- a/libs/common/src/lib/account/account.module.ts
+++ b/libs/common/src/lib/account/account.module.ts
@@ -21,8 +21,8 @@ import {
 } from '@guillotinaweb/pastanaga-angular';
 import { BackButtonComponent, DropdownButtonComponent, SisProgressModule } from '@nuclia/sistema';
 import { UsersManageModule } from '../users-manage';
-import { AccountAragComponent } from './account-arag/account-arag.component';
 import { AragListComponent } from './account-arag/arag-list/arag-list.component';
+import { AccountBillingComponent } from './account-billing/account-billing.component';
 import { AccountAdministrationComponent } from './account-administration/account-administration.component';
 import { AccountConfigurationComponent } from './account-configuration/account-configuration.component';
 import { AccountHomeComponent } from './account-home/account-home.component';
@@ -40,7 +40,6 @@ import { NuaActivityComponent } from './account-nua/nua-activity/nua-activity.co
 import { AccountStatusComponent } from './account-status/account-status.component';
 import { AccountUsersComponent } from './account-users/account-users.component';
 import { SimpleAccountHomeComponent } from './account-home/simple-account-home.component';
-import { BillingComponent } from './billing/billing.component';
 import { BillingModule } from './billing/billing.module';
 import { CheckoutComponent } from './billing/checkout/checkout.component';
 import { HistoryComponent } from './billing/history/history.component';
@@ -86,18 +85,6 @@ const routes: Routes = [
     children: [
       { path: '', redirectTo: 'consumption', pathMatch: 'full' },
       { path: 'consumption', component: AccountConsumptionComponent },
-      {
-        path: 'subscriptions',
-        component: BillingComponent,
-        children: [
-          { path: '', pathMatch: 'full', component: RedirectComponent },
-          { path: 'plans', component: SubscriptionsComponent },
-          { path: 'checkout', component: CheckoutComponent },
-          { path: 'my-subscription', component: MySubscriptionComponent },
-          { path: 'usage', component: UsageTableComponent },
-          { path: 'history', component: HistoryComponent },
-        ],
-      },
       { path: 'preferences', component: ProfileComponent, data: { embedded: true } },
       { path: 'account-settings', component: AccountManageComponent, data: { embedded: true } },
     ],
@@ -131,6 +118,20 @@ const routes: Routes = [
       { path: 'models', component: AccountModelsComponent },
     ],
   },
+  // Billing page — tab shell with child routes
+  {
+    path: 'billing',
+    component: AccountBillingComponent,
+    canActivate: [accountOwnerGuard],
+    children: [
+      { path: '', pathMatch: 'full', component: RedirectComponent },
+      { path: 'subscriptions', component: SubscriptionsComponent },
+      { path: 'checkout', component: CheckoutComponent },
+      { path: 'my-subscription', component: MySubscriptionComponent },
+      { path: 'usage', component: UsageTableComponent },
+      { path: 'history', component: HistoryComponent },
+    ],
+  },
   // Legacy redirect routes (backward compatibility for bookmarked URLs)
   { path: 'nua', redirectTo: 'configuration/nua' },
   { path: 'nua/:id/activity', redirectTo: ({ params }) => `configuration/nua/${params['id']}/activity` },
@@ -139,13 +140,6 @@ const routes: Routes = [
   { path: 'arag', redirectTo: 'administration/retrieval-agents' },
   { path: 'models', redirectTo: 'configuration/models' },
   { path: 'users', redirectTo: 'administration/users' },
-  // Legacy billing redirects — all billing content lives under /home/subscriptions now
-  { path: 'billing', pathMatch: 'full', redirectTo: 'home/subscriptions' },
-  { path: 'billing/subscriptions', redirectTo: 'home/subscriptions/plans' },
-  { path: 'billing/checkout', redirectTo: 'home/subscriptions/checkout' },
-  { path: 'billing/my-subscription', redirectTo: 'home/subscriptions/my-subscription' },
-  { path: 'billing/usage', redirectTo: 'home/subscriptions/usage' },
-  { path: 'billing/history', redirectTo: 'home/subscriptions/history' },
 ];
 
 @NgModule({
@@ -193,6 +187,7 @@ const routes: Routes = [
   ],
   declarations: [
     AccountAdministrationComponent,
+    AccountBillingComponent,
     AccountHomeComponent,
     AccountPageLayoutComponent,
     AccountConsumptionComponent,
diff --git a/libs/common/src/lib/account/billing/billing.component.html b/libs/common/src/lib/account/billing/billing.component.html
deleted file mode 100644
index 0680b43f9c..0000000000
--- a/libs/common/src/lib/account/billing/billing.component.html
+++ /dev/null
@@ -1 +0,0 @@
-<router-outlet></router-outlet>
diff --git a/libs/common/src/lib/account/billing/billing.component.scss b/libs/common/src/lib/account/billing/billing.component.scss
deleted file mode 100644
index 1959567aad..0000000000
--- a/libs/common/src/lib/account/billing/billing.component.scss
+++ /dev/null
@@ -1,10 +0,0 @@
-@use 'apps/dashboard/src/variables' as *;
-
-.billing {
-  background-color: $color-neutral-lightest;
-}
-
-nsi-back-button {
-  display: inline-block;
-  margin-bottom: rhythm(2);
-}
diff --git a/libs/common/src/lib/account/billing/billing.component.ts b/libs/common/src/lib/account/billing/billing.component.ts
deleted file mode 100644
index 320bdd97b5..0000000000
--- a/libs/common/src/lib/account/billing/billing.component.ts
+++ /dev/null
@@ -1,27 +0,0 @@
-import { Component, ChangeDetectionStrategy, OnDestroy, OnInit, Inject } from '@angular/core';
-import { injectScript } from '@flaps/core';
-import { WINDOW } from '@ng-web-apis/common';
-
-@Component({
-  selector: 'app-billing',
-  templateUrl: './billing.component.html',
-  styleUrls: ['./billing.component.scss'],
-  changeDetection: ChangeDetectionStrategy.OnPush,
-  standalone: false,
-})
-export class BillingComponent implements OnInit, OnDestroy {
-  constructor(@Inject(WINDOW) private window: Window) {}
-
-  ngOnInit() {
-    const hubSpotApi = (this.window as any)?.HubSpotConversations;
-    if (hubSpotApi) {
-      hubSpotApi.widget?.load();
-    } else {
-      injectScript('//js-eu1.hs-scripts.com/139773752.js').subscribe();
-    }
-  }
-
-  ngOnDestroy() {
-    (this.window as any)?.HubSpotConversations?.widget?.remove();
-  }
-}
diff --git a/libs/common/src/lib/account/billing/billing.module.ts b/libs/common/src/lib/account/billing/billing.module.ts
index 5232902622..61f47e7ab4 100644
--- a/libs/common/src/lib/account/billing/billing.module.ts
+++ b/libs/common/src/lib/account/billing/billing.module.ts
@@ -15,7 +15,6 @@ import {
 } from '@guillotinaweb/pastanaga-angular';
 import { BackButtonComponent, CountrySelectComponent, SisProgressModule } from '@nuclia/sistema';
 import { STFPipesModule } from '@flaps/core';
-import { BillingComponent } from './billing.component';
 import { SubscriptionsComponent } from './subscriptions/subscriptions.component';
 import { CheckoutComponent } from './checkout/checkout.component';
 import { ReviewComponent } from './review/review.component';
@@ -50,7 +49,6 @@ import { BudgetComponent } from './usage/budget.component';
     BudgetComponent,
   ],
   declarations: [
-    BillingComponent,
     SubscriptionsComponent,
     CheckoutComponent,
     ReviewComponent,
diff --git a/libs/common/src/lib/account/billing/checkout/checkout.component.html b/libs/common/src/lib/account/billing/checkout/checkout.component.html
index f0be4fc5c0..60c43d2a98 100644
--- a/libs/common/src/lib/account/billing/checkout/checkout.component.html
+++ b/libs/common/src/lib/account/billing/checkout/checkout.component.html
@@ -1,12 +1,15 @@
 <div class="checkout">
-  <nsi-back-button [link]="backToSettingsLink | async">
-    {{ ((simpleMode | async) ? 'generic.back_to_settings' : 'generic.back') | translate }}
-  </nsi-back-button>
   <div>
     <h2 class="page-subtitle">{{ 'billing.payment_details' | translate }}</h2>
     <p class="page-description">{{ 'billing.payment_details-description' | translate }}</p>
   </div>
 
+  @if (!(isSubscribedToStripe | async)) {
+    <nsi-back-button [link]="backToSettingsLink | async">
+      {{ ((simpleMode | async) ? 'generic.back_to_subscription' : 'generic.back') | translate }}
+    </nsi-back-button>
+  }
+
   @if (subscribeMode | async) {
     <div>
       <div class="section-header">
diff --git a/libs/common/src/lib/account/billing/checkout/checkout.component.ts b/libs/common/src/lib/account/billing/checkout/checkout.component.ts
index 112527439b..0b3ae2a6bd 100644
--- a/libs/common/src/lib/account/billing/checkout/checkout.component.ts
+++ b/libs/common/src/lib/account/billing/checkout/checkout.component.ts
@@ -98,7 +98,7 @@ export class CheckoutComponent implements OnDestroy, OnInit {
   usage = this.billingService.getAccountUsage().pipe(shareReplay(1));
   simpleMode = this.navigation.simpleMode;
   backToSettingsLink = this.sdk.currentAccount.pipe(
-    map((account) => `${this.navigation.getAccountManageUrl(account.slug)}/home/subscriptions`),
+    map((account) => `${this.navigation.getAccountManageUrl(account.slug)}/billing`),
   );
 
   updateCurrency = new Subject<string>();
@@ -121,8 +121,10 @@ export class CheckoutComponent implements OnDestroy, OnInit {
     ),
   ]).pipe(map(([prices, accountType]) => !!prices[accountType]?.recurring?.month));
 
+  isSubscribedToStripe = this.billingService.isSubscribedToStripe;
   billingDetailsEnabled = true;
   editCustomer = true;
+
   private _customer?: StripeCustomer;
   get customer() {
     return this._customer;
@@ -138,6 +140,7 @@ export class CheckoutComponent implements OnDestroy, OnInit {
   }
 
   private _stripe: any;
+
   @ViewChild('card') private cardContainer?: ElementRef;
   card: any;
   cardError = '';
@@ -412,7 +415,7 @@ export class CheckoutComponent implements OnDestroy, OnInit {
                   return of(`${this.navigation.getKbSelectUrl(newAccount.slug)}`);
                 }
               } else {
-                return of(`${this.navigation.getAccountManageUrl(newAccount.slug)}/home/subscriptions`);
+                return of(`${this.navigation.getAccountManageUrl(newAccount.slug)}/billing`);
               }
             }),
           );
diff --git a/libs/common/src/lib/account/billing/redirect.component.ts b/libs/common/src/lib/account/billing/redirect.component.ts
index 36a5181ce2..36bcae9c2d 100644
--- a/libs/common/src/lib/account/billing/redirect.component.ts
+++ b/libs/common/src/lib/account/billing/redirect.component.ts
@@ -14,7 +14,7 @@ export class RedirectComponent {
     private route: ActivatedRoute,
   ) {
     this.billingService.isSubscribedToStripe.pipe(take(1)).subscribe((isSubscribed) => {
-      this.router.navigate([isSubscribed ? './usage' : './plans'], {
+      this.router.navigate([isSubscribed ? './usage' : './subscriptions'], {
         replaceUrl: true,
         relativeTo: this.route,
       });
diff --git a/libs/common/src/lib/account/billing/subscriptions/subscriptions.component.html b/libs/common/src/lib/account/billing/subscriptions/subscriptions.component.html
index c9ada57f09..9684ee4d65 100644
--- a/libs/common/src/lib/account/billing/subscriptions/subscriptions.component.html
+++ b/libs/common/src/lib/account/billing/subscriptions/subscriptions.component.html
@@ -3,8 +3,6 @@
 } @else if ((isManuallySubscribed | async) === true) {
   <app-manual-subscription></app-manual-subscription>
 } @else {
-  <h2 class="page-subtitle">{{ 'billing.subscription.title' | translate }}</h2>
-  <p class="page-description">{{ 'billing.subscription.help' | translate }}</p>
   <div class="header">
     @if (canSelectCurrency) {
       <div>
diff --git a/libs/common/src/lib/account/billing/subscriptions/subscriptions.component.ts b/libs/common/src/lib/account/billing/subscriptions/subscriptions.component.ts
index 4d569022d7..ac4bf76a89 100644
--- a/libs/common/src/lib/account/billing/subscriptions/subscriptions.component.ts
+++ b/libs/common/src/lib/account/billing/subscriptions/subscriptions.component.ts
@@ -88,7 +88,7 @@ export class SubscriptionsComponent implements OnDestroy {
 
   goToPaymentDetails(type: AccountTypes) {
     this.sdk.currentAccount.pipe(take(1)).subscribe((account) => {
-      this.router.navigate([`${this.navigation.getAccountManageUrl(account.slug)}/home/subscriptions/checkout`], {
+      this.router.navigate([`${this.navigation.getAccountManageUrl(account.slug)}/billing/checkout`], {
         queryParams: { type },
       });
     });
diff --git a/libs/common/src/lib/topbar/topbar.component.ts b/libs/common/src/lib/topbar/topbar.component.ts
index 5e412e1c2a..bd5dbbf398 100644
--- a/libs/common/src/lib/topbar/topbar.component.ts
+++ b/libs/common/src/lib/topbar/topbar.component.ts
@@ -149,7 +149,7 @@ export class TopbarComponent {
 
   goToSubscriptions() {
     this.sdk.currentAccount.pipe(take(1)).subscribe((account) => {
-      this.router.navigate([`${this.navigationService.getAccountManageUrl(account.slug)}/home/subscriptions`]);
+      this.router.navigate([`${this.navigationService.getAccountManageUrl(account.slug)}/billing`]);
     });
   }
 }
diff --git a/libs/common/src/lib/topbar/user-menu/user-menu.component.ts b/libs/common/src/lib/topbar/user-menu/user-menu.component.ts
index 57d24bff21..2d6ad34f0e 100644
--- a/libs/common/src/lib/topbar/user-menu/user-menu.component.ts
+++ b/libs/common/src/lib/topbar/user-menu/user-menu.component.ts
@@ -4,6 +4,7 @@ import { Router } from '@angular/router';
 import {
   AccountVerificationService,
   BackendConfigurationService,
+  BillingService,
   FeaturesService,
   NavigationService,
   SDKService,
@@ -65,6 +66,7 @@ export class UserMenuComponent implements OnInit {
   private readonly backendConfig = inject(BackendConfigurationService);
   private readonly accountVerification = inject(AccountVerificationService);
   private readonly modalService = inject(SisModalService);
+  private readonly billing = inject(BillingService);
 
   @Input() set userInfo(userInfo: Welcome | undefined | null) {
     if (userInfo) {
@@ -115,6 +117,18 @@ export class UserMenuComponent implements OnInit {
 
   private readonly showSwitchAccount$ = new BehaviorSubject<boolean>(!!this.standalone);
 
+  private readonly showBillingGroup = combineLatest([this.isAccountManager, this.billing.isSubscribedToStripe]).pipe(
+    map(([manager, subscribed]) => !this.standalone && !!manager && (subscribed || !this.noStripe)),
+    shareReplay(1),
+  );
+
+  private readonly showBillingPlansItem = this.isBillingEnabled.pipe(
+    map((billing) => !!billing && !this.noStripe),
+    shareReplay(1),
+  );
+
+  private readonly isSubscribedToStripe = this.billing.isSubscribedToStripe;
+
   readonly sections: MenuSection[] = [
     // ── Account ────────────────────────────────────────────────────────────
     {
@@ -127,14 +141,6 @@ export class UserMenuComponent implements OnInit {
           action: () => this.go('home/consumption'),
           visible$: this.isAccountManager.pipe(map((m) => !this.standalone && !!m)),
         },
-        {
-          label: 'account.billing',
-          icon: 'payment',
-          action: () => this.go('home/subscriptions'),
-          visible$: combineLatest([this.isBillingEnabled, this.isAccountManager]).pipe(
-            map(([billing, manager]) => !!billing && !!manager && !this.noStripe),
-          ),
-        },
         {
           label: 'account.manage',
           icon: 'gear',
@@ -156,6 +162,49 @@ export class UserMenuComponent implements OnInit {
         },
       ],
     },
+    // ── Billing ────────────────────────────────────────────────────────────
+    {
+      header: 'user-menu.section.billing',
+      visible$: this.showBillingGroup,
+      items: [
+        {
+          // Always shown when billing is enabled + Stripe available
+          label: 'billing.plan-subscription',
+          icon: 'payment',
+          dataCy: 'go-to-billing',
+          action: () => this.go('billing'),
+          visible$: this.showBillingPlansItem,
+        },
+        {
+          label: 'billing.usage.label',
+          icon: 'activity-log',
+          dataCy: 'go-to-usage',
+          action: () => this.go('billing/usage'),
+          visible$: this.isSubscribedToStripe,
+        },
+        {
+          label: 'billing.payment_details',
+          icon: 'payment-details',
+          dataCy: 'go-to-checkout',
+          action: () => this.go('billing/checkout'),
+          visible$: this.isSubscribedToStripe,
+        },
+        {
+          label: 'billing.my-subscription',
+          icon: 'info',
+          dataCy: 'go-to-my-subscription',
+          action: () => this.go('billing/my-subscription'),
+          visible$: this.isSubscribedToStripe,
+        },
+        {
+          label: 'billing.history.link',
+          icon: 'history',
+          dataCy: 'go-to-history',
+          action: () => this.go('billing/history'),
+          visible$: this.isSubscribedToStripe,
+        },
+      ],
+    },
     // ── Administration ─────────────────────────────────────────────────────
     {
       header: 'user-menu.section.administration',