From a29cb34669ad0383e081ff569ee7d8e8c71c7411 Mon Sep 17 00:00:00 2001
From: Gagan7900 <54118395+Gagan7900@users.noreply.github.com>
Date: Fri, 24 Jul 2026 11:24:55 +0530
Subject: [PATCH] feat: add Master Admin application functionality

---
 src/app/.editorconfig                         |    17 +
 src/app/.gitignore                            |    55 +
 src/app/.postcssrc.json                       |     6 +
 .../charts/spk-echarts/spk-echarts.html       |     1 +
 .../charts/spk-echarts/spk-echarts.scss       |     0
 .../charts/charts/spk-echarts/spk-echarts.ts  |    16 +
 src/app/README.md                             |    59 +
 src/app/angular.json                          |   124 +
 src/app/app.routes.ts                         |    13 +-
 src/app/app.ts                                |     2 +-
 src/app/authentication/login/login.html       |   106 -
 src/app/core/config/api-host.ts               |     8 +
 src/app/core/config/api-url.util.ts           |    13 +
 src/app/core/config/api.config.ts             |    14 +-
 .../core/end-points/auth/auth.endpoints.ts    |     8 +
 src/app/core/guards/auth/auth.guard.ts        |    37 +
 src/app/core/guards/auth/guest.guard.ts       |    53 +
 src/app/core/guards/auth/super-admin.guard.ts |    11 +
 src/app/core/interceptors/auth.interceptor.ts |    24 +-
 .../core/interceptors/error.interceptor.ts    |    27 +-
 .../core/interceptors/loading-interceptor.ts  |     2 +-
 .../models/api-response/api-response.model.ts |    12 +
 src/app/core/models/auth/auth.model.ts        |    24 +
 src/app/core/models/context/context.model.ts  |    33 +
 src/app/core/services/auth/auth.service.ts    |   133 +
 .../services/auth/session-timeout.service.ts  |   154 +
 .../services/auth/token-storage.service.ts    |   151 +
 .../core/services/common/app-state.service.ts |   321 +
 .../core/services/common/base-api.service.ts  |    33 +
 .../core/services/common/firebase.service.ts  |    27 +
 .../core/services/common/loading.service.ts   |    24 +
 src/app/core/services/common/menu.data.ts     |    91 +
 .../core/services/common/menu.service.spec.ts |    74 +
 src/app/core/services/common/menu.service.ts  |    56 +
 src/app/core/services/common/nav.service.ts   |   102 +
 .../services/common/permission.service.ts     |    33 +
 .../services/context/app-context.service.ts   |   104 +
 .../context/tenant-context.service.ts         |    22 +
 .../services/context/user-context.service.ts  |    31 +
 .../authentication/authentication.routes.ts   |    19 +
 .../authentication/pages/login/login.html     |    85 +
 .../authentication/pages}/login/login.scss    |     2 +-
 .../authentication/pages}/login/login.ts      |    44 +-
 src/app/features/dashboards/crm/crm.html      |   529 +
 src/app/features/dashboards/crm/crm.scss      |     0
 src/app/features/dashboards/crm/crm.ts        |   618 +
 .../features/dashboards/dashboard.routes.ts   |    12 +
 src/app/features/errors/error.routes.ts       |    15 +
 .../features/errors/error404/error404.html    |    27 +
 .../features/errors/error404/error404.scss    |     0
 src/app/features/errors/error404/error404.ts  |    16 +
 src/app/features/errors/particleoptions.ts    |    36 +
 .../cities/data-access/city.endpoints.ts      |    11 +
 .../cities/data-access/city.service.ts        |    46 +
 .../cities/models/city.model.ts               |    28 +
 .../cities/pages/city-list/city-list.html     |   170 +
 .../cities/pages/city-list/city-list.scss     |     0
 .../cities/pages/city-list/city-list.ts       |   560 +
 .../data-access/country.endpoints.ts          |    21 +
 .../countries/data-access/country.service.ts  |    44 +
 .../countries/models/country.model.ts         |    31 +
 .../pages/country-list/country-list.html      |    96 +
 .../pages/country-list/country-list.scss      |     0
 .../pages/country-list/country-list.ts        |   559 +
 .../global-masters/countries/public-api.ts    |     2 +
 .../data-access/currency.endpoints.ts         |    44 +
 .../data-access/currency.service.ts           |    46 +
 .../currencies/models/currency.model.ts       |    43 +
 .../pages/currency-list/currency-list.html    |   146 +
 .../pages/currency-list/currency-list.scss    |     0
 .../pages/currency-list/currency-list.ts      |   623 +
 .../global-masters/currencies/public-api.ts   |     2 +
 .../global-masters/global-masters.routes.ts   |    31 +-
 .../data-access/language.endpoints.ts         |    11 +
 .../languages/data-access/language.service.ts |    48 +
 .../languages/models/language.model.ts        |    31 +
 .../pages/language-list/language-list.html    |    67 +
 .../pages/language-list/language-list.scss    |     1 +
 .../pages/language-list/language-list.ts      |   356 +
 .../global-masters/languages/public-api.ts    |     2 +
 .../pages/master-list/master-list.html        |    26 -
 .../pages/master-list/master-list.scss        |     5 -
 .../pages/master-list/master-list.ts          |    12 -
 .../states/data-access/state.endpoints.ts     |    43 +
 .../states/data-access/state.service.ts       |    45 +
 .../states/models/state.model.ts              |    30 +
 .../states/pages/state-list/state-list.html   |   104 +
 .../states/pages/state-list/state-list.scss   |     0
 .../states/pages/state-list/state-list.ts     |   570 +
 .../global-masters/states/public-api.ts       |     2 +
 .../data-access/timezone.endpoints.ts         |    11 +
 .../timezones/data-access/timezone.service.ts |    45 +
 .../timezones/models/timezone.model.ts        |    27 +
 .../pages/timezone-list/timezone-list.html    |   137 +
 .../pages/timezone-list/timezone-list.scss    |     1 +
 .../pages/timezone-list/timezone-list.ts      |   348 +
 .../global-masters/timezones/public-api.ts    |     2 +
 .../organization-list/organization-list.html  |     1 +
 .../organization-list/organization-list.scss  |     0
 .../organization-list/organization-list.ts    |    11 +
 .../onboarding-stepper.html                   |   239 +
 .../onboarding-stepper.scss                   |     0
 .../onboarding-stepper/onboarding-stepper.ts  |   119 +
 .../models/organization-draft.model.ts        |    18 +
 .../models/organization-onboarding.model.ts   |   119 +
 .../models/organization-provisioning.model.ts |    23 +
 .../organization-onboarding.html              |    66 +
 .../organization-onboarding.scss              |     0
 .../organization-onboarding.ts                |   164 +
 .../organization-onboarding-state.service.ts  |   189 +
 .../organization-onboarding.service.ts        |   331 +
 .../organization-basics.html                  |   134 +
 .../organization-basics.scss                  |     1 +
 .../organization-basics.ts                    |   217 +
 .../organization-localization.html            |   139 +
 .../organization-localization.ts              |   409 +
 .../organization-plan-limits.html             |   151 +
 .../organization-plan-limits.ts               |   266 +
 .../organizations/organizations.routes.ts     |    14 +
 .../tenant-currencies.endpoints.ts            |    32 +
 .../data-access/tenant-currencies.service.ts  |    47 +
 .../tenants/data-access/tenant.endpoints.ts   |    32 +
 .../tenants/data-access/tenant.service.ts     |    46 +
 .../tenants/models/tenant-currencies.model.ts |    53 +
 .../features/tenants/models/tenant.model.ts   |    68 +
 .../tenant-currencies/tenant-currencies.html  |    55 +
 .../tenant-currencies/tenant-currencies.scss  |     0
 .../tenant-currencies/tenant-currencies.ts    |   408 +
 .../pages/tenant-list/tenant-list.html        |   198 +-
 .../pages/tenant-list/tenant-list.scss        |     1 +
 .../tenants/pages/tenant-list/tenant-list.ts  |   631 +-
 src/app/features/tenants/tenants.routes.ts    |     9 +-
 .../users/data-access/user.endpoints.ts       |    10 +
 .../users/data-access/user.service.ts         |    40 +
 src/app/features/users/models/user.model.ts   |    29 +
 .../users/pages/users-list/users-list.html    |    23 +-
 .../users/pages/users-list/users-list.ts      |   518 +-
 src/app/features/users/users.routes.ts        |     4 +-
 src/app/package-lock.json                     | 14438 ++++++++++++++++
 src/app/package.json                          |    77 +
 src/app/shared/components/button/button.html  |    56 +
 src/app/shared/components/button/button.scss  |     0
 src/app/shared/components/button/button.ts    |   349 +
 .../confirm-dialog/confirm-dialog.html        |    10 +
 .../confirm-dialog/confirm-dialog.scss        |     0
 .../confirm-dialog/confirm-dialog.ts          |    62 +
 .../components/data-list/data-list.html       |    66 +
 .../shared/components/data-list/data-list.ts  |    75 +
 .../data-table/data-table-cell.directive.ts   |    12 +
 .../data-table/data-table-query.state.ts      |    60 +
 .../data-table/data-table-query.types.ts      |    17 +
 .../components/data-table/data-table.html     |   357 +-
 .../components/data-table/data-table.scss     |   256 +
 .../components/data-table/data-table.ts       |   495 +-
 .../components/data-table/data-table.types.ts |    48 +-
 .../components/filter-card/filter-card.html   |    46 +
 .../filter-card/filter-card.spec.ts           |   142 +
 .../components/filter-card/filter-card.ts     |    72 +
 .../form/autocomplete/autocomplete.html       |   129 +
 .../form/autocomplete/autocomplete.scss       |   120 +
 .../form/autocomplete/autocomplete.spec.ts    |   393 +
 .../form/autocomplete/autocomplete.ts         |   434 +
 .../form/autocomplete/autocomplete.types.ts   |    16 +
 .../form/form-action/form-action.html         |     1 +
 .../form/form-action/form-action.scss         |     0
 .../form/form-action/form-action.ts           |    11 +
 .../form/form-checkbox/form-checkbox.html     |     1 +
 .../form/form-checkbox/form-checkbox.scss     |     0
 .../form/form-checkbox/form-checkbox.ts       |    11 +
 .../form-date-picker/form-date-picker.html    |    39 +
 .../form-date-picker/form-date-picker.scss    |     0
 .../form/form-date-picker/form-date-picker.ts |   147 +
 .../form/form-field/form-field.html           |    65 +
 .../form/form-field/form-field.scss           |    65 +
 .../components/form/form-field/form-field.ts  |   205 +
 .../form-file-upload/form-file-upload.html    |     1 +
 .../form-file-upload/form-file-upload.scss    |     0
 .../form/form-file-upload/form-file-upload.ts |    11 +
 .../form/form-input/form-input.html           |   158 +
 .../form/form-input/form-input.scss           |    98 +
 .../components/form/form-input/form-input.ts  |   328 +
 .../form/form-radio/form-radio.html           |     1 +
 .../form/form-radio/form-radio.scss           |     0
 .../components/form/form-radio/form-radio.ts  |    11 +
 .../form/form-select/form-select.html         |   225 +
 .../form/form-select/form-select.scss         |    35 +
 .../form/form-select/form-select.ts           |   739 +
 .../form/form-textarea/form-textarea.html     |     1 +
 .../form/form-textarea/form-textarea.scss     |     0
 .../form/form-textarea/form-textarea.ts       |    11 +
 .../form-validation-message.html              |    14 +
 .../form-validation-message.scss              |     0
 .../form-validation-message.ts                |   167 +
 .../form/models/form-select.models.ts         |    37 +
 src/app/shared/components/modal/modal.html    |   176 +
 src/app/shared/components/modal/modal.scss    |   750 +
 src/app/shared/components/modal/modal.ts      |   127 +
 .../spk-reusable-tables.html                  |    51 +
 .../spk-reusable-tables.scss                  |     0
 .../spk-reusable-tables.ts                    |    85 +
 .../date-time/constants/date-time-formats.ts  |    65 +
 .../date-time/models/date-time-format.ts      |    12 +
 .../pipes/app-date-time.pipe.spec.ts          |    35 +
 .../date-time/pipes/app-date-time.pipe.ts     |    28 +
 .../date-time-formatter.service.spec.ts       |    82 +
 .../services/date-time-formatter.service.ts   |    48 +
 .../directives/data-table-cell.directive.ts   |    12 +
 .../data-table-toolbar.directive.spec.ts      |    16 +
 .../data-table-toolbar.directive.ts           |    15 +
 .../directives/tooltip/tooltip.directive.ts   |   231 +
 .../directives/tooltip/tooltip/tooltip.html   |    26 +
 .../directives/tooltip/tooltip/tooltip.scss   |     0
 .../directives/tooltip/tooltip/tooltip.ts     |    59 +
 src/app/shared/routes/auth.routes.ts          |    19 -
 .../authentication-layout.html                |     2 +
 .../authentication-layout.scss                |     0
 .../authentication-layout.ts                  |    14 +
 .../content-layout/content-layout.html        |    46 +
 .../content-layout/content-layout.scss        |     0
 .../layouts/content-layout/content-layout.ts  |   143 +
 .../routes/content.routes.ts                  |     6 +-
 src/app/shell/ui/app-loader/app-loader.html   |     8 +
 src/app/shell/ui/app-loader/app-loader.scss   |     0
 src/app/shell/ui/app-loader/app-loader.ts     |    13 +
 src/app/shell/ui/footer/footer.html           |    15 +
 src/app/shell/ui/footer/footer.scss           |     0
 src/app/shell/ui/footer/footer.ts             |    13 +
 src/app/shell/ui/header/header.html           |   524 +
 src/app/shell/ui/header/header.scss           |     0
 src/app/shell/ui/header/header.ts             |   318 +
 src/app/shell/ui/header/headerdata.ts         |   102 +
 src/app/shell/ui/page-header/page-header.html |    35 +
 src/app/shell/ui/page-header/page-header.scss |    11 +
 src/app/shell/ui/page-header/page-header.ts   |    34 +
 .../problem-details-toast.ts                  |    16 +
 src/app/shell/ui/sidebar/sidebar.html         |   216 +
 src/app/shell/ui/sidebar/sidebar.scss         |     0
 src/app/shell/ui/sidebar/sidebar.ts           |   526 +
 src/app/shell/ui/switcher/switcher.html       |   543 +
 src/app/shell/ui/switcher/switcher.scss       |     0
 src/app/shell/ui/switcher/switcher.ts         |   191 +
 src/app/shell/ui/tab-to-top/tab-to-top.html   |     6 +
 src/app/shell/ui/tab-to-top/tab-to-top.scss   |     0
 src/app/shell/ui/tab-to-top/tab-to-top.ts     |    35 +
 src/app/tsconfig.app.json                     |    16 +
 src/app/tsconfig.json                         |    33 +
 src/app/tsconfig.spec.json                    |    15 +
 src/environments/environment.model.ts         |    24 +
 src/environments/environment.prod.ts          |     9 +-
 src/environments/environment.ts               |    12 +-
 src/styles.scss                               |    53 +-
 251 files changed, 37133 insertions(+), 461 deletions(-)
 create mode 100644 src/app/.editorconfig
 create mode 100644 src/app/.gitignore
 create mode 100644 src/app/.postcssrc.json
 create mode 100644 src/app/@spk/charts/charts/spk-echarts/spk-echarts.html
 create mode 100644 src/app/@spk/charts/charts/spk-echarts/spk-echarts.scss
 create mode 100644 src/app/@spk/charts/charts/spk-echarts/spk-echarts.ts
 create mode 100644 src/app/README.md
 create mode 100644 src/app/angular.json
 delete mode 100644 src/app/authentication/login/login.html
 create mode 100644 src/app/core/config/api-host.ts
 create mode 100644 src/app/core/config/api-url.util.ts
 create mode 100644 src/app/core/end-points/auth/auth.endpoints.ts
 create mode 100644 src/app/core/guards/auth/auth.guard.ts
 create mode 100644 src/app/core/guards/auth/guest.guard.ts
 create mode 100644 src/app/core/guards/auth/super-admin.guard.ts
 create mode 100644 src/app/core/models/api-response/api-response.model.ts
 create mode 100644 src/app/core/models/auth/auth.model.ts
 create mode 100644 src/app/core/models/context/context.model.ts
 create mode 100644 src/app/core/services/auth/auth.service.ts
 create mode 100644 src/app/core/services/auth/session-timeout.service.ts
 create mode 100644 src/app/core/services/auth/token-storage.service.ts
 create mode 100644 src/app/core/services/common/app-state.service.ts
 create mode 100644 src/app/core/services/common/base-api.service.ts
 create mode 100644 src/app/core/services/common/firebase.service.ts
 create mode 100644 src/app/core/services/common/loading.service.ts
 create mode 100644 src/app/core/services/common/menu.data.ts
 create mode 100644 src/app/core/services/common/menu.service.spec.ts
 create mode 100644 src/app/core/services/common/menu.service.ts
 create mode 100644 src/app/core/services/common/nav.service.ts
 create mode 100644 src/app/core/services/common/permission.service.ts
 create mode 100644 src/app/core/services/context/app-context.service.ts
 create mode 100644 src/app/core/services/context/tenant-context.service.ts
 create mode 100644 src/app/core/services/context/user-context.service.ts
 create mode 100644 src/app/features/authentication/authentication.routes.ts
 create mode 100644 src/app/features/authentication/pages/login/login.html
 rename src/app/{authentication => features/authentication/pages}/login/login.scss (97%)
 rename src/app/{authentication => features/authentication/pages}/login/login.ts (72%)
 create mode 100644 src/app/features/dashboards/crm/crm.html
 create mode 100644 src/app/features/dashboards/crm/crm.scss
 create mode 100644 src/app/features/dashboards/crm/crm.ts
 create mode 100644 src/app/features/dashboards/dashboard.routes.ts
 create mode 100644 src/app/features/errors/error.routes.ts
 create mode 100644 src/app/features/errors/error404/error404.html
 create mode 100644 src/app/features/errors/error404/error404.scss
 create mode 100644 src/app/features/errors/error404/error404.ts
 create mode 100644 src/app/features/errors/particleoptions.ts
 create mode 100644 src/app/features/global-masters/cities/data-access/city.endpoints.ts
 create mode 100644 src/app/features/global-masters/cities/data-access/city.service.ts
 create mode 100644 src/app/features/global-masters/cities/models/city.model.ts
 create mode 100644 src/app/features/global-masters/cities/pages/city-list/city-list.html
 create mode 100644 src/app/features/global-masters/cities/pages/city-list/city-list.scss
 create mode 100644 src/app/features/global-masters/cities/pages/city-list/city-list.ts
 create mode 100644 src/app/features/global-masters/countries/data-access/country.endpoints.ts
 create mode 100644 src/app/features/global-masters/countries/data-access/country.service.ts
 create mode 100644 src/app/features/global-masters/countries/models/country.model.ts
 create mode 100644 src/app/features/global-masters/countries/pages/country-list/country-list.html
 create mode 100644 src/app/features/global-masters/countries/pages/country-list/country-list.scss
 create mode 100644 src/app/features/global-masters/countries/pages/country-list/country-list.ts
 create mode 100644 src/app/features/global-masters/countries/public-api.ts
 create mode 100644 src/app/features/global-masters/currencies/data-access/currency.endpoints.ts
 create mode 100644 src/app/features/global-masters/currencies/data-access/currency.service.ts
 create mode 100644 src/app/features/global-masters/currencies/models/currency.model.ts
 create mode 100644 src/app/features/global-masters/currencies/pages/currency-list/currency-list.html
 create mode 100644 src/app/features/global-masters/currencies/pages/currency-list/currency-list.scss
 create mode 100644 src/app/features/global-masters/currencies/pages/currency-list/currency-list.ts
 create mode 100644 src/app/features/global-masters/currencies/public-api.ts
 create mode 100644 src/app/features/global-masters/languages/data-access/language.endpoints.ts
 create mode 100644 src/app/features/global-masters/languages/data-access/language.service.ts
 create mode 100644 src/app/features/global-masters/languages/models/language.model.ts
 create mode 100644 src/app/features/global-masters/languages/pages/language-list/language-list.html
 create mode 100644 src/app/features/global-masters/languages/pages/language-list/language-list.scss
 create mode 100644 src/app/features/global-masters/languages/pages/language-list/language-list.ts
 create mode 100644 src/app/features/global-masters/languages/public-api.ts
 delete mode 100644 src/app/features/global-masters/pages/master-list/master-list.html
 delete mode 100644 src/app/features/global-masters/pages/master-list/master-list.scss
 delete mode 100644 src/app/features/global-masters/pages/master-list/master-list.ts
 create mode 100644 src/app/features/global-masters/states/data-access/state.endpoints.ts
 create mode 100644 src/app/features/global-masters/states/data-access/state.service.ts
 create mode 100644 src/app/features/global-masters/states/models/state.model.ts
 create mode 100644 src/app/features/global-masters/states/pages/state-list/state-list.html
 create mode 100644 src/app/features/global-masters/states/pages/state-list/state-list.scss
 create mode 100644 src/app/features/global-masters/states/pages/state-list/state-list.ts
 create mode 100644 src/app/features/global-masters/states/public-api.ts
 create mode 100644 src/app/features/global-masters/timezones/data-access/timezone.endpoints.ts
 create mode 100644 src/app/features/global-masters/timezones/data-access/timezone.service.ts
 create mode 100644 src/app/features/global-masters/timezones/models/timezone.model.ts
 create mode 100644 src/app/features/global-masters/timezones/pages/timezone-list/timezone-list.html
 create mode 100644 src/app/features/global-masters/timezones/pages/timezone-list/timezone-list.scss
 create mode 100644 src/app/features/global-masters/timezones/pages/timezone-list/timezone-list.ts
 create mode 100644 src/app/features/global-masters/timezones/public-api.ts
 create mode 100644 src/app/features/organizations/organization-list/organization-list.html
 create mode 100644 src/app/features/organizations/organization-list/organization-list.scss
 create mode 100644 src/app/features/organizations/organization-list/organization-list.ts
 create mode 100644 src/app/features/organizations/organization-onboarding/components/onboarding-stepper/onboarding-stepper.html
 create mode 100644 src/app/features/organizations/organization-onboarding/components/onboarding-stepper/onboarding-stepper.scss
 create mode 100644 src/app/features/organizations/organization-onboarding/components/onboarding-stepper/onboarding-stepper.ts
 create mode 100644 src/app/features/organizations/organization-onboarding/models/organization-draft.model.ts
 create mode 100644 src/app/features/organizations/organization-onboarding/models/organization-onboarding.model.ts
 create mode 100644 src/app/features/organizations/organization-onboarding/models/organization-provisioning.model.ts
 create mode 100644 src/app/features/organizations/organization-onboarding/organization-onboarding.html
 create mode 100644 src/app/features/organizations/organization-onboarding/organization-onboarding.scss
 create mode 100644 src/app/features/organizations/organization-onboarding/organization-onboarding.ts
 create mode 100644 src/app/features/organizations/organization-onboarding/services/organization-onboarding-state.service.ts
 create mode 100644 src/app/features/organizations/organization-onboarding/services/organization-onboarding.service.ts
 create mode 100644 src/app/features/organizations/organization-onboarding/steps/organization-basics/organization-basics.html
 create mode 100644 src/app/features/organizations/organization-onboarding/steps/organization-basics/organization-basics.scss
 create mode 100644 src/app/features/organizations/organization-onboarding/steps/organization-basics/organization-basics.ts
 create mode 100644 src/app/features/organizations/organization-onboarding/steps/organization-localization/organization-localization.html
 create mode 100644 src/app/features/organizations/organization-onboarding/steps/organization-localization/organization-localization.ts
 create mode 100644 src/app/features/organizations/organization-onboarding/steps/organization-plan-limits/organization-plan-limits.html
 create mode 100644 src/app/features/organizations/organization-onboarding/steps/organization-plan-limits/organization-plan-limits.ts
 create mode 100644 src/app/features/organizations/organizations.routes.ts
 create mode 100644 src/app/features/tenants/data-access/tenant-currencies.endpoints.ts
 create mode 100644 src/app/features/tenants/data-access/tenant-currencies.service.ts
 create mode 100644 src/app/features/tenants/data-access/tenant.endpoints.ts
 create mode 100644 src/app/features/tenants/data-access/tenant.service.ts
 create mode 100644 src/app/features/tenants/models/tenant-currencies.model.ts
 create mode 100644 src/app/features/tenants/models/tenant.model.ts
 create mode 100644 src/app/features/tenants/pages/tenant-currencies/tenant-currencies.html
 create mode 100644 src/app/features/tenants/pages/tenant-currencies/tenant-currencies.scss
 create mode 100644 src/app/features/tenants/pages/tenant-currencies/tenant-currencies.ts
 create mode 100644 src/app/features/users/data-access/user.endpoints.ts
 create mode 100644 src/app/features/users/data-access/user.service.ts
 create mode 100644 src/app/features/users/models/user.model.ts
 create mode 100644 src/app/package-lock.json
 create mode 100644 src/app/package.json
 create mode 100644 src/app/shared/components/button/button.html
 create mode 100644 src/app/shared/components/button/button.scss
 create mode 100644 src/app/shared/components/button/button.ts
 create mode 100644 src/app/shared/components/confirm-dialog/confirm-dialog.html
 create mode 100644 src/app/shared/components/confirm-dialog/confirm-dialog.scss
 create mode 100644 src/app/shared/components/confirm-dialog/confirm-dialog.ts
 create mode 100644 src/app/shared/components/data-list/data-list.html
 create mode 100644 src/app/shared/components/data-list/data-list.ts
 create mode 100644 src/app/shared/components/data-table/data-table-cell.directive.ts
 create mode 100644 src/app/shared/components/data-table/data-table-query.state.ts
 create mode 100644 src/app/shared/components/data-table/data-table-query.types.ts
 create mode 100644 src/app/shared/components/filter-card/filter-card.html
 create mode 100644 src/app/shared/components/filter-card/filter-card.spec.ts
 create mode 100644 src/app/shared/components/filter-card/filter-card.ts
 create mode 100644 src/app/shared/components/form/autocomplete/autocomplete.html
 create mode 100644 src/app/shared/components/form/autocomplete/autocomplete.scss
 create mode 100644 src/app/shared/components/form/autocomplete/autocomplete.spec.ts
 create mode 100644 src/app/shared/components/form/autocomplete/autocomplete.ts
 create mode 100644 src/app/shared/components/form/autocomplete/autocomplete.types.ts
 create mode 100644 src/app/shared/components/form/form-action/form-action.html
 create mode 100644 src/app/shared/components/form/form-action/form-action.scss
 create mode 100644 src/app/shared/components/form/form-action/form-action.ts
 create mode 100644 src/app/shared/components/form/form-checkbox/form-checkbox.html
 create mode 100644 src/app/shared/components/form/form-checkbox/form-checkbox.scss
 create mode 100644 src/app/shared/components/form/form-checkbox/form-checkbox.ts
 create mode 100644 src/app/shared/components/form/form-date-picker/form-date-picker.html
 create mode 100644 src/app/shared/components/form/form-date-picker/form-date-picker.scss
 create mode 100644 src/app/shared/components/form/form-date-picker/form-date-picker.ts
 create mode 100644 src/app/shared/components/form/form-field/form-field.html
 create mode 100644 src/app/shared/components/form/form-field/form-field.scss
 create mode 100644 src/app/shared/components/form/form-field/form-field.ts
 create mode 100644 src/app/shared/components/form/form-file-upload/form-file-upload.html
 create mode 100644 src/app/shared/components/form/form-file-upload/form-file-upload.scss
 create mode 100644 src/app/shared/components/form/form-file-upload/form-file-upload.ts
 create mode 100644 src/app/shared/components/form/form-input/form-input.html
 create mode 100644 src/app/shared/components/form/form-input/form-input.scss
 create mode 100644 src/app/shared/components/form/form-input/form-input.ts
 create mode 100644 src/app/shared/components/form/form-radio/form-radio.html
 create mode 100644 src/app/shared/components/form/form-radio/form-radio.scss
 create mode 100644 src/app/shared/components/form/form-radio/form-radio.ts
 create mode 100644 src/app/shared/components/form/form-select/form-select.html
 create mode 100644 src/app/shared/components/form/form-select/form-select.scss
 create mode 100644 src/app/shared/components/form/form-select/form-select.ts
 create mode 100644 src/app/shared/components/form/form-textarea/form-textarea.html
 create mode 100644 src/app/shared/components/form/form-textarea/form-textarea.scss
 create mode 100644 src/app/shared/components/form/form-textarea/form-textarea.ts
 create mode 100644 src/app/shared/components/form/form-validation-message/form-validation-message.html
 create mode 100644 src/app/shared/components/form/form-validation-message/form-validation-message.scss
 create mode 100644 src/app/shared/components/form/form-validation-message/form-validation-message.ts
 create mode 100644 src/app/shared/components/form/models/form-select.models.ts
 create mode 100644 src/app/shared/components/modal/modal.html
 create mode 100644 src/app/shared/components/modal/modal.scss
 create mode 100644 src/app/shared/components/modal/modal.ts
 create mode 100644 src/app/shared/components/spk-reusable-tables/spk-reusable-tables.html
 create mode 100644 src/app/shared/components/spk-reusable-tables/spk-reusable-tables.scss
 create mode 100644 src/app/shared/components/spk-reusable-tables/spk-reusable-tables.ts
 create mode 100644 src/app/shared/date-time/constants/date-time-formats.ts
 create mode 100644 src/app/shared/date-time/models/date-time-format.ts
 create mode 100644 src/app/shared/date-time/pipes/app-date-time.pipe.spec.ts
 create mode 100644 src/app/shared/date-time/pipes/app-date-time.pipe.ts
 create mode 100644 src/app/shared/date-time/services/date-time-formatter.service.spec.ts
 create mode 100644 src/app/shared/date-time/services/date-time-formatter.service.ts
 create mode 100644 src/app/shared/directives/data-table-cell.directive.ts
 create mode 100644 src/app/shared/directives/data-table-toolbar/data-table-toolbar.directive.spec.ts
 create mode 100644 src/app/shared/directives/data-table-toolbar/data-table-toolbar.directive.ts
 create mode 100644 src/app/shared/directives/tooltip/tooltip.directive.ts
 create mode 100644 src/app/shared/directives/tooltip/tooltip/tooltip.html
 create mode 100644 src/app/shared/directives/tooltip/tooltip/tooltip.scss
 create mode 100644 src/app/shared/directives/tooltip/tooltip/tooltip.ts
 delete mode 100644 src/app/shared/routes/auth.routes.ts
 create mode 100644 src/app/shell/layouts/authentication-layout/authentication-layout.html
 create mode 100644 src/app/shell/layouts/authentication-layout/authentication-layout.scss
 create mode 100644 src/app/shell/layouts/authentication-layout/authentication-layout.ts
 create mode 100644 src/app/shell/layouts/content-layout/content-layout.html
 create mode 100644 src/app/shell/layouts/content-layout/content-layout.scss
 create mode 100644 src/app/shell/layouts/content-layout/content-layout.ts
 rename src/app/{shared => shell}/routes/content.routes.ts (81%)
 create mode 100644 src/app/shell/ui/app-loader/app-loader.html
 create mode 100644 src/app/shell/ui/app-loader/app-loader.scss
 create mode 100644 src/app/shell/ui/app-loader/app-loader.ts
 create mode 100644 src/app/shell/ui/footer/footer.html
 create mode 100644 src/app/shell/ui/footer/footer.scss
 create mode 100644 src/app/shell/ui/footer/footer.ts
 create mode 100644 src/app/shell/ui/header/header.html
 create mode 100644 src/app/shell/ui/header/header.scss
 create mode 100644 src/app/shell/ui/header/header.ts
 create mode 100644 src/app/shell/ui/header/headerdata.ts
 create mode 100644 src/app/shell/ui/page-header/page-header.html
 create mode 100644 src/app/shell/ui/page-header/page-header.scss
 create mode 100644 src/app/shell/ui/page-header/page-header.ts
 create mode 100644 src/app/shell/ui/problem-details-toast/problem-details-toast.ts
 create mode 100644 src/app/shell/ui/sidebar/sidebar.html
 create mode 100644 src/app/shell/ui/sidebar/sidebar.scss
 create mode 100644 src/app/shell/ui/sidebar/sidebar.ts
 create mode 100644 src/app/shell/ui/switcher/switcher.html
 create mode 100644 src/app/shell/ui/switcher/switcher.scss
 create mode 100644 src/app/shell/ui/switcher/switcher.ts
 create mode 100644 src/app/shell/ui/tab-to-top/tab-to-top.html
 create mode 100644 src/app/shell/ui/tab-to-top/tab-to-top.scss
 create mode 100644 src/app/shell/ui/tab-to-top/tab-to-top.ts
 create mode 100644 src/app/tsconfig.app.json
 create mode 100644 src/app/tsconfig.json
 create mode 100644 src/app/tsconfig.spec.json
 create mode 100644 src/environments/environment.model.ts

diff --git a/src/app/.editorconfig b/src/app/.editorconfig
new file mode 100644
index 00000000..f166060d
--- /dev/null
+++ b/src/app/.editorconfig
@@ -0,0 +1,17 @@
+# Editor configuration, see https://editorconfig.org
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 2
+insert_final_newline = true
+trim_trailing_whitespace = true
+
+[*.ts]
+quote_type = single
+ij_typescript_use_double_quotes = false
+
+[*.md]
+max_line_length = off
+trim_trailing_whitespace = false
diff --git a/src/app/.gitignore b/src/app/.gitignore
new file mode 100644
index 00000000..d480cdcf
--- /dev/null
+++ b/src/app/.gitignore
@@ -0,0 +1,55 @@
+# See https://docs.github.com/get-started/getting-started-with-git/ignoring-files for more about ignoring files.
+
+# Compiled output
+/dist
+/tmp
+/out-tsc
+/bazel-out
+
+# Node
+/node_modules
+npm-debug.log
+yarn-error.log
+
+node_modules/
+.angular/
+dist/
+
+# IDEs and editors
+.idea/
+.project
+.classpath
+.c9/
+*.launch
+.settings/
+*.sublime-workspace
+
+# Visual Studio Code
+.vscode/*
+!.vscode/settings.json
+!.vscode/tasks.json
+!.vscode/launch.json
+!.vscode/extensions.json
+.history/*
+
+# Miscellaneous
+/.angular/cache
+.sass-cache/
+/connect.lock
+/coverage
+/libpeerconnection.log
+testem.log
+/typings
+__screenshots__/
+
+# System files
+.DS_Store
+Thumbs.db
+
+
+# Ignore local ESLint config
+eslint.config.js
+
+# Ignore preview folder
+preview/
+src/.htaccess
\ No newline at end of file
diff --git a/src/app/.postcssrc.json b/src/app/.postcssrc.json
new file mode 100644
index 00000000..6e4364ec
--- /dev/null
+++ b/src/app/.postcssrc.json
@@ -0,0 +1,6 @@
+{
+  "plugins": {
+    "@tailwindcss/postcss": {},
+    "autoprefixer": {}
+  }
+}
diff --git a/src/app/@spk/charts/charts/spk-echarts/spk-echarts.html b/src/app/@spk/charts/charts/spk-echarts/spk-echarts.html
new file mode 100644
index 00000000..79a0230a
--- /dev/null
+++ b/src/app/@spk/charts/charts/spk-echarts/spk-echarts.html
@@ -0,0 +1 @@
+<div  echarts [ngClass]="echartClass()" [options]="options() || {}" [id]="id()"></div>
\ No newline at end of file
diff --git a/src/app/@spk/charts/charts/spk-echarts/spk-echarts.scss b/src/app/@spk/charts/charts/spk-echarts/spk-echarts.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/src/app/@spk/charts/charts/spk-echarts/spk-echarts.ts b/src/app/@spk/charts/charts/spk-echarts/spk-echarts.ts
new file mode 100644
index 00000000..c0b9fe4e
--- /dev/null
+++ b/src/app/@spk/charts/charts/spk-echarts/spk-echarts.ts
@@ -0,0 +1,16 @@
+import { NgClass } from '@angular/common';
+import { Component, input } from '@angular/core';
+import { NgxEchartsDirective } from 'ngx-echarts';
+import { EChartsOption } from 'echarts';
+@Component({
+  selector: 'spk-echarts',
+  imports: [NgxEchartsDirective, NgClass],
+  templateUrl: './spk-echarts.html',
+  styleUrl: './spk-echarts.scss'
+})
+export class SpkEcharts {
+  options = input<EChartsOption>()
+  id = input<string>()
+  echartClass = input<string>()
+  theme = input<string>()
+}
diff --git a/src/app/README.md b/src/app/README.md
new file mode 100644
index 00000000..da9cc0e1
--- /dev/null
+++ b/src/app/README.md
@@ -0,0 +1,59 @@
+# YnexTailwind
+
+This project was generated using [Angular CLI](https://github.com/angular/angular-cli) version 21.0.5.
+
+## Development server
+
+To start a local development server, run:
+
+```bash
+ng serve
+```
+
+Once the server is running, open your browser and navigate to `http://localhost:4200/`. The application will automatically reload whenever you modify any of the source files.
+
+## Code scaffolding
+
+Angular CLI includes powerful code scaffolding tools. To generate a new component, run:
+
+```bash
+ng generate component component-name
+```
+
+For a complete list of available schematics (such as `components`, `directives`, or `pipes`), run:
+
+```bash
+ng generate --help
+```
+
+## Building
+
+To build the project run:
+
+```bash
+ng build
+```
+
+This will compile your project and store the build artifacts in the `dist/` directory. By default, the production build optimizes your application for performance and speed.
+
+## Running unit tests
+
+To execute unit tests with the [Vitest](https://vitest.dev/) test runner, use the following command:
+
+```bash
+ng test
+```
+
+## Running end-to-end tests
+
+For end-to-end (e2e) testing, run:
+
+```bash
+ng e2e
+```
+
+Angular CLI does not come with an end-to-end testing framework by default. You can choose one that suits your needs.
+
+## Additional Resources
+
+For more information on using the Angular CLI, including detailed command references, visit the [Angular CLI Overview and Command Reference](https://angular.dev/tools/cli) page.
diff --git a/src/app/angular.json b/src/app/angular.json
new file mode 100644
index 00000000..83cef95e
--- /dev/null
+++ b/src/app/angular.json
@@ -0,0 +1,124 @@
+{
+  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
+  "version": 1,
+  "cli": {
+    "packageManager": "npm",
+    "analytics": "0b3da18f-5d81-4a09-9b2f-b0ce36040773",
+    "schematicCollections": [
+      "angular-eslint"
+    ]
+  },
+  "newProjectRoot": "projects",
+  "projects": {
+    "Ynex-Tailwind": {
+      "projectType": "application",
+      "schematics": {
+        "@schematics/angular:component": {
+          "skipTests": true,
+          "style": "scss",
+          "prefix": ""
+        }
+      },
+      "root": "",
+      "sourceRoot": "src",
+      "prefix": "app",
+      "architect": {
+        "build": {
+          "builder": "@angular/build:application",
+          "options": {
+            "allowedCommonJsDependencies": [
+              "sweetalert2",
+              "inputmask",
+              "filepond",
+              "moment",
+              "leaflet",
+              "apexcharts",
+              "glightbox",
+              "intl-tel-input",
+              "filepond-plugin-image-preview",
+              "dropzone",
+              "quill-delta",
+              "sweetalert",
+              "dayjs"
+            ],
+            "browser": "src/main.ts",
+            "tsConfig": "tsconfig.app.json",
+            "inlineStyleLanguage": "scss",
+            "outputPath": {
+              "base": "preview",
+              "browser": ""
+            },
+            "assets": [
+              {
+                "glob": "**/*",
+                "input": "public"
+              },
+              "src/.htaccess"
+            ],
+            "styles": [
+              "node_modules/@ng-select/ng-select/themes/default.theme.css",
+              "src/styles.scss"
+            ],
+            "scripts": [
+              "node_modules/preline/dist/preline.js"
+            ]
+          },
+          "configurations": {
+            "production": {
+              "fileReplacements": [
+                {
+                  "replace": "src/environments/environment.ts",
+                  "with": "src/environments/environment.prod.ts"
+                }
+              ],
+              "baseHref": "/",
+              "budgets": [
+                {
+                  "type": "initial",
+                  "maximumWarning": "5MB",
+                  "maximumError": "5MB"
+                },
+                {
+                  "type": "anyComponentStyle",
+                  "maximumWarning": "4kB",
+                  "maximumError": "8kB"
+                }
+              ],
+              "outputHashing": "all"
+            },
+            "development": {
+              "optimization": false,
+              "extractLicenses": false,
+              "sourceMap": true
+            }
+          },
+          "defaultConfiguration": "development"
+        },
+        "serve": {
+          "builder": "@angular/build:dev-server",
+          "configurations": {
+            "production": {
+              "buildTarget": "Ynex-Tailwind:build:production"
+            },
+            "development": {
+              "buildTarget": "Ynex-Tailwind:build:development"
+            }
+          },
+          "defaultConfiguration": "development"
+        },
+        "test": {
+          "builder": "@angular/build:unit-test"
+        },
+        "lint": {
+          "builder": "@angular-eslint/builder:lint",
+          "options": {
+            "lintFilePatterns": [
+              "src/**/*.ts",
+              "src/**/*.html"
+            ]
+          }
+        }
+      }
+    }
+  }
+}
\ No newline at end of file
diff --git a/src/app/app.routes.ts b/src/app/app.routes.ts
index 7101590c..41a5239b 100644
--- a/src/app/app.routes.ts
+++ b/src/app/app.routes.ts
@@ -1,23 +1,24 @@
 import { Route } from '@angular/router';
-import { ContentLayout } from './shared/layouts/content-layout/content-layout';
-import { AuthenticationLayout } from './shared/layouts/authentication-layout/authentication-layout';
-import { authGuard } from './core/guards/auth.guard';
+import { ContentLayout } from './shell/layouts/content-layout/content-layout';
+import { AuthenticationLayout } from './shell/layouts/authentication-layout/authentication-layout';
+import { authGuard } from './core/guards/auth/auth.guard';
 
 export const App_Route: Route[] = [
   { path: '', redirectTo: 'auth/login', pathMatch: 'full' },
   {
     path: 'auth',
     component: AuthenticationLayout,
-    loadChildren: () => import('./shared/routes/auth.routes').then((m) => m.authen),
+    loadChildren: () =>
+      import('./features/authentication/authentication.routes').then((m) => m.authen),
   },
   {
     path: '',
     component: ContentLayout,
     canActivateChild: [authGuard],
-    loadChildren: () => import('./shared/routes/content.routes').then((m) => m.content),
+    loadChildren: () => import('./shell/routes/content.routes').then((m) => m.content),
   },
   {
     path: '**',
-    loadComponent: () => import('./components/error/error404/error404').then((m) => m.Error404),
+    loadComponent: () => import('./features/errors/error404/error404').then((m) => m.Error404),
   },
 ];
diff --git a/src/app/app.ts b/src/app/app.ts
index 300fe3df..3484e40f 100644
--- a/src/app/app.ts
+++ b/src/app/app.ts
@@ -1,6 +1,6 @@
 import { Component, signal, inject } from '@angular/core';
 import { NavigationEnd, Router, RouterOutlet } from '@angular/router';
-import { AppStateService } from './shared/services/app-state.service';
+import { AppStateService } from './core/services/common/app-state.service';
 @Component({
   selector: 'app-root',
   imports: [RouterOutlet],
diff --git a/src/app/authentication/login/login.html b/src/app/authentication/login/login.html
deleted file mode 100644
index 4f5dfdb3..00000000
--- a/src/app/authentication/login/login.html
+++ /dev/null
@@ -1,106 +0,0 @@
-<div
-  class="flex justify-center authentication authentication-basic items-center h-full text-defaultsize text-defaulttextcolor">
-  <div class="grid grid-cols-12">
-    <div class="xxl:col-span-4 xl:col-span-4 lg:col-span-4 md:col-span-3 sm:col-span-2"></div>
-    <div class="xxl:col-span-4 xl:col-span-4 lg:col-span-4 md:col-span-6 sm:col-span-8 col-span-12">
-      <div class="my-[2.5rem] flex justify-center">
-        <a routerLink="/dashboards/crm">
-          <img src="./assets/images/brand-logos/erp-logo-icon.png" alt="logo" class="desktop-logo">
-          <img src="./assets/images/brand-logos/erp-logo-icon.png" alt="logo" class="desktop-dark">
-        </a>
-      </div>
-      <div class="box">
-        <div class="box-body !p-[3rem]">
-          <p class="h5 font-semibold mb-2 text-center">Sign In</p>
-          <p class="mb-4 text-[#8c9097] dark:text-white/50 opacity-[0.7] font-normal text-center">Welcome back !
-          </p>
-          <nav aria-label="Tabs" role="tablist" aria-orientation="horizontal"
-            class="sm:flex  rounded-lg transition p-1 ">
-
-          </nav>
-
-          <div class="mt-3">
-            <div id="segment-2" role="tabpanel" aria-labelledby="segment-item-2">
-
-              <div class="text-center">
-                <h1 class="block text-2xl font-bold text-gray-800 dark:text-white">
-                </h1>
-              </div>
-              <div class="mt-3">
-
-                <form [formGroup]="adminLoginForm" (ngSubmit)="login()">
-                  <div class="text-danger">
-                    {{ loginError }}
-                  </div>
-                  <div class="grid grid-cols-12 gap-y-4">
-                    <div class="xl:col-span-12 col-span-12">
-                      <label for="signin-username" class="form-label text-default">User Name </label>
-                      <input type="text" class="form-control form-control-lg w-full !rounded-md" id="signin-username"
-                        placeholder="user name" formControlName="username" autocomplete>
-                    </div>
-                    <div class="xl:col-span-12 col-span-12 mb-2">
-                      <label for="signin-password" class="form-label text-default block">Password
-                      </label>
-                        <a routerLink="/authentication/reset-password/basic"
-                          class="float-end text-danger">Forget password ?</a>
-                      <div class="input-group">
-                        <input type="password" class="form-control form-control-lg !rounded-s-md" id="signin-password"
-                          placeholder="password" formControlName="password" autocomplete
-                          [type]="visibilityMap['Angular'] ? 'text' : 'password'">
-                        <button aria-label="button" class="ti-btn ti-btn-light !rounded-s-none !mb-0" type="button"
-                          (click)="toggleVisibility('Angular')" id="button-addon2"><i
-                            class="{{ iconMap['Angular'] }} align-middle"></i></button>
-                      </div>
-                      <div class="mt-2">
-                        <div class="form-check !ps-0">
-                          <input class="form-check-input" type="checkbox" value="" id="defaultCheck1" formControlName="rememberMe">
-                          <label class="form-check-label text-[#8c9097] dark:text-white/50 font-normal"
-                            for="defaultCheck1">
-                            Remember password ?
-                          </label>
-                        </div>
-                      </div>
-                    </div>
-                    <div class="xl:col-span-12 col-span-12 grid mt-2">
-                      <button type="submit" [disabled]="adminLoginForm.invalid || isSubmitting"
-                        class="ti-btn ti-btn-primary !bg-primary !text-white !font-medium inline-flex items-center justify-center gap-2">
-                        @if (isSubmitting) {
-                          <span class="ti-spinner text-white" role="status" aria-label="loading"></span>
-                          <span>Signing In...</span>
-                        } @else {
-                          <span>Sign In</span>
-                        }
-                      </button>
-                    </div>
-                  </div>
-                </form>
-                <div class="text-center">
-                  <p class="text-[0.75rem] text-[#8c9097] dark:text-white/50 mt-4">Dont have an account? <a
-                      routerLink="/authentication/sign-up/basic" class="text-primary">Sign Up</a></p>
-                </div>
-                <div class="text-center my-4 authentication-barrier">
-                  <span>OR</span>
-                </div>
-                <div class="btn-list text-center">
-                  <button aria-label="button" type="button" class="ti-btn ti-btn-icon ti-btn-light me-[0.365rem]">
-                    <i class="ri-facebook-line font-bold text-dark opacity-[0.7]"></i>
-                  </button>
-                  <button aria-label="button" type="button" class="ti-btn ti-btn-icon ti-btn-light me-[0.365rem]">
-                    <i class="ri-google-line font-bold text-dark opacity-[0.7]"></i>
-                  </button>
-                  <button aria-label="button" type="button" class="ti-btn ti-btn-icon ti-btn-light">
-                    <i class="ri-twitter-x-line font-bold text-dark opacity-[0.7]"></i>
-                  </button>
-                </div>
-
-              </div>
-
-            </div>
-          </div>
-
-        </div>
-      </div>
-    </div>
-    <div class="xxl:col-span-4 xl:col-span-4 lg:col-span-4 md:col-span-3 sm:col-span-2"></div>
-  </div>
-</div>
diff --git a/src/app/core/config/api-host.ts b/src/app/core/config/api-host.ts
new file mode 100644
index 00000000..23a8c4dc
--- /dev/null
+++ b/src/app/core/config/api-host.ts
@@ -0,0 +1,8 @@
+import { environment } from '../../../environments/environment';
+
+export const API_HOSTS = {
+  identity: environment.api.identity,
+  masterAdmin: environment.api.masterAdmin,
+} as const;
+
+export type ApiHost = keyof typeof API_HOSTS;
\ No newline at end of file
diff --git a/src/app/core/config/api-url.util.ts b/src/app/core/config/api-url.util.ts
new file mode 100644
index 00000000..61853e56
--- /dev/null
+++ b/src/app/core/config/api-url.util.ts
@@ -0,0 +1,13 @@
+import { API_HOSTS, ApiHost } from './api-host';
+
+export function buildApiUrl(
+  host: ApiHost,
+  endpoint: string
+): string {
+  const baseUrl = API_HOSTS[host].replace(/\/+$/, '');
+  const normalizedEndpoint = endpoint.startsWith('/')
+    ? endpoint
+    : `/${endpoint}`;
+
+  return `${baseUrl}${normalizedEndpoint}`;
+}
\ No newline at end of file
diff --git a/src/app/core/config/api.config.ts b/src/app/core/config/api.config.ts
index 2d3be74d..ce9d4275 100644
--- a/src/app/core/config/api.config.ts
+++ b/src/app/core/config/api.config.ts
@@ -1,19 +1,9 @@
-import { environment } from '../../../environments/environment';
-
 export const API_CONFIG = {
-  baseUrl: environment.apiBaseUrl ?? 'https://localhost:5001/api',
+  baseUrl: '/api',
   endpoints: {
-    auth: '/v1/auth',
-    users: '/users',
-    tenants: '/tenants',
+    auth: '/auth',
     currentUserProfile: '/users/me',
     tenantContext: '/tenants/current-context',
     permissionContext: '/users/me/permissions',
-    masters: '/masters',
-    billing: '/billing',
-    localization: '/localization',
-    theming: '/theming',
-    platform: '/platform',
-    monitoring: '/monitoring',
   },
 };
diff --git a/src/app/core/end-points/auth/auth.endpoints.ts b/src/app/core/end-points/auth/auth.endpoints.ts
new file mode 100644
index 00000000..2c1fd773
--- /dev/null
+++ b/src/app/core/end-points/auth/auth.endpoints.ts
@@ -0,0 +1,8 @@
+import { buildApiUrl } from '../../config/api-url.util';
+
+export const AUTH_ENDPOINTS = {
+  login: buildApiUrl('identity', '/v1/auth/login'),
+  refresh: buildApiUrl('identity', '/v1/auth/refresh'),
+  logout: buildApiUrl('identity', '/v1/auth/logout'),
+  currentUser: buildApiUrl('identity', '/v1/auth/me'),
+} as const;
\ No newline at end of file
diff --git a/src/app/core/guards/auth/auth.guard.ts b/src/app/core/guards/auth/auth.guard.ts
new file mode 100644
index 00000000..764b2048
--- /dev/null
+++ b/src/app/core/guards/auth/auth.guard.ts
@@ -0,0 +1,37 @@
+import { inject } from '@angular/core';
+import { CanActivateChildFn, Router } from '@angular/router';
+import { catchError, map, of } from 'rxjs';
+import { AuthService } from '../../services/auth/auth.service';
+import { TokenStorageService } from '../../services/auth/token-storage.service';
+
+export const authGuard: CanActivateChildFn = (_childRoute, state) => {
+  const authService = inject(AuthService);
+  const tokenStorage = inject(TokenStorageService);
+  const router = inject(Router);
+
+  const loginUrlTree = router.createUrlTree(['/auth/login'], {
+    queryParams: { returnUrl: state.url },
+  });
+
+  if (!authService.accessToken || !authService.currentUser) {
+    authService.logout();
+    return loginUrlTree;
+  }
+
+  if (!tokenStorage.isAccessTokenExpired()) {
+    return true;
+  }
+
+  if (!authService.refreshToken || tokenStorage.isRefreshTokenExpired()) {
+    authService.logout();
+    return loginUrlTree;
+  }
+
+  return authService.refreshAccessToken().pipe(
+    map(() => true),
+    catchError(() => {
+      authService.logout();
+      return of(loginUrlTree);
+    })
+  );
+};
diff --git a/src/app/core/guards/auth/guest.guard.ts b/src/app/core/guards/auth/guest.guard.ts
new file mode 100644
index 00000000..e62d18af
--- /dev/null
+++ b/src/app/core/guards/auth/guest.guard.ts
@@ -0,0 +1,53 @@
+import { inject } from '@angular/core';
+import { CanActivateFn, Router } from '@angular/router';
+import { catchError, map, of } from 'rxjs';
+import { AuthService } from '../../services/auth/auth.service';
+import { TokenStorageService } from '../../services/auth/token-storage.service';
+
+const DEFAULT_AUTHENTICATED_REDIRECT = '/dashboards/crm';
+
+function resolveSafeReturnUrl(returnUrl: string | null): string {
+  const candidate = returnUrl?.trim();
+  if (!candidate) {
+    return DEFAULT_AUTHENTICATED_REDIRECT;
+  }
+
+  const lowerCandidate = candidate.toLowerCase();
+  const isSafeInternal =
+    candidate.startsWith('/') &&
+    !candidate.startsWith('//') &&
+    !lowerCandidate.includes('http://') &&
+    !lowerCandidate.includes('https://');
+
+  return isSafeInternal ? candidate : DEFAULT_AUTHENTICATED_REDIRECT;
+}
+
+export const guestGuard: CanActivateFn = (route) => {
+  const authService = inject(AuthService);
+  const tokenStorage = inject(TokenStorageService);
+  const router = inject(Router);
+
+  const targetUrl = resolveSafeReturnUrl(route.queryParamMap.get('returnUrl'));
+  const targetUrlTree = router.createUrlTree([targetUrl]);
+
+  if (!authService.accessToken || !authService.currentUser) {
+    return true;
+  }
+
+  if (!tokenStorage.isAccessTokenExpired()) {
+    return targetUrlTree;
+  }
+
+  if (!authService.refreshToken || tokenStorage.isRefreshTokenExpired()) {
+    authService.logout();
+    return true;
+  }
+
+  return authService.refreshAccessToken().pipe(
+    map(() => targetUrlTree),
+    catchError(() => {
+      authService.logout();
+      return of(true);
+    })
+  );
+};
\ No newline at end of file
diff --git a/src/app/core/guards/auth/super-admin.guard.ts b/src/app/core/guards/auth/super-admin.guard.ts
new file mode 100644
index 00000000..d109777b
--- /dev/null
+++ b/src/app/core/guards/auth/super-admin.guard.ts
@@ -0,0 +1,11 @@
+import { inject } from '@angular/core';
+import { CanActivateFn, Router } from '@angular/router';
+import { AuthService } from '../../services/auth/auth.service';
+
+export const superAdminGuard: CanActivateFn = () => {
+  const auth = inject(AuthService);
+  const router = inject(Router);
+  return (auth.currentUser?.roles ?? []).includes('super_admin')
+    ? true
+    : router.createUrlTree(['/dashboards/crm']);
+};
diff --git a/src/app/core/interceptors/auth.interceptor.ts b/src/app/core/interceptors/auth.interceptor.ts
index 204c3832..8418add5 100644
--- a/src/app/core/interceptors/auth.interceptor.ts
+++ b/src/app/core/interceptors/auth.interceptor.ts
@@ -2,20 +2,34 @@ import { HttpErrorResponse, HttpInterceptorFn } from '@angular/common/http';
 import { inject } from '@angular/core';
 import { Router } from '@angular/router';
 import { catchError, switchMap, throwError } from 'rxjs';
-import { AuthService } from '../auth/auth.service';
+import { AuthService } from '../services/auth/auth.service';
 import { API_CONFIG } from '../config/api.config';
+import { AUTH_ENDPOINTS } from '../end-points/auth/auth.endpoints';
 
 const RETRY_HEADER = 'X-Auth-Retry';
 
+function isEndpointRequest(requestUrl: string, endpointUrl: string): boolean {
+  return (
+    requestUrl === endpointUrl ||
+    requestUrl.startsWith(`${endpointUrl}?`)
+  );
+}
+
 export const authInterceptor: HttpInterceptorFn = (req, next) => {
   const authService = inject(AuthService);
   const router = inject(Router);
 
-  const authBaseUrl = `${API_CONFIG.baseUrl}${API_CONFIG.endpoints.auth}`;
-  const isAuthRequest = req.url.includes(authBaseUrl);
-  const isRefreshRequest = req.url.includes(`${authBaseUrl}/refresh`);
+  const isLoginRequest = isEndpointRequest(
+    req.url,
+    AUTH_ENDPOINTS.login
+  );
 
-  if (isAuthRequest) {
+  const isRefreshRequest = isEndpointRequest(
+    req.url,
+    AUTH_ENDPOINTS.refresh
+  );
+
+  if (isLoginRequest || isRefreshRequest) {
     return next(req);
   }
 
diff --git a/src/app/core/interceptors/error.interceptor.ts b/src/app/core/interceptors/error.interceptor.ts
index 1fd7c0c3..31706513 100644
--- a/src/app/core/interceptors/error.interceptor.ts
+++ b/src/app/core/interceptors/error.interceptor.ts
@@ -4,6 +4,31 @@ import { ToastrService } from 'ngx-toastr';
 import { catchError, throwError } from 'rxjs';
 import { API_CONFIG } from '../config/api.config';
 
+const backendErrorMessage = (body: unknown): string | null => {
+  if (typeof body === 'string') return body.trim() || null;
+  if (typeof body !== 'object' || body === null) return null;
+
+  const record = body as Record<string, unknown>;
+  for (const key of ['detail', 'message', 'title']) {
+    const value = record[key];
+    if (typeof value === 'string' && value.trim()) return value.trim();
+  }
+  return null;
+};
+
+const httpErrorMessage = (error: HttpErrorResponse): string => {
+  const backendMessage = backendErrorMessage(error.error);
+  if (backendMessage) return backendMessage;
+
+  if (error.status > 0) {
+    const statusText = error.statusText.trim();
+    const meaningfulStatusText = statusText && statusText.toUpperCase() !== 'OK';
+    return `HTTP ${error.status}${meaningfulStatusText ? ` ${statusText}` : ''}`;
+  }
+
+  return error.message || 'Request failed';
+};
+
 export const errorInterceptor: HttpInterceptorFn = (req, next) => {
   const toastr = inject(ToastrService);
   const authBaseUrl = `${API_CONFIG.baseUrl}${API_CONFIG.endpoints.auth}`;
@@ -13,7 +38,7 @@ export const errorInterceptor: HttpInterceptorFn = (req, next) => {
   return next(req).pipe(
     catchError((error: HttpErrorResponse) => {
       if (!isLoginRequest && !isRefreshRequest && error.status !== 401) {
-        const message = error.error?.detail ?? error.error?.message ?? error.message ?? 'Request failed';
+        const message = httpErrorMessage(error);
         toastr.error(message, 'Request failed');
       }
 
diff --git a/src/app/core/interceptors/loading-interceptor.ts b/src/app/core/interceptors/loading-interceptor.ts
index 5d920d6d..260cff1f 100644
--- a/src/app/core/interceptors/loading-interceptor.ts
+++ b/src/app/core/interceptors/loading-interceptor.ts
@@ -1,7 +1,7 @@
 import { HttpInterceptorFn } from '@angular/common/http';
 import { inject } from '@angular/core';
 import { finalize } from 'rxjs';
-import { LoadingService } from '../services/loading.service';
+import { LoadingService } from '../services/common/loading.service';
 
 export const loadingInterceptor: HttpInterceptorFn = (req, next) => {
   const loadingService = inject(LoadingService);
diff --git a/src/app/core/models/api-response/api-response.model.ts b/src/app/core/models/api-response/api-response.model.ts
new file mode 100644
index 00000000..0ec47b3b
--- /dev/null
+++ b/src/app/core/models/api-response/api-response.model.ts
@@ -0,0 +1,12 @@
+export interface ApiResponse<T> {
+  data: T;
+  message?: string;
+  success: boolean;
+}
+
+export interface ProblemDetails {
+  title?: string;
+  status?: number;
+  detail?: string;
+  errors?: Record<string, string[]>;
+}
diff --git a/src/app/core/models/auth/auth.model.ts b/src/app/core/models/auth/auth.model.ts
new file mode 100644
index 00000000..0c747c92
--- /dev/null
+++ b/src/app/core/models/auth/auth.model.ts
@@ -0,0 +1,24 @@
+export interface LoginRequest {
+  email: string;
+  password: string;
+}
+
+export interface LoginResponse {
+  accessToken: string;
+  refreshToken?: string;
+  accessTokenExpiresOn?: string;
+  refreshTokenExpiresOn?: string;
+  expiresIn?: number;
+  user?: UserProfile;
+  userId?: string;
+  email?: string;
+  roles?: string[];
+}
+
+export interface UserProfile {
+  id: string;
+  email: string;
+  displayName?: string;
+  roles?: string[];
+  tenantId?: string;
+}
diff --git a/src/app/core/models/context/context.model.ts b/src/app/core/models/context/context.model.ts
new file mode 100644
index 00000000..57efe873
--- /dev/null
+++ b/src/app/core/models/context/context.model.ts
@@ -0,0 +1,33 @@
+import { UserProfile } from '../auth/auth.model';
+import { Menu } from '../../services/common/nav.service';
+
+export interface CurrentUserContext extends UserProfile {
+  fullName?: string;
+  defaultLandingPage?: string;
+}
+
+export interface TenantContext {
+  tenantId?: string;
+  companyId?: string;
+  companyName?: string;
+  tenantName?: string;
+  defaultLandingPage?: string;
+}
+
+export interface PermissionContext {
+  roles: string[];
+  permissions: string[];
+  defaultLandingPage?: string;
+}
+
+export interface MenuContext {
+  items: Menu[];
+  defaultLandingPage?: string;
+}
+
+export interface AppContextState {
+  user: CurrentUserContext;
+  tenant: TenantContext;
+  permissions: PermissionContext;
+  menu: MenuContext;
+}
\ No newline at end of file
diff --git a/src/app/core/services/auth/auth.service.ts b/src/app/core/services/auth/auth.service.ts
new file mode 100644
index 00000000..1b6c4338
--- /dev/null
+++ b/src/app/core/services/auth/auth.service.ts
@@ -0,0 +1,133 @@
+import { computed, Injectable, inject, signal } from '@angular/core';
+import { BehaviorSubject, Observable, catchError, finalize, map, shareReplay, throwError } from 'rxjs';
+import { HttpClient, HttpErrorResponse } from '@angular/common/http';
+import { LoginRequest, LoginResponse, UserProfile } from '../../models/auth/auth.model';
+import { TokenStorageService } from './token-storage.service';
+import { AppContextService } from '../../services/context/app-context.service';
+import { AUTH_ENDPOINTS } from '../../../core/end-points/auth/auth.endpoints';
+
+@Injectable({ providedIn: 'root' })
+export class AuthService {
+  private readonly http = inject(HttpClient);
+  private readonly tokenStorage = inject(TokenStorageService);
+  private readonly appContextService = inject(AppContextService);
+
+  private readonly userSubject = new BehaviorSubject<UserProfile | null>(null);
+  readonly user$ = this.userSubject.asObservable();
+  readonly currentUserSignal = signal<UserProfile | null>(null);
+  private readonly accessTokenSignal = signal<string | null>(null);
+  readonly isAuthenticatedSignal = computed(() => !!this.accessTokenSignal() && !!this.currentUserSignal());
+
+  private refreshRequest$: Observable<LoginResponse> | null = null;
+
+  constructor() {
+    this.restoreAuthState();
+  }
+
+  login(payload: LoginRequest, rememberMe: boolean): Observable<LoginResponse> {
+    return this.http.post<LoginResponse>(`${AUTH_ENDPOINTS.login}`, payload).pipe(
+      map((response) => {
+        const user = this.normalizeUserProfile(response);
+        this.tokenStorage.saveAuth(response, rememberMe);
+        this.setAuthState(user, this.tokenStorage.getAccessToken());
+        return response;
+      })
+    );
+  }
+
+  refreshAccessToken(): Observable<LoginResponse> {
+    if (this.refreshRequest$) {
+      return this.refreshRequest$;
+    }
+
+    const refreshToken = this.tokenStorage.getRefreshToken();
+    if (!refreshToken) {
+      this.logout();
+      return throwError(() => new HttpErrorResponse({ status: 401, statusText: 'Refresh token missing' }));
+    }
+
+    this.refreshRequest$ = this.http.post<LoginResponse>(`${AUTH_ENDPOINTS.refresh}`, { refreshToken }).pipe(
+      map((response) => {
+        const user = this.normalizeUserProfile(response, this.currentUserSignal());
+        const storageType = this.tokenStorage.getStorageType();
+        const rememberMe = storageType === 'local';
+        this.tokenStorage.saveAuth(response, rememberMe);
+        this.setAuthState(user, this.tokenStorage.getAccessToken());
+        return response;
+      }),
+      catchError((error) => {
+        this.logout();
+        return throwError(() => error);
+      }),
+      finalize(() => {
+        this.refreshRequest$ = null;
+      }),
+      shareReplay(1)
+    );
+
+    return this.refreshRequest$;
+  }
+
+  logout(): void {
+    this.tokenStorage.clearAuth();
+    this.appContextService.clearContext();
+    this.setAuthState(null, null);
+    this.refreshRequest$ = null;
+  }
+
+  get accessToken(): string | null {
+    return this.tokenStorage.getAccessToken();
+  }
+
+  get refreshToken(): string | null {
+    return this.tokenStorage.getRefreshToken();
+  }
+
+  get isAuthenticated(): boolean {
+    return this.isAuthenticatedSignal();
+  }
+
+  get isLoggedIn(): boolean {
+    return this.isAuthenticatedSignal();
+  }
+
+  get currentUser(): UserProfile | null {
+    return this.currentUserSignal();
+  }
+
+  private restoreAuthState(): void {
+    const storedUser = this.tokenStorage.getUser();
+    const storedAccessToken = this.tokenStorage.getAccessToken();
+
+    if (storedUser && storedAccessToken) {
+      this.setAuthState(storedUser, storedAccessToken);
+      return;
+    }
+
+    this.setAuthState(null, storedAccessToken ?? null);
+  }
+
+  private setAuthState(user: UserProfile | null, token: string | null): void {
+    this.userSubject.next(user);
+    this.currentUserSignal.set(user);
+    this.accessTokenSignal.set(token);
+  }
+
+  private normalizeUserProfile(response: LoginResponse, fallbackUser: UserProfile | null = null): UserProfile | null {
+    if (response.user) {
+      return response.user;
+    }
+
+    const userId = response.userId?.trim();
+    const email = response.email?.trim();
+    if (userId || email) {
+      return {
+        id: userId ?? fallbackUser?.id ?? '',
+        email: email ?? fallbackUser?.email ?? '',
+        roles: response.roles,
+      };
+    }
+
+    return fallbackUser;
+  }
+}
diff --git a/src/app/core/services/auth/session-timeout.service.ts b/src/app/core/services/auth/session-timeout.service.ts
new file mode 100644
index 00000000..1404257c
--- /dev/null
+++ b/src/app/core/services/auth/session-timeout.service.ts
@@ -0,0 +1,154 @@
+import { DOCUMENT } from '@angular/common';
+import { DestroyRef, effect, inject, Injectable, OnDestroy, signal } from '@angular/core';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { Router } from '@angular/router';
+import { merge, fromEvent, Subscription } from 'rxjs';
+import { throttleTime } from 'rxjs/operators';
+import { environment } from '../../../../environments/environment';
+import { AuthService } from '../auth/auth.service';
+
+@Injectable()
+export class SessionTimeoutService implements OnDestroy {
+  private readonly document = inject(DOCUMENT);
+  private readonly router = inject(Router);
+  private readonly authService = inject(AuthService);
+  private readonly destroyRef = inject(DestroyRef);
+
+  readonly showWarning = signal(false);
+  readonly remainingSeconds = signal(0);
+
+  private readonly warningAfterMs = environment.sessionTimeout?.warningAfterMs ?? 25 * 60 * 1000;
+  private readonly logoutAfterMs = environment.sessionTimeout?.logoutAfterMs ?? 30 * 60 * 1000;
+
+  private activitySubscription: Subscription | null = null;
+  private warningTimer: ReturnType<typeof setTimeout> | null = null;
+  private logoutTimer: ReturnType<typeof setTimeout> | null = null;
+  private countdownTimer: ReturnType<typeof setInterval> | null = null;
+  private logoutDeadline = 0;
+  private trackingEnabled = false;
+
+  constructor() {
+    effect(() => {
+      if (this.authService.currentUserSignal()) {
+        this.start();
+        return;
+      }
+
+      this.stop();
+    });
+  }
+
+  start(): void {
+    if (this.trackingEnabled) {
+      this.resetTimers();
+      return;
+    }
+
+    this.trackingEnabled = true;
+    this.bindActivityTracking();
+    this.resetTimers();
+  }
+
+  stop(): void {
+    this.trackingEnabled = false;
+    this.showWarning.set(false);
+    this.remainingSeconds.set(0);
+    this.clearTimers();
+    this.activitySubscription?.unsubscribe();
+    this.activitySubscription = null;
+  }
+
+  staySignedIn(): void {
+    if (!this.trackingEnabled) {
+      return;
+    }
+
+    this.resetTimers();
+  }
+
+  logoutNow(): void {
+    this.handleTimeoutLogout();
+  }
+
+  ngOnDestroy(): void {
+    this.stop();
+  }
+
+  private bindActivityTracking(): void {
+    if (this.activitySubscription) {
+      return;
+    }
+
+    this.activitySubscription = merge(
+      fromEvent(this.document, 'mousemove'),
+      fromEvent(this.document, 'keydown'),
+      fromEvent(this.document, 'click'),
+      fromEvent(window, 'scroll')
+    )
+      .pipe(throttleTime(1000), takeUntilDestroyed(this.destroyRef))
+      .subscribe(() => {
+        if (!this.trackingEnabled || !this.authService.currentUserSignal()) {
+          return;
+        }
+
+        this.resetTimers();
+      });
+  }
+
+  private resetTimers(): void {
+    if (!this.trackingEnabled) {
+      return;
+    }
+
+    this.clearTimers();
+    this.showWarning.set(false);
+    this.remainingSeconds.set(0);
+
+    const safeWarningDelay = Math.max(Math.min(this.warningAfterMs, this.logoutAfterMs), 0);
+    const safeLogoutDelay = Math.max(this.logoutAfterMs, 0);
+
+    this.warningTimer = setTimeout(() => {
+      this.showWarning.set(true);
+      this.logoutDeadline = Date.now() + Math.max(safeLogoutDelay - safeWarningDelay, 0);
+      this.updateRemainingSeconds();
+      this.countdownTimer = setInterval(() => {
+        this.updateRemainingSeconds();
+      }, 1000);
+    }, safeWarningDelay);
+
+    this.logoutTimer = setTimeout(() => {
+      this.handleTimeoutLogout();
+    }, safeLogoutDelay);
+  }
+
+  private updateRemainingSeconds(): void {
+    const remainingMs = Math.max(this.logoutDeadline - Date.now(), 0);
+    this.remainingSeconds.set(Math.ceil(remainingMs / 1000));
+  }
+
+  private handleTimeoutLogout(): void {
+    const returnUrl = this.router.url.startsWith('/auth') ? '/' : this.router.url;
+    this.stop();
+    this.authService.logout();
+    void this.router.navigate(['/auth/login'], {
+      queryParams: returnUrl && returnUrl !== '/' ? { returnUrl } : undefined,
+    });
+  }
+
+  private clearTimers(): void {
+    if (this.warningTimer) {
+      clearTimeout(this.warningTimer);
+      this.warningTimer = null;
+    }
+
+    if (this.logoutTimer) {
+      clearTimeout(this.logoutTimer);
+      this.logoutTimer = null;
+    }
+
+    if (this.countdownTimer) {
+      clearInterval(this.countdownTimer);
+      this.countdownTimer = null;
+    }
+  }
+}
diff --git a/src/app/core/services/auth/token-storage.service.ts b/src/app/core/services/auth/token-storage.service.ts
new file mode 100644
index 00000000..b62a6bec
--- /dev/null
+++ b/src/app/core/services/auth/token-storage.service.ts
@@ -0,0 +1,151 @@
+import { Injectable } from '@angular/core';
+import { LoginResponse, UserProfile } from '../../models/auth/auth.model';
+
+type StorageType = 'local' | 'session';
+
+@Injectable({ providedIn: 'root' })
+export class TokenStorageService {
+  private readonly accessTokenKey = 'master-admin-access-token';
+  private readonly refreshTokenKey = 'master-admin-refresh-token';
+  private readonly accessTokenExpiresOnKey = 'master-admin-access-token-expires-on';
+  private readonly refreshTokenExpiresOnKey = 'master-admin-refresh-token-expires-on';
+  private readonly userKey = 'master-admin-user';
+
+  saveAuth(response: LoginResponse, rememberMe: boolean): void {
+    this.clearAuth();
+    const selectedStorage = rememberMe ? localStorage : sessionStorage;
+
+    if (response.accessToken) {
+      selectedStorage.setItem(this.accessTokenKey, response.accessToken);
+    }
+
+    if (response.refreshToken) {
+      selectedStorage.setItem(this.refreshTokenKey, response.refreshToken);
+    }
+
+    if (response.accessTokenExpiresOn) {
+      selectedStorage.setItem(this.accessTokenExpiresOnKey, response.accessTokenExpiresOn);
+    }
+
+    if (response.refreshTokenExpiresOn) {
+      selectedStorage.setItem(this.refreshTokenExpiresOnKey, response.refreshTokenExpiresOn);
+    }
+
+    const user = this.buildUserProfile(response);
+    if (user) {
+      selectedStorage.setItem(this.userKey, JSON.stringify(user));
+    }
+  }
+
+  clearAuth(): void {
+    this.removeFromStorage(localStorage);
+    this.removeFromStorage(sessionStorage);
+  }
+
+  getAccessToken(): string | null {
+    return this.getByPriority(this.accessTokenKey);
+  }
+
+  getRefreshToken(): string | null {
+    return this.getByPriority(this.refreshTokenKey);
+  }
+
+  getAccessTokenExpiresOn(): string | null {
+    return this.getByPriority(this.accessTokenExpiresOnKey);
+  }
+
+  getRefreshTokenExpiresOn(): string | null {
+    return this.getByPriority(this.refreshTokenExpiresOnKey);
+  }
+
+  getUser(): UserProfile | null {
+    const raw = this.getByPriority(this.userKey);
+
+    if (!raw) {
+      return null;
+    }
+
+    try {
+      return JSON.parse(raw) as UserProfile;
+    } catch {
+      this.clearAuth();
+      return null;
+    }
+  }
+
+  getStorageType(): 'local' | 'session' | null {
+    if (this.hasAnyAuthKey(sessionStorage)) {
+      return 'session';
+    }
+
+    if (this.hasAnyAuthKey(localStorage)) {
+      return 'local';
+    }
+
+    return null;
+  }
+
+  isAccessTokenExpired(): boolean {
+    return this.isExpired(this.getAccessTokenExpiresOn());
+  }
+
+  isRefreshTokenExpired(): boolean {
+    return this.isExpired(this.getRefreshTokenExpiresOn());
+  }
+
+  private getByPriority(key: string): string | null {
+    const fromSession = sessionStorage.getItem(key);
+    if (fromSession !== null) {
+      return fromSession;
+    }
+
+    return localStorage.getItem(key);
+  }
+
+  private hasAnyAuthKey(storage: Storage): boolean {
+    return [
+      this.accessTokenKey,
+      this.refreshTokenKey,
+      this.accessTokenExpiresOnKey,
+      this.refreshTokenExpiresOnKey,
+      this.userKey,
+    ].some((key) => storage.getItem(key) !== null);
+  }
+
+  private removeFromStorage(storage: Storage): void {
+    storage.removeItem(this.accessTokenKey);
+    storage.removeItem(this.refreshTokenKey);
+    storage.removeItem(this.accessTokenExpiresOnKey);
+    storage.removeItem(this.refreshTokenExpiresOnKey);
+    storage.removeItem(this.userKey);
+  }
+
+  private isExpired(expiresOn: string | null): boolean {
+    if (!expiresOn) {
+      return true;
+    }
+
+    const parsedExpiry = Date.parse(expiresOn);
+
+    if (Number.isNaN(parsedExpiry)) {
+      return true;
+    }
+
+    return parsedExpiry <= Date.now();
+  }
+  private buildUserProfile(response: LoginResponse): UserProfile | null {
+    if (response.user) {
+      return response.user;
+    }
+
+    if (response.userId || response.email) {
+      return {
+        id: response.userId ?? '',
+        email: response.email ?? '',
+        roles: response.roles,
+      };
+    }
+
+    return null;
+  }
+}
diff --git a/src/app/core/services/common/app-state.service.ts b/src/app/core/services/common/app-state.service.ts
new file mode 100644
index 00000000..76d41601
--- /dev/null
+++ b/src/app/core/services/common/app-state.service.ts
@@ -0,0 +1,321 @@
+import { DOCUMENT, ElementRef, inject, Injectable, Renderer2 } from '@angular/core';
+import { BehaviorSubject } from 'rxjs';
+
+interface StateType {
+  direction: string;
+  theme: string;
+  navigationStyles: string,   // vertical, horizontal
+  menuStyles: string,                 // menu-click, menu-hover, icon-click, icon-hover
+  layoutStyles: string,   // double-menu, detached, icon-overlay, icontext-menu, closed-menu, default-menu
+  pageStyles: string,          // regular, classic, modern
+  widthStyles: string,       // fullwidth, boxed
+  menuPosition: string,          // fixed, scrollable
+  headerPosition: string,        // fixed, scrollable
+  menuColor: string,                  // light, dark, color, gradient, transparent
+  headerColor: string,                // light, dark, color, gradient, transparent
+  themePrimary: string,               // '58, 88, 146', '92, 144, 163', '161, 90, 223', '78, 172, 76', '223, 90, 90'
+  themeBackground: string,
+  backgroundImage: string,
+};
+@Injectable({
+  providedIn: 'root'
+})
+export class AppStateService {
+  private readonly localStorageKey = 'Ynex-ng'; // Customize this key
+  private initialState: StateType = {
+    theme: 'light',            // light, dark
+    direction: 'ltr',               // ltr, rtl
+    navigationStyles: 'vertical',   // vertical, horizontal
+    menuStyles: '',                 // menu-click, menu-hover, icon-click, icon-hover
+    layoutStyles: 'default',   // double-menu, detached, icon-overlay, icontext-menu, closed-menu, default-menu
+    pageStyles: 'regular',          // regular, classic, modern
+    widthStyles: 'fullwidth',       // fullwidth, boxed
+    menuPosition: 'fixed',          // fixed, scrollable
+    headerPosition: 'fixed',        // fixed, scrollable
+    menuColor: 'dark',                  // light, dark, color, gradient, transparent
+    headerColor: 'light',                // light, dark, color, gradient, transparent
+    themePrimary: '',          // '58, 88, 146', '92, 144, 163', '161, 90, 223', '78, 172, 76', '223, 90, 90'
+    themeBackground: '',
+    backgroundImage: '',         // bgimg1, bgimg2, bgimg3, bgimg4, bgimg5
+  } // Store initial state
+  private stateSubject = new BehaviorSubject<StateType>(this.initialState); // Use any for initial null value
+  state$ = this.stateSubject.asObservable();
+  private document = inject(DOCUMENT);
+  navigationStyles: any;
+  private html = this.document.documentElement;
+
+  constructor() {
+
+    const initialState: StateType = this.getInitialStateFromLocalStorage();
+    // this.initializeState();
+    this.stateSubject.next(initialState);
+
+  }
+
+  private getInitialStateFromLocalStorage(): StateType {
+    try {
+      const storedState = localStorage.getItem(this.localStorageKey);
+      if (storedState) {
+        return JSON.parse(storedState);
+      }
+    } catch (error) {
+      console.error('Error retrieving initial state from local storage:', error);
+    }
+    return this.initialState;
+  }
+
+
+
+
+  getupdateState() {
+    const currentState = this.stateSubject.getValue();
+    return currentState
+  }
+
+  updateState(newState?: Partial<any>) { // Use any for partial updates
+    const currentState = this.stateSubject.getValue(); // Get current state
+
+    if (!currentState) {
+
+      // Handle initial update case (no state emitted yet)
+      this.updateStateAndEmit(newState);
+      return;
+    }
+    if (newState) {
+
+      const updatedState = { ...currentState, ...newState }; // Merge updates
+      this.updateStateAndEmit(updatedState); // Update and emit combined state
+    } else {
+      this.updateStateAndEmit(currentState);
+
+      return;
+    }
+  }
+
+  private state: { [key: string]: any } = {};
+  getState(menuStyles: string): any {
+    return this.state[menuStyles];
+  }
+  private applyThemeBackgroundSpecificChanges(background: any) {
+
+    this.html?.style.setProperty('--color-bodybg', background.main);
+    this.html?.style.setProperty('--color-bodybg2', background.secondary);
+    this.html?.style.setProperty('--color-light', background.accent);
+    this.html?.style.setProperty('--color-formcontrolbg', `rgba(${background.accent})`);
+    this.html?.style.setProperty('--color-inputborder', background.overlay);
+    this.html?.style.setProperty('--color-gray3', background.primary);
+    this.applythemeSpecificChanges(background.theme);
+  }
+
+
+  private applyDirectionSpecificChanges(direction: string) {
+
+
+    this.html?.setAttribute('dir', direction);
+
+  }
+  private applythemeSpecificChanges(theme: string) {
+
+
+    this.html?.setAttribute('class', theme);  //setting theme style
+    this.html?.setAttribute('data-header-styles', theme); //setting header style
+
+
+
+
+
+  }
+
+
+
+  private applyNavigationStylesSpecificChanges(navigationStyles: string) {
+
+
+
+    this.html?.setAttribute('data-nav-layout', navigationStyles);
+    if (navigationStyles == 'horizontal') {
+      this.html?.setAttribute('data-nav-style', 'menu-click');
+      this.html?.removeAttribute('data-vertical-style');
+
+    }
+  }
+  private applyMenuStylesSpecificChanges(menuStyles: string) {
+
+
+
+    this.html?.setAttribute('data-nav-style', menuStyles);
+    this.html?.setAttribute('data-toggled', menuStyles + '-closed');
+    this.html?.removeAttribute('data-vertical-style');
+  }
+  private applyLayoutStylesSpecificChanges(layoutStyles: string) {
+
+    this.html?.setAttribute('data-vertical-style', layoutStyles);
+    this.html?.removeAttribute('data-nav-style');
+    switch (layoutStyles) {
+      case 'default':
+        this.html?.setAttribute('data-vertical-style', 'overlay');
+        this.html?.setAttribute('data-toggled', '');
+        break;
+      case 'closed':
+        this.html?.setAttribute('data-toggled', 'close-menu-close');
+        break;
+      case 'icontext':
+        this.html?.setAttribute('data-toggled', 'icon-text-close');
+        break;
+      case 'overlay':
+        this.html?.setAttribute('data-toggled', 'icon-overlay-close');
+        break;
+      case 'detached':
+        this.html?.setAttribute('data-toggled', 'detached-close');
+        break;
+      case 'doublemenu':
+        this.html?.setAttribute('data-toggled', 'double-menu-open');
+        break;
+    }
+    if (layoutStyles === 'icon-text') {
+      this.html?.setAttribute('icon-text', 'open');
+    } else {
+      // If not 'icon-text', remove the icon-text attribute
+      this.html?.removeAttribute('icon-text');
+    }
+  }
+  private applypageStylesSpecificChanges(pageStyles: string) {
+
+    this.html?.setAttribute('data-page-style', pageStyles);
+
+    const slideRight = document.querySelector('.slide-right') as HTMLElement | null;
+    if (slideRight) {
+      // If the element exists, toggle the 'd-none' class
+      if (slideRight.classList.contains('d-none')) {
+        slideRight.classList.remove('d-none');
+      } else {
+        slideRight.classList.add('d-none');
+      }
+    } else {
+      // If the element does not exist (is null), create a safe fallback by adding 'd-none'
+      const dummySlideRight = document.createElement('div');
+      dummySlideRight.classList.add('slide-right', 'd-none'); // Add classes to the new element
+      document.body.appendChild(dummySlideRight); // Append it to the DOM as a fallback
+    }
+  }
+  private applywidthStylesSpecificChanges(widthStyles: string) {
+
+    this.html?.setAttribute('data-width', widthStyles);
+  }
+  private applymenuPositionSpecificChanges(menuPosition: string) {
+
+    this.html?.setAttribute('data-menu-position', menuPosition);
+  }
+  private applyheaderPositionSpecificChanges(headerPosition: string) {
+
+    this.html?.setAttribute('data-header-position', headerPosition);
+  }
+  private applyheaderColorSpecificChanges(headerColor: string) {
+
+    this.html?.setAttribute('data-header-styles', headerColor);
+  }
+  private applymenuColorSpecificChanges(menuColor: string) {
+
+    this.html?.setAttribute('data-menu-styles', menuColor);
+  }
+  private applyPrimarySpecificChanges(primary: string) {
+
+    this.html?.style.setProperty('--color-primaryrgb', primary);
+    this.html?.style.setProperty('--color-primary', primary);
+  }
+  private applybackgroundImageSpecificChanges(backgroundImage: string) {
+
+    this.html?.setAttribute('bg-img', backgroundImage);
+  }
+
+
+
+
+  public applyReset() {
+
+    if (this.html) {
+      this.html?.style.removeProperty('--color-bodybg');
+      this.html?.style.removeProperty('--color-gray3');
+      this.html?.style.removeProperty('--color-bodybg2');
+      this.html?.style.removeProperty('--color-light');
+      this.html?.style.removeProperty('--color-formcontrolbg');
+      this.html?.style.removeProperty('--color-inputborder');
+      this.html?.style.removeProperty('--color-primary');
+      this.html?.style.removeProperty('--color-primaryrgb');
+
+    }
+    this.html?.removeAttribute('bg-img');
+    this.html?.setAttribute('data-vertical-style', 'overlay');
+    this.stateSubject.next(this.initialState);
+    this.updateStateAndEmit(this.initialState);
+    localStorage.clear();
+
+    if (window.innerWidth <= 992) {
+      this.html?.setAttribute('data-toggled', 'close');
+    }
+  }
+
+  private updateStateAndEmit(state: any) {
+    // Conditional logic based on direction changes
+
+    const currentState = this.stateSubject.getValue(); // Get current state
+    // Conditional logic based on theme changes
+    if (state['theme']) {
+
+      this.applythemeSpecificChanges(state['theme']);
+    }
+    if (state['direction']) {
+
+      this.applyDirectionSpecificChanges(state['direction']);
+    }
+    // Conditional logic based on theme changes
+    if (state['navigationStyles']) {
+      this.applyNavigationStylesSpecificChanges(state['navigationStyles']);
+    }
+    // Conditional logic based on theme changes
+    if (state['menuStyles'] && !state['layoutStyles']) {
+      this.applyMenuStylesSpecificChanges(state['menuStyles']);
+    }
+    if (state['layoutStyles'] && !state['menuStyles']) {
+      this.applyLayoutStylesSpecificChanges(state['layoutStyles']);
+    }
+    if (state['pageStyles']) {
+      this.applypageStylesSpecificChanges(state['pageStyles']);
+    }
+    if (state['widthStyles']) {
+      this.applywidthStylesSpecificChanges(state['widthStyles']);
+    }
+    if (state['menuPosition']) {
+      this.applymenuPositionSpecificChanges(state['menuPosition']);
+    }
+    if (state['headerPosition']) {
+      this.applyheaderPositionSpecificChanges(state['headerPosition']);
+    }
+    if (state['themePrimary']) {
+      this.applyPrimarySpecificChanges(state['themePrimary']);
+    }
+    if (state['themeBackground']) {
+      this.applyThemeBackgroundSpecificChanges(state['themeBackground']);
+    }
+    if (state['headerColor']) {
+      this.applyheaderColorSpecificChanges(state['headerColor']);
+    }
+    if (state['menuColor']) {
+      this.applymenuColorSpecificChanges(state['menuColor']);
+    }
+    if (state['backgroundImage']) {
+      this.applybackgroundImageSpecificChanges(state['backgroundImage']);
+    }
+
+    this.stateSubject.next(state);
+    this.updateLocalStorage(state);
+  }
+
+  private updateLocalStorage(state: any) {
+    try {
+      localStorage.setItem(this.localStorageKey, JSON.stringify(state));
+    } catch (error) {
+      console.error('Error saving state to local storage:', error);
+    }
+  }
+}
diff --git a/src/app/core/services/common/base-api.service.ts b/src/app/core/services/common/base-api.service.ts
new file mode 100644
index 00000000..44a35118
--- /dev/null
+++ b/src/app/core/services/common/base-api.service.ts
@@ -0,0 +1,33 @@
+import { HttpClient, HttpParams } from '@angular/common/http';
+import { Injectable, inject } from '@angular/core';
+import { Observable } from 'rxjs';
+import { API_CONFIG } from '../../config/api.config';
+
+@Injectable({ providedIn: 'root' })
+export class BaseApiService {
+  private readonly http = inject(HttpClient);
+
+  protected get<T>(resource: string, params?: Record<string, string | number | boolean>): Observable<T> {
+    let httpParams = new HttpParams();
+
+    if (params) {
+      Object.entries(params).forEach(([key, value]) => {
+        httpParams = httpParams.set(key, String(value));
+      });
+    }
+
+    return this.http.get<T>(`${API_CONFIG.baseUrl}${resource}`, { params: httpParams });
+  }
+
+  protected post<T, R = unknown>(resource: string, body: T): Observable<R> {
+    return this.http.post<R>(`${API_CONFIG.baseUrl}${resource}`, body);
+  }
+
+  protected put<T, R = unknown>(resource: string, body: T): Observable<R> {
+    return this.http.put<R>(`${API_CONFIG.baseUrl}${resource}`, body);
+  }
+
+  protected delete<R = unknown>(resource: string): Observable<R> {
+    return this.http.delete<R>(`${API_CONFIG.baseUrl}${resource}`);
+  }
+}
diff --git a/src/app/core/services/common/firebase.service.ts b/src/app/core/services/common/firebase.service.ts
new file mode 100644
index 00000000..74b07156
--- /dev/null
+++ b/src/app/core/services/common/firebase.service.ts
@@ -0,0 +1,27 @@
+import { Injectable } from '@angular/core';
+import { AngularFireModule } from '@angular/fire/compat';
+import { AngularFirestoreModule } from '@angular/fire/compat/firestore';
+import { AngularFireDatabaseModule } from '@angular/fire/compat/database';
+import { AngularFireAuthModule } from '@angular/fire/compat/auth';
+import { environment } from '../../../../environments/environment';
+
+@Injectable({
+  providedIn: 'root',
+})
+export class FirebaseService {
+  constructor() {
+    AngularFireModule.initializeApp(environment.firebase);
+  }
+
+  getFirestore() {
+    return AngularFirestoreModule;
+  }
+
+  getDatabase() {
+    return AngularFireDatabaseModule;
+  }
+
+  getAuth() {
+    return AngularFireAuthModule;
+  }
+}
diff --git a/src/app/core/services/common/loading.service.ts b/src/app/core/services/common/loading.service.ts
new file mode 100644
index 00000000..fa48c82e
--- /dev/null
+++ b/src/app/core/services/common/loading.service.ts
@@ -0,0 +1,24 @@
+import { Injectable, signal} from '@angular/core';
+
+@Injectable({
+  providedIn: 'root',
+})
+export class LoadingService {
+
+  private requestCount = 0;
+  readonly isLoading = signal(false);
+
+  show(): void {
+    this.requestCount++;
+    this.isLoading.set(true);
+  }
+
+  hide(): void {
+    this.requestCount--;
+
+    if (this.requestCount <= 0) {
+      this.requestCount = 0;
+      this.isLoading.set(false);
+    }
+  }
+}
diff --git a/src/app/core/services/common/menu.data.ts b/src/app/core/services/common/menu.data.ts
new file mode 100644
index 00000000..137a2564
--- /dev/null
+++ b/src/app/core/services/common/menu.data.ts
@@ -0,0 +1,91 @@
+import { MenuContext } from '../../models/context/context.model';
+
+export const SAAS_MENU_DATA: MenuContext = {
+  defaultLandingPage: '/dashboards/crm',
+  items: [
+    { headTitle: 'MAIN' },
+    {
+      title: 'Dashboards',
+      icon: '<i class="bx bx-home side-menu__icon"></i>',
+      type: 'sub',
+      active: false,
+      selected: false,
+      dirchange: false,
+      children: [
+        { path: '/dashboards/crm', title: 'CRM', type: 'link', dirchange: false },
+      ],
+    },
+    { headTitle: 'SAAS ADMIN' },
+    {
+      title: 'Management',
+      icon: '<i class="bx bx-buildings side-menu__icon"></i>',
+      type: 'sub',
+      active: false,
+      selected: false,
+      dirchange: false,
+      children: [
+        {
+          title: 'Global Master',
+          type: 'sub',
+          active: false,
+          selected: false,
+          dirchange: false,
+          children: [
+            { path: '/global-masters/currencies', title: 'Currency', type: 'link', dirchange: false },
+            { path: '/global-masters/languages', title: 'Language', type: 'link', dirchange: false },
+            { path: '/global-masters/timezones', title: 'Timezone', type: 'link', dirchange: false },
+            { path: '/global-masters/countries', title: 'Country', type: 'link', dirchange: false },
+            { path: '/global-masters/states', title: 'State', type: 'link', dirchange: false },
+            { path: '/global-masters/cities', title: 'City', type: 'link', dirchange: false },
+          ],
+        },
+        {
+          title: 'Tenant Master',
+          type: 'sub',
+          active: false,
+          selected: false,
+          dirchange: false,
+          children: [
+            { path: '/tenants', title: 'Tenants', type: 'link', dirchange: false },
+            { path: '/tenants/tenant-currencies', title: 'Tenant Currencies', type: 'link', dirchange: false }
+          ],
+        },
+        { path: '/users', title: 'Users', type: 'link', dirchange: false },
+        {
+          title: 'Configuration',
+          type: 'sub',
+          active: false,
+          selected: false,
+          dirchange: false,
+          children: [
+
+            { path: '/localization', title: 'Localization', type: 'link', dirchange: false },
+            {
+              title: 'Branding',
+              type: 'sub',
+              active: false,
+              selected: false,
+              dirchange: false,
+              children: [
+                { path: '/theming', title: 'Theming', type: 'link', dirchange: false },
+                { path: '/platform', title: 'Platform', type: 'link', dirchange: false },
+              ],
+            },
+          ],
+        },
+      ],
+    },
+    {
+      title: 'Operations',
+      icon: '<i class="bx bx-line-chart side-menu__icon"></i>',
+      type: 'sub',
+      active: false,
+      selected: false,
+      dirchange: false,
+      children: [
+        { path: '/billing', title: 'Billing', type: 'link', dirchange: false },
+        { path: '/monitoring', title: 'Monitoring', type: 'link', dirchange: false },
+      ],
+    },
+  ],
+};
diff --git a/src/app/core/services/common/menu.service.spec.ts b/src/app/core/services/common/menu.service.spec.ts
new file mode 100644
index 00000000..ec059a31
--- /dev/null
+++ b/src/app/core/services/common/menu.service.spec.ts
@@ -0,0 +1,74 @@
+import { provideHttpClient } from '@angular/common/http';
+import { TestBed } from '@angular/core/testing';
+import { provideRouter } from '@angular/router';
+import { firstValueFrom } from 'rxjs';
+import { AuthService } from '../auth/auth.service';
+import { TokenStorageService } from '../auth/token-storage.service';
+import { MenuService } from './menu.service';
+
+describe('MenuService dependency and authorization', () => {
+  let menuService: MenuService;
+  let tokenStorage: TokenStorageService;
+
+  beforeEach(() => {
+    localStorage.clear();
+    sessionStorage.clear();
+    TestBed.configureTestingModule({
+      providers: [provideHttpClient(), provideRouter([])],
+    });
+    menuService = TestBed.inject(MenuService);
+    tokenStorage = TestBed.inject(TokenStorageService);
+  });
+
+  afterEach(() => {
+    localStorage.clear();
+    sessionStorage.clear();
+  });
+
+  it('constructs MenuService and AuthService without a circular dependency', () => {
+    expect(menuService).toBeTruthy();
+    expect(TestBed.inject(AuthService)).toBeTruthy();
+  });
+
+  it('hides the Users menu when the stored user is not a super administrator', async () => {
+    tokenStorage.saveAuth(
+      { accessToken: 'token', user: { id: '1', email: 'user@example.com', roles: ['admin'] } },
+      false,
+    );
+
+    const context = await firstValueFrom(menuService.loadMenu());
+
+    expect(hasPath(context.items, '/users')).toBe(false);
+  });
+
+  it('shows the Users menu when the stored user is a super administrator', async () => {
+    tokenStorage.saveAuth(
+      {
+        accessToken: 'token',
+        user: { id: '1', email: 'super@example.com', roles: ['super_admin'] },
+      },
+      false,
+    );
+
+    const context = await firstValueFrom(menuService.loadMenu());
+
+    expect(hasPath(context.items, '/users')).toBe(true);
+  });
+
+  it('clears menu state during context cleanup', async () => {
+    await firstValueFrom(menuService.loadMenu());
+
+    menuService.clear();
+
+    expect(menuService.menuContext()).toBeNull();
+  });
+});
+
+function hasPath(items: ReturnType<MenuService['getNavigationMenu']>, path: string): boolean {
+  return items.some(
+    (item) =>
+      item.path === path ||
+      (item.children ? hasPath(item.children, path) : false) ||
+      (item.children2 ? hasPath(item.children2, path) : false),
+  );
+}
diff --git a/src/app/core/services/common/menu.service.ts b/src/app/core/services/common/menu.service.ts
new file mode 100644
index 00000000..50dc8eb6
--- /dev/null
+++ b/src/app/core/services/common/menu.service.ts
@@ -0,0 +1,56 @@
+import { Injectable, inject, signal } from '@angular/core';
+import { Observable, of, tap } from 'rxjs';
+import { MenuContext } from '../../models/context/context.model';
+import { SAAS_MENU_DATA } from './menu.data';
+import { Menu } from '../../../core/services/common/nav.service';
+import { TokenStorageService } from '../auth/token-storage.service';
+
+@Injectable({ providedIn: 'root' })
+export class MenuService {
+  private readonly tokenStorage = inject(TokenStorageService);
+  readonly menuContext = signal<MenuContext | null>(null);
+
+  loadMenu(): Observable<MenuContext> {
+    const context = this.cloneMenuContext(SAAS_MENU_DATA);
+    context.items = this.filterAuthorizedItems(context.items);
+    return of(context).pipe(
+      tap((menuContext) => {
+        this.menuContext.set(menuContext);
+      })
+    );
+  }
+
+  getNavigationMenu(): Menu[] {
+    return this.cloneMenuItems(this.menuContext()?.items ?? []);
+  }
+
+  getDefaultLandingPage(): string | null {
+    return this.menuContext()?.defaultLandingPage ?? null;
+  }
+
+  clear(): void {
+    this.menuContext.set(null);
+  }
+
+  private cloneMenuContext(context: MenuContext): MenuContext {
+    return {
+      defaultLandingPage: context.defaultLandingPage,
+      items: this.cloneMenuItems(context.items),
+    };
+  }
+
+  private cloneMenuItems(items: Menu[]): Menu[] {
+    return JSON.parse(JSON.stringify(items)) as Menu[];
+  }
+
+  private filterAuthorizedItems(items: Menu[]): Menu[] {
+    const isSuperAdmin = (this.tokenStorage.getUser()?.roles ?? []).includes('super_admin');
+    return items
+      .filter(item => isSuperAdmin || item.path !== '/users')
+      .map(item => ({
+        ...item,
+        children: item.children ? this.filterAuthorizedItems(item.children) : item.children,
+        children2: item.children2 ? this.filterAuthorizedItems(item.children2) : item.children2
+      }));
+  }
+}
diff --git a/src/app/core/services/common/nav.service.ts b/src/app/core/services/common/nav.service.ts
new file mode 100644
index 00000000..450e2863
--- /dev/null
+++ b/src/app/core/services/common/nav.service.ts
@@ -0,0 +1,102 @@
+import { Injectable, OnDestroy } from '@angular/core';
+import { Subject, BehaviorSubject, fromEvent } from 'rxjs';
+import { takeUntil, debounceTime } from 'rxjs/operators';
+import { Router } from '@angular/router';
+// Menu
+export interface Menu {
+  headTitle?: string;
+  headTitle2?: string;
+  path?: string;
+  title?: string;
+  icon?: string;
+  type?: string;
+  badgeValue?: string;
+  badgeClass?: string;
+  badgeText?: string;
+  active?: boolean;
+  selected?: boolean;
+  bookmark?: boolean;
+  children?: Menu[];
+  children2?: Menu[];
+  Menusub?: boolean;
+  target?: boolean;
+  menutype?: string,
+  dirchange?: boolean,
+  nochild?: any
+
+}
+
+@Injectable({
+  providedIn: 'root',
+})
+export class NavService implements OnDestroy {
+  private unsubscriber: Subject<any> = new Subject();
+  public screenWidth: BehaviorSubject<number> = new BehaviorSubject(
+    window.innerWidth
+  );
+
+  // Search Box
+  public search = false;
+
+  // Language
+  public language = false;
+
+  // Mega Menu
+  public megaMenu = false;
+  public levelMenu = false;
+  public megaMenuColapse: boolean = window.innerWidth < 1199 ? true : false;
+
+  // Collapse Sidebar
+  public collapseSidebar: boolean = window.innerWidth < 991 ? true : false;
+
+  // For Horizontal Layout Mobile
+  public horizontal: boolean = window.innerWidth < 991 ? false : true;
+
+  // Full screen
+  public fullScreen = false;
+  active: any;
+
+  constructor(private router: Router) {
+    this.setScreenWidth(window.innerWidth);
+    fromEvent(window, 'resize')
+      .pipe(debounceTime(1000), takeUntil(this.unsubscriber))
+      .subscribe((evt: any) => {
+        this.setScreenWidth(evt.target.innerWidth);
+        if (evt.target.innerWidth < 991) {
+          this.collapseSidebar = true;
+          this.megaMenu = false;
+          this.levelMenu = false;
+        }
+        if (evt.target.innerWidth < 1199) {
+          this.megaMenuColapse = true;
+        }
+      });
+    if (window.innerWidth < 991) {
+      // Detect Route change sidebar close
+      this.router.events.subscribe((event) => {
+        this.collapseSidebar = true;
+        this.megaMenu = false;
+        this.levelMenu = false;
+      });
+    }
+  }
+
+  ngOnDestroy() {
+    this.unsubscriber.next;
+    this.unsubscriber.complete();
+  }
+
+  private setScreenWidth(width: number): void {
+    this.screenWidth.next(width);
+  }
+
+  items = new BehaviorSubject<Menu[]>([]);
+
+  setMenuItems(menuItems: Menu[]): void {
+    this.items.next(menuItems);
+  }
+
+  clearMenuItems(): void {
+    this.items.next([]);
+  }
+}
diff --git a/src/app/core/services/common/permission.service.ts b/src/app/core/services/common/permission.service.ts
new file mode 100644
index 00000000..938c2da0
--- /dev/null
+++ b/src/app/core/services/common/permission.service.ts
@@ -0,0 +1,33 @@
+import { HttpClient } from '@angular/common/http';
+import { Injectable, inject, signal } from '@angular/core';
+import { map, Observable, tap } from 'rxjs';
+import { PermissionContext } from '../../models/context/context.model';
+
+interface PermissionResponse {
+  roles?: string[];
+  permissions?: string[];
+  defaultLandingPage?: string;
+}
+
+@Injectable({ providedIn: 'root' })
+export class PermissionService {
+  private readonly http = inject(HttpClient);
+  readonly permissionContext = signal<PermissionContext | null>(null);
+
+  loadPermissions(): Observable<PermissionContext> {
+    return this.http.get<PermissionResponse>(``).pipe(
+      map((response) => ({
+        roles: response.roles ?? [],
+        permissions: response.permissions ?? [],
+        defaultLandingPage: response.defaultLandingPage?.trim() || undefined,
+      })),
+      tap((context) => {
+        this.permissionContext.set(context);
+      })
+    );
+  }
+
+  clear(): void {
+    this.permissionContext.set(null);
+  }
+}
\ No newline at end of file
diff --git a/src/app/core/services/context/app-context.service.ts b/src/app/core/services/context/app-context.service.ts
new file mode 100644
index 00000000..7ad0b124
--- /dev/null
+++ b/src/app/core/services/context/app-context.service.ts
@@ -0,0 +1,104 @@
+import { Injectable, inject } from '@angular/core';
+import { finalize, forkJoin, Observable, of, shareReplay, tap } from 'rxjs';
+import { AppContextState, MenuContext } from '../../models/context/context.model';
+import { MenuService } from '../common/menu.service';
+import { PermissionService } from '../common/permission.service';
+import { TenantContextService } from './tenant-context.service';
+import { UserContextService } from './user-context.service';
+import { NavService } from '../common/nav.service';
+
+@Injectable({ providedIn: 'root' })
+export class AppContextService {
+  private readonly userContextService = inject(UserContextService);
+  private readonly tenantContextService = inject(TenantContextService);
+  private readonly permissionService = inject(PermissionService);
+  private readonly menuService = inject(MenuService);
+  private readonly navService = inject(NavService);
+
+  private loadRequest$: Observable<AppContextState> | null = null;
+  private menuLoadRequest$: Observable<MenuContext> | null = null;
+  private loaded = false;
+
+  ensureMenuInitialized(forceReload = false): Observable<MenuContext> {
+    const currentMenu = this.menuService.menuContext();
+    if (currentMenu && !forceReload) {
+      this.navService.setMenuItems(this.menuService.getNavigationMenu());
+      return of(currentMenu);
+    }
+
+    if (this.menuLoadRequest$ && !forceReload) {
+      return this.menuLoadRequest$;
+    }
+
+    this.menuLoadRequest$ = this.menuService.loadMenu().pipe(
+      tap(() => {
+        this.navService.setMenuItems(this.menuService.getNavigationMenu());
+      }),
+      finalize(() => {
+        this.menuLoadRequest$ = null;
+      }),
+      shareReplay(1)
+    );
+
+    return this.menuLoadRequest$;
+  }
+
+  loadAppContext(forceReload = false): Observable<AppContextState> {
+    if (this.loaded && !forceReload) {
+      return of(this.getCurrentState());
+    }
+
+    if (this.loadRequest$ && !forceReload) {
+      return this.loadRequest$;
+    }
+
+    this.loadRequest$ = forkJoin({
+      user: this.userContextService.loadCurrentUserProfile(),
+      tenant: this.tenantContextService.loadTenantContext(),
+      permissions: this.permissionService.loadPermissions(),
+      menu: this.menuService.loadMenu(),
+    }).pipe(
+      tap((context) => {
+        this.navService.setMenuItems(this.menuService.getNavigationMenu());
+        this.loaded = true;
+      }),
+      finalize(() => {
+        this.loadRequest$ = null;
+      }),
+      shareReplay(1)
+    );
+
+    return this.loadRequest$;
+  }
+
+  ensureContextLoaded(): Observable<AppContextState> {
+    return this.loadAppContext();
+  }
+
+  clearContext(): void {
+    this.userContextService.clear();
+    this.tenantContextService.clear();
+    this.permissionService.clear();
+    this.menuService.clear();
+    this.navService.clearMenuItems();
+    this.loaded = false;
+    this.loadRequest$ = null;
+  }
+
+  getDefaultLandingPage(): string {
+    return this.userContextService.currentUserContext()?.defaultLandingPage
+      ?? this.permissionService.permissionContext()?.defaultLandingPage
+      ?? this.tenantContextService.tenantContext()?.defaultLandingPage
+      ?? this.menuService.getDefaultLandingPage()
+      ?? '/dashboards/crm';
+  }
+
+  private getCurrentState(): AppContextState {
+    return {
+      user: this.userContextService.currentUserContext() ?? { id: '', email: '', roles: [] },
+      tenant: this.tenantContextService.tenantContext() ?? {},
+      permissions: this.permissionService.permissionContext() ?? { roles: [], permissions: [] },
+      menu: this.menuService.menuContext() ?? { items: [] },
+    };
+  }
+}
\ No newline at end of file
diff --git a/src/app/core/services/context/tenant-context.service.ts b/src/app/core/services/context/tenant-context.service.ts
new file mode 100644
index 00000000..da6ba416
--- /dev/null
+++ b/src/app/core/services/context/tenant-context.service.ts
@@ -0,0 +1,22 @@
+import { HttpClient } from '@angular/common/http';
+import { Injectable, inject, signal } from '@angular/core';
+import { Observable, tap } from 'rxjs';
+import { TenantContext } from '../../models/context/context.model';
+
+@Injectable({ providedIn: 'root' })
+export class TenantContextService {
+  private readonly http = inject(HttpClient);
+  readonly tenantContext = signal<TenantContext | null>(null);
+
+  loadTenantContext(): Observable<TenantContext> {
+    return this.http.get<TenantContext>(``).pipe(
+      tap((context) => {
+        this.tenantContext.set(context);
+      })
+    );
+  }
+
+  clear(): void {
+    this.tenantContext.set(null);
+  }
+}
\ No newline at end of file
diff --git a/src/app/core/services/context/user-context.service.ts b/src/app/core/services/context/user-context.service.ts
new file mode 100644
index 00000000..9c202794
--- /dev/null
+++ b/src/app/core/services/context/user-context.service.ts
@@ -0,0 +1,31 @@
+import { HttpClient } from '@angular/common/http';
+import { Injectable, inject, signal } from '@angular/core';
+import { map, Observable, tap } from 'rxjs';
+import { CurrentUserContext } from '../../models/context/context.model';
+
+@Injectable({ providedIn: 'root' })
+export class UserContextService {
+  private readonly http = inject(HttpClient);
+  readonly currentUserContext = signal<CurrentUserContext | null>(null);
+
+  loadCurrentUserProfile(): Observable<CurrentUserContext> {
+    return this.http.get<Partial<CurrentUserContext>>(``).pipe(
+      map((response) => ({
+        id: response.id?.trim() ?? '',
+        email: response.email?.trim() ?? '',
+        displayName: response.displayName?.trim() || undefined,
+        fullName: response.fullName?.trim() || undefined,
+        tenantId: response.tenantId?.trim() || undefined,
+        roles: response.roles ?? [],
+        defaultLandingPage: response.defaultLandingPage?.trim() || undefined,
+      })),
+      tap((profile) => {
+        this.currentUserContext.set(profile);
+      })
+    );
+  }
+
+  clear(): void {
+    this.currentUserContext.set(null);
+  }
+}
\ No newline at end of file
diff --git a/src/app/features/authentication/authentication.routes.ts b/src/app/features/authentication/authentication.routes.ts
new file mode 100644
index 00000000..54cb8c98
--- /dev/null
+++ b/src/app/features/authentication/authentication.routes.ts
@@ -0,0 +1,19 @@
+import { Routes } from '@angular/router';
+import { guestGuard } from '../../core/guards/auth/guest.guard';
+
+export const authen: Routes = [
+  {
+    path: 'login',
+    canActivate: [guestGuard],
+    loadComponent: () => import('./pages/login/login').then((m) => m.Login),
+  },
+  {
+    path: '',
+    children: [
+      {
+        path: '',
+        loadChildren: () => import('../errors/error.routes').then((m) => m.errorRoutingModule),
+      },
+    ],
+  },
+];
diff --git a/src/app/features/authentication/pages/login/login.html b/src/app/features/authentication/pages/login/login.html
new file mode 100644
index 00000000..88695cd8
--- /dev/null
+++ b/src/app/features/authentication/pages/login/login.html
@@ -0,0 +1,85 @@
+<div
+    class="grid grid-cols-12 h-screen min-h-screen overflow-hidden bg-bodybg dark:bg-bodybg text-defaulttextcolor text-defaultsize">
+    <div class="hidden xl:block xl:col-span-6 h-screen"> <img src="./assets/images/authentication/auth-cover.png"
+            class="w-full h-full object-cover object-left" alt="login cover" /> </div>
+    <div class="xl:col-span-6 col-span-12 min-h-[100dvh] flex items-center justify-center px-6 bg-bodybg dark:bg-bodybg">
+  <div class="authentication authentication-basic w-full max-w-[420px]">
+
+    <div class="my-[2.5rem] flex justify-center">
+        <img src="./assets/images/brand-logos/erp-logo-icon.png" alt="logo" class="desktop-logo">
+        <img src="./assets/images/brand-logos/erp-logo-icon.png" alt="logo" class="desktop-dark">
+      
+    </div>
+
+            <div class="box !mb-0">
+                <div class="box-body !p-[3rem]">
+                    <p class="h5 font-semibold mb-2 text-center">Sign In</p>
+                    <p class="mb-4 text-[#8c9097] dark:text-white/50 opacity-[0.7] font-normal text-center">
+                        Welcome back !
+                    </p>
+
+                    <form [formGroup]="adminLoginForm" (ngSubmit)="login()">
+                        @if (loginError) {
+                        <div class="text-danger mb-3">{{ loginError }}</div>
+                        }
+
+                        <div class="grid grid-cols-12 gap-y-4">
+                            <div class="xl:col-span-12 col-span-12">
+                                <label for="signin-username" class="form-label text-default">User Name</label>
+                                <input type="text" class="form-control form-control-lg w-full !rounded-md"
+                                    id="signin-username" placeholder="user name" formControlName="username"
+                                    autocomplete="username">
+                            </div>
+
+                            <div class="xl:col-span-12 col-span-12 mb-2">
+                                <label for="signin-password" class="form-label text-default block">Password</label>
+
+                                <a routerLink="/authentication/reset-password/basic"
+                                    class="ltr:float-right rtl:float-left text-danger">
+                                    Forgot password ?
+                                </a>
+
+                                <div class="input-group">
+                                    <input class="form-control form-control-lg !rounded-s-md" id="signin-password"
+                                        placeholder="password" formControlName="password"
+                                        autocomplete="current-password"
+                                        [type]="visibilityMap['Angular'] ? 'text' : 'password'">
+
+                                    <button aria-label="button" class="ti-btn ti-btn-light !rounded-s-none !mb-0"
+                                        type="button" (click)="toggleVisibility('Angular')" id="button-addon2">
+                                        <i class="{{ iconMap['Angular'] }} align-middle"></i>
+                                    </button>
+                                </div>
+
+                                <div class="mt-5">
+                                    <div class="form-check !ps-0">
+                                        <input class="form-check-input" type="checkbox" id="defaultCheck1"
+                                            formControlName="rememberMe">
+
+                                        <label class="form-check-label text-[#8c9097] dark:text-white/50 font-normal"
+                                            for="defaultCheck1">
+                                            Remember password ?
+                                        </label>
+                                    </div>
+                                </div>
+                            </div>
+
+                            <div class="xl:col-span-12 col-span-12 grid mt-2">
+                                <button type="submit" [disabled]="adminLoginForm.invalid || isSubmitting"
+                                    class="ti-btn ti-btn-primary !bg-primary !text-white !font-medium inline-flex items-center justify-center gap-2">
+
+                                    <span [style.display]="isSubmitting ? '' : 'none'" class="ti-spinner text-white"
+                                        role="status" aria-label="loading"></span>
+                                    <span [style.display]="isSubmitting ? '' : 'none'">Signing In...</span>
+                                    <span [style.display]="isSubmitting ? 'none' : ''">Sign In</span>
+                                </button>
+                            </div>
+                        </div>
+                    </form>
+
+                </div>
+            </div>
+
+        </div>
+    </div>
+</div>
diff --git a/src/app/authentication/login/login.scss b/src/app/features/authentication/pages/login/login.scss
similarity index 97%
rename from src/app/authentication/login/login.scss
rename to src/app/features/authentication/pages/login/login.scss
index 11e53b4c..263aee1c 100644
--- a/src/app/authentication/login/login.scss
+++ b/src/app/features/authentication/pages/login/login.scss
@@ -12,4 +12,4 @@
                 margin: auto;
                 border-radius: 0.75rem;
             }           
-    }
\ No newline at end of file
+    }
diff --git a/src/app/authentication/login/login.ts b/src/app/features/authentication/pages/login/login.ts
similarity index 72%
rename from src/app/authentication/login/login.ts
rename to src/app/features/authentication/pages/login/login.ts
index 9f8681c4..74b11327 100644
--- a/src/app/authentication/login/login.ts
+++ b/src/app/features/authentication/pages/login/login.ts
@@ -1,11 +1,11 @@
-import { Component, inject } from '@angular/core';
+import { ChangeDetectorRef, Component, inject } from '@angular/core';
 import { FormBuilder, Validators } from '@angular/forms';
 import { ActivatedRoute, Router, RouterModule } from '@angular/router';
-import { AuthService } from '../../core/auth/auth.service';
+import { AuthService } from '../../../../core/services/auth/auth.service';
 import { ReactiveFormsModule } from '@angular/forms';
 import { ToastrService } from 'ngx-toastr';
-import { finalize, switchMap, tap } from 'rxjs';
-import { AppContextService } from '../../core/services/app-context.service';
+import { catchError, finalize, of, switchMap, tap } from 'rxjs';
+import { AppContextService } from '../../../../core/services/context/app-context.service';
 
 @Component({
   selector: 'app-login',
@@ -17,6 +17,7 @@ import { AppContextService } from '../../core/services/app-context.service';
 })
 export class Login {
   private readonly formBuilder = inject(FormBuilder);
+  private readonly cdr = inject(ChangeDetectorRef);
   private readonly fallbackRoute = '/dashboards/crm';
 
   public readonly adminLoginForm = this.formBuilder.nonNullable.group({
@@ -39,7 +40,7 @@ export class Login {
     private route: ActivatedRoute,
     private router: Router,
     private toastr: ToastrService
-  ) {}
+  ) { }
 
   login() {
     this.loginError = '';
@@ -49,40 +50,47 @@ export class Login {
       return;
     }
 
-    // if login is already in progress, prevent multiple submissions
     if (this.isSubmitting) {
       return;
     }
 
     this.isSubmitting = true;
-    let loginSucceeded = false;
 
     const { username, password, rememberMe } = this.adminLoginForm.getRawValue();
 
     this.authservice.login({ email: username, password }, !!rememberMe)
       .pipe(
-        tap(() => {
-          loginSucceeded = true;
-        }),
-        switchMap(() => this.appContextService.ensureMenuInitialized(true)),
+        switchMap(() =>
+          this.appContextService.ensureMenuInitialized(true).pipe(
+            catchError(() => {
+              this.authservice.logout();
+              this.loginError = 'Unable to load application context.';
+              return of(null);
+            })
+          )
+        ),
         finalize(() => {
           this.isSubmitting = false;
+          this.cdr.detectChanges();
         })
       )
       .subscribe({
         next: () => {
+          if (this.loginError) {
+            this.toastr.error(this.loginError);
+            return;
+          }
+
           void this.router.navigateByUrl(this.getSafeReturnUrl());
           this.toastr.success('Login successful', username);
         },
         error: (error) => {
-          if (loginSucceeded) {
-            this.authservice.logout();
-            this.loginError = 'Unable to load application context.';
-          } else {
-            this.loginError = error?.error?.detail || 'Invalid details';
-          }
+          this.loginError =
+            error?.error?.detail ||
+            error?.error?.message ||
+            'Invalid email or password';
 
-          this.toastr.error(this.loginError, username);
+          this.toastr.error(this.loginError);
         }
       });
   }
diff --git a/src/app/features/dashboards/crm/crm.html b/src/app/features/dashboards/crm/crm.html
new file mode 100644
index 00000000..55adc727
--- /dev/null
+++ b/src/app/features/dashboards/crm/crm.html
@@ -0,0 +1,529 @@
+<div class="md:flex block items-center justify-between my-[1.5rem] page-header-breadcrumb">
+  <div>
+    <p class="font-semibold text-[1.125rem] text-defaulttextcolor dark:text-defaulttextcolor/70 !mb-0 ">Welcome back,
+      Json Taylor !</p>
+    <p class="font-normal text-[#8c9097] dark:text-white/50 text-[0.813rem]">Track your sales activity, leads and deals
+      here.</p>
+  </div>
+  <div class="btn-list md:mt-0 mt-2">
+    <button type="button"
+      class="ti-btn bg-primary text-white btn-wave !font-medium !me-[0.375rem] !ms-0 !text-[0.85rem] !rounded-[0.35rem] !py-[0.51rem] !px-[0.86rem] shadow-none">
+      <i class="ri-filter-3-fill  inline-block"></i>Filters
+    </button>
+    <button type="button"
+      class="ti-btn ti-btn-outline-secondary btn-wave !font-medium  !me-[0.375rem]  !ms-0 !text-[0.85rem] !rounded-[0.35rem] !py-[0.51rem] !px-[0.86rem] shadow-none">
+      <i class="ri-upload-cloud-line  inline-block"></i>Export
+    </button>
+  </div>
+</div>
+
+<div class="grid grid-cols-12 gap-x-6">
+  <div class="2xl:col-span-9 xl:col-span-12  col-span-12">
+    <div class="grid grid-cols-12 gap-x-6">
+      <div class="2xl:col-span-4 xl:col-span-4  col-span-12">
+        <div class="2xl:col-span-12 xl:col-span-12 col-span-12">
+          <div class="box crm-highlight-card">
+            <div class="box-body">
+              <div class="flex items-center justify-between">
+                <div>
+                  <div class="font-semibold text-[1.125rem] text-white mb-2">Your target is incomplete</div>
+                  <span class="block text-[0.75rem] text-white"><span class="opacity-[0.7]">You have
+                      completed</span>
+                    <span class="font-semibold text-warning"> 48%</span> <span class="opacity-[0.7]"> of the given
+                      target, you can also check your status</span>.</span>
+                  <span class="block font-semibold mt-[0.125rem]"><a class="text-white text-[0.813rem]"
+                      href="javascript:void(0);"><u>Click
+                        here</u></a></span>
+                </div>
+                <div>
+                  <spk-apexcharts id="crm-main" [chartOptions]="YourtargetisincompleteChart" />
+
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div class="2xl:col-span-12 xl:col-span-12 col-span-12">
+          <div class="box">
+            <div class="box-header flex justify-between">
+              <div class="box-title">
+                Top Deals
+              </div>
+              <div class="hs-dropdown ti-dropdown">
+                <a aria-label="anchor" href="javascript:void(0);"
+                  class="flex items-center justify-center w-[1.75rem] h-[1.75rem]  !text-[0.8rem] !py-1 !px-2 rounded-sm bg-light border-light shadow-none !font-medium"
+                  aria-expanded="false">
+                  <i class="fe fe-more-vertical text-[0.8rem]"></i>
+                </a>
+                <ul class="hs-dropdown-menu ti-dropdown-menu hidden">
+                  <li><a class="ti-dropdown-item !py-2 !px-[0.9375rem] !text-[0.8125rem] !font-medium block"
+                      href="javascript:void(0);">Week</a></li>
+                  <li><a class="ti-dropdown-item !py-2 !px-[0.9375rem] !text-[0.8125rem] !font-medium block"
+                      href="javascript:void(0);">Month</a></li>
+                  <li><a class="ti-dropdown-item !py-2 !px-[0.9375rem] !text-[0.8125rem] !font-medium block"
+                      href="javascript:void(0);">Year</a></li>
+                </ul>
+              </div>
+            </div>
+            <div class="box-body">
+              <ul class="list-none crm-top-deals mb-0">
+                @for (deal of topDeals; track $index) {
+                <li [class]="!$last ?'mb-[0.9rem]':''">
+                  <div class="flex items-start flex-wrap">
+
+                    <div class="me-2">
+                      <span class="inline-flex items-center justify-center">
+                        @if (deal.avatarImg) {
+                        <img [src]="deal.avatarImg" [alt]="deal.name"
+                          class="w-[1.75rem] h-[1.75rem] leading-[1.75rem] rounded-full">
+                        } @else {
+                        <span
+                          [class]="`inline-flex items-center justify-center !w-[1.75rem] !h-[1.75rem] leading-[1.75rem] text-[0.65rem] rounded-full font-semibold bg-${deal.color}/10 text-${deal.color}`">
+                          {{ deal.initials }}
+                        </span>
+                        }
+                      </span>
+                    </div>
+
+                    <div class="flex-grow">
+                      <p class="font-semibold mb-[1.4px] text-[0.813rem]">
+                        {{ deal.name }}
+                      </p>
+                      <p class="text-[#8c9097] dark:text-white/50 text-[0.75rem]">
+                        {{ deal.email }}
+                      </p>
+                    </div>
+
+                    <div class="font-semibold text-[0.9375rem]">
+                      {{ deal.amount }}
+                    </div>
+
+                  </div>
+                </li>
+                }
+
+              </ul>
+            </div>
+          </div>
+        </div>
+        <div class="2xl:col-span-12 xl:col-span-12 col-span-12">
+          <div class="box">
+            <div class="box-header justify-between">
+              <div class="box-title">Profit Earned</div>
+              <div class="hs-dropdown ti-dropdown">
+                <a href="javascript:void(0);" class="px-2 font-normal text-[0.75rem] text-[#8c9097] dark:text-white/50"
+                  aria-expanded="false">
+                  View All<i class="ri-arrow-down-s-line align-middle ms-1 inline-block"></i>
+                </a>
+                <ul class="hs-dropdown-menu ti-dropdown-menu hidden" role="menu">
+                  <li><a class="ti-dropdown-item !py-2 !px-[0.9375rem] !text-[0.8125rem] !font-medium block"
+                      href="javascript:void(0);">Today</a></li>
+                  <li><a class="ti-dropdown-item !py-2 !px-[0.9375rem] !text-[0.8125rem] !font-medium block"
+                      href="javascript:void(0);">This Week</a></li>
+                  <li><a class="ti-dropdown-item !py-2 !px-[0.9375rem] !text-[0.8125rem] !font-medium block"
+                      href="javascript:void(0);">Last Week</a></li>
+                </ul>
+              </div>
+            </div>
+            <div class="box-body !py-0 !ps-0">
+              <spk-apexcharts [chartOptions]="profitEarnedChart" id="crm-profits-earned" />
+
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="2xl:col-span-8  xl:col-span-8  col-span-12">
+        <div class="grid grid-cols-12 gap-x-6">
+          @for (item of crmCards; track $index) {
+          <div class="2xl:col-span-6 xl:col-span-6 col-span-12">
+            <div class="box overflow-hidden">
+              <div class="box-body">
+                <div class="flex items-top justify-between">
+                  <div>
+                    <span
+                      [class]="`!text-[0.8rem]  !w-[2.5rem] !h-[2.5rem] !leading-[2.5rem] !rounded-full inline-flex items-center justify-center bg-${item.color}`">
+                      <i [class]="`${item.icon} text-[1rem] text-white`"></i>
+                    </span>
+                  </div>
+                  <div class="flex-grow ms-4">
+                    <div class="flex items-center justify-between flex-wrap">
+                      <div>
+                        <p class="text-[#8c9097] dark:text-white/50 text-[0.813rem] mb-0">{{item.title}}</p>
+                        <h4 class="font-semibold  text-[1.5rem] !mb-2 ">{{item.number}}</h4>
+                      </div>
+                      <spk-apexcharts [id]="item.chartId" [chartOptions]="item.chartoptions" />
+                    </div>
+                    <div class="flex items-center justify-between !mt-1">
+                      <div>
+                        <a [class]="`text-${item.color} text-[0.813rem]`" href="javascript:void(0);">View All<i
+                            class="ti ti-arrow-narrow-right ms-2 font-semibold inline-block"></i></a>
+                      </div>
+                      <div class="text-end">
+                        <p [class]="`mb-0 ${item.percentageColor} text-[0.813rem] font-semibold`">{{item.percentage}}
+                        </p>
+                        <p class="text-[#8c9097] dark:text-white/50 opacity-[0.7] text-[0.6875rem]">this month</p>
+                      </div>
+                    </div>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+          }
+
+          <div class="2xl:col-span-12 xl:col-span-12 col-span-12">
+            <div class="box">
+              <div class="box-header !gap-0 !m-0 justify-between">
+                <div class="box-title">
+                  Revenue Analytics
+                </div>
+                <div class="hs-dropdown ti-dropdown">
+                  <a href="javascript:void(0);"
+                    class="text-[0.75rem] px-2 font-normal text-[#8c9097] dark:text-white/50" aria-expanded="false">
+                    View All<i class="ri-arrow-down-s-line align-middle ms-1 inline-block"></i>
+                  </a>
+                  <ul class="hs-dropdown-menu ti-dropdown-menu hidden" role="menu">
+                    <li><a class="ti-dropdown-item !py-2 !px-[0.9375rem] !text-[0.8125rem] !font-medium block"
+                        href="javascript:void(0);">Today</a></li>
+                    <li><a class="ti-dropdown-item !py-2 !px-[0.9375rem] !text-[0.8125rem] !font-medium block"
+                        href="javascript:void(0);">This Week</a></li>
+                    <li><a class="ti-dropdown-item !py-2 !px-[0.9375rem] !text-[0.8125rem] !font-medium block"
+                        href="javascript:void(0);">Last Week</a></li>
+                  </ul>
+                </div>
+              </div>
+              <div class="box-body !py-5">
+                <spk-apexcharts [id]="'crm-revenue-analytics'" [chartOptions]="RevenueAnalytics" />
+
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="2xl:col-span-12 xl:col-span-12 col-span-12">
+        <div class="box custom-card">
+          <div class="box-header justify-between">
+            <div class="box-title">
+              Deals Statistics
+            </div>
+            <div class="flex flex-wrap gap-2">
+              <div>
+                <input class="ti-form-control form-control-sm" type="text" placeholder="Search Here"
+                  aria-label=".form-control-sm example">
+              </div>
+              <div class="hs-dropdown ti-dropdown">
+                <a href="javascript:void(0);"
+                  class="ti-btn ti-btn-primary !bg-primary !text-white !py-1 !px-2 !text-[0.75rem] !m-0 !gap-0 !font-medium"
+                  aria-expanded="false">
+                  Sort By<i class="ri-arrow-down-s-line align-middle ms-1 inline-block"></i>
+                </a>
+                <ul class="hs-dropdown-menu ti-dropdown-menu hidden" role="menu">
+                  <li><a class="ti-dropdown-item !py-2 !px-[0.9375rem] !text-[0.8125rem] !font-medium block"
+                      href="javascript:void(0);">New</a></li>
+                  <li><a class="ti-dropdown-item !py-2 !px-[0.9375rem] !text-[0.8125rem] !font-medium block"
+                      href="javascript:void(0);">Popular</a></li>
+                  <li><a class="ti-dropdown-item !py-2 !px-[0.9375rem] !text-[0.8125rem] !font-medium block"
+                      href="javascript:void(0);">Relevant</a></li>
+                </ul>
+              </div>
+            </div>
+          </div>
+          <div class="box-body">
+            <div class="overflow-x-auto">
+              <div class="table-responsive">
+                <spk-reusable-tables [columns]="SalesRepData.columns" [showCheckbox]="true"
+                  tableClass="table min-w-full whitespace-nowrap table-hover border table-bordered">
+
+                  @for (row of SalesRepData.rows; track row.id) {
+                  <tr class="border !border-defaultborder border-solid hover:bg-gray-100 dark:!border-defaultborder/10 dark:hover:!bg-light">
+
+                    <td scope="row" class="">
+                      <input class="form-check-input" type="checkbox" [checked]="row.checked" aria-label="...">
+                    </td>
+
+                    <td>
+                      <div class="flex items-center font-semibold">
+                        <span class="!me-2 inline-flex justify-center items-center">
+                          <img [src]="row.img" alt="img" class="w-[1.75rem] h-[1.75rem] rounded-full">
+                        </span>
+                        {{ row.name }}
+                      </div>
+                    </td>
+
+                    <td>{{ row.category }}</td>
+
+                    <td>{{ row.mail }}</td>
+
+                    <td>
+                      <span
+                        [class]="'inline-flex text-' + row.locationClass + ' !py-[0.15rem] !px-[0.45rem] rounded-sm !font-semibold !text-[0.75em] bg-' + row.locationClass + '/10'">
+                        {{ row.location }}
+                      </span>
+                    </td>
+
+                    <td>{{ row.date }}</td>
+
+                    <td>
+                      <div class="flex flex-row items-center !gap-2 text-[0.9375rem]">
+                        <a aria-label="anchor" href="javascript:void(0);"
+                          class="ti-btn ti-btn-icon ti-btn-wave !gap-0 !m-0 !h-[1.75rem] !w-[1.75rem] text-[0.8rem] bg-success/10 text-success hover:bg-success hover:!text-white hover:!border-success">
+                          <i class="ri-download-2-line"></i>
+                        </a>
+                        <a aria-label="anchor" href="javascript:void(0);"
+                          class="ti-btn ti-btn-icon ti-btn-wave !gap-0 !m-0 !h-[1.75rem] !w-[1.75rem] text-[0.8rem] bg-primary/10 text-primary hover:bg-primary hover:!text-white hover:!border-primary">
+                          <i class="ri-edit-line"></i>
+                        </a>
+                      </div>
+                    </td>
+
+                  </tr>
+                  }
+                </spk-reusable-tables>
+              </div>
+            </div>
+          </div>
+          <div class="box-footer">
+            <div class="sm:flex items-center">
+              <div class="text-defaulttextcolor dark:text-defaulttextcolor/70">
+                Showing 5 Entries <i class="bi bi-arrow-right ms-2 font-semibold"></i>
+              </div>
+              <div class="ms-auto">
+                <nav aria-label="Page navigation" class="pagination-style-4">
+                  <ul class="ti-pagination mb-0">
+                    <li class="page-item disabled">
+                      <a class="page-link" href="javascript:void(0);">
+                        Prev
+                      </a>
+                    </li>
+                    <li class="page-item"><a class="page-link active" href="javascript:void(0);">1</a></li>
+                    <li class="page-item"><a class="page-link" href="javascript:void(0);">2</a></li>
+                    <li class="page-item">
+                      <a class="page-link !text-primary" href="javascript:void(0);">
+                        next
+                      </a>
+                    </li>
+                  </ul>
+                </nav>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <div class="2xl:col-span-3 xl:col-span-12 col-span-12">
+    <div class="grid grid-cols-12 gap-x-6">
+      <div class="2xl:col-span-12 xl:col-span-12  col-span-12">
+        <div class="box">
+          <div class="box-header justify-between">
+            <div class="box-title">
+              Leads By Source
+            </div>
+            <div class="hs-dropdown ti-dropdown">
+              <a aria-label="anchor" href="javascript:void(0);"
+                class="flex items-center justify-center w-[1.75rem] h-[1.75rem] ! !text-[0.8rem] !py-1 !px-2 rounded-sm bg-light border-light shadow-none !font-medium"
+                aria-expanded="false">
+                <i class="fe fe-more-vertical text-[0.8rem]"></i>
+              </a>
+              <ul class="hs-dropdown-menu ti-dropdown-menu hidden">
+                <li><a class="ti-dropdown-item !py-2 !px-[0.9375rem] !text-[0.8125rem] !font-medium block"
+                    href="javascript:void(0);">Week</a></li>
+                <li><a class="ti-dropdown-item !py-2 !px-[0.9375rem] !text-[0.8125rem] !font-medium block"
+                    href="javascript:void(0);">Month</a></li>
+                <li><a class="ti-dropdown-item !py-2 !px-[0.9375rem] !text-[0.8125rem] !font-medium block"
+                    href="javascript:void(0);">Year</a></li>
+              </ul>
+            </div>
+          </div>
+          <div class="box-body !p-6 mt-4">
+
+            <div class="leads-source-chart flex items-center justify-center">
+
+              <spk-chartjs [id]="'leads-source'" [class]="'chartjs-chart w-full'" [height]="250"  [chartjs]="LeadsBySourceChart" />
+
+              <div class="lead-source-value ">
+                <span class="block text-[0.875rem] ">Total</span>
+                <span class="block text-[1.5625rem] font-bold">4,145</span>
+              </div>
+            </div>
+          </div>
+          <div class="grid grid-cols-4 mt-4 border-t border-dashed border-defaultborder dark:border-defaultborder/10">
+
+            @for (item of deviceLeads; track item.label) {
+            <div class="col !p-0">
+              <div [class]="item.containerClass">
+
+                <span class="text-[#8c9097] dark:text-white/50 text-[0.75rem] mb-1 crm-lead-legend inline-block"
+                  [class]="item.legendClass">
+                  {{ item.label }}
+                </span>
+
+                <div>
+                  <span class="text-[1rem] font-semibold">{{ item.value }}</span>
+                </div>
+
+              </div>
+            </div>
+            }
+
+          </div>
+        </div>
+      </div>
+      <div class="2xl:col-span-12 xl:col-span-6  col-span-12">
+        <div class="box">
+          <div class="box-header justify-between">
+            <div class="box-title">
+              Deals Status
+            </div>
+            <div class="hs-dropdown ti-dropdown">
+              <a href="javascript:void(0);" class="text-[0.75rem] px-2 font-normal text-[#8c9097] dark:text-white/50"
+                aria-expanded="false">
+                View All<i class="ri-arrow-down-s-line align-middle ms-1 inline-block"></i>
+              </a>
+              <ul class="hs-dropdown-menu ti-dropdown-menu hidden" role="menu">
+                <li><a class="ti-dropdown-item !py-2 !px-[0.9375rem] !text-[0.8125rem] !font-medium block"
+                    href="javascript:void(0);">Today</a></li>
+                <li><a class="ti-dropdown-item !py-2 !px-[0.9375rem] !text-[0.8125rem] !font-medium block"
+                    href="javascript:void(0);">This Week</a></li>
+                <li><a class="ti-dropdown-item !py-2 !px-[0.9375rem] !text-[0.8125rem] !font-medium block"
+                    href="javascript:void(0);">Last Week</a></li>
+              </ul>
+            </div>
+          </div>
+          <div class="box-body">
+            <div class="flex items-center mb-[0.8rem]">
+              <h4 class="font-bold mb-0 text-[1.5rem] ">4,289</h4>
+              <div class="ms-2">
+                <span
+                  class="py-[0.18rem] px-[0.45rem] rounded-sm text-success !font-medium !text-[0.75em] bg-success/10">1.02<i
+                    class="ri-arrow-up-s-fill align-mmiddle ms-1"></i></span>
+                <span class="text-[#8c9097] dark:text-white/50 text-[0.813rem] ms-1">compared to last week</span>
+              </div>
+            </div>
+
+            <div class="flex w-full h-[0.3125rem] mb-6 rounded-full overflow-hidden">
+              <div class="flex flex-col justify-center rounded-s-[0.625rem] overflow-hidden bg-primary w-[21%]"
+                aria-valuenow="21" aria-valuemin="0" aria-valuemax="100">
+              </div>
+              <div class="flex flex-col justify-center rounded-none overflow-hidden bg-info w-[26%]" aria-valuenow="26"
+                aria-valuemin="0" aria-valuemax="100">
+              </div>
+              <div class="flex flex-col justify-center rounded-none overflow-hidden bg-warning w-[35%]"
+                aria-valuenow="35" aria-valuemin="0" aria-valuemax="100">
+              </div>
+              <div class="flex flex-col justify-center rounded-e-[0.625rem] overflow-hidden bg-success w-[18%]"
+                aria-valuenow="18" aria-valuemin="0" aria-valuemax="100">
+              </div>
+            </div>
+            <ul class="list-none mb-0 pt-2 crm-deals-status">
+
+              @for (deal of dealStats; track deal.title) {
+              <li [class]="deal.liClass">
+                <div class="flex items-center text-[0.813rem] justify-between">
+                  <div>{{ deal.title }}</div>
+
+                  <div class="text-[0.75rem] text-[#8c9097] dark:text-white/50">
+                    {{ deal.count }}
+                  </div>
+                </div>
+              </li>
+              }
+
+            </ul>
+          </div>
+        </div>
+      </div>
+      <div class="2xl:col-span-12 xl:col-span-6  col-span-12">
+        <div class="box">
+          <div class="box-header justify-between">
+            <div class="box-title">
+              Recent Activity
+            </div>
+            <div class="hs-dropdown ti-dropdown">
+              <a href="javascript:void(0);" class="text-[0.75rem] px-2 font-normal text-[#8c9097] dark:text-white/50"
+                aria-expanded="false">
+                View All<i class="ri-arrow-down-s-line align-middle ms-1 inline-block"></i>
+              </a>
+              <ul class="hs-dropdown-menu ti-dropdown-menu hidden" role="menu">
+                <li><a class="ti-dropdown-item !py-2 !px-[0.9375rem] !text-[0.8125rem] !font-medium block"
+                    href="javascript:void(0);">Today</a></li>
+                <li><a class="ti-dropdown-item !py-2 !px-[0.9375rem] !text-[0.8125rem] !font-medium block"
+                    href="javascript:void(0);">This Week</a></li>
+                <li><a class="ti-dropdown-item !py-2 !px-[0.9375rem] !text-[0.8125rem] !font-medium block"
+                    href="javascript:void(0);">Last Week</a></li>
+              </ul>
+            </div>
+          </div>
+          <div class="box-body">
+            <div>
+              <ul class="list-none mb-0 crm-recent-activity">
+                @for (item of recentActivity; track $index) {
+                <li class="crm-recent-activity-content text-defaultsize">
+                  <div class="flex items-start">
+
+                    <div class="me-4">
+                      <span
+                        class="w-[1.25rem] h-[1.25rem] inline-flex items-center justify-center font-medium leading-[1.25rem] text-[0.65rem] rounded-full"
+                        [class]="item.statusClass">
+                        <i class="bi bi-circle-fill text-[0.5rem]"></i>
+                      </span>
+                    </div>
+
+                    <div class="crm-timeline-content">
+                      <span [class.font-semibold]="item.boldMain">{{ item.mainText }}</span>
+
+                      @if (item.linkText) {
+                      <a href="javascript:void(0);" [class]="item.linkClass">{{ item.linkText }}</a>
+                      }
+
+                      @if (item.boldText) {
+                      <span class="font-semibold">{{ item.boldText }}</span>
+                      }
+
+                      @if (item.highlightText) {
+                      <span [class]="item.highlightClass">{{ item.highlightText }}</span>
+                      }
+
+                      @if (item.tagText) {
+                      <span [class]="item.tagClass">{{ item.tagText }}</span>
+                      }
+
+                      @if (item.afterText) {
+                      <span>{{ item.afterText }}</span>
+                      }
+
+                      @if (item.showAddIcon) {
+                      <span
+                        class="w-[1.25rem] h-[1.25rem] leading-[1.25rem] text-[0.65rem] inline-flex items-center justify-center font-medium bg-purple/10 rounded-full ms-1">
+                        <i class="ri-add-fill text-purple text-[0.75rem]"></i>
+                      </span>
+                      }
+
+                      @if (item.showCheckIcon) {
+                      <i class="ri-checkbox-circle-line text-success text-[1rem] align-middle ms-1"></i>
+                      }
+
+                      @if (item.subText) {
+                      <span class="block text-[0.75rem] text-[#8c9097] dark:text-white/50">
+                        {{ item.subText }}
+                      </span>
+                      }
+                    </div>
+
+                    <div class="flex-grow text-end">
+                      <span class="block text-[#8c9097] dark:text-white/50 text-[0.6875rem] opacity-[0.7]">
+                        {{ item.time }}
+                      </span>
+                    </div>
+
+                  </div>
+                </li>
+                }
+              </ul>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
diff --git a/src/app/features/dashboards/crm/crm.scss b/src/app/features/dashboards/crm/crm.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/src/app/features/dashboards/crm/crm.ts b/src/app/features/dashboards/crm/crm.ts
new file mode 100644
index 00000000..12d5cc75
--- /dev/null
+++ b/src/app/features/dashboards/crm/crm.ts
@@ -0,0 +1,618 @@
+import { Chart, ChartConfiguration, Plugin } from 'chart.js';
+import { Component } from '@angular/core';
+import { RouterModule } from '@angular/router';
+import { SpkApexcharts } from "../../../@spk/charts/charts/spk-apexcharts/spk-apexcharts";
+import { ApexOptions } from 'ng-apexcharts';
+import { SpkReusableTables } from "../../../@spk/tables/spk-reusable-tables/spk-reusable-tables";
+import { SpkChartjs } from "../../../@spk/charts/charts/spk-chartjs/spk-chartjs";
+@Component({
+  selector: 'app-crm',
+  standalone: true,
+  imports: [RouterModule, SpkApexcharts, SpkReusableTables, SpkChartjs],
+  templateUrl: './crm.html',
+  styleUrl: './crm.scss'
+})
+export class Crm {
+  YourtargetisincompleteChart: ApexOptions = {
+    chart: {
+      height: 127,
+      width: 100,
+      type: 'radialBar',
+    },
+
+    series: [48],
+    // colors: ['#fff'],
+    plotOptions: {
+      radialBar: {
+        hollow: {
+          margin: 0,
+          size: '55%',
+          background: '#fff',
+        },
+        dataLabels: {
+          name: {
+            offsetY: -10,
+            color: '#4b9bfa',
+            fontSize: '.625rem',
+            show: false,
+          },
+          value: {
+            offsetY: 5,
+            color: '#4b9bfa',
+            fontSize: '.875rem',
+            show: true,
+            fontWeight: 600,
+          },
+        },
+      },
+    },
+    stroke: {
+      lineCap: 'round',
+    },
+    labels: ['Status'],
+    colors: ['#fff']
+  }
+
+  topDeals = [
+    {
+      name: 'Michael Jordan',
+      email: 'michael.jordan@example.com',
+      amount: '$2,893',
+      avatarImg: './assets/images/faces/10.jpg'
+    },
+    {
+      name: 'Emigo Kiaren',
+      email: 'emigo.kiaren@gmail.com',
+      amount: '$4,289',
+      initials: 'EK',
+      color: 'warning', // Used for text-warning and bg-warning/10
+    },
+    {
+      name: 'Randy Origoan',
+      email: 'randy.origoan@gmail.com',
+      amount: '$6,347',
+      avatarImg: './assets/images/faces/12.jpg'
+    },
+    {
+      name: 'George Pieterson',
+      email: 'george.pieterson@gmail.com',
+      amount: '$3,894',
+      initials: 'GP',
+      color: 'success',
+    },
+    {
+      name: 'Kiara Advain',
+      email: 'kiaraadvain214@gmail.com',
+      amount: '$2,679',
+      initials: 'KA',
+      color: 'primary',
+    }
+  ];
+
+  profitEarnedChart: ApexOptions = {
+    series: [
+      {
+        name: 'Profit Earned',
+        data: [44, 42, 57, 86, 58, 55, 70],
+      },
+      {
+        name: 'Total Sales',
+        data: [34, 22, 37, 56, 21, 35, 60],
+      },
+    ],
+    chart: {
+      type: 'bar',
+      height: 180,
+      toolbar: {
+        show: false,
+      },
+    },
+    grid: {
+      borderColor: '#f1f1f1',
+      strokeDashArray: 3,
+    },
+    colors: ['rgb(132, 90, 223)', '#e4e7ed'],
+    plotOptions: {
+      bar: {
+        colors: {
+          ranges: [
+            {
+              from: -100,
+              to: -46,
+              color: '#ebeff5',
+            },
+            {
+              from: -45,
+              to: 0,
+              color: '#ebeff5',
+            },
+          ],
+        },
+        columnWidth: '60%',
+        borderRadius: 5,
+      },
+    },
+    dataLabels: {
+      enabled: false,
+    },
+    stroke: {
+      show: true,
+      width: 2,
+      colors: undefined,
+    },
+    legend: {
+      show: false,
+      position: 'top',
+    },
+    yaxis: {
+      title: {
+        style: {
+          color: '#adb5be',
+          fontSize: '13px',
+          fontFamily: 'poppins, sans-serif',
+          fontWeight: 600,
+          cssClass: 'apexcharts-yaxis-label',
+        },
+      },
+      labels: {
+        formatter: function (y: number) {
+          return y.toFixed(0) + '';
+        },
+      },
+    },
+    xaxis: {
+      type: 'category',
+      categories: ['S', 'M', 'T', 'W', 'T', 'F', 'S'],
+      axisBorder: {
+        show: true,
+        color: 'rgba(119, 119, 142, 0.05)',
+        offsetX: 0,
+        offsetY: 0,
+      },
+      axisTicks: {
+        show: true,
+        borderType: 'solid',
+        color: 'rgba(119, 119, 142, 0.05)',
+
+        offsetX: 0,
+        offsetY: 0,
+      },
+      labels: {
+        rotate: -90,
+      },
+    },
+  }
+
+
+
+  crmCardsChartOptions({ series, colors }: { colors: string[], series: { data: number[], name: string }[] }): ApexOptions {
+    return {
+      chart: {
+        type: 'line',
+        height: 40,
+        width: 100,
+        sparkline: {
+          enabled: true
+        }
+      },
+      dataLabels: {
+        enabled: false
+      },
+
+      stroke: {
+        show: true,
+        curve: 'smooth',
+        lineCap: 'butt',
+        colors: undefined,
+        width: 1.5,
+        dashArray: 0,
+      },
+      fill: {
+        type: 'gradient',
+        gradient: {
+          opacityFrom: 0.9,
+          opacityTo: 0.9,
+          stops: [0, 98],
+        }
+      },
+      series: series,
+      yaxis: {
+        min: 0,
+        show: false,
+        axisBorder: {
+          show: false
+        },
+      },
+      xaxis: {
+        labels: {
+          show: false,
+        },
+        axisBorder: {
+          show: false
+        },
+      },
+      tooltip: {
+        enabled: true,
+      },
+      colors: colors,
+    }
+  }
+
+  crmCards = [
+    {
+      color: 'primary',
+      icon: 'ti ti-users',
+      title: 'Total Customers',
+      number: '1,02,890',
+      chartId: 'crm-total-customers',
+      chartoptions: this.crmCardsChartOptions({
+        series: [{
+          name: 'Value',
+          data: [20, 14, 19, 10, 23, 20, 22, 9, 12]
+        }], colors: ["rgb(132, 90, 223)"],
+      }),
+      viewallTextColor: 'text-primary',
+      percentage: '+40%',
+      percentageColor: 'text-success',
+    },
+    {
+      color: 'secondary',
+      icon: 'ti ti-wallet',
+      title: 'Total Revenue',
+      number: '$56,562',
+      chartId: 'crm-total-revenue',
+      chartoptions: this.crmCardsChartOptions({
+        series: [
+          {
+            name: 'Value',
+            data: [20, 14, 20, 22, 9, 12, 19, 10, 25],
+          },
+        ], colors: ['rgb(35, 183, 229)'],
+      }),
+      viewallTextColor: 'text-secondary',
+      percentage: '+25%',
+      percentageColor: 'text-success',
+    },
+    {
+      color: 'success',
+      icon: 'ti ti-wave-square',
+      title: 'Conversion Ratio',
+      number: '12.08%',
+      chartId: 'crm-conversion-ratio',
+      chartoptions: this.crmCardsChartOptions({
+        series: [
+          {
+            name: 'Value',
+            data: [20, 20, 22, 9, 14, 19, 10, 25, 12],
+          },
+        ], colors: ['rgb(38, 191, 148)'],
+      }),
+      viewallTextColor: 'text-success',
+      percentage: '-12%',
+      percentageColor: 'text-danger',
+    },
+    {
+      color: 'warning',
+      icon: 'ti ti-briefcase',
+      title: 'Total Deals',
+      number: '2,543',
+      chartId: 'crm-total-deals',
+      chartoptions: this.crmCardsChartOptions({
+        series: [
+          {
+            name: 'Value',
+            data: [20, 20, 22, 9, 12, 14, 19, 10, 25],
+          },
+        ], colors: ['rgb(245, 184, 73)'],
+      }),
+      viewallTextColor: 'text-warning',
+      percentage: '+19%',
+      percentageColor: 'text-success',
+    }
+  ];
+
+
+
+  RevenueAnalytics: ApexOptions = {
+    series: [
+      {
+        type: 'line',
+        name: 'Profit',
+        data: [
+          { x: 'Jan', y: 100 },
+          { x: 'Feb', y: 210 },
+          { x: 'Mar', y: 180 },
+          { x: 'Apr', y: 454 },
+          { x: 'May', y: 230 },
+          { x: 'Jun', y: 320 },
+          { x: 'Jul', y: 656 },
+          { x: 'Aug', y: 830 },
+          { x: 'Sep', y: 350 },
+          { x: 'Oct', y: 350 },
+          { x: 'Nov', y: 210 },
+          { x: 'Dec', y: 410 },
+        ],
+      },
+      {
+        type: 'line',
+        name: 'Revenue',
+        data: [
+          { x: 'Jan', y: 180 },
+          { x: 'Feb', y: 620 },
+          { x: 'Mar', y: 476 },
+          { x: 'Apr', y: 220 },
+          { x: 'May', y: 520 },
+          { x: 'Jun', y: 780 },
+          { x: 'Jul', y: 435 },
+          { x: 'Aug', y: 515 },
+          { x: 'Sep', y: 738 },
+          { x: 'Oct', y: 454 },
+          { x: 'Nov', y: 525 },
+          { x: 'Dec', y: 230 },
+        ],
+      },
+      {
+        type: 'area',
+        name: 'Sales',
+        data: [
+          { x: 'Jan', y: 200 },
+          { x: 'Feb', y: 530 },
+          { x: 'Mar', y: 110 },
+          { x: 'Apr', y: 130 },
+          { x: 'May', y: 480 },
+          { x: 'Jun', y: 520 },
+          { x: 'Jul', y: 780 },
+          { x: 'Aug', y: 435 },
+          { x: 'Sep', y: 475 },
+          { x: 'Oct', y: 738 },
+          { x: 'Nov', y: 454 },
+          { x: 'Dec', y: 480 },
+        ],
+      },
+    ],
+    chart: {
+      type: 'line',
+      height: 350,
+      animations: {
+        speed: 500,
+      },
+      toolbar: {
+        show: true
+      },
+      zoom: {
+        enabled: true,
+      },
+      dropShadow: {
+        enabled: false,
+        enabledOnSeries: undefined,
+        top: 8,
+        left: 0,
+        blur: 3,
+        color: '#000',
+        opacity: 0.1,
+      },
+    },
+    colors: ["rgb(132, 90, 223)", "rgba(35, 183, 229, 0.85)", "rgba(119, 119, 142, 0.05)"],
+    dataLabels: {
+      enabled: false,
+    },
+    grid: {
+      padding:{
+        left:0,
+        right:0,
+        top:0,
+        bottom:0
+      },
+      borderColor: '#f1f1f1',
+      strokeDashArray: 3,
+      yaxis: {
+        lines: {
+          show: false
+        }
+      },
+    },
+    stroke: {
+      curve: 'smooth',
+      width: [2, 2, 0],
+      dashArray: [0, 5, 0],
+    },
+    xaxis: {
+      axisTicks: {
+        show: false,
+      },
+    },
+    yaxis: {
+
+      labels: {
+        formatter: (value: number) => `$${value}`,
+      },
+
+    },
+    tooltip: {
+      y: [
+        {
+          formatter: (value: number) => `$${value}`,
+        },
+        {
+          formatter: (value: number) => `$${value.toFixed(0)}`,
+        },
+        {
+          formatter: (value: number) => `$${value.toFixed(0)}`,
+        },
+      ],
+    },
+    legend: {
+      show: true,
+      offsetY: 15,
+      customLegendItems: ['Profit', 'Revenue', 'Sales'],
+      inverseOrder: true,
+      markers: {
+        size: 5
+      }
+    },
+    title: {
+      text: 'Revenue Analytics with sales & profit (USD)',
+      align: 'left',
+      style: {
+        fontSize: '.8125rem',
+        fontWeight: 'semibold',
+        color: '#8c9097',
+      },
+    },
+    markers: {
+      hover: {
+        sizeOffset: 5,
+      },
+    },
+  }
+
+  SalesRepData = {
+    columns: [
+      { header: 'Sales Rep', tableHeadColumn: '!text-start !text-[0.85rem] min-w-[200px]' },
+      { header: 'Category', tableHeadColumn: '!text-start !text-[0.85rem]' },
+      { header: 'Mail', tableHeadColumn: '!text-start !text-[0.85rem]' },
+      { header: 'Location', tableHeadColumn: '!text-start !text-[0.85rem]' },
+      { header: 'Date', tableHeadColumn: '!text-start !text-[0.85rem]' },
+      { header: 'Action', tableHeadColumn: '!text-start !text-[0.85rem]' }
+    ],
+    rows: [
+      { id: 1, name: 'Mayor Kelly', img: './assets/images/faces/4.jpg', category: 'Manufacture', mail: 'mayorkelly@gmail.com', location: 'Germany', locationClass: 'info', date: 'Sep 15 - Oct 12, 2023', checked: false },
+      { id: 2, name: 'Andrew Garfield', img: './assets/images/faces/15.jpg', category: 'Development', mail: 'andrewgarfield@gmail.com', location: 'Canada', locationClass: 'primary', date: 'Apr 10 - Dec 12, 2023', checked: true },
+      { id: 3, name: 'Simon Cowel', img: './assets/images/faces/11.jpg', category: 'Service', mail: 'simoncowel234@gmail.com', location: 'Europe', locationClass: 'danger', date: 'Sep 15 - Oct 12, 2023', checked: false },
+      { id: 4, name: 'Mirinda Hers', img: './assets/images/faces/8.jpg', category: 'Marketing', mail: 'mirindahers@gmail.com', location: 'USA', locationClass: 'warning', date: 'Apr 14 - Dec 14, 2023', checked: true },
+      { id: 5, name: 'Jacob Smith', img: './assets/images/faces/9.jpg', category: 'Social Plataform', mail: 'jacobsmith@gmail.com', location: 'Singapore', locationClass: 'success', date: 'Feb 25 - Nov 25, 2023', checked: true }
+    ]
+  };
+
+
+
+
+
+
+  LeadsBySourceChart: ChartConfiguration<'doughnut'> = {
+    type: 'doughnut',
+    data: {
+      datasets: [{
+        data: [32, 27, 25, 16],
+        backgroundColor: [
+          'rgb(132, 90, 223)', // Purple
+          'rgb(35, 183, 229)', // Blue
+          'rgb(245, 184, 73)', // Orange
+          'rgb(38, 191, 148)', // Green
+        ],
+        // 1. INCREASE SPACING: This creates the clear gap between segments
+        spacing: -20,
+        // 2. ROUNDED BORDER: 10-20 is usually the sweet spot for this thinness
+        borderRadius: 20,
+        borderWidth: 0,
+      }]
+    },
+    options: {
+      responsive: true,
+      maintainAspectRatio: false,
+      // 3. THINNESS: Ensure this is high enough (80% to 90%)
+      cutout: '86%',
+      plugins: {
+        legend: { display: false },
+        tooltip: { enabled: true }
+      }
+    }
+  };
+  recentActivity = [
+    {
+      statusClass: 'text-primary bg-primary/10',
+      time: '4:45PM',
+      mainText: 'Update of calendar events & ',
+      boldMain: true,
+      linkText: 'Added new events in next week.',
+      linkClass: 'text-primary font-semibold'
+    },
+    {
+      statusClass: 'text-secondary bg-secondary/10',
+      time: '3 hrs',
+      mainText: 'New theme for ',
+      boldText: 'Spruko Website',
+      afterText: ' completed',
+      subText: 'Lorem ipsum, dolor sit amet.'
+    },
+    {
+      statusClass: 'text-success bg-success/10',
+      time: '22 hrs',
+      mainText: 'Created a ',
+      highlightText: 'New Task',
+      highlightClass: 'text-success font-semibold',
+      afterText: ' today',
+      showAddIcon: true
+    },
+    {
+      statusClass: 'text-pink bg-pink/10',
+      time: 'Today',
+      mainText: 'New member ',
+      tagText: '@andreas gurrero',
+      tagClass: 'py-[0.2rem] px-[0.45rem] font-semibold rounded-sm text-pink text-[0.75em] bg-pink/10',
+      afterText: ' added today to AI Summit.'
+    },
+    {
+      statusClass: 'text-warning bg-warning/10',
+      time: '22 hrs',
+      mainText: '32 New people joined summit.'
+    },
+    {
+      statusClass: 'text-info bg-info/10',
+      time: '12 hrs',
+      mainText: 'Neon Tarly added ',
+      highlightText: 'Robert Bright',
+      highlightClass: 'text-info font-semibold',
+      afterText: ' to AI summit project.'
+    },
+    {
+      statusClass: 'text-[#232323] dark:text-white bg-[#232323]/10 dark:bg-white/20',
+      time: '4 hrs',
+      mainText: 'Replied to new support request ',
+      showCheckIcon: true
+    },
+    {
+      statusClass: 'text-purple bg-purple/10',
+      time: '4 hrs',
+      mainText: 'Completed documentation of ',
+      linkText: 'AI Summit.',
+      linkClass: 'text-purple underline font-semibold'
+    }
+  ];
+
+  deviceLeads = [
+    {
+      label: 'Mobile',
+      value: '1,624',
+      legendClass: 'mobile',
+      containerClass: '!ps-4 p-[0.95rem] text-center border-e border-dashed border-defaultborder dark:border-defaultborder/10'
+    },
+    {
+      label: 'Desktop',
+      value: '1,267',
+      legendClass: 'desktop',
+      containerClass: 'p-[0.95rem] text-center border-e border-dashed border-defaultborder dark:border-defaultborder/10'
+    },
+    {
+      label: 'Laptop',
+      value: '1,153',
+      legendClass: 'laptop',
+      containerClass: 'p-[0.95rem] text-center border-e border-dashed border-defaultborder dark:border-defaultborder/10'
+    },
+    {
+      label: 'Tablet',
+      value: '679',
+      legendClass: 'tablet',
+      containerClass: '!pe-4 p-[0.95rem] text-center'
+    }
+  ];
+
+  dealStats = [
+    { title: 'Successful Deals', count: '987 deals', liClass: 'primary' },
+    { title: 'Pending Deals', count: '1,073 deals', liClass: 'info' },
+    { title: 'Rejected Deals', count: '1,674 deals', liClass: 'warning' },
+    { title: 'Upcoming Deals', count: '921 deals', liClass: 'success' }
+  ];
+}
+
+
diff --git a/src/app/features/dashboards/dashboard.routes.ts b/src/app/features/dashboards/dashboard.routes.ts
new file mode 100644
index 00000000..7f34349f
--- /dev/null
+++ b/src/app/features/dashboards/dashboard.routes.ts
@@ -0,0 +1,12 @@
+import {  Routes } from '@angular/router';
+
+export const dashboardRoutingModule: Routes = [
+
+      {
+        path: 'crm',
+        loadComponent: () => import('./crm/crm').then((m) => m.Crm),
+        title: 'YNEX - Crm',
+      },
+      
+
+];
diff --git a/src/app/features/errors/error.routes.ts b/src/app/features/errors/error.routes.ts
new file mode 100644
index 00000000..04e3aeb7
--- /dev/null
+++ b/src/app/features/errors/error.routes.ts
@@ -0,0 +1,15 @@
+import { Routes } from '@angular/router';
+
+export const errorRoutingModule: Routes = [
+  {
+    path: 'error', children: [
+    {
+      path: 'error404',
+      loadComponent: () => import('./error404/error404').then(   (m) => m.Error404 ),
+      title: 'YNEX - Error 404'
+    },
+
+    ]
+  }
+];
+
diff --git a/src/app/features/errors/error404/error404.html b/src/app/features/errors/error404/error404.html
new file mode 100644
index 00000000..cf0f11a3
--- /dev/null
+++ b/src/app/features/errors/error404/error404.html
@@ -0,0 +1,27 @@
+<div class="page error-bg dark:!bg-bodybg" id="particles-js">
+    <!-- Start::error-page -->
+          <spk-particles id="tsparticles" [options]="particlesOptions" />
+
+    <div class="error-page">
+      <div class="container text-defaulttextcolo dark:text-defaulttextcolor/70r text-defaultsize">
+        <div class="text-center p-5 my-auto">
+          <div class="flex items-center justify-center h-full !text-defaulttextcolor">
+            <div class="xl:col-span-3"></div>
+            <div class="xl:col-span-6 col-span-12">
+              <p class="error-text sm:mb-0 mb-2">404</p>
+              <p class="text-[1.125rem] font-semibold mb-4">Oops 😭,The page you are looking for is not available.</p>
+              <div class="flex justify-center items-center mb-[3rem]">
+                <div class="xl:col-span-6 w-[50%]">
+                  <p class="mb-0 opacity-[0.7]">We are sorry for the inconvenience,The page you are trying to access has
+                    been removed or never been existed.</p>
+                </div>
+              </div>
+              <a routerLink="/dashboards/crm" class="ti-btn bg-primary text-white font-semibold"><i
+                  class="ri-arrow-left-line align-middle inline-block"></i>BACK TO HOME</a>
+            </div>
+            <div class="xl:col-span-3"></div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
diff --git a/src/app/features/errors/error404/error404.scss b/src/app/features/errors/error404/error404.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/src/app/features/errors/error404/error404.ts b/src/app/features/errors/error404/error404.ts
new file mode 100644
index 00000000..5f5998ac
--- /dev/null
+++ b/src/app/features/errors/error404/error404.ts
@@ -0,0 +1,16 @@
+import { Component } from '@angular/core';
+import {RouterModule} from'@angular/router';
+import { SpkParticles } from "../../../@spk/plugins&reusable/spk-particles/spk-particles";
+import {particlesOptions}  from "../particleoptions"
+@Component({
+  selector: 'app-error404',
+  standalone: true,
+  imports: [RouterModule, SpkParticles],
+  templateUrl: './error404.html',
+  styleUrls: ['./error404.scss']
+})
+export class Error404 {
+particlesOptions=particlesOptions
+}
+
+
diff --git a/src/app/features/errors/particleoptions.ts b/src/app/features/errors/particleoptions.ts
new file mode 100644
index 00000000..6e7c01ec
--- /dev/null
+++ b/src/app/features/errors/particleoptions.ts
@@ -0,0 +1,36 @@
+ export const particlesOptions = {
+    fpsLimit: 60, // 200 is excessive; 60 is smooth and efficient
+    interactivity: {
+      events: {
+        onClick: { enable: true },
+        onHover: { enable: true },
+        resize: { enable: true }
+      },
+      modes: {
+        push: { quantity: 4 },
+        repulse: { distance: 200, duration: 0.4 }
+      }
+    },
+    particles: {
+      number: {
+        value: 80,
+        density: { enable: true, value_area: 800 }
+      },
+      color: { value: "#845adf" },
+      shape: { type: "circle" },
+      opacity: { value: 0.5 },
+      size: { value: 2, random: true },
+      line_linked: {
+        enable: true,
+        distance: 150,
+        color: "#d1d9e0",
+        opacity: 0.4,
+        width: 1
+      },
+      move: {
+        enable: true,
+        speed: 2,
+        out_mode: "out"
+      }
+    }
+  };
diff --git a/src/app/features/global-masters/cities/data-access/city.endpoints.ts b/src/app/features/global-masters/cities/data-access/city.endpoints.ts
new file mode 100644
index 00000000..0c668c39
--- /dev/null
+++ b/src/app/features/global-masters/cities/data-access/city.endpoints.ts
@@ -0,0 +1,11 @@
+import { buildApiUrl } from '../../../../core/config/api-url.util';
+
+export const CITY_ENDPOINTS = {
+  dataTable: buildApiUrl('masterAdmin', '/v1/cities/datatable'),
+  create: buildApiUrl('masterAdmin', '/v1/cities'),
+  getById: (id: string) =>
+    buildApiUrl('masterAdmin', `/v1/cities/${encodeURIComponent(id)}`),
+  update: (id: string) =>
+    buildApiUrl('masterAdmin', `/v1/cities/${encodeURIComponent(id)}`),
+  autocomplete: buildApiUrl('masterAdmin', '/v1/cities/autocomplete')
+} as const;
diff --git a/src/app/features/global-masters/cities/data-access/city.service.ts b/src/app/features/global-masters/cities/data-access/city.service.ts
new file mode 100644
index 00000000..dd8a49a1
--- /dev/null
+++ b/src/app/features/global-masters/cities/data-access/city.service.ts
@@ -0,0 +1,46 @@
+import { HttpClient, HttpParams } from '@angular/common/http';
+import { Injectable, inject } from '@angular/core';
+import { Observable } from 'rxjs';
+
+import { CITY_ENDPOINTS } from './city.endpoints';
+import {
+  CityDto,
+  CreateCityRequest,
+  UpdateCityRequest
+} from '../models/city.model';
+import {
+  DataTableQuery,
+  DataTableResult
+} from '../../../../shared/components/data-table/data-table.types';
+
+@Injectable({ providedIn: 'root' })
+export class CityService {
+  private readonly http = inject(HttpClient);
+
+  getCityDataTable(
+    query: DataTableQuery,
+    countryId: string | null = null,
+    stateId: string | null = null
+  ): Observable<DataTableResult<CityDto>> {
+    let params = new HttpParams();
+    if (countryId) params = params.set('countryId', countryId);
+    if (stateId) params = params.set('stateId', stateId);
+    return this.http.post<DataTableResult<CityDto>>(
+      CITY_ENDPOINTS.dataTable,
+      query,
+      { params }
+    );
+  }
+
+  createCity(request: CreateCityRequest): Observable<CityDto> {
+    return this.http.post<CityDto>(CITY_ENDPOINTS.create, request);
+  }
+
+  updateCity(id: string, request: UpdateCityRequest): Observable<CityDto> {
+    return this.http.put<CityDto>(CITY_ENDPOINTS.update(id), request);
+  }
+
+  getCityById(id: string): Observable<CityDto> {
+    return this.http.get<CityDto>(CITY_ENDPOINTS.getById(id));
+  }
+}
diff --git a/src/app/features/global-masters/cities/models/city.model.ts b/src/app/features/global-masters/cities/models/city.model.ts
new file mode 100644
index 00000000..19a7dbf2
--- /dev/null
+++ b/src/app/features/global-masters/cities/models/city.model.ts
@@ -0,0 +1,28 @@
+export interface CityDto {
+  id: string;
+  stateId: string;
+  name: string;
+  state:string;
+  country:string;
+  code: string | null;
+  timezoneId: string | null;
+  isActive: boolean;
+  createdOn?: string;
+  modifiedOn?: string | null;
+}
+
+export interface CreateCityRequest {
+  stateId: string;
+  name: string;
+  code: string;
+  timezoneId: string | null;
+}
+
+export interface UpdateCityRequest {
+  name: string;
+  code: string;
+  timezoneId: string | null;
+  isActive: boolean;
+}
+
+export type CityModalMode = 'create' | 'edit';
diff --git a/src/app/features/global-masters/cities/pages/city-list/city-list.html b/src/app/features/global-masters/cities/pages/city-list/city-list.html
new file mode 100644
index 00000000..280df3fd
--- /dev/null
+++ b/src/app/features/global-masters/cities/pages/city-list/city-list.html
@@ -0,0 +1,170 @@
+<!-- Start::row-1 -->
+<div class="grid grid-cols-12 gap-6">
+  <div class="xl:col-span-12 col-span-12">
+    <app-filter-card title="Filter" titleIcon="ti ti-filter" headerClass="!py-2" bodyClass="!px-4 !py-2.5">
+          <form [formGroup]="filterForm" autocomplete="off" class="grid w-full grid-cols-12 items-end gap-3">
+            <div class="col-span-12 sm:col-span-5 lg:col-span-2">
+              <app-autocomplete
+                formControlName="countryId"
+                inputId="city-country-filter"
+                variant="floating"
+                size="sm"
+                label="Country"
+                placeholder="Search country"
+                [searchFn]="searchCountries"
+                [displayWith]="displayCountry"
+                [valueWith]="countryValue"
+                [selectedItem]="selectedCountry()"
+                [minSearchLength]="1"
+                [debounceTime]="300"
+                [limit]="50"
+                [clearable]="true"
+                [hideValidation]="true"
+                wrapperClass="!mb-0 w-full"
+                (itemSelected)="onFilterCountrySelected($event)"
+                (cleared)="onFilterCountryCleared()"
+              />
+            </div>
+
+            <div class="col-span-12 sm:col-span-5 lg:col-span-2">
+              <app-autocomplete
+                formControlName="stateId"
+                inputId="city-state-filter"
+                variant="floating"
+                size="sm"
+                label="State"
+                [placeholder]="filterStatePlaceholder()"
+                [searchFn]="searchFilterStates"
+                [displayWith]="displayState"
+                [valueWith]="stateValue"
+                [selectedItem]="selectedFilterState()"
+                [minSearchLength]="1"
+                [debounceTime]="300"
+                [limit]="50"
+                [clearable]="true"
+                [disabled]="!selectedCountryId()"
+                [hideValidation]="true"
+                wrapperClass="!mb-0 w-full"
+                (itemSelected)="onFilterStateSelected($event)"
+                (cleared)="onFilterStateCleared()"
+              />
+            </div>
+            <div class="col-span-12 sm:col-span-2 lg:col-span-1">
+              <button type="button" class="ti-btn ti-btn-sm ti-btn-primary-full !mb-0 flex min-h-8 w-full items-center justify-center gap-1.5 !px-3 md:!w-auto" (click)="applyCityFilters()">
+                <i class="ti ti-filter" aria-hidden="true"></i>
+                <span>Filter</span>
+              </button>
+            </div>
+          </form>
+       </app-filter-card>
+  </div>
+</div>
+<!-- End::row-1 -->
+
+<app-data-table [columns]="columns()" [rows]="cities()" [actions]="actions()"
+  [totalRecords]="totalRecords()" [pageIndex]="queryState.pageIndex()" [pageSize]="queryState.pageSize()"
+   tableTitle="Cities" buttonTitle="Add" [showSearch]="true"
+  [showAddButton]="true" [emptyMessage]="emptyMessage()" [emptyDescription]="emptyDescription()"
+  searchPlaceholder="Search cities..." [searchDebounceTime]="300" (addClicked)="onAddCity()" (searchChanged)="onSearch($event)"
+  (pageChanged)="onPageChange($event)" (sortChanged)="onSortChange($event)"
+  (actionClicked)="onActionClick($event)" toolTip="Add City" />
+
+<modal [open]="showCityModal()" [title]="modalTitle()" size="lg"
+  [submitAction]="modalMode() === 'create' ? 'save' : 'update'" [submitLabel]="submitLabel()"
+  [loadingLabel]="loadingLabel()" [loading]="saving()"
+  (closed)="closeCityModal()" (submitted)="saveCity()">
+  <form [formGroup]="cityForm" (ngSubmit)="saveCity()" autocomplete="off">
+    <div class="grid grid-cols-12 gap-x-5 gap-y-5">
+      <div class="col-span-12 md:col-span-6">
+        <app-autocomplete
+          formControlName="countryId"
+          inputId="city-country"
+          variant="floating"
+          label="Country"
+          placeholder="Search"
+          [searchFn]="searchCountries"
+          [displayWith]="displayCountry"
+          [valueWith]="countryValue"
+          [resolveValueFn]="resolveCountry"
+          [selectedItem]="selectedFormCountry()"
+          [minSearchLength]="1"
+          [debounceTime]="300"
+          [limit]="50"
+          [clearable]="true"
+          [required]="true"
+          [readonly]="modalMode() !== 'create'"
+          [validationMessages]="{ required: 'Country is required.' }"
+          [submitAttempted]="submitAttempted()"
+          wrapperClass="w-full"
+          (itemSelected)="onFormCountrySelected($event)"
+          (cleared)="onFormCountryCleared()"
+        />
+      </div>
+
+      <div class="col-span-12 md:col-span-6">
+        <app-autocomplete
+          formControlName="stateId"
+          inputId="city-state"
+          variant="floating"
+          label="State"
+          [placeholder]="formStatePlaceholder()"
+          [help]="'Select a country first'"
+          [searchFn]="searchFormStates"
+          [displayWith]="displayState"
+          [valueWith]="stateValue"
+          [resolveValueFn]="resolveState"
+          [selectedItem]="selectedFormState()"
+          [minSearchLength]="1"
+          [debounceTime]="300"
+          [limit]="50"
+          [clearable]="true"
+          [required]="true"
+          [readonly]="modalMode() !== 'create'"
+          [validationMessages]="{ required: 'State is required.' }"
+          [submitAttempted]="submitAttempted()"
+          wrapperClass="w-full"
+          (itemSelected)="onFormStateSelected($event)"
+          (cleared)="onFormStateCleared()"
+        />
+      </div>
+
+      <div class="col-span-12 md:col-span-6">
+        <app-form-input formControlName="name" inputId="city-name" label="City Name" variant="floating"
+          placeholder="Name" autocomplete="off" [required]="true" 
+          [maxLength]="150" [validationMessages]="{
+            required: 'City Name is required.',
+            maxlength: 'City Name cannot exceed 150 characters.'
+          }" [submitAttempted]="submitAttempted()" />
+      </div>
+
+      <div class="col-span-12 md:col-span-6">
+        <app-form-input formControlName="code" inputId="city-code" label="City Code" variant="floating"
+          placeholder="Code" autocomplete="off" [required]="true"
+          [maxLength]="16" [validationMessages]="{
+            required: 'City Code is required.',
+            maxlength: 'City Code cannot exceed 16 characters.',
+            pattern: 'City Code can contain letters, numbers, hyphens, and underscores only.'
+          }" [submitAttempted]="submitAttempted()" />
+      </div>
+
+      <div class="col-span-12 md:col-span-6">
+        <app-autocomplete
+          formControlName="timezoneId"
+          inputId="city-timezone"
+          variant="floating"
+          label="Timezone"
+          placeholder="Search"
+          [searchFn]="searchTimezones"
+          [displayWith]="displayTimezone"
+          [valueWith]="timezoneValue"
+          [resolveValueFn]="resolveTimezone"
+          [minSearchLength]="2"
+          [debounceTime]="300"
+          [limit]="10"
+          emptyText="No timezones found"
+          [submitAttempted]="submitAttempted()"
+        />
+      </div>
+    </div>
+  </form>
+</modal>
diff --git a/src/app/features/global-masters/cities/pages/city-list/city-list.scss b/src/app/features/global-masters/cities/pages/city-list/city-list.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/src/app/features/global-masters/cities/pages/city-list/city-list.ts b/src/app/features/global-masters/cities/pages/city-list/city-list.ts
new file mode 100644
index 00000000..f535d001
--- /dev/null
+++ b/src/app/features/global-masters/cities/pages/city-list/city-list.ts
@@ -0,0 +1,560 @@
+import { Component, DestroyRef, ElementRef, computed, inject, signal } from '@angular/core';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { FormBuilder, ReactiveFormsModule, Validators } from '@angular/forms';
+import { ToastrService } from 'ngx-toastr';
+import {
+  Subject,
+  catchError,
+  debounceTime,
+  distinctUntilChanged,
+  finalize,
+  map,
+  of,
+  switchMap,
+  take
+} from 'rxjs';
+
+import {
+  CityDto,
+  CityModalMode,
+  CreateCityRequest,
+  UpdateCityRequest
+} from '../../models/city.model';
+import { CountryLookupDto } from '../../../countries/models/country.model';
+import { StateLookupDto } from '../../../states/models/state.model';
+import { TimezoneDto, TimezoneLookupDto } from '../../../timezones/models/timezone.model';
+import { CityService } from '../../../cities/data-access/city.service';
+import { CountryService } from '../../../countries/data-access/country.service';
+import { StateService } from '../../../states/data-access/state.service';
+import { TimezoneService } from '../../../timezones/data-access/timezone.service';
+import { DataTable } from '../../../../../shared/components/data-table/data-table';
+import { DataTableQueryState } from '../../../../../shared/components/data-table/data-table-query.state';
+import {
+  DataTableAction,
+  DataTableActionEvent,
+  DataTableColumn,
+  DataTablePageEvent,
+  DataTableQuery,
+  DataTableRecord,
+  DataTableSortEvent
+} from '../../../../../shared/components/data-table/data-table.types';
+import { FormInput } from '../../../../../shared/components/form/form-input/form-input';
+import { Autocomplete } from '../../../../../shared/components/form/autocomplete/autocomplete';
+import {
+  AutocompleteDisplayFn,
+  AutocompleteResolveValueFn,
+  AutocompleteSearchFn,
+  AutocompleteValueFn
+} from '../../../../../shared/components/form/autocomplete/autocomplete.types';
+import { Modal } from '../../../../../shared/components/modal/modal';
+import { FilterCard } from '../../../../../shared/components/filter-card/filter-card';
+
+interface CityTableRow extends DataTableRecord {
+  id: string;
+  stateId: string;
+  name: string;
+  code: string | null;
+  timezoneId: string | null;
+  isActive: boolean;
+  serialNumber: number;
+  state: string;
+  country: string;
+  createdOn?: string;
+  modifiedOn?: string | null;
+}
+
+@Component({
+  selector: 'city-list',
+  standalone: true,
+  imports: [DataTable, Modal, ReactiveFormsModule, FormInput, Autocomplete, FilterCard],
+  templateUrl: './city-list.html',
+  styleUrl: './city-list.scss'
+})
+export class CityList {
+  private readonly destroyRef = inject(DestroyRef);
+  private readonly cityApi = inject(CityService);
+  private readonly countryApi = inject(CountryService);
+  private readonly stateApi = inject(StateService);
+  private readonly timezoneApi = inject(TimezoneService);
+  private readonly formBuilder = inject(FormBuilder);
+  private readonly elementRef = inject<ElementRef<HTMLElement>>(ElementRef);
+  private readonly toastr = inject(ToastrService);
+  private readonly cityQueryRequests$ = new Subject<DataTableQuery>();
+
+  readonly queryState = new DataTableQueryState();
+  readonly cities = signal<CityTableRow[]>([]);
+  readonly selectedCountryId = signal<string | null>(null);
+  readonly selectedStateId = signal<string | null>(null);
+  readonly appliedCountryId = signal<string | null>(null);
+  readonly appliedStateId = signal<string | null>(null);
+  readonly selectedCountry = signal<CountryLookupDto | null>(null);
+  readonly selectedFilterState = signal<StateLookupDto | null>(null);
+  readonly selectedFormCountry = signal<CountryLookupDto | null>(null);
+  readonly selectedFormState = signal<StateLookupDto | null>(null);
+  readonly totalRecords = signal(0);
+  readonly saving = signal(false);
+  readonly showCityModal = signal(false);
+  readonly modalMode = signal<CityModalMode>('create');
+  readonly selectedCity = signal<CityDto | null>(null);
+  readonly submitAttempted = signal(false);
+
+  readonly filterForm = this.formBuilder.nonNullable.group({
+    countryId: [''],
+    stateId: [{ value: '', disabled: true }]
+  });
+
+  readonly cityForm = this.formBuilder.nonNullable.group({
+    countryId: ['', Validators.required],
+    stateId: ['', Validators.required],
+    name: ['', [Validators.required, Validators.maxLength(150)]],
+    code: [
+      '',
+      [
+        Validators.required,
+        Validators.maxLength(16),
+        Validators.pattern(/^[A-Za-z0-9_-]+$/)
+      ]
+    ],
+    timezoneId: this.formBuilder.control<string | null>(null)
+  });
+
+  readonly searchTimezones: AutocompleteSearchFn<TimezoneLookupDto> =
+    (term, limit) => this.timezoneApi.autocomplete(term, limit);
+  readonly searchCountries: AutocompleteSearchFn<CountryLookupDto> =
+    (term, limit) => this.countryApi.autocomplete(term, limit).pipe(
+      catchError(() => {
+        this.toastr.error('Unable to load countries.');
+        return of<CountryLookupDto[]>([]);
+      })
+    );
+  readonly searchFilterStates: AutocompleteSearchFn<StateLookupDto> =
+    (term, limit) => {
+      const countryId = this.selectedCountryId();
+      if (!countryId) return of<StateLookupDto[]>([]);
+      return this.stateApi.autocomplete(countryId, term, limit).pipe(
+        catchError(() => {
+          this.toastr.error('Unable to load states.');
+          return of<StateLookupDto[]>([]);
+        })
+      );
+    };
+  readonly searchFormStates: AutocompleteSearchFn<StateLookupDto> =
+    (term, limit) => {
+      const countryId = this.cityForm.controls.countryId.value;
+      if (!countryId) return of<StateLookupDto[]>([]);
+      return this.stateApi.autocomplete(countryId, term, limit).pipe(
+        catchError(() => {
+          this.toastr.error('Unable to load states.');
+          return of<StateLookupDto[]>([]);
+        })
+      );
+    };
+  readonly displayCountry: AutocompleteDisplayFn<CountryLookupDto> = country => country.name;
+  readonly countryValue: AutocompleteValueFn<CountryLookupDto, string> = country => country.id;
+  readonly resolveCountry: AutocompleteResolveValueFn<CountryLookupDto, string> =
+    value => this.countryApi.getCountryById(value).pipe(
+      map(country => ({ id: country.id, iso2: country.iso2, name: country.name }))
+    );
+  readonly displayState: AutocompleteDisplayFn<StateLookupDto> = state => state.name;
+  readonly stateValue: AutocompleteValueFn<StateLookupDto, string> = state => state.id;
+  readonly resolveState: AutocompleteResolveValueFn<StateLookupDto, string> =
+    value => this.stateApi.getStateById(value).pipe(
+      map(state => ({ id: state.id, name: state.name, code: state.code ?? '' }))
+    );
+  readonly displayTimezone: AutocompleteDisplayFn<TimezoneLookupDto> =
+    timezone => `${timezone.ianaId} — ${timezone.displayName}`;
+  readonly timezoneValue: AutocompleteValueFn<TimezoneLookupDto, string> =
+    timezone => timezone.id;
+  readonly resolveTimezone: AutocompleteResolveValueFn<TimezoneLookupDto, string> =
+    value => this.timezoneApi.getById(value).pipe(map(timezone => this.toTimezoneLookup(timezone)));
+  readonly filterStatePlaceholder = computed(() =>
+    this.selectedCountryId() ? 'Search' : 'Select a country first'
+  );
+  readonly formStatePlaceholder = computed(() =>
+    this.cityForm.controls.countryId.value ? 'Search' : 'Search'
+  );
+  readonly emptyMessage = computed(() =>
+    this.appliedCountryId() && this.appliedStateId()
+      ? 'No cities found'
+      : 'Select a country and state'
+  );
+
+  readonly emptyDescription = computed(() =>
+    this.appliedCountryId() && this.appliedStateId()
+      ? 'There are no cities available for the selected state.'
+      : 'Choose a country and state to view available cities.'
+  );
+  readonly modalTitle = computed(() => {
+    const mode = this.modalMode();
+    return mode === 'create' ? 'Add City' : mode === 'edit' ? 'Edit City' : 'View City';
+  });
+  readonly submitLabel = computed(() =>
+    this.modalMode() === 'create' ? 'Save' : 'Update'
+  );
+  readonly loadingLabel = computed(() =>
+    this.modalMode() === 'create' ? 'Saving...' : 'Updating...'
+  );
+
+  readonly columns = signal<DataTableColumn<CityTableRow>[]>([
+    { key: 'serialNumber', label: 'Sr. No.', header: 'Sr. No.', sortable: false, width: '70px' },
+    { key: 'name', label: 'City Name', header: 'City Name', sortable: true, align: 'left' },
+    { key: 'code', label: 'Code', header: 'Code', sortable: true },
+    { key: 'stateName', label: 'State', header: 'State', sortable: false },
+    { key: 'countryName', label: 'Country', header: 'Country', sortable: false },
+    {
+      key: 'isActive',
+      label: 'Status',
+      header: 'Status',
+      sortable: true,
+      badge: true,
+      width: '100px',
+      formatter: value => value ? 'Active' : 'Inactive',
+      badgeClass: value => value === true
+        ? 'badge bg-success/10 text-success'
+        : 'badge bg-danger/10 text-danger'
+    }
+  ]);
+
+  readonly actions = signal<DataTableAction<CityTableRow>[]>([
+    // { type: 'view', label: 'View', icon: 'ti ti-eye', className: 'text-info' },
+    { type: 'edit', label: 'Edit', icon: 'ti ti-edit', className: 'text-primary' },
+    {
+      type: 'deactivate',
+      label: 'Deactivate',
+      icon: 'ti ti-ban',
+      className: 'text-danger',
+      visible: row => row.isActive
+    },
+    {
+      type: 'activate',
+      label: 'Activate',
+      icon: 'ti ti-check',
+      className: 'text-success',
+      visible: row => !row.isActive
+    }
+  ]);
+
+  constructor() {
+    this.configureCityQueries();
+    this.configureFilterChanges();
+    this.configureFormChanges();
+  }
+
+  ngOnInit(): void {
+    this.loadCities(this.queryState.getQuery());
+  }
+
+  onFilterCountrySelected(country: CountryLookupDto): void {
+    this.selectedCountry.set(country);
+  }
+
+  onFilterCountryCleared(): void {
+    this.selectedCountry.set(null);
+  }
+
+  onFilterStateSelected(state: StateLookupDto): void {
+    this.selectedFilterState.set(state);
+  }
+
+  onFilterStateCleared(): void {
+    this.selectedFilterState.set(null);
+  }
+
+  applyCityFilters(): void {
+    const countryId = this.filterForm.controls.countryId.value || null;
+    const stateId = this.filterForm.controls.stateId.value || null;
+
+    this.appliedCountryId.set(countryId);
+    this.appliedStateId.set(stateId);
+
+    this.loadCities(this.queryState.setPage({
+      pageIndex: 1,
+      pageSize: this.queryState.pageSize()
+    }));
+  }
+
+  onFormCountrySelected(country: CountryLookupDto): void {
+    this.selectedFormCountry.set(country);
+  }
+
+  onFormCountryCleared(): void {
+    this.selectedFormCountry.set(null);
+  }
+
+  onFormStateSelected(state: StateLookupDto): void {
+    this.selectedFormState.set(state);
+  }
+
+  onFormStateCleared(): void {
+    this.selectedFormState.set(null);
+  }
+
+  loadCities(query: DataTableQuery): void {
+    this.cityQueryRequests$.next(query);
+  }
+
+  onSearch(value: string): void {
+    this.loadCities(this.queryState.setSearch(value.trim()));
+  }
+
+  onPageChange(event: DataTablePageEvent): void {
+    this.loadCities(this.queryState.setPage(event));
+  }
+
+  onSortChange(event: DataTableSortEvent): void {
+    this.loadCities(this.queryState.setSort(event));
+  }
+
+  onActionClick(event: DataTableActionEvent<CityTableRow>): void {
+    const city = this.toCityDto(event.row);
+    switch (event.action.type) {
+      case 'edit':
+        this.openExistingCity(city, 'edit');
+        break;
+      case 'activate':
+        this.updateCityStatus(city, true);
+        break;
+      case 'deactivate':
+        this.updateCityStatus(city, false);
+        break;
+    }
+  }
+
+  onAddCity(): void {
+    this.modalMode.set('create');
+    this.selectedCity.set(null);
+    this.submitAttempted.set(false);
+    this.selectedFormCountry.set(null);
+    this.selectedFormState.set(null);
+    this.cityForm.enable({ emitEvent: false });
+    this.cityForm.reset({ countryId: '', stateId: '', name: '', code: '', timezoneId: null }, { emitEvent: false });
+    this.resetFormState();
+    this.showCityModal.set(true);
+  }
+
+  closeCityModal(): void {
+    if (this.saving()) return;
+    this.showCityModal.set(false);
+    this.selectedCity.set(null);
+    this.selectedFormCountry.set(null);
+    this.selectedFormState.set(null);
+    this.submitAttempted.set(false);
+  }
+
+  saveCity(): void {
+    if (this.saving()) return;
+    if (this.cityForm.invalid) {
+      this.submitAttempted.set(true);
+      this.cityForm.markAllAsTouched();
+      this.focusFirstInvalidControl();
+      return;
+    }
+
+    this.saving.set(true);
+    const city = this.selectedCity();
+    const request$ = this.modalMode() === 'create'
+      ? this.cityApi.createCity(this.buildCreateRequest())
+      : city
+        ? this.cityApi.updateCity(city.id, this.buildUpdateRequest(city.isActive))
+        : null;
+
+    if (!request$) {
+      this.saving.set(false);
+      return;
+    }
+
+    request$.pipe(finalize(() => this.saving.set(false))).subscribe({
+      next: () => {
+        this.toastr.success(
+          this.modalMode() === 'create'
+            ? 'City saved successfully.'
+            : 'City updated successfully.'
+        );
+        this.showCityModal.set(false);
+        this.selectedCity.set(null);
+        this.loadCities(this.queryState.getQuery());
+      }
+    });
+  }
+
+  private configureCityQueries(): void {
+    this.cityQueryRequests$.pipe(
+      switchMap(query => {
+        const stateId = this.appliedStateId();
+        const countryId = this.appliedCountryId();
+        return this.cityApi.getCityDataTable(query, countryId, stateId).pipe(
+              catchError(() => {
+                this.toastr.error('Unable to load cities.');
+                this.clearGrid();
+                return of(null);
+              })
+            );
+      }),
+      takeUntilDestroyed(this.destroyRef)
+    ).subscribe(response => {
+      if (!response) return;
+      const query = this.queryState.getQuery();
+      if (response.draw !== query.draw) return;
+
+      this.cities.set(response.rows.map((city, index) => ({
+        ...city,
+        serialNumber: (query.page - 1) * query.pageSize + index + 1
+      })));
+      this.totalRecords.set(response.filtered);
+    });
+  }
+
+  private configureFilterChanges(): void {
+    this.filterForm.controls.countryId.valueChanges.pipe(
+      distinctUntilChanged(),
+      takeUntilDestroyed(this.destroyRef)
+    ).subscribe(countryId => {
+      if (!countryId || this.selectedCountry()?.id !== countryId) {
+        this.selectedCountry.set(null);
+      }
+
+      this.selectedCountryId.set(countryId || null);
+      this.selectedStateId.set(null);
+      this.selectedFilterState.set(null);
+
+      this.filterForm.controls.stateId.reset('', { emitEvent: false });
+      countryId
+        ? this.filterForm.controls.stateId.enable({ emitEvent: false })
+        : this.filterForm.controls.stateId.disable({ emitEvent: false });
+
+    });
+
+    this.filterForm.controls.stateId.valueChanges.pipe(
+      distinctUntilChanged(),
+      takeUntilDestroyed(this.destroyRef)
+    ).subscribe(stateId => {
+      if (!stateId || this.selectedFilterState()?.id !== stateId) {
+        this.selectedFilterState.set(null);
+      }
+
+      this.selectedStateId.set(stateId || null);
+    });
+  }
+
+  private configureFormChanges(): void {
+    this.cityForm.controls.countryId.valueChanges.pipe(
+      distinctUntilChanged(),
+      takeUntilDestroyed(this.destroyRef)
+    ).subscribe(countryId => {
+      if (!this.showCityModal() || this.modalMode() !== 'create') return;
+
+      if (!countryId || this.selectedFormCountry()?.id !== countryId) {
+        this.selectedFormCountry.set(null);
+      }
+
+      this.selectedFormState.set(null);
+      this.cityForm.controls.stateId.reset('', { emitEvent: false });
+      this.cityForm.controls.stateId.enable({ emitEvent: false });
+    });
+  }
+
+  private openExistingCity(city: CityDto, mode: 'edit'): void {
+    this.cityApi.getCityById(city.id).pipe(
+      switchMap(details => this.stateApi.getStateById(details.stateId).pipe(
+        map(stateDetails => ({ details, countryId: stateDetails.countryId }))
+      )),
+      take(1)
+    ).subscribe(({ details, countryId }) => {
+      this.selectedCity.set(details);
+      this.modalMode.set(mode);
+      this.submitAttempted.set(false);
+      this.selectedFormCountry.set(null);
+      this.selectedFormState.set(null);
+      this.cityForm.enable({ emitEvent: false });
+      this.cityForm.reset({
+        countryId,
+        stateId: details.stateId,
+        name: details.name ?? '',
+        code: details.code ?? '',
+        timezoneId: details.timezoneId
+      }, { emitEvent: false });
+      // this.cityForm.controls.countryId.disable({ emitEvent: false });
+      // this.cityForm.controls.stateId.disable({ emitEvent: false });
+      this.resetFormState();
+      this.showCityModal.set(true);
+    });
+  }
+
+  private updateCityStatus(city: CityDto, isActive: boolean): void {
+    this.cityApi.updateCity(city.id, {
+      name: city.name.trim(),
+      code: city.code?.trim().toUpperCase() ?? '',
+      timezoneId: city.timezoneId,
+      isActive
+    }).subscribe(() => {
+      this.toastr.success(
+        isActive ? 'City activated successfully.' : 'City deactivated successfully.'
+      );
+      this.loadCities(this.queryState.getQuery());
+    });
+  }
+
+  private buildCreateRequest(): CreateCityRequest {
+    const value = this.cityForm.getRawValue();
+    return {
+      stateId: value.stateId,
+      name: value.name.trim(),
+      code: value.code.trim().toUpperCase(),
+      timezoneId: value.timezoneId
+    };
+  }
+
+  private buildUpdateRequest(isActive: boolean): UpdateCityRequest {
+    const value = this.cityForm.getRawValue();
+    return {
+      name: value.name.trim(),
+      code: value.code.trim().toUpperCase(),
+      timezoneId: value.timezoneId,
+      isActive
+    };
+  }
+
+  private clearGrid(): void {
+    this.cities.set([]);
+    this.totalRecords.set(0);
+  }
+
+  private resetFormState(): void {
+    this.cityForm.markAsPristine();
+    this.cityForm.markAsUntouched();
+    this.cityForm.updateValueAndValidity();
+  }
+
+  private focusFirstInvalidControl(): void {
+    queueMicrotask(() => {
+      const control = this.elementRef.nativeElement.querySelector<HTMLElement>(
+        'modal [data-form-control][aria-invalid="true"]'
+      );
+      control?.focus();
+      control?.scrollIntoView({ behavior: 'smooth', block: 'center' });
+    });
+  }
+
+  private toCityDto(row: CityTableRow): CityDto {
+    return {
+      id: row.id,
+      stateId: row.stateId,
+      name: row.name,
+      state: row.state,
+      country: row.country,
+      code: row.code,
+      timezoneId: row.timezoneId,
+      isActive: row.isActive,
+      createdOn: row.createdOn,
+      modifiedOn: row.modifiedOn
+    };
+  }
+
+  private toTimezoneLookup(timezone: TimezoneDto): TimezoneLookupDto {
+    return {
+      id: timezone.id,
+      ianaId: timezone.ianaId,
+      displayName: timezone.displayName
+    };
+  }
+}
diff --git a/src/app/features/global-masters/countries/data-access/country.endpoints.ts b/src/app/features/global-masters/countries/data-access/country.endpoints.ts
new file mode 100644
index 00000000..e4a7b4d5
--- /dev/null
+++ b/src/app/features/global-masters/countries/data-access/country.endpoints.ts
@@ -0,0 +1,21 @@
+import { buildApiUrl } from '../../../../core/config/api-url.util';
+
+export const COUNTRY_ENDPOINTS = {
+  dataTable: buildApiUrl('masterAdmin', '/v1/countries/datatable'),
+
+  create: buildApiUrl('masterAdmin', '/v1/countries'),
+
+  getById: (id: string) =>
+    buildApiUrl('masterAdmin', `/v1/countries/${encodeURIComponent(id)}`),
+
+  autocomplete: buildApiUrl('masterAdmin', '/v1/countries/autocomplete'),
+
+  update: (id: string) =>
+    buildApiUrl('masterAdmin', `/v1/countries/${encodeURIComponent(id)}`),
+
+  delete: (id: string) =>
+    buildApiUrl('masterAdmin', `/v1/countries/${encodeURIComponent(id)}`),
+
+  changeStatus: (id: string) =>
+    buildApiUrl('masterAdmin', `/v1/countries/${encodeURIComponent(id)}/status`),
+} as const;
diff --git a/src/app/features/global-masters/countries/data-access/country.service.ts b/src/app/features/global-masters/countries/data-access/country.service.ts
new file mode 100644
index 00000000..10d406b0
--- /dev/null
+++ b/src/app/features/global-masters/countries/data-access/country.service.ts
@@ -0,0 +1,44 @@
+import { HttpClient, HttpParams } from '@angular/common/http';
+import { Injectable, inject } from '@angular/core';
+import { Observable } from 'rxjs';
+
+import {
+  DataTableQuery,
+  DataTableResult,
+} from '../../../../shared/components/data-table/data-table.types';
+import {
+  CountryDto,
+  CountryLookupDto,
+  CreateCountryRequest,
+  UpdateCountryRequest,
+} from '../models/country.model';
+import { COUNTRY_ENDPOINTS } from './country.endpoints';
+
+@Injectable({
+  providedIn: 'root',
+})
+export class CountryService {
+  private readonly http = inject(HttpClient);
+
+  getCountryDataTable(query: DataTableQuery): Observable<DataTableResult<CountryDto>> {
+    return this.http.post<DataTableResult<CountryDto>>(COUNTRY_ENDPOINTS.dataTable, query);
+  }
+
+  createCountry(request: CreateCountryRequest): Observable<CountryDto> {
+    return this.http.post<CountryDto>(COUNTRY_ENDPOINTS.create, request);
+  }
+
+  updateCountry(id: string, request: UpdateCountryRequest): Observable<CountryDto> {
+    return this.http.put<CountryDto>(COUNTRY_ENDPOINTS.update(id), request);
+  }
+
+  getCountryById(id: string): Observable<CountryDto> {
+    return this.http.get<CountryDto>(COUNTRY_ENDPOINTS.getById(id));
+  }
+
+  autocomplete(term = '', limit = 50): Observable<CountryLookupDto[]> {
+    return this.http.get<CountryLookupDto[]>(COUNTRY_ENDPOINTS.autocomplete, {
+      params: new HttpParams().set('term', term).set('limit', limit),
+    });
+  }
+}
diff --git a/src/app/features/global-masters/countries/models/country.model.ts b/src/app/features/global-masters/countries/models/country.model.ts
new file mode 100644
index 00000000..9c4b220f
--- /dev/null
+++ b/src/app/features/global-masters/countries/models/country.model.ts
@@ -0,0 +1,31 @@
+export interface CountryDto {
+  id: string;
+  iso2: string;
+  iso3: string;
+  name: string;
+  phoneCode: string | null;
+  defaultCurrencyId: string | null;
+  isActive: boolean;
+  createdOn?: string;
+  modifiedOn?: string | null;
+}
+
+export interface CountryLookupDto {
+  id: string;
+  iso2: string;
+  name: string;
+}
+
+export interface CreateCountryRequest {
+  iso2: string;
+  iso3: string;
+  name: string;
+  phoneCode: string | null;
+  defaultCurrencyId: string | null;
+}
+
+export interface UpdateCountryRequest extends CreateCountryRequest {
+  isActive: boolean;
+}
+
+export type CountryModalMode = 'create' | 'edit';
diff --git a/src/app/features/global-masters/countries/pages/country-list/country-list.html b/src/app/features/global-masters/countries/pages/country-list/country-list.html
new file mode 100644
index 00000000..43a71e14
--- /dev/null
+++ b/src/app/features/global-masters/countries/pages/country-list/country-list.html
@@ -0,0 +1,96 @@
+<app-data-table [columns]="columns()" [rows]="countries()" [actions]="actions()"
+  (addClicked)="onAddCountry()" [totalRecords]="totalRecords()" [pageIndex]="queryState.pageIndex()"
+  [pageSize]="queryState.pageSize()" tableTitle="Countries" buttonTitle="Add"
+  [showSearch]="true" [showAddButton]="true" searchPlaceholder="Search countries..." [searchDebounceTime]="300"
+  (searchChanged)="onSearch($event)" (pageChanged)="onPageChange($event)" (sortChanged)="onSortChange($event)"
+  (actionClicked)="onActionClick($event)" toolTip="Add Country">
+  <ng-template appDataTableCell="name" let-row let-value="value">
+    <div class="flex items-center gap-2">
+      @if (getFlagUrl(row.iso2); as flagUrl) {
+      <img [src]="flagUrl" [alt]="value + ' flag'" class="w-6 h-[18px] object-cover rounded-sm shrink-0"
+        (error)="onFlagError($event)" />
+      }
+
+      <span class="font-semibold">
+        {{ value }}
+      </span>
+    </div>
+  </ng-template>
+</app-data-table>
+
+<app-confirm-dialog
+  title="Delete Country"
+  text="Do you really want to delete this country?"
+  confirmButtonText="Delete"
+  cancelButtonText="Cancel"
+  (confirmed)="onDeleteConfirmed()"
+  (cancelled)="onDeleteCancelled()"
+/>
+
+<modal [open]="showCountryModal()" [title]="countryModalTitle()" size="md"
+  [submitAction]="countrySubmitAction()" [submitLabel]="countrySubmitLabel()" [loadingLabel]="countryLoadingLabel()"
+  [loading]="saving()" (closed)="closeCountryModal()"
+  (submitted)="saveCountry()">
+  <form [formGroup]="countryForm" (ngSubmit)="saveCountry()" autocomplete="off">
+    <div class="grid grid-cols-12 gap-x-5 gap-y-5">
+      <div class="col-span-6">
+        <app-form-input formControlName="name" inputId="country-name" label="Country Name" variant="floating"
+          placeholder="Name" autocomplete="off" [required]="true" [maxLength]="150" [validationMessages]="{
+            required: 'Country Name is required.',
+            maxlength: 'Country Name cannot exceed 150 characters.'
+          }" [submitAttempted]="countrySubmitAttempted()" />
+      </div>
+      <div class="col-span-6">
+        <app-autocomplete
+          formControlName="defaultCurrencyId"
+          inputId="country-default-currency-id"
+          variant="floating"
+          label="Currency"
+          placeholder="e.g.: USD"
+          [searchFn]="searchCurrencies"
+          [displayWith]="displayCurrency"
+          [valueWith]="currencyValue"
+          [selectedItem]="selectedCurrency()"
+          [minSearchLength]="1"
+          [debounceTime]="300"
+          [limit]="10"
+          [clearable]="true"
+          emptyText="No currencies found"
+          typeToSearchText="Type to search currencies"
+          [submitAttempted]="countrySubmitAttempted()"
+          wrapperClass="w-full"
+        />
+      </div>
+
+      <div class="col-span-12 md:col-span-6">
+        <app-form-input formControlName="iso2" inputId="country-iso2" label="ISO2 Code" placeholder="e.g.: IN" variant="floating"
+           autocomplete="off" [required]="true" [minLength]="2" [maxLength]="2"
+          [validationMessages]="{
+            required: 'ISO2 Code is required.',
+            minlength: 'ISO2 Code must contain exactly 2 letters.',
+            maxlength: 'ISO2 Code must contain exactly 2 letters.',
+            pattern: 'ISO2 Code can contain letters only.'
+          }" [submitAttempted]="countrySubmitAttempted()" />
+      </div>
+
+      <div class="col-span-12 md:col-span-6">
+        <app-form-input formControlName="iso3" inputId="country-iso3" label="ISO3 Code" placeholder="e.g.: IND" variant="floating"
+           autocomplete="off" [required]="true" [minLength]="3" [maxLength]="3"
+          [validationMessages]="{
+            required: 'ISO3 Code is required.',
+            minlength: 'ISO3 Code must contain exactly 3 letters.',
+            maxlength: 'ISO3 Code must contain exactly 3 letters.',
+            pattern: 'ISO3 Code can contain letters only.'
+          }" [submitAttempted]="countrySubmitAttempted()" />
+      </div>
+
+      <div class="col-span-12 md:col-span-6">
+        <app-form-input formControlName="phoneCode" inputId="country-phone-code" label="Phone Code" type="tel" variant="floating"
+          inputMode="tel" placeholder="e.g.: +91" autocomplete="off" [maxLength]="16" [validationMessages]="{
+            maxlength: 'Phone Code cannot exceed 16 characters.',
+            pattern: 'Phone Code can contain an optional plus sign, digits, hyphens, and spaces only.'
+          }" [submitAttempted]="countrySubmitAttempted()" />
+      </div>
+    </div>
+  </form>
+</modal>
diff --git a/src/app/features/global-masters/countries/pages/country-list/country-list.scss b/src/app/features/global-masters/countries/pages/country-list/country-list.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/src/app/features/global-masters/countries/pages/country-list/country-list.ts b/src/app/features/global-masters/countries/pages/country-list/country-list.ts
new file mode 100644
index 00000000..a46ddcf1
--- /dev/null
+++ b/src/app/features/global-masters/countries/pages/country-list/country-list.ts
@@ -0,0 +1,559 @@
+import { Component, DestroyRef, ElementRef, computed, inject, signal, viewChild } from '@angular/core';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import {
+  FormBuilder,
+  ReactiveFormsModule,
+  Validators
+} from '@angular/forms';
+import { ToastrService } from 'ngx-toastr';
+import { Subject, catchError, finalize, map, of, switchMap } from 'rxjs';
+
+import {
+  CountryDto,
+  CountryModalMode,
+  CreateCountryRequest,
+  UpdateCountryRequest
+} from '../../models/country.model';
+import { CurrencyLookupDto, CurrencyService } from '../../../currencies/public-api';
+import { CountryService } from '../../data-access/country.service';
+import { DataTableQueryState } from '../../../../../shared/components/data-table/data-table-query.state';
+import {
+  DataTableAction,
+  DataTableActionEvent,
+  DataTableColumn,
+  DataTablePageEvent,
+  DataTableQuery,
+  DataTableRecord,
+  DataTableSortEvent
+} from '../../../../../shared/components/data-table/data-table.types';
+import { DataTable } from '../../../../../shared/components/data-table/data-table';
+import { DataTableCellDirective } from '../../../../../shared/directives/data-table-cell.directive';
+import { Autocomplete } from '../../../../../shared/components/form/autocomplete/autocomplete';
+import {
+  AutocompleteDisplayFn,
+  AutocompleteSearchFn,
+  AutocompleteValueFn
+} from '../../../../../shared/components/form/autocomplete/autocomplete.types';
+import { FormInput } from '../../../../../shared/components/form/form-input/form-input';
+import { Modal } from '../../../../../shared/components/modal/modal';
+import { ConfirmDialog } from '../../../../../shared/components/confirm-dialog/confirm-dialog';
+
+interface CountryTableRow extends DataTableRecord {
+  id: string;
+  iso2: string;
+  iso3: string;
+  name: string;
+  phoneCode: string | null;
+  defaultCurrencyId: string | null;
+  isActive: boolean;
+  serialNumber: number;
+  createdOn?: string;
+  modifiedOn?: string | null;
+}
+
+@Component({
+  selector: 'country-list',
+  standalone: true,
+  imports: [DataTable, DataTableCellDirective, Modal, ReactiveFormsModule, FormInput, Autocomplete, ConfirmDialog],
+  templateUrl: './country-list.html',
+  styleUrl: './country-list.scss',
+})
+export class CountryList {
+  private readonly destroyRef = inject(DestroyRef);
+  private readonly countryApi = inject(CountryService);
+  private readonly currencyApi = inject(CurrencyService);
+  private readonly formBuilder = inject(FormBuilder);
+  private readonly elementRef = inject<ElementRef<HTMLElement>>(ElementRef);
+  private readonly toastr = inject(ToastrService);
+  private readonly countryQueryRequests$ = new Subject<DataTableQuery>();
+
+  readonly queryState = new DataTableQueryState();
+
+  readonly countries = signal<CountryTableRow[]>([]);
+  readonly totalRecords = signal(0);
+  readonly filteredRecords = signal(0);
+  readonly saving = signal(false);
+
+  readonly showCountryModal = signal(false);
+  readonly countryModalMode = signal<CountryModalMode>('create');
+  readonly selectedCountryId = signal<string | null>(null);
+  readonly selectedCountry = signal<CountryDto | null>(null);
+  readonly selectedCurrency = signal<CurrencyLookupDto | null>(null);
+  readonly countrySubmitAttempted = signal(false);
+  readonly pendingDeleteCountry = signal<CountryDto | null>(null);
+  readonly deleteConfirmDialog = viewChild(ConfirmDialog);
+
+  readonly countryForm = this.formBuilder.nonNullable.group({
+    name: [
+      '',
+      [
+        Validators.required,
+        Validators.maxLength(150)
+      ]
+    ],
+    iso2: [
+      '',
+      [
+        Validators.required,
+        Validators.pattern(/^[A-Za-z]{2}$/)
+      ]
+    ],
+    iso3: [
+      '',
+      [
+        Validators.required,
+        Validators.pattern(/^[A-Za-z]{3}$/)
+      ]
+    ],
+    phoneCode: [
+      '',
+      [
+        Validators.maxLength(16),
+        Validators.pattern(/^\+?[0-9\- ]{1,15}$/)
+      ]
+    ],
+    defaultCurrencyId: this.formBuilder.control<string | null>(null)
+  });
+
+  readonly searchCurrencies: AutocompleteSearchFn<CurrencyLookupDto> =
+    (term, limit) => this.currencyApi.autocomplete(term, limit);
+  readonly displayCurrency: AutocompleteDisplayFn<CurrencyLookupDto> = currency => {
+    const baseLabel = [currency.code, currency.name].filter(Boolean).join(' - ');
+
+    return currency.symbol?.trim()
+      ? `${baseLabel} (${currency.symbol})`
+      : baseLabel;
+  };
+  readonly currencyValue: AutocompleteValueFn<CurrencyLookupDto, string> = currency => currency.id;
+
+  readonly countryModalTitle = computed(() =>
+    this.countryModalMode() === 'create'
+      ? 'Add Country'
+      : 'Edit Country'
+  );
+
+  readonly countrySubmitLabel = computed(() =>
+    this.countryModalMode() === 'create'
+      ? 'Save'
+      : 'Update'
+  );
+
+  readonly countryLoadingLabel = computed(() =>
+    this.countryModalMode() === 'create'
+      ? 'Saving...'
+      : 'Updating...'
+  );
+
+  readonly countrySubmitAction = computed<'save' | 'update'>(() =>
+    this.countryModalMode() === 'create'
+      ? 'save'
+      : 'update'
+  );
+
+  readonly columns = signal<DataTableColumn<CountryTableRow>[]>([
+    { key: 'serialNumber', label: 'Sr. No.', header: 'Sr.No.', sortable: false, width: '100px' },
+    { key: 'name', label: 'Name', header: 'Name', sortable: true, align: 'left' },
+    { key: 'iso2', label: 'ISO2', header: 'ISO2', sortable: true },
+    { key: 'iso3', label: 'ISO3', header: 'ISO3', sortable: true },
+    { key: 'phoneCode', label: 'Phone Code', header: 'Phone Code', sortable: true },
+    { key: 'currencyName', label: 'Default Currency', header: 'Default Currency', sortable: true, align: 'left' },
+    {
+      key: 'isActive',
+      label: 'Status',
+      header: 'Status',
+      sortable: true,
+      badge: true,
+      badgeClass: value =>
+        value === true
+          ? 'badge bg-success/10 text-success'
+          : 'badge bg-danger/10 text-danger',
+      formatter: value => value ? 'Active' : 'Inactive'
+    }
+  ]);
+
+  readonly actions = signal<DataTableAction<CountryTableRow>[]>([
+    {
+      type: 'edit',
+      label: 'Edit',
+      icon: 'ti ti-edit',
+      className: 'text-primary'
+    },
+    {
+      type: 'delete',
+      label: 'Delete',
+      icon: 'ti ti-trash',
+      className: 'text-danger',
+      visible: row => row.isActive
+    },
+    {
+      type: 'activate',
+      label: 'Activate',
+      icon: 'ti ti-check',
+      className: 'text-success',
+      visible: row => !row.isActive
+    }
+  ]);
+
+  constructor() {
+    this.countryQueryRequests$
+      .pipe(
+        switchMap(query =>
+          this.countryApi.getCountryDataTable(query).pipe(
+            catchError(() => {
+              this.toastr.error('Unable to load countries.');
+              this.clearCountryGrid();
+              return of(null);
+            })
+          )
+        ),
+        takeUntilDestroyed(this.destroyRef)
+      )
+      .subscribe(response => {
+        if (!response) {
+          return;
+        }
+
+        const query = this.queryState.getQuery();
+
+        if (response.draw !== query.draw) {
+          return;
+        }
+
+        const countriesWithSerialNumbers: CountryTableRow[] = response.rows.map((country, index) => ({
+          ...country,
+          serialNumber: (query.page - 1) * query.pageSize + index + 1
+        }));
+
+        this.countries.set(countriesWithSerialNumbers);
+        this.totalRecords.set(response.total);
+        this.filteredRecords.set(response.filtered);
+      });
+  }
+
+  ngOnInit(): void {
+    this.loadCountries(this.queryState.getQuery());
+  }
+
+  loadCountries(query: DataTableQuery): void {
+    this.countryQueryRequests$.next(query);
+  }
+
+  onSearch(value: string): void {
+    const query = this.queryState.setSearch(value.trim());
+    this.loadCountries(query);
+  }
+
+  onPageChange(event: DataTablePageEvent): void {
+    const query = this.queryState.setPage(event);
+    this.loadCountries(query);
+  }
+
+  onSortChange(event: DataTableSortEvent): void {
+    const query = this.queryState.setSort(event);
+    this.loadCountries(query);
+  }
+
+  onRefresh(): void {
+    const currentQuery = this.queryState.getQuery();
+
+    this.loadCountries({
+      ...currentQuery,
+      draw: currentQuery.draw + 1
+    });
+  }
+
+  onReset(): void {
+    const query = this.queryState.reset();
+    this.loadCountries(query);
+  }
+
+  onDeleteConfirmed(): void {
+    const country = this.pendingDeleteCountry();
+
+    if (!country) {
+      return;
+    }
+
+    this.pendingDeleteCountry.set(null);
+    this.deleteCountry(country);
+  }
+
+  onDeleteCancelled(): void {
+    this.pendingDeleteCountry.set(null);
+  }
+
+  onActionClick(event: DataTableActionEvent<CountryTableRow>): void {
+    const country = this.toCountryDto(event.row);
+
+    switch (event.action.type) {
+      case 'view':
+        this.viewCountry(country);
+        break;
+      case 'edit':
+        this.openEditCountry(country);
+        break;
+      case 'delete':
+        this.requestDeleteCountry(country);
+        break;
+      case 'activate':
+        this.activateCountry(country);
+        break;
+    }
+  }
+
+  onAddCountry(): void {
+    this.countryModalMode.set('create');
+    this.selectedCountryId.set(null);
+    this.selectedCountry.set(null);
+    this.selectedCurrency.set(null);
+    this.countrySubmitAttempted.set(false);
+
+    this.countryForm.reset({
+      name: '',
+      iso2: '',
+      iso3: '',
+      phoneCode: '',
+      defaultCurrencyId: null
+    });
+    this.resetCountryFormState();
+
+    this.showCountryModal.set(true);
+  }
+
+  closeCountryModal(): void {
+    if (this.saving()) {
+      return;
+    }
+
+    this.showCountryModal.set(false);
+    this.selectedCountryId.set(null);
+    this.selectedCountry.set(null);
+    this.selectedCurrency.set(null);
+    this.countrySubmitAttempted.set(false);
+  }
+
+  saveCountry(): void {
+    if (this.countryForm.invalid) {
+      this.countrySubmitAttempted.set(true);
+      this.countryForm.markAllAsTouched();
+      this.focusFirstInvalidCountryControl();
+      return;
+    }
+
+    if (this.saving()) {
+      return;
+    }
+
+    this.saving.set(true);
+
+    if (this.countryModalMode() === 'create') {
+      this.countryApi
+        .createCountry(this.buildCreateCountryRequest())
+        .pipe(finalize(() => this.saving.set(false)))
+        .subscribe({
+          next: () => {
+            this.toastr.success('Country saved successfully.');
+            this.finishCountrySave();
+          }
+        });
+
+      return;
+    }
+
+    const countryId = this.selectedCountryId();
+
+    if (!countryId) {
+      this.saving.set(false);
+      return;
+    }
+
+    this.countryApi
+      .updateCountry(
+        countryId,
+        this.buildUpdateCountryRequest(this.selectedCountry()?.isActive ?? true)
+      )
+      .pipe(finalize(() => this.saving.set(false)))
+      .subscribe({
+        next: () => {
+          this.toastr.success('Country updated successfully.');
+          this.finishCountrySave();
+        }
+      });
+  }
+
+  openEditCountry(country: CountryDto): void {
+    this.countryModalMode.set('edit');
+    this.selectedCountryId.set(country.id);
+    this.selectedCountry.set(null);
+    this.selectedCurrency.set(null);
+    this.countrySubmitAttempted.set(false);
+
+    this.countryApi
+      .getCountryById(country.id)
+      .pipe(
+        switchMap(countryDetails => {
+          const currencyId = countryDetails.defaultCurrencyId;
+
+          if (!currencyId) {
+            return of({ countryDetails, currency: null });
+          }
+
+          return this.currencyApi.getCurrencyById(currencyId).pipe(
+            map(currency => ({ countryDetails, currency })),
+            catchError(() => {
+              this.toastr.error('Unable to load the selected currency.');
+              return of({ countryDetails, currency: null });
+            })
+          );
+        })
+      )
+      .subscribe({
+        next: ({ countryDetails, currency }) => {
+          this.selectedCountry.set(countryDetails);
+          this.selectedCurrency.set(currency);
+          this.countryForm.reset({
+            name: countryDetails.name ?? '',
+            iso2: countryDetails.iso2 ?? '',
+            iso3: countryDetails.iso3 ?? '',
+            phoneCode: countryDetails.phoneCode ?? '',
+            defaultCurrencyId: countryDetails.defaultCurrencyId ?? null
+          });
+          this.resetCountryFormState();
+
+          this.showCountryModal.set(true);
+        }
+      });
+  }
+
+  getFlagUrl(iso2: string | null | undefined): string {
+    const code = iso2?.trim().toLowerCase();
+
+    return code && /^[a-z]{2}$/.test(code)
+      ? `https://flagcdn.com/24x18/${code}.png`
+      : '';
+  }
+
+  onFlagError(event: Event): void {
+    const image = event.target as HTMLImageElement;
+    image.style.display = 'none';
+  }
+
+  private viewCountry(country: CountryDto): void {
+    this.openEditCountry(country);
+  }
+
+  private requestDeleteCountry(country: CountryDto): void {
+    this.pendingDeleteCountry.set(country);
+    this.deleteConfirmDialog()?.open();
+  }
+
+  private deleteCountry(country: CountryDto): void {
+    this.updateCountryStatus(country, false);
+  }
+
+  private activateCountry(country: CountryDto): void {
+    this.updateCountryStatus(country, true);
+  }
+
+  private buildCreateCountryRequest(): CreateCountryRequest {
+    const value = this.countryForm.getRawValue();
+
+    return {
+      name: value.name.trim(),
+      iso2: value.iso2.trim().toUpperCase(),
+      iso3: value.iso3.trim().toUpperCase(),
+      phoneCode: this.nullWhenBlank(value.phoneCode),
+      defaultCurrencyId: this.nullWhenBlank(value.defaultCurrencyId)
+    };
+  }
+
+  private buildUpdateCountryRequest(isActive: boolean): UpdateCountryRequest {
+    return {
+      ...this.buildCreateCountryRequest(),
+      isActive
+    };
+  }
+
+  private countryToUpdateRequest(country: CountryDto, isActive: boolean): UpdateCountryRequest {
+    return {
+      name: country.name?.trim() ?? '',
+      iso2: country.iso2?.trim().toUpperCase() ?? '',
+      iso3: country.iso3?.trim().toUpperCase() ?? '',
+      phoneCode: this.nullWhenBlank(country.phoneCode),
+      defaultCurrencyId: this.nullWhenBlank(country.defaultCurrencyId),
+      isActive
+    };
+  }
+
+  private updateCountryStatus(country: CountryDto, isActive: boolean): void {
+    this.countryApi
+      .updateCountry(country.id, this.countryToUpdateRequest(country, isActive))
+      .subscribe({
+        next: () => {
+          this.toastr.success(
+            isActive
+              ? 'Country activated successfully.'
+              : 'Country deactivated successfully.'
+          );
+          this.loadCountries(this.queryState.getQuery());
+        }
+      });
+  }
+
+  private resetCountryFormState(): void {
+    this.countryForm.markAsPristine();
+    this.countryForm.markAsUntouched();
+    this.countryForm.updateValueAndValidity();
+  }
+
+  private finishCountrySave(): void {
+    this.showCountryModal.set(false);
+    this.selectedCountryId.set(null);
+    this.selectedCountry.set(null);
+    this.countrySubmitAttempted.set(false);
+    this.loadCountries(this.queryState.getQuery());
+  }
+
+  private clearCountryGrid(): void {
+    this.countries.set([]);
+    this.totalRecords.set(0);
+    this.filteredRecords.set(0);
+  }
+
+  private focusFirstInvalidCountryControl(): void {
+    queueMicrotask(() => {
+      const firstInvalidControl =
+        this.elementRef.nativeElement.querySelector<HTMLElement>(
+          'modal [data-form-control][aria-invalid="true"]'
+        );
+
+      firstInvalidControl?.focus();
+      firstInvalidControl?.scrollIntoView({
+        behavior: 'smooth',
+        block: 'center'
+      });
+    });
+  }
+
+  private nullWhenBlank(value: string | null | undefined): string | null {
+    const normalized = value?.trim();
+
+    return normalized
+      ? normalized
+      : null;
+  }
+
+  private toCountryDto(row: CountryTableRow): CountryDto {
+    return {
+      id: row.id,
+      iso2: row.iso2,
+      iso3: row.iso3,
+      name: row.name,
+      phoneCode: row.phoneCode,
+      defaultCurrencyId: row.defaultCurrencyId,
+      isActive: row.isActive,
+      createdOn: row.createdOn,
+      modifiedOn: row.modifiedOn
+    };
+  }
+}
diff --git a/src/app/features/global-masters/countries/public-api.ts b/src/app/features/global-masters/countries/public-api.ts
new file mode 100644
index 00000000..158a7781
--- /dev/null
+++ b/src/app/features/global-masters/countries/public-api.ts
@@ -0,0 +1,2 @@
+export { CountryService } from './data-access/country.service';
+export type { CountryLookupDto } from './models/country.model';
diff --git a/src/app/features/global-masters/currencies/data-access/currency.endpoints.ts b/src/app/features/global-masters/currencies/data-access/currency.endpoints.ts
new file mode 100644
index 00000000..9eb91c37
--- /dev/null
+++ b/src/app/features/global-masters/currencies/data-access/currency.endpoints.ts
@@ -0,0 +1,44 @@
+import { buildApiUrl } from '../../../../core/config/api-url.util';
+
+
+export const CURRENCY_ENDPOINTS = {
+    dataTable: buildApiUrl(
+        'masterAdmin',
+        '/v1/currencies/datatable'
+    ),
+
+    create: buildApiUrl(
+        'masterAdmin',
+        '/v1/currencies'
+    ),
+
+    getById: (id: string) =>
+        buildApiUrl(
+            'masterAdmin',
+            `/v1/currencies/${encodeURIComponent(id)}`
+        ),
+
+    update: (id: string) =>
+        buildApiUrl(
+            'masterAdmin',
+            `/v1/currencies/${encodeURIComponent(id)}`
+        ),
+
+    delete: (id: string) =>
+        buildApiUrl(
+            'masterAdmin',
+            `/v1/currencies/${encodeURIComponent(id)}`
+        ),
+
+    changeStatus: (id: string) =>
+        buildApiUrl(
+            'masterAdmin',
+            `/v1/currencies/${encodeURIComponent(id)}/status`
+        ),
+
+    autocomplete:
+        buildApiUrl(
+            'masterAdmin',
+            '/v1/currencies/autocomplete'
+        ),
+} as const;
diff --git a/src/app/features/global-masters/currencies/data-access/currency.service.ts b/src/app/features/global-masters/currencies/data-access/currency.service.ts
new file mode 100644
index 00000000..cebb5a1c
--- /dev/null
+++ b/src/app/features/global-masters/currencies/data-access/currency.service.ts
@@ -0,0 +1,46 @@
+import { HttpClient, HttpParams } from '@angular/common/http';
+import { Injectable, inject } from '@angular/core';
+import { Observable } from 'rxjs';
+
+import { DataTableQuery, DataTableResult } from '../../../../shared/components/data-table/data-table.types';
+import {
+    CreateCurrencyRequest,
+    CurrencyDto,
+    CurrencyLookupDto,
+    UpdateCurrencyRequest
+} from '../models/currency.model';
+import { CURRENCY_ENDPOINTS } from './currency.endpoints';
+
+@Injectable({
+    providedIn: 'root'
+})
+export class CurrencyService {
+    private readonly http = inject(HttpClient);
+
+    getCurrencyDataTable(query: DataTableQuery): Observable<DataTableResult<CurrencyDto>> {
+        return this.http.post<DataTableResult<CurrencyDto>>(CURRENCY_ENDPOINTS.dataTable, query);
+    }
+
+    createCurrency(request: CreateCurrencyRequest): Observable<CurrencyDto> {
+        return this.http.post<CurrencyDto>(CURRENCY_ENDPOINTS.create, request);
+    }
+
+    updateCurrency(id: string, request: UpdateCurrencyRequest): Observable<CurrencyDto> {
+        return this.http.put<CurrencyDto>(CURRENCY_ENDPOINTS.update(id), request);
+    }
+
+    getCurrencyById(id: string): Observable<CurrencyDto> {
+        return this.http.get<CurrencyDto>(CURRENCY_ENDPOINTS.getById(id));
+    }
+
+    autocomplete(term: string | null, limit = 10): Observable<readonly CurrencyLookupDto[]> {
+        let params = new HttpParams().set('limit', limit);
+        const normalizedTerm = term?.trim();
+
+        if (normalizedTerm) {
+            params = params.set('term', normalizedTerm);
+        }
+
+        return this.http.get<readonly CurrencyLookupDto[]>(CURRENCY_ENDPOINTS.autocomplete, { params });
+    }
+}
diff --git a/src/app/features/global-masters/currencies/models/currency.model.ts b/src/app/features/global-masters/currencies/models/currency.model.ts
new file mode 100644
index 00000000..8ea67172
--- /dev/null
+++ b/src/app/features/global-masters/currencies/models/currency.model.ts
@@ -0,0 +1,43 @@
+export interface CurrencyCountryFlag {
+  readonly iso2: string;
+}
+
+export type CurrencyIso2Value =
+  | string
+  | readonly (string | CurrencyCountryFlag)[]
+  | null;
+
+export interface CurrencyDto {
+  id: string;
+  code: string;
+  iso2: CurrencyIso2Value;
+  name: string;
+  symbol: string;
+  numericCode: number;
+  decimalDigits: number;
+  isActive: boolean;
+  createdOn?: string;
+  modifiedOn?: string | null;
+}
+
+
+export interface CurrencyLookupDto {
+  readonly id: string;
+  readonly code: string;
+  readonly name: string;
+  readonly symbol: string;
+}
+
+export interface CreateCurrencyRequest {
+  code: string;
+  name: string;
+  symbol: string;
+  numericCode: number;
+  decimalDigits: number;
+}
+
+export interface UpdateCurrencyRequest extends CreateCurrencyRequest {
+  isActive: boolean;
+}
+
+export type CurrencyModalMode = 'create' | 'edit';
diff --git a/src/app/features/global-masters/currencies/pages/currency-list/currency-list.html b/src/app/features/global-masters/currencies/pages/currency-list/currency-list.html
new file mode 100644
index 00000000..27f32995
--- /dev/null
+++ b/src/app/features/global-masters/currencies/pages/currency-list/currency-list.html
@@ -0,0 +1,146 @@
+<app-data-table [columns]="columns()" [rows]="currencies()" [actions]="actions()" [totalRecords]="totalRecords()"
+    [pageIndex]="queryState.pageIndex()" [pageSize]="queryState.pageSize()"
+    tableTitle="Currency Management" buttonTitle="Add" [showSearch]="true" [showAddButton]="true"
+    searchPlaceholder="Search currencies..." [searchDebounceTime]="300" toolTip="Add Currency"
+    (addClicked)="onAddCurrency()" (searchChanged)="onSearch($event)" (pageChanged)="onPageChange($event)"
+    (sortChanged)="onSortChange($event)" (actionClicked)="onActionClick($event)">
+    <ng-template appDataTableCell="iso2" let-row>
+        @if (visibleCountries(row); as countries) {
+        @if (countries.length > 0) {
+        <div class="inline-flex max-w-full items-center gap-2 whitespace-nowrap" (click)="$event.stopPropagation()">
+            @for (country of countries; track country.iso2) {
+            <span
+                class="inline-flex shrink-0 items-center gap-1.5 rounded-sm bg-light/60 px-1.5 py-1 text-[0.6875rem] font-semibold text-defaulttextcolor dark:bg-white/10 dark:text-white/80">
+                <span
+                    class="inline-flex h-[18px] w-6 items-center justify-center rounded-sm bg-light text-textmuted dark:bg-black/20">
+                    @if (getFlagUrl(country.iso2); as flagUrl) {
+                    <img [src]="flagUrl" [alt]="country.iso2 + ' flag'" loading="lazy"
+                        class="h-[18px] w-6 rounded-sm object-contain" (error)="onFlagError($event)" />
+                    <i class="ti ti-flag hidden text-[0.6875rem]" aria-hidden="true"></i>
+                    } @else {
+                    <i class="ti ti-flag text-[0.6875rem]" aria-hidden="true"></i>
+                    }
+                </span>
+                <span>{{ country.iso2 }}</span>
+            </span>
+            }
+
+            @if (remainingCountryCount(row); as remaining) {
+            <button type="button" cdkOverlayOrigin #iso2TooltipOrigin="cdkOverlayOrigin"
+                class="inline-flex size-7 shrink-0 items-center justify-center rounded-full bg-primary text-[0.6875rem] font-semibold text-white focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/40"
+                [attr.aria-label]="'Show ' + remaining + ' more ISO2 codes for ' + row.name"
+                [attr.aria-describedby]="iso2TooltipId(row)" (mouseenter)="openIso2Tooltip(row)"
+                (mouseleave)="scheduleIso2TooltipClose()" (focus)="openIso2Tooltip(row)"
+                (blur)="scheduleIso2TooltipClose()" (keydown)="onIso2TooltipKeydown($event)">
+                +{{ remaining }}
+            </button>
+
+            <ng-template cdkConnectedOverlay [cdkConnectedOverlayOrigin]="iso2TooltipOrigin"
+                [cdkConnectedOverlayOpen]="isIso2TooltipOpen(row)" [cdkConnectedOverlayPositions]="iso2TooltipPositions"
+                [cdkConnectedOverlayViewportMargin]="8" [cdkConnectedOverlayPush]="true" (detach)="closeIso2Tooltip()">
+                <div [id]="iso2TooltipId(row)" role="tooltip"
+                    class="relative w-35 max-w-[calc(100vw-16px)] overflow-visible rounded-lg border border-defaultborder bg-white shadow-2xl dark:border-white/10 dark:bg-bodybg"
+                    (click)="$event.stopPropagation()" (mouseenter)="openIso2Tooltip(row)"
+                    (mouseleave)="scheduleIso2TooltipClose()">
+                    @if (iso2TooltipPlacement() === 'right') {
+                    <span aria-hidden="true"
+                        class="pointer-events-none absolute left-[-6px] top-1/2 z-10 size-3 -translate-y-1/2 rotate-45 border-b border-l border-defaultborder bg-white dark:border-white/10 dark:bg-bodybg"></span>
+                    } @else {
+                    <span aria-hidden="true"
+                        class="pointer-events-none absolute left-1/2 top-[-6px] z-10 size-3 -translate-x-1/2 rotate-45 border-l border-t border-primary bg-primary">
+                    </span>
+                    }
+
+                    <div class="relative z-20 overflow-hidden rounded-lg">
+                        <div class="flex shrink-0 items-center justify-between bg-primary px-3 py-2 text-white">
+                             <!--<span class="text-xs font-semibold">
+                                Associated Countries
+                            </span>
+
+                            <span
+                                class="inline-flex min-w-5 items-center justify-center rounded-full bg-white/20 px-1.5 py-0.5 text-[0.625rem] font-semibold text-white">
+                                {{ remainingCountryCount(row) }}
+                            </span> -->
+                        </div>
+
+                        <div class="custom-scrollbar-width max-h-48 overflow-y-auto overscroll-contain bg-white p-2 dark:bg-bodybg"
+                            (wheel)="$event.stopPropagation()">
+                            <div class="grid grid-cols-1 gap-1">
+                                @for (country of remainingCountries(row); track country.iso2) {
+                                <div
+                                    class="flex items-center gap-2 rounded-md px-2 py-1.5 text-xs font-semibold text-defaulttextcolor transition-colors hover:bg-primary/10 dark:text-white/80">
+                                    <span
+                                        class="inline-flex h-[18px] w-6 shrink-0 items-center justify-center rounded-sm bg-light text-textmuted dark:bg-black/20">
+                                        @if (getFlagUrl(country.iso2); as flagUrl) {
+                                        <img [src]="flagUrl" [alt]="country.iso2 + ' flag'" loading="lazy"
+                                            class="h-[18px] w-6 shrink-0 rounded-sm object-cover"
+                                            (error)="onFlagError($event)" />
+                                        <i class="ti ti-flag hidden text-[0.6875rem]" aria-hidden="true"></i>
+                                        } @else {
+                                        <i class="ti ti-flag text-[0.6875rem]" aria-hidden="true"></i>
+                                        }
+                                    </span>
+                                    <span>{{ country.iso2 }}</span>
+                                </div>
+                                }
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </ng-template>
+            }
+        </div>
+        } @else {
+        <span class="text-textmuted" aria-label="No ISO2 codes">&mdash;</span>
+        }
+        }
+    </ng-template>
+
+    <ng-template appDataTableCell="code" let-value="value">
+        <span class="badge bg-primary/10 text-primary">
+            {{ value }}
+        </span>
+    </ng-template></app-data-table>
+
+<app-confirm-dialog title="Delete Currency" text="Do you really want to delete this currency?"
+    confirmButtonText="Delete" cancelButtonText="Cancel" (confirmed)="onDeleteConfirmed()"
+    (cancelled)="onDeleteCancelled()" />
+
+<modal class="modern-modal" [open]="showCurrencyModal()" [title]="currencyModalTitle()" size="md"
+    [submitAction]="currencySubmitAction()" [submitLabel]="currencySubmitLabel()"
+    [loadingLabel]="currencyLoadingLabel()" [loading]="saving()" (closed)="closeCurrencyModal()"
+    (submitted)="saveCurrency()">
+    <form [formGroup]="currencyForm" (ngSubmit)="saveCurrency()" autocomplete="off">
+        <div class="grid grid-cols-12 gap-x-5 gap-y-5">
+            <div class="col-span-12 md:col-span-4">
+                <app-form-input formControlName="name" inputId="currency-name" label="Currency Name" autocomplete="off"
+                    variant="floating" [required]="true" [maxLength]="100" [submitAttempted]="currencySubmitAttempted()"
+                    [validationMessages]="{ required: 'Currency Name is required.', maxlength: 'Currency Name cannot exceed 100 characters.' }" />
+            </div>
+            <div class="col-span-12 md:col-span-4">
+                <app-form-input formControlName="code" inputId="currency-code" label="Currency Code" autocomplete="off"
+                    variant="floating" [required]="true" [minLength]="3" [maxLength]="3" pattern="[A-Za-z]{3}"
+                    [submitAttempted]="currencySubmitAttempted()"
+                    [validationMessages]="{ required: 'Currency Code is required.', minlength: 'Currency Code must contain exactly 3 letters.', maxlength: 'Currency Code must contain exactly 3 letters.', pattern: 'Currency Code can contain letters only.' }" />
+            </div>
+            <div class="col-span-12 md:col-span-4">
+                <app-form-input formControlName="symbol" inputId="currency-symbol" label="Currency Symbol"
+                    autocomplete="off" variant="floating" [required]="true" [maxLength]="8"
+                    [submitAttempted]="currencySubmitAttempted()"
+                    [validationMessages]="{ required: 'Currency Symbol is required.', maxlength: 'Currency Symbol cannot exceed 8 characters.' }" />
+            </div>
+            <div class="col-span-12 md:col-span-4">
+                <app-form-input formControlName="numericCode" inputId="currency-numeric-code" label="Numeric Code"
+                    type="number" inputMode="numeric" autocomplete="off" variant="floating" [required]="true" [min]="1"
+                    [max]="999" [step]="1" [submitAttempted]="currencySubmitAttempted()"
+                    [validationMessages]="{ required: 'Numeric Code is required.', min: 'Numeric Code must be at least 1.', max: 'Numeric Code cannot exceed 999.' }" />
+            </div>
+            <div class="col-span-12 md:col-span-4">
+                <app-form-input formControlName="decimalDigits" inputId="currency-decimal-digits" label="Decimal Digits"
+                    type="number" inputMode="numeric" autocomplete="off" variant="floating" [required]="true" [min]="0"
+                    [max]="4" [step]="1" [submitAttempted]="currencySubmitAttempted()"
+                    [validationMessages]="{ required: 'Decimal Digits is required.', min: 'Decimal Digits cannot be less than 0.', max: 'Decimal Digits cannot exceed 4.' }" />
+            </div>
+        </div>
+    </form>
+</modal>
diff --git a/src/app/features/global-masters/currencies/pages/currency-list/currency-list.scss b/src/app/features/global-masters/currencies/pages/currency-list/currency-list.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/src/app/features/global-masters/currencies/pages/currency-list/currency-list.ts b/src/app/features/global-masters/currencies/pages/currency-list/currency-list.ts
new file mode 100644
index 00000000..cfeeb807
--- /dev/null
+++ b/src/app/features/global-masters/currencies/pages/currency-list/currency-list.ts
@@ -0,0 +1,623 @@
+import { Component, DestroyRef, ElementRef, computed, inject, signal, viewChild } from '@angular/core';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import {
+  CdkConnectedOverlay,
+  CdkOverlayOrigin,
+  ConnectedOverlayPositionChange,
+  ConnectedPosition
+} from '@angular/cdk/overlay';
+import {
+  FormBuilder,
+  ReactiveFormsModule,
+  Validators
+} from '@angular/forms';
+import { ToastrService } from 'ngx-toastr';
+import { Subject, catchError, finalize, of, switchMap } from 'rxjs';
+
+import {
+  CreateCurrencyRequest,
+  CurrencyCountryFlag,
+  CurrencyDto,
+  CurrencyIso2Value,
+  CurrencyModalMode,
+  UpdateCurrencyRequest
+} from '../../models/currency.model';
+import { CurrencyService } from '../../data-access/currency.service';
+import { DataTableQueryState } from '../../../../../shared/components/data-table/data-table-query.state';
+import {
+  DataTableAction,
+  DataTableActionEvent,
+  DataTableColumn,
+  DataTablePageEvent,
+  DataTableQuery,
+  DataTableRecord,
+  DataTableSortEvent
+} from '../../../../../shared/components/data-table/data-table.types';
+import { DataTable } from '../../../../../shared/components/data-table/data-table';
+import { DataTableCellDirective } from '../../../../../shared/directives/data-table-cell.directive';
+import { Modal } from '../../../../../shared/components/modal/modal';
+import { ConfirmDialog } from '../../../../../shared/components/confirm-dialog/confirm-dialog';
+import { FormInput } from '../../../../../shared/components/form/form-input/form-input';
+
+type Iso2TooltipPlacement = 'above' | 'below' | 'left' | 'right';
+interface CurrencyTableRow extends DataTableRecord {
+  id: string;
+  code: string;
+  iso2: CurrencyIso2Value;
+  name: string;
+  symbol: string;
+  numericCode: number;
+  decimalDigits: number;
+  isActive: boolean;
+  serialNumber: number;
+  createdOn?: string;
+  modifiedOn?: string | null;
+}
+
+@Component({
+  selector: 'currency-list',
+  standalone: true,
+  imports: [DataTable, DataTableCellDirective, Modal, ReactiveFormsModule, FormInput, ConfirmDialog, CdkOverlayOrigin, CdkConnectedOverlay],
+  templateUrl: './currency-list.html',
+  styleUrl: './currency-list.scss',
+})
+export class CurrencyList {
+  private readonly destroyRef = inject(DestroyRef);
+  private readonly currencyApi = inject(CurrencyService);
+  private readonly formBuilder = inject(FormBuilder);
+  private readonly elementRef = inject<ElementRef<HTMLElement>>(ElementRef);
+  private readonly toastr = inject(ToastrService);
+  private readonly currencyQueryRequests$ = new Subject<DataTableQuery>();
+
+  readonly queryState = new DataTableQueryState();
+
+  readonly currencies = signal<CurrencyTableRow[]>([]);
+  readonly totalRecords = signal(0);
+  readonly filteredRecords = signal(0);
+  readonly saving = signal(false);
+
+  readonly showCurrencyModal = signal(false);
+  readonly currencyModalMode = signal<CurrencyModalMode>('create');
+  readonly selectedCurrencyId = signal<string | null>(null);
+  readonly selectedCurrency = signal<CurrencyDto | null>(null);
+  readonly currencySubmitAttempted = signal(false);
+  readonly pendingDeleteCurrency = signal<CurrencyDto | null>(null);
+  readonly deleteConfirmDialog = viewChild(ConfirmDialog);
+    readonly openIso2TooltipCurrencyId = signal<string | null>(null);
+  readonly iso2TooltipPlacement = signal<Iso2TooltipPlacement>('right');
+  readonly iso2TooltipPositions: ConnectedPosition[] = [
+    {
+    originX: 'end',
+    originY: 'center',
+    overlayX: 'start',
+    overlayY: 'center',
+    offsetX: 12
+  }
+  ];
+  private iso2TooltipCloseTimer: ReturnType<typeof setTimeout> | null = null;
+
+  readonly currencyForm = this.formBuilder.nonNullable.group({
+    name: [
+      '',
+      [
+        Validators.required,
+        Validators.maxLength(100)
+      ]
+    ],
+    code: [
+      '',
+      [
+        Validators.required,
+        Validators.minLength(3),
+        Validators.maxLength(3),
+        Validators.pattern(/^[A-Za-z]{3}$/)
+      ]
+    ],
+    symbol: [
+      '',
+      [
+        Validators.required,
+        Validators.maxLength(8)
+      ]
+    ],
+    numericCode: [
+      0,
+      [
+        Validators.required,
+        Validators.min(1),
+        Validators.max(999)
+      ]
+    ],
+    decimalDigits: [
+      2,
+      [
+        Validators.required,
+        Validators.min(0),
+        Validators.max(4)
+      ]
+    ]
+  });
+
+  readonly currencyModalTitle = computed(() =>
+    this.currencyModalMode() === 'create'
+      ? 'Add Currency'
+      : 'Edit Currency'
+  );
+
+  readonly currencySubmitLabel = computed(() =>
+    this.currencyModalMode() === 'create'
+      ? 'Save'
+      : 'Update'
+  );
+
+  readonly currencyLoadingLabel = computed(() =>
+    this.currencyModalMode() === 'create'
+      ? 'Saving...'
+      : 'Updating...'
+  );
+
+  readonly currencySubmitAction = computed<'save' | 'update'>(() =>
+    this.currencyModalMode() === 'create'
+      ? 'save'
+      : 'update'
+  );
+
+  readonly columns = signal<DataTableColumn<CurrencyTableRow>[]>([
+    { key: 'serialNumber', label: 'Sr. No.', header: 'Sr.No.', sortable: false, width: '100px' },
+    { key: 'name', label: 'Name', header: 'Name', sortable: true, align: 'left' },
+    { key: 'iso2', label: 'Iso2 Code', header: 'Iso2 Code', sortable: true , align: 'left'},
+    { key: 'code', label: 'Code', header: 'Code', sortable: true },
+    { key: 'symbol', label: 'Symbol', header: 'Symbol', sortable: true },
+    { key: 'numericCode', label: 'Numeric Code', header: 'Numeric Code', sortable: true },
+    { key: 'decimalDigits', label: 'Decimal Digits', header: 'Decimal Digits', sortable: true },
+    {
+      key: 'isActive',
+      label: 'Status',
+      header: 'Status',
+      sortable: true,
+      badge: true,
+      badgeClass: value =>
+        value === true
+          ? 'badge bg-success/10 text-success'
+          : 'badge bg-danger/10 text-danger',
+      formatter: value => value ? 'Active' : 'Inactive'
+    }
+  ]);
+
+  readonly actions = signal<DataTableAction<CurrencyTableRow>[]>([
+    {
+      type: 'edit',
+      label: 'Edit',
+      icon: 'ti ti-edit',
+      className: 'text-primary'
+    },
+    {
+      type: 'delete',
+      label: 'Delete',
+      icon: 'ti ti-trash',
+      className: 'text-danger',
+      visible: row => row.isActive
+    },
+    {
+      type: 'activate',
+      label: 'Activate',
+      icon: 'ti ti-check',
+      className: 'text-success',
+      visible: row => !row.isActive
+    }
+  ]);
+
+  constructor() {
+    this.currencyQueryRequests$
+      .pipe(
+        switchMap(query =>
+          this.currencyApi.getCurrencyDataTable(query).pipe(
+            catchError(() => {
+              this.toastr.error('Unable to load currencies.');
+              this.clearCurrencyGrid();
+              return of(null);
+            })
+          )
+        ),
+        takeUntilDestroyed(this.destroyRef)
+      )
+      .subscribe(response => {
+        if (!response) {
+          return;
+        }
+
+        const query = this.queryState.getQuery();
+
+        if (response.draw !== query.draw) {
+          return;
+        }
+
+        const currenciesWithSerialNumbers: CurrencyTableRow[] = response.rows.map((currency, index) => ({
+          ...currency,
+          serialNumber: (query.page - 1) * query.pageSize + index + 1
+        }));
+
+        this.currencies.set(currenciesWithSerialNumbers);
+        this.totalRecords.set(response.total);
+        this.filteredRecords.set(response.filtered);
+      });
+  }
+
+  ngOnInit(): void {
+    this.loadCurrencies(this.queryState.getQuery());
+  }
+
+  loadCurrencies(query: DataTableQuery): void {
+    this.currencyQueryRequests$.next(query);
+  }
+
+  onSearch(value: string): void {
+    const query = this.queryState.setSearch(value.trim());
+    this.loadCurrencies(query);
+  }
+
+  onPageChange(event: DataTablePageEvent): void {
+    const query = this.queryState.setPage(event);
+    this.loadCurrencies(query);
+  }
+
+  onSortChange(event: DataTableSortEvent): void {
+    const query = this.queryState.setSort(event);
+    this.loadCurrencies(query);
+  }
+
+  onRefresh(): void {
+    const currentQuery = this.queryState.getQuery();
+
+    this.loadCurrencies({
+      ...currentQuery,
+      draw: currentQuery.draw + 1
+    });
+  }
+
+  onReset(): void {
+    const query = this.queryState.reset();
+    this.loadCurrencies(query);
+  }
+
+  onDeleteConfirmed(): void {
+    const currency = this.pendingDeleteCurrency();
+
+    if (!currency) {
+      return;
+    }
+
+    this.pendingDeleteCurrency.set(null);
+    this.deleteCurrency(currency);
+  }
+
+  onDeleteCancelled(): void {
+    this.pendingDeleteCurrency.set(null);
+  }
+
+  onActionClick(event: DataTableActionEvent<CurrencyTableRow>): void {
+    const currency = this.toCurrencyDto(event.row);
+
+    switch (event.action.type) {
+      case 'view':
+        this.viewCurrency(currency);
+        break;
+      case 'edit':
+        this.openEditCurrency(currency);
+        break;
+      case 'delete':
+        this.requestDeleteCurrency(currency);
+        break;
+      case 'activate':
+        this.activateCurrency(currency);
+        break;
+    }
+  }
+
+  onAddCurrency(): void {
+    this.currencyModalMode.set('create');
+    this.selectedCurrencyId.set(null);
+    this.selectedCurrency.set(null);
+    this.currencySubmitAttempted.set(false);
+
+    this.currencyForm.reset({
+      name: '',
+      code: '',
+      symbol: '',
+      numericCode: 0,
+      decimalDigits: 2
+    });
+    this.resetCurrencyFormState();
+
+    this.showCurrencyModal.set(true);
+  }
+
+  closeCurrencyModal(): void {
+    if (this.saving()) {
+      return;
+    }
+
+    this.showCurrencyModal.set(false);
+    this.selectedCurrencyId.set(null);
+    this.selectedCurrency.set(null);
+    this.currencySubmitAttempted.set(false);
+  }
+
+  saveCurrency(): void {
+    if (this.currencyForm.invalid) {
+      this.currencySubmitAttempted.set(true);
+      this.currencyForm.markAllAsTouched();
+      this.focusFirstInvalidCurrencyControl();
+      return;
+    }
+
+    if (this.saving()) {
+      return;
+    }
+
+    this.saving.set(true);
+
+    if (this.currencyModalMode() === 'create') {
+      this.currencyApi
+        .createCurrency(this.buildCreateCurrencyRequest())
+        .pipe(finalize(() => this.saving.set(false)))
+        .subscribe({
+          next: () => {
+            this.toastr.success('Currency saved successfully.');
+            this.finishCurrencySave();
+          }
+        });
+
+      return;
+    }
+
+    const currencyId = this.selectedCurrencyId();
+
+    if (!currencyId) {
+      this.saving.set(false);
+      return;
+    }
+
+    this.currencyApi
+      .updateCurrency(
+        currencyId,
+        this.buildUpdateCurrencyRequest(this.selectedCurrency()?.isActive ?? true)
+      )
+      .pipe(finalize(() => this.saving.set(false)))
+      .subscribe({
+        next: () => {
+          this.toastr.success('Currency updated successfully.');
+          this.finishCurrencySave();
+        }
+      });
+  }
+
+  private viewCurrency(currency: CurrencyDto): void {
+    this.openEditCurrency(currency);
+  }
+
+  private openEditCurrency(currency: CurrencyDto): void {
+    this.currencyModalMode.set('edit');
+    this.selectedCurrencyId.set(currency.id);
+    this.selectedCurrency.set(currency);
+    this.currencySubmitAttempted.set(false);
+
+    this.currencyApi
+      .getCurrencyById(currency.id)
+      .subscribe({
+        next: currencyDetails => {
+          this.selectedCurrency.set(currencyDetails);
+          this.currencyForm.reset({
+            name: currencyDetails.name ?? '',
+            code: currencyDetails.code ?? '',
+            symbol: currencyDetails.symbol ?? '',
+            numericCode: currencyDetails.numericCode ?? '0',
+            decimalDigits: currencyDetails.decimalDigits ?? 2
+          });
+          this.resetCurrencyFormState();
+
+          this.showCurrencyModal.set(true);
+        }
+      });
+  }
+
+  private requestDeleteCurrency(currency: CurrencyDto): void {
+    this.pendingDeleteCurrency.set(currency);
+    this.deleteConfirmDialog()?.open();
+  }
+
+  private deleteCurrency(currency: CurrencyDto): void {
+    this.updateCurrencyStatus(currency, false);
+  }
+
+  private activateCurrency(currency: CurrencyDto): void {
+    this.updateCurrencyStatus(currency, true);
+  }
+
+  private buildCreateCurrencyRequest(): CreateCurrencyRequest {
+    const value = this.currencyForm.getRawValue();
+
+    return {
+      name: value.name.trim(),
+      code: value.code.trim().toUpperCase(),
+      symbol: value.symbol.trim(),
+      numericCode: value.numericCode,
+      decimalDigits: value.decimalDigits
+    };
+  }
+
+  private buildUpdateCurrencyRequest(isActive: boolean): UpdateCurrencyRequest {
+    return {
+      ...this.buildCreateCurrencyRequest(),
+      isActive
+    };
+  }
+
+  private currencyToUpdateRequest(currency: CurrencyDto, isActive: boolean): UpdateCurrencyRequest {
+    return {
+      name: currency.name?.trim() ?? '',
+      code: currency.code?.trim().toUpperCase() ?? '',
+      symbol: currency.symbol?.trim() ?? '',
+      numericCode: currency.numericCode,
+      decimalDigits: currency.decimalDigits,
+      isActive
+    };
+  }
+
+  private updateCurrencyStatus(currency: CurrencyDto, isActive: boolean): void {
+    this.currencyApi
+      .updateCurrency(currency.id, this.currencyToUpdateRequest(currency, isActive))
+      .subscribe({
+        next: () => {
+          this.toastr.success(
+            isActive
+              ? 'Currency activated successfully.'
+              : 'Currency deactivated successfully.'
+          );
+          this.loadCurrencies(this.queryState.getQuery());
+        }
+      });
+  }
+
+  private resetCurrencyFormState(): void {
+    this.currencyForm.markAsPristine();
+    this.currencyForm.markAsUntouched();
+    this.currencyForm.updateValueAndValidity();
+  }
+
+  private finishCurrencySave(): void {
+    this.showCurrencyModal.set(false);
+    this.selectedCurrencyId.set(null);
+    this.selectedCurrency.set(null);
+    this.currencySubmitAttempted.set(false);
+    this.loadCurrencies(this.queryState.getQuery());
+  }
+
+  private clearCurrencyGrid(): void {
+    this.currencies.set([]);
+    this.totalRecords.set(0);
+    this.filteredRecords.set(0);
+  }
+
+  private focusFirstInvalidCurrencyControl(): void {
+    queueMicrotask(() => {
+      const firstInvalidControl =
+        this.elementRef.nativeElement.querySelector<HTMLElement>(
+          'modal [data-form-control][aria-invalid="true"]'
+        );
+
+      firstInvalidControl?.focus();
+      firstInvalidControl?.scrollIntoView({
+        behavior: 'smooth',
+        block: 'center'
+      });
+    });
+  }
+
+  private toCurrencyDto(row: CurrencyTableRow): CurrencyDto {
+    return {
+      id: row.id,
+      code: row.code,
+      iso2: row.iso2,
+      name: row.name,
+      symbol: row.symbol,
+      numericCode: row.numericCode,
+      decimalDigits: row.decimalDigits,
+      isActive: row.isActive,
+      createdOn: row.createdOn,
+      modifiedOn: row.modifiedOn
+    };
+  }
+
+  visibleCountries(row: CurrencyTableRow): readonly CurrencyCountryFlag[] {
+    return this.normalizeIso2Codes(row.iso2).slice(0, 1);
+  }
+
+  remainingCountries(row: CurrencyTableRow): readonly CurrencyCountryFlag[] {
+    return this.normalizeIso2Codes(row.iso2).slice(1);
+  }
+
+  remainingCountryCount(row: CurrencyTableRow): number {
+    return this.remainingCountries(row).length;
+  }
+
+  openIso2Tooltip(row: CurrencyTableRow): void {
+    this.cancelIso2TooltipClose();
+    this.openIso2TooltipCurrencyId.set(row.id);
+  }
+
+  scheduleIso2TooltipClose(): void {
+    this.cancelIso2TooltipClose();
+    this.iso2TooltipCloseTimer = setTimeout(() => this.closeIso2Tooltip(), 120);
+  }
+
+  isIso2TooltipOpen(row: CurrencyTableRow): boolean {
+    return this.openIso2TooltipCurrencyId() === row.id;
+  }
+
+  iso2TooltipId(row: CurrencyTableRow): string {
+    return `currency-iso2-tooltip-${row.id}`;
+  }
+
+  closeIso2Tooltip(): void {
+    this.cancelIso2TooltipClose();
+    this.openIso2TooltipCurrencyId.set(null);
+  }
+
+  onIso2TooltipKeydown(event: KeyboardEvent): void {
+    if (event.key === 'Escape') {
+      event.preventDefault();
+      this.closeIso2Tooltip();
+    }
+  }
+
+  onIso2TooltipPositionChange(event: ConnectedOverlayPositionChange): void {
+    this.iso2TooltipPlacement.set(
+      event.connectionPair.overlayY === 'bottom' ? 'above' : 'below'
+    );
+  }
+
+  normalizeIso2Codes(value: unknown): CurrencyCountryFlag[] {
+    const items: readonly unknown[] = Array.isArray(value)
+      ? value
+      : typeof value === 'string'
+        ? value.split(/[,;|]/)
+        : [];
+    const codes = new Set<string>();
+
+    for (const item of items) {
+      const rawCode = typeof item === 'string'
+        ? item
+        : item && typeof item === 'object' && 'iso2' in item
+          ? String(item.iso2)
+          : '';
+      const iso2 = rawCode.trim().toUpperCase();
+
+      if (/^[A-Z]{2}$/.test(iso2)) {
+        codes.add(iso2);
+      }
+    }
+
+    return [...codes].map(iso2 => ({ iso2 }));
+  }
+
+  private cancelIso2TooltipClose(): void {
+    if (this.iso2TooltipCloseTimer !== null) {
+      clearTimeout(this.iso2TooltipCloseTimer);
+      this.iso2TooltipCloseTimer = null;
+    }
+  }
+
+  getFlagUrl(value: unknown): string {
+    const code = this.normalizeIso2Codes(value)[0]?.iso2.toLowerCase();
+
+    return code && /^[a-z]{2}$/.test(code)
+      ? `https://flagcdn.com/24x18/${code}.png`
+      : '';
+  }
+  onFlagError(event: Event): void {
+    const image = event.target as HTMLImageElement;
+    image.classList.add('hidden');
+    image.nextElementSibling?.classList.remove('hidden');
+  }
+}
diff --git a/src/app/features/global-masters/currencies/public-api.ts b/src/app/features/global-masters/currencies/public-api.ts
new file mode 100644
index 00000000..ed036285
--- /dev/null
+++ b/src/app/features/global-masters/currencies/public-api.ts
@@ -0,0 +1,2 @@
+export { CurrencyService } from './data-access/currency.service';
+export type { CurrencyDto, CurrencyLookupDto } from './models/currency.model';
diff --git a/src/app/features/global-masters/global-masters.routes.ts b/src/app/features/global-masters/global-masters.routes.ts
index 68a7ba38..35cf4e8e 100644
--- a/src/app/features/global-masters/global-masters.routes.ts
+++ b/src/app/features/global-masters/global-masters.routes.ts
@@ -2,8 +2,33 @@ import { Routes } from '@angular/router';
 
 export const globalMastersRoutes: Routes = [
   {
-    path: '',
-    loadComponent: () => import('./pages/master-list/master-list').then((m) => m.MasterList),
-    data: { childTitle: 'Global Masters', parentTitle: 'Platform', subParentTitle: 'Configuration' },
+    path: 'countries',
+    loadComponent: () => import('./countries/pages/country-list/country-list').then((m) => m.CountryList),
+    data: { childTitle: 'Country Management', parentTitle: 'Global Master', subParentTitle: 'Configuration' },
   },
+  {
+    path: 'states',
+    loadComponent: () => import('./states/pages/state-list/state-list').then((m) => m.StateList),
+    data: { childTitle: 'State Management', parentTitle: 'Global Master', subParentTitle: 'Configuration' },
+  },
+  {
+    path: 'cities',
+    loadComponent: () => import('./cities/pages/city-list/city-list').then((m) => m.CityList),
+    data: { childTitle: 'City Management', parentTitle: 'Global Master', subParentTitle: 'Configuration' },
+  },
+  {
+    path: 'currencies',
+    loadComponent: () => import('./currencies/pages/currency-list/currency-list').then((m) => m.CurrencyList),
+    data: { childTitle: 'Currency Management', parentTitle: 'Global Master', subParentTitle: 'Configuration' },
+  },
+  {
+    path: 'languages',
+    loadComponent: () => import('./languages/pages/language-list/language-list').then((m) => m.LanguageList),
+    data: { childTitle: 'Language Management', parentTitle: 'Global Master', subParentTitle: 'Configuration' },
+  },
+  {
+    path: 'timezones',
+    loadComponent: () => import('./timezones/pages/timezone-list/timezone-list').then((m) => m.TimezoneList),
+    data: { childTitle: 'Timezone Management', parentTitle: 'Global Master', subParentTitle: 'Configuration' },
+  }
 ];
diff --git a/src/app/features/global-masters/languages/data-access/language.endpoints.ts b/src/app/features/global-masters/languages/data-access/language.endpoints.ts
new file mode 100644
index 00000000..123ad1fa
--- /dev/null
+++ b/src/app/features/global-masters/languages/data-access/language.endpoints.ts
@@ -0,0 +1,11 @@
+import { buildApiUrl } from '../../../../core/config/api-url.util';
+
+export const LANGUAGE_ENDPOINTS = {
+  dataTable: buildApiUrl('masterAdmin', '/v1/languages/datatable'),
+  create: buildApiUrl('masterAdmin', '/v1/languages'),
+  getById: (id: string) =>
+    buildApiUrl('masterAdmin', `/v1/languages/${encodeURIComponent(id)}`),
+  update: (id: string) =>
+    buildApiUrl('masterAdmin', `/v1/languages/${encodeURIComponent(id)}`),
+  autocomplete: buildApiUrl('masterAdmin', '/v1/languages/autocomplete')
+} as const;
diff --git a/src/app/features/global-masters/languages/data-access/language.service.ts b/src/app/features/global-masters/languages/data-access/language.service.ts
new file mode 100644
index 00000000..d491b95f
--- /dev/null
+++ b/src/app/features/global-masters/languages/data-access/language.service.ts
@@ -0,0 +1,48 @@
+import { HttpClient, HttpParams } from '@angular/common/http';
+import { Injectable, inject } from '@angular/core';
+import { Observable } from 'rxjs';
+
+import { LANGUAGE_ENDPOINTS } from './language.endpoints';
+import {
+  CreateLanguageRequest,
+  LanguageDto,
+  LanguageLookupDto,
+  UpdateLanguageRequest
+} from '../models/language.model';
+import {
+  DataTableQuery,
+  DataTableResult
+} from '../../../../shared/components/data-table/data-table.types';
+
+@Injectable({ providedIn: 'root' })
+export class LanguageService {
+  private readonly http = inject(HttpClient);
+
+  getDataTable(query: DataTableQuery): Observable<DataTableResult<LanguageDto>> {
+    return this.http.post<DataTableResult<LanguageDto>>(LANGUAGE_ENDPOINTS.dataTable, query);
+  }
+
+  getById(id: string): Observable<LanguageDto> {
+    return this.http.get<LanguageDto>(LANGUAGE_ENDPOINTS.getById(id));
+  }
+
+  create(request: CreateLanguageRequest): Observable<LanguageDto> {
+    return this.http.post<LanguageDto>(LANGUAGE_ENDPOINTS.create, request);
+  }
+
+  update(id: string, request: UpdateLanguageRequest): Observable<LanguageDto> {
+    return this.http.put<LanguageDto>(LANGUAGE_ENDPOINTS.update(id), request);
+  }
+
+  autocomplete(
+    term: string | null,
+    limit = 10
+  ): Observable<readonly LanguageLookupDto[]> {
+    let params = new HttpParams().set('limit', limit);
+    if (term !== null) {
+      params = params.set('term', term);
+    }
+
+    return this.http.get<readonly LanguageLookupDto[]>(LANGUAGE_ENDPOINTS.autocomplete, { params });
+  }
+}
diff --git a/src/app/features/global-masters/languages/models/language.model.ts b/src/app/features/global-masters/languages/models/language.model.ts
new file mode 100644
index 00000000..fc1f7539
--- /dev/null
+++ b/src/app/features/global-masters/languages/models/language.model.ts
@@ -0,0 +1,31 @@
+export interface LanguageDto {
+  id: string;
+  code: string;
+  name: string;
+  nativeName: string;
+  isRightToLeft: boolean;
+  isActive: boolean;
+  createdOn: string;
+  modifiedOn: string | null;
+}
+
+export interface LanguageLookupDto {
+  readonly id: string;
+  readonly code: string;
+  readonly name: string;
+  readonly nativeName: string;
+  readonly isRightToLeft: boolean;
+}
+
+export interface CreateLanguageRequest {
+  code: string;
+  name: string;
+  nativeName: string;
+  isRightToLeft: boolean;
+}
+
+export interface UpdateLanguageRequest extends CreateLanguageRequest {
+  isActive: boolean;
+}
+
+export type LanguageModalMode = 'create' | 'edit';
diff --git a/src/app/features/global-masters/languages/pages/language-list/language-list.html b/src/app/features/global-masters/languages/pages/language-list/language-list.html
new file mode 100644
index 00000000..6aaa3e77
--- /dev/null
+++ b/src/app/features/global-masters/languages/pages/language-list/language-list.html
@@ -0,0 +1,67 @@
+<app-data-table [columns]="columns()" [rows]="languages()" [actions]="actions()" [totalRecords]="totalRecords()"
+  [pageIndex]="queryState.pageIndex()" [pageSize]="queryState.pageSize()" tableTitle="Languages" buttonTitle="Add"
+  [showSearch]="true" [showAddButton]="true" searchPlaceholder="Search languages..." [searchDebounceTime]="300"
+  toolTip="Add Language" (addClicked)="onAddLanguage()" (searchChanged)="onSearch($event)"
+  (pageChanged)="onPageChange($event)" (sortChanged)="onSortChange($event)" (actionClicked)="onActionClick($event)">
+  <ng-template appDataTableCell="name" let-value="value">
+    <span class="font-semibold">{{ value }}</span>
+  </ng-template>
+  <ng-template appDataTableCell="code" let-value="value">
+    <span class="badge bg-primary/10 text-primary">{{ value }}</span>
+  </ng-template>
+</app-data-table>
+
+<app-confirm-dialog title="Delete Language" text="Do you really want to delete this language?"
+  confirmButtonText="Delete" cancelButtonText="Cancel" (confirmed)="onDeleteConfirmed()"
+  (cancelled)="onDeleteCancelled()" />
+
+<modal [open]="showModal()" [title]="modalTitle()" size="md" [submitAction]="submitAction()"
+  [submitLabel]="submitLabel()" [loadingLabel]="loadingLabel()" [loading]="saving() || modalLoading()"
+  (closed)="closeModal()" (submitted)="saveLanguage()">
+  @if (modalLoading()) {
+  <div class="flex min-h-32 items-center justify-center" role="status" aria-live="polite">
+    <span class="ti ti-loader-2 animate-spin text-2xl text-primary" aria-hidden="true"></span>
+    <span class="ms-2">Loading language...</span>
+  </div>
+  } @else {
+  <form [formGroup]="languageForm" (ngSubmit)="saveLanguage()" autocomplete="off">
+    <div class="grid grid-cols-12 gap-x-5 gap-y-5">
+      <div class="col-span-12 md:col-span-6">
+        <app-form-input formControlName="name" inputId="language-name" variant="floating" label="Language Name"
+          placeholder="e.g.: English" autocomplete="off" [required]="true" [maxLength]="100"
+          [submitAttempted]="submitAttempted()" [validationMessages]="{
+              required: 'Language Name is required.',
+              maxlength: 'Language Name cannot exceed 100 characters.',
+              pattern: 'Language Name cannot contain only whitespace.'
+            }" />
+      </div>
+      <div class="col-span-12 md:col-span-6">
+        <app-form-input formControlName="code" inputId="language-code" variant="floating" label="Language Code"
+          placeholder="e.g.: en-US" autocomplete="off" [required]="true" [maxLength]="35"
+          [submitAttempted]="submitAttempted()" [validationMessages]="{
+              required: 'Language Code is required.',
+              maxlength: 'Language Code cannot exceed 35 characters.',
+              pattern: 'Use a valid language code, for example en-US or hi-IN.'
+            }" />
+      </div>
+      <div class="col-span-12 md:col-span-6">
+        <app-form-input formControlName="nativeName" inputId="language-native-name" variant="floating"
+          label="Native Name" placeholder="e.g.: English" autocomplete="off" [required]="true" [maxLength]="100"
+          [submitAttempted]="submitAttempted()" [validationMessages]="{
+              required: 'Native Name is required.',
+              maxlength: 'Native Name cannot exceed 100 characters.',
+              pattern: 'Native Name cannot contain only whitespace.'
+            }" />
+      </div>   
+
+
+      <div class="col-span-12 md:col-span-6 flex items-center pt-3">
+        <label for="language-rtl" class="inline-flex cursor-pointer items-center gap-2">
+          <input id="language-rtl" type="checkbox" formControlName="isRightToLeft" class="form-check-input" />
+          <span>Right To Left Language</span>
+        </label>
+      </div>
+    </div>
+  </form>
+  }
+</modal>
\ No newline at end of file
diff --git a/src/app/features/global-masters/languages/pages/language-list/language-list.scss b/src/app/features/global-masters/languages/pages/language-list/language-list.scss
new file mode 100644
index 00000000..8b137891
--- /dev/null
+++ b/src/app/features/global-masters/languages/pages/language-list/language-list.scss
@@ -0,0 +1 @@
+
diff --git a/src/app/features/global-masters/languages/pages/language-list/language-list.ts b/src/app/features/global-masters/languages/pages/language-list/language-list.ts
new file mode 100644
index 00000000..56e47501
--- /dev/null
+++ b/src/app/features/global-masters/languages/pages/language-list/language-list.ts
@@ -0,0 +1,356 @@
+import { HttpErrorResponse } from '@angular/common/http';
+import { Component, DestroyRef, ElementRef, computed, inject, signal, viewChild } from '@angular/core';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { FormBuilder, ReactiveFormsModule, Validators } from '@angular/forms';
+import { ToastrService } from 'ngx-toastr';
+import { Subject, catchError, finalize, of, switchMap } from 'rxjs';
+
+import {
+  CreateLanguageRequest,
+  LanguageDto,
+  LanguageModalMode,
+  UpdateLanguageRequest
+} from '../../models/language.model';
+import { LanguageService } from '../../data-access/language.service';
+import { DataTable } from '../../../../../shared/components/data-table/data-table';
+import { DataTableQueryState } from '../../../../../shared/components/data-table/data-table-query.state';
+import {
+  DataTableAction,
+  DataTableActionEvent,
+  DataTableColumn,
+  DataTablePageEvent,
+  DataTableQuery,
+  DataTableRecord,
+  DataTableSortEvent
+} from '../../../../../shared/components/data-table/data-table.types';
+import { FormInput } from '../../../../../shared/components/form/form-input/form-input';
+import { Modal } from '../../../../../shared/components/modal/modal';
+import { DataTableCellDirective } from '../../../../../shared/directives/data-table-cell.directive';
+import { ConfirmDialog } from '../../../../../shared/components/confirm-dialog/confirm-dialog';
+
+interface LanguageTableRow extends DataTableRecord {
+  id: string;
+  code: string;
+  name: string;
+  nativeName: string;
+  isRightToLeft: boolean;
+  isActive: boolean;
+  serialNumber: number;
+  createdOn: string;
+  modifiedOn: string | null;
+}
+
+@Component({
+  selector: 'language-list',
+  standalone: true,
+  imports: [DataTable, DataTableCellDirective, Modal, ReactiveFormsModule, FormInput, ConfirmDialog],
+  templateUrl: './language-list.html',
+  styleUrl: './language-list.scss'
+})
+export class LanguageList {
+  private readonly destroyRef = inject(DestroyRef);
+  private readonly languageApi = inject(LanguageService);
+  private readonly formBuilder = inject(FormBuilder);
+  private readonly elementRef = inject<ElementRef<HTMLElement>>(ElementRef);
+  private readonly toastr = inject(ToastrService);
+  private readonly queryRequests$ = new Subject<DataTableQuery>();
+
+  readonly queryState = new DataTableQueryState();
+  readonly languages = signal<LanguageTableRow[]>([]);
+  readonly totalRecords = signal(0);
+  readonly modalLoading = signal(false);
+  readonly saving = signal(false);
+  readonly statusChangingId = signal<string | null>(null);
+  readonly showModal = signal(false);
+  readonly modalMode = signal<LanguageModalMode>('create');
+  readonly selectedLanguageId = signal<string | null>(null);
+  readonly selectedLanguage = signal<LanguageDto | null>(null);
+  readonly submitAttempted = signal(false);
+  readonly pendingDeleteLanguageId = signal<string | null>(null);
+  readonly deleteConfirmDialog = viewChild(ConfirmDialog);
+
+  readonly languageForm = this.formBuilder.nonNullable.group({
+    name: ['', [Validators.required, Validators.maxLength(100), Validators.pattern(/.*\S.*/)]],
+    code: ['', [
+      Validators.required,
+      Validators.maxLength(35),
+      Validators.pattern(/^[A-Za-z]{2,3}(?:-[A-Za-z0-9]{2,8})*$/)
+    ]],
+    nativeName: ['', [Validators.required, Validators.maxLength(100), Validators.pattern(/.*\S.*/)]],
+    isRightToLeft: [false]
+  });
+
+  readonly modalTitle = computed(() =>
+    this.modalMode() === 'create' ? 'Add Language' : 'Edit Language'
+  );
+  readonly submitLabel = computed(() =>
+    this.modalMode() === 'create' ? 'Save' : 'Update'
+  );
+  readonly loadingLabel = computed(() =>
+    this.modalMode() === 'create' ? 'Saving...' : 'Updating...'
+  );
+  readonly submitAction = computed<'save' | 'update'>(() =>
+    this.modalMode() === 'create' ? 'save' : 'update'
+  );
+
+  readonly columns = signal<DataTableColumn<LanguageTableRow>[]>([
+    { key: 'serialNumber', label: 'Sr. No.', header: 'Sr.No.', sortable: false, width: '100px' },
+    { key: 'name', label: 'Language Name', header: 'Language Name', sortable: true, align: 'left' },
+    { key: 'code', label: 'Language Code', header: 'Language Code', sortable: true },
+    { key: 'nativeName', label: 'Native Name', header: 'Native Name', sortable: true },
+    {
+      key: 'isRightToLeft', label: 'Direction', header: 'Direction', sortable: true,
+      formatter: value => value ? 'RTL' : 'LTR'
+    },
+    {
+      key: 'isActive', label: 'Status', header: 'Status', sortable: true, badge: true,
+      badgeClass: value => value === true
+        ? 'badge bg-success/10 text-success'
+        : 'badge bg-danger/10 text-danger',
+      formatter: value => value ? 'Active' : 'Inactive'
+    }
+  ]);
+
+  readonly actions = signal<DataTableAction<LanguageTableRow>[]>([
+    {
+      type: 'edit',
+      label: 'Edit',
+      icon: 'ti ti-edit',
+      className: 'text-primary'
+    },
+    {
+      type: 'delete',
+      label: 'Delete',
+      icon: 'ti ti-trash',
+      className: 'text-danger',
+      visible: row => row.isActive,
+      disabled: row => this.statusChangingId() === row.id
+    },
+    {
+      type: 'activate',
+      label: 'Activate',
+      icon: 'ti ti-check',
+      className: 'text-success',
+      visible: row => !row.isActive,
+      disabled: row => this.statusChangingId() === row.id
+    }
+  ]);
+
+  constructor() {
+    this.queryRequests$.pipe(
+      switchMap(query => this.languageApi.getDataTable(query).pipe(
+        catchError(() => {
+          this.toastr.error('Unable to load languages.');
+          this.languages.set([]);
+          this.totalRecords.set(0);
+          return of(null);
+        })
+      )),
+      takeUntilDestroyed(this.destroyRef)
+    ).subscribe(response => {
+      if (!response || response.draw !== this.queryState.getQuery().draw) {
+        return;
+      }
+      const query = this.queryState.getQuery();
+      this.languages.set(response.rows.map((language, index) => ({
+        ...language,
+        serialNumber: (query.page - 1) * query.pageSize + index + 1
+      })));
+      this.totalRecords.set(response.total);
+    });
+  }
+
+  ngOnInit(): void {
+    this.loadLanguages(this.queryState.getQuery());
+  }
+
+  loadLanguages(query: DataTableQuery): void { this.queryRequests$.next(query); }
+  onSearch(value: string): void { this.loadLanguages(this.queryState.setSearch(value.trim())); }
+  onPageChange(event: DataTablePageEvent): void { this.loadLanguages(this.queryState.setPage(event)); }
+  onSortChange(event: DataTableSortEvent): void { this.loadLanguages(this.queryState.setSort(event)); }
+
+  onDeleteConfirmed(): void {
+    const languageId = this.pendingDeleteLanguageId();
+
+    if (!languageId) {
+      return;
+    }
+
+    this.pendingDeleteLanguageId.set(null);
+    this.changeLanguageStatus(languageId, false);
+  }
+
+  onDeleteCancelled(): void {
+    this.pendingDeleteLanguageId.set(null);
+  }
+
+  onActionClick(event: DataTableActionEvent<LanguageTableRow>): void {
+    if (event.action.type === 'edit') {
+      this.openEditLanguage(event.row.id);
+    } else if (event.action.type === 'delete') {
+      this.requestDeleteLanguage(event.row.id);
+    } else if (event.action.type === 'activate') {
+      this.changeLanguageStatus(event.row.id, true);
+    }
+  }
+
+  private requestDeleteLanguage(id: string): void {
+    this.pendingDeleteLanguageId.set(id);
+    this.deleteConfirmDialog()?.open();
+  }
+
+  onAddLanguage(): void {
+    this.modalMode.set('create');
+    this.selectedLanguageId.set(null);
+    this.selectedLanguage.set(null);
+    this.submitAttempted.set(false);
+    this.languageForm.reset({ name: '', code: '', nativeName: '', isRightToLeft: false });
+    this.resetFormState();
+    this.showModal.set(true);
+  }
+
+  openEditLanguage(id: string): void {
+    this.modalMode.set('edit');
+    this.selectedLanguageId.set(id);
+    this.selectedLanguage.set(null);
+    this.submitAttempted.set(false);
+    this.languageForm.reset({ name: '', code: '', nativeName: '', isRightToLeft: false });
+    this.resetFormState();
+    this.modalLoading.set(true);
+    this.showModal.set(true);
+
+    this.languageApi.getById(id).pipe(
+      finalize(() => this.modalLoading.set(false)),
+      takeUntilDestroyed(this.destroyRef)
+    ).subscribe({
+      next: language => {
+        if (this.selectedLanguageId() !== language.id || !this.showModal()) {
+          return;
+        }
+        this.selectedLanguage.set(language);
+        this.languageForm.reset({
+          name: language.name,
+          code: language.code,
+          nativeName: language.nativeName,
+          isRightToLeft: language.isRightToLeft
+        });
+        this.resetFormState();
+      },
+      error: () => this.showModal.set(false)
+    });
+  }
+
+  closeModal(): void {
+    if (this.saving()) return;
+    this.showModal.set(false);
+    this.selectedLanguageId.set(null);
+    this.selectedLanguage.set(null);
+    this.submitAttempted.set(false);
+  }
+
+  saveLanguage(): void {
+    if (this.languageForm.invalid) {
+      this.submitAttempted.set(true);
+      this.languageForm.markAllAsTouched();
+      this.focusFirstInvalidControl();
+      return;
+    }
+    if (this.saving() || this.modalLoading()) return;
+
+    this.saving.set(true);
+    const request = this.buildCreateRequest();
+    const operation = this.modalMode() === 'create'
+      ? this.languageApi.create(request)
+      : this.languageApi.update(
+          this.selectedLanguageId() ?? '',
+          { ...request, isActive: this.selectedLanguage()?.isActive ?? true }
+        );
+
+    operation.pipe(
+      finalize(() => this.saving.set(false)),
+      takeUntilDestroyed(this.destroyRef)
+    ).subscribe({
+      next: () => {
+        this.toastr.success(
+          this.modalMode() === 'create'
+            ? 'Language saved successfully.'
+            : 'Language updated successfully.'
+        );
+        this.finishSave();
+      },
+      error: (error: HttpErrorResponse) => this.handleSaveError(error)
+    });
+  }
+
+  private buildCreateRequest(): CreateLanguageRequest {
+    const value = this.languageForm.getRawValue();
+    return {
+      code: this.normalizeCode(value.code),
+      name: value.name.trim(),
+      nativeName: value.nativeName.trim(),
+      isRightToLeft: value.isRightToLeft
+    };
+  }
+
+  private normalizeCode(code: string): string {
+    return code.trim().split('-').map((part, index) =>
+      index === 0 ? part.toLowerCase() : part.toUpperCase()
+    ).join('-');
+  }
+
+  private changeLanguageStatus(id: string, isActive: boolean): void {
+    if (this.statusChangingId()) return;
+    this.statusChangingId.set(id);
+    this.languageApi.getById(id).pipe(
+      switchMap(language => this.languageApi.update(id, {
+        code: language.code,
+        name: language.name,
+        nativeName: language.nativeName,
+        isRightToLeft: language.isRightToLeft,
+        isActive
+      })),
+      finalize(() => this.statusChangingId.set(null)),
+      takeUntilDestroyed(this.destroyRef)
+    ).subscribe({
+      next: () => {
+        this.toastr.success(isActive
+          ? 'Language activated successfully.'
+          : 'Language deleted successfully.');
+        this.loadLanguages(this.queryState.getQuery());
+      },
+      error: (error: HttpErrorResponse) => {
+        if (error.status === 404) this.toastr.error('The language is no longer available.');
+      }
+    });
+  }
+
+  private handleSaveError(error: HttpErrorResponse): void {
+    if (error.status === 409) {
+      this.toastr.error('A language with this code already exists.', 'Duplicate language code');
+    }
+  }
+
+  private finishSave(): void {
+    this.showModal.set(false);
+    this.selectedLanguageId.set(null);
+    this.selectedLanguage.set(null);
+    this.submitAttempted.set(false);
+    this.loadLanguages(this.queryState.getQuery());
+  }
+
+  private resetFormState(): void {
+    this.languageForm.markAsPristine();
+    this.languageForm.markAsUntouched();
+    this.languageForm.updateValueAndValidity();
+  }
+
+  private focusFirstInvalidControl(): void {
+    queueMicrotask(() => {
+      const control = this.elementRef.nativeElement.querySelector<HTMLElement>(
+        'modal [data-form-control][aria-invalid="true"]'
+      );
+      control?.focus();
+      control?.scrollIntoView({ behavior: 'smooth', block: 'center' });
+    });
+  }
+}
diff --git a/src/app/features/global-masters/languages/public-api.ts b/src/app/features/global-masters/languages/public-api.ts
new file mode 100644
index 00000000..6d9a5cf5
--- /dev/null
+++ b/src/app/features/global-masters/languages/public-api.ts
@@ -0,0 +1,2 @@
+export { LanguageService } from './data-access/language.service';
+export type { LanguageLookupDto } from './models/language.model';
diff --git a/src/app/features/global-masters/pages/master-list/master-list.html b/src/app/features/global-masters/pages/master-list/master-list.html
deleted file mode 100644
index 2a437e86..00000000
--- a/src/app/features/global-masters/pages/master-list/master-list.html
+++ /dev/null
@@ -1,26 +0,0 @@
-<div class="space-y-6">
-  <div class="rounded-2xl border border-gray-200 bg-white p-6 shadow-sm dark:border-white/10 dark:bg-bodybg">
-    <div class="flex flex-wrap items-center justify-between gap-3">
-      <div>
-        <h3 class="text-lg font-semibold text-gray-900 dark:text-white">Global masters</h3>
-        <p class="mt-1 text-sm text-gray-500 dark:text-gray-400">Reference landing page for the common master configuration pattern.</p>
-      </div>
-      <a routerLink="/dashboards/crm" class="rounded-lg bg-primary px-4 py-2 text-sm font-medium text-white">Back to dashboard</a>
-    </div>
-  </div>
-
-  <div class="grid gap-4 md:grid-cols-2 xl:grid-cols-3">
-    <div class="rounded-2xl border border-gray-200 bg-white p-5 shadow-sm dark:border-white/10 dark:bg-bodybg">
-      <h4 class="font-semibold text-gray-900 dark:text-white">Country</h4>
-      <p class="mt-2 text-sm text-gray-500 dark:text-gray-400">Reference CRUD screen to be implemented first.</p>
-    </div>
-    <div class="rounded-2xl border border-gray-200 bg-white p-5 shadow-sm dark:border-white/10 dark:bg-bodybg">
-      <h4 class="font-semibold text-gray-900 dark:text-white">Currency</h4>
-      <p class="mt-2 text-sm text-gray-500 dark:text-gray-400">Reuses the same configurable master pattern.</p>
-    </div>
-    <div class="rounded-2xl border border-gray-200 bg-white p-5 shadow-sm dark:border-white/10 dark:bg-bodybg">
-      <h4 class="font-semibold text-gray-900 dark:text-white">Language</h4>
-      <p class="mt-2 text-sm text-gray-500 dark:text-gray-400">Shared master configuration with filters and forms.</p>
-    </div>
-  </div>
-</div>
diff --git a/src/app/features/global-masters/pages/master-list/master-list.scss b/src/app/features/global-masters/pages/master-list/master-list.scss
deleted file mode 100644
index 5aaa3c5b..00000000
--- a/src/app/features/global-masters/pages/master-list/master-list.scss
+++ /dev/null
@@ -1,5 +0,0 @@
-.space-y-6 {
-  display: flex;
-  flex-direction: column;
-  gap: 1.5rem;
-}
diff --git a/src/app/features/global-masters/pages/master-list/master-list.ts b/src/app/features/global-masters/pages/master-list/master-list.ts
deleted file mode 100644
index 29147d5d..00000000
--- a/src/app/features/global-masters/pages/master-list/master-list.ts
+++ /dev/null
@@ -1,12 +0,0 @@
-import { Component } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { RouterLink } from '@angular/router';
-
-@Component({
-  selector: 'app-master-list',
-  standalone: true,
-  imports: [CommonModule, RouterLink],
-  templateUrl: './master-list.html',
-  styleUrl: './master-list.scss',
-})
-export class MasterList {}
diff --git a/src/app/features/global-masters/states/data-access/state.endpoints.ts b/src/app/features/global-masters/states/data-access/state.endpoints.ts
new file mode 100644
index 00000000..9f32324b
--- /dev/null
+++ b/src/app/features/global-masters/states/data-access/state.endpoints.ts
@@ -0,0 +1,43 @@
+import { buildApiUrl } from '../../../../core/config/api-url.util';
+
+
+export const STATE_ENDPOINTS = {
+    dataTable: buildApiUrl(
+        'masterAdmin',
+        '/v1/states/datatable'
+    ),
+
+    create: buildApiUrl(
+        'masterAdmin',
+        '/v1/states'
+    ),
+
+    getById: (id: string) =>
+        buildApiUrl(
+            'masterAdmin',
+            `/v1/states/${encodeURIComponent(id)}`
+        ),
+
+    autocomplete: buildApiUrl(
+        'masterAdmin',
+        '/v1/states/autocomplete'
+    ),
+
+    update: (id: string) =>
+        buildApiUrl(
+            'masterAdmin',
+            `/v1/states/${encodeURIComponent(id)}`
+        ),
+
+    delete: (id: string) =>
+        buildApiUrl(
+            'masterAdmin',
+            `/v1/states/${encodeURIComponent(id)}`
+        ),
+
+    changeStatus: (id: string) =>
+        buildApiUrl(
+            'masterAdmin',
+            `/v1/states/${encodeURIComponent(id)}/status`
+        ),
+} as const;
diff --git a/src/app/features/global-masters/states/data-access/state.service.ts b/src/app/features/global-masters/states/data-access/state.service.ts
new file mode 100644
index 00000000..ae925b34
--- /dev/null
+++ b/src/app/features/global-masters/states/data-access/state.service.ts
@@ -0,0 +1,45 @@
+import { HttpClient, HttpParams } from "@angular/common/http";
+import { Injectable, inject } from "@angular/core";
+import { STATE_ENDPOINTS } from "./state.endpoints"
+import { Observable } from "rxjs";
+import { DataTableQuery, DataTableResult } from "../../../../shared/components/data-table/data-table.types";
+import {
+  CreateStateRequest,
+  StateDto,
+  StateLookupDto,
+  UpdateStateRequest
+} from "../models/state.model";
+
+@Injectable({
+  providedIn: 'root'
+})
+export class StateService {
+
+    private readonly http = inject(HttpClient);
+
+    getStateDataTable(query: DataTableQuery, countryId: string | null = null): Observable<DataTableResult<StateDto>> {
+        const params = countryId ? new HttpParams().set('countryId', countryId) : undefined;
+        return this.http.post<DataTableResult<StateDto>>(`${STATE_ENDPOINTS.dataTable}`, query, { params });
+    }
+
+    createState(request: CreateStateRequest): Observable<StateDto> {
+        return this.http.post<StateDto>(STATE_ENDPOINTS.create, request);
+    }
+
+    updateState(id: string, request: UpdateStateRequest): Observable<StateDto> {
+        return this.http.put<StateDto>(STATE_ENDPOINTS.update(id), request);
+    }
+
+    getStateById(id: string): Observable<StateDto> {
+        return this.http.get<StateDto>(STATE_ENDPOINTS.getById(id));
+    }
+
+    autocomplete(countryId: string, term = '', limit = 50): Observable<StateLookupDto[]> {
+        return this.http.get<StateLookupDto[]>(STATE_ENDPOINTS.autocomplete, {
+            params: new HttpParams()
+                .set('countryId', countryId)
+                .set('term', term)
+                .set('limit', limit)
+        });
+    }
+}
diff --git a/src/app/features/global-masters/states/models/state.model.ts b/src/app/features/global-masters/states/models/state.model.ts
new file mode 100644
index 00000000..384358d9
--- /dev/null
+++ b/src/app/features/global-masters/states/models/state.model.ts
@@ -0,0 +1,30 @@
+export interface StateDto {
+  id: string;
+  countryId: string;
+  name: string;
+  code: string | null;
+  isActive: boolean;
+  createdOn?: string;
+  modifiedOn?: string | null;
+}
+
+export interface StateLookupDto {
+  id: string;
+  name: string;
+  code: string;
+}
+
+export interface CreateStateRequest {
+  countryId: string;
+  name: string;
+  code: string;
+}
+
+export interface UpdateStateRequest {
+  countryId: null;
+  name: string;
+  code: string;
+  isActive: boolean;
+}
+
+export type StateModalMode = 'create' | 'edit';
diff --git a/src/app/features/global-masters/states/pages/state-list/state-list.html b/src/app/features/global-masters/states/pages/state-list/state-list.html
new file mode 100644
index 00000000..0728e910
--- /dev/null
+++ b/src/app/features/global-masters/states/pages/state-list/state-list.html
@@ -0,0 +1,104 @@
+<div class="grid grid-cols-12 gap-6">
+  <div class="xl:col-span-12 col-span-12">
+    <app-filter-card title="Filter" titleIcon="ti ti-filter" headerClass="!py-2" bodyClass="!px-4 !py-2.5">
+          <form [formGroup]="countryFilterForm" autocomplete="off" class="grid w-full grid-cols-12 items-end gap-3">
+            <div class="col-span-12 sm:col-span-5 lg:col-span-2">
+              <app-autocomplete
+                formControlName="countryId"
+                inputId="state-country-filter"
+                variant="floating"
+                size="sm"
+                label="Country"
+                placeholder="Search"
+                [searchFn]="searchCountries"
+                [displayWith]="displayCountry"
+                [valueWith]="countryValue"
+                [selectedItem]="selectedCountryLookup()"
+                [minSearchLength]="1"
+                [debounceTime]="300"
+                [limit]="50"
+                [clearable]="true"
+                [hideValidation]="true"
+                wrapperClass="!mb-0 w-full"
+                (itemSelected)="onCountryLookupSelected($event)"
+              />
+            </div>
+            <div class="col-span-12 sm:col-span-3 lg:col-span-1">
+              <button type="button" class="ti-btn ti-btn-sm ti-btn-primary-full !mb-0 flex min-h-8 w-full items-center justify-center gap-1.5 !px-3 md:!w-auto" (click)="applyCountryFilter()">
+                <i class="ti ti-filter" aria-hidden="true"></i>
+                <span>Filter</span>
+              </button>
+            </div>
+          </form>
+    </app-filter-card>
+  </div>
+</div>
+
+<app-data-table [columns]="columns()" [rows]="states()" [actions]="actions()"
+  [totalRecords]="totalRecords()" [pageIndex]="queryState.pageIndex()" [pageSize]="queryState.pageSize()"
+   tableTitle="States" buttonTitle="Add" [showSearch]="true"
+  [showAddButton]="true" searchPlaceholder="Search..." [searchDebounceTime]="300"
+  [emptyMessage]="emptyMessage()" [emptyDescription]="emptyDescription()"
+  (addClicked)="onAddState()" (searchChanged)="onSearch($event)" (pageChanged)="onPageChange($event)"
+  (sortChanged)="onSortChange($event)" (actionClicked)="onActionClick($event)" toolTip="Add State" />
+
+<app-confirm-dialog
+  title="Delete State"
+  text="Do you really want to delete this state?"
+  confirmButtonText="Delete"
+  cancelButtonText="Cancel"
+  (confirmed)="onDeleteConfirmed()"
+  (cancelled)="onDeleteCancelled()"
+/>
+
+<modal [open]="showStateModal()" [title]="stateModalTitle()" size="md" [submitAction]="stateSubmitAction()"
+  [submitLabel]="stateSubmitLabel()" [loadingLabel]="stateLoadingLabel()" [loading]="saving()"
+  (closed)="closeStateModal()" (submitted)="saveState()">
+  <form [formGroup]="stateForm" (ngSubmit)="saveState()" autocomplete="off">
+    <div class="grid grid-cols-12 gap-x-5 gap-y-5">
+      <div class="col-span-12 md:col-span-6">
+        <app-autocomplete
+          formControlName="countryId"
+          inputId="state-country"
+          variant="floating"
+          label="Country"
+          placeholder="Search"
+          [searchFn]="searchCountries"
+          [displayWith]="displayCountry"
+          [valueWith]="countryValue"
+          [resolveValueFn]="resolveCountry"
+          [selectedItem]="selectedFormCountry()"
+          [minSearchLength]="1"
+          [debounceTime]="300"
+          [limit]="50"
+          [clearable]="stateModalMode() === 'create'"
+          [required]="true"
+          [clearable]="true"
+          [readonly]="stateModalMode() !== 'create'"
+          [validationMessages]="{ required: 'Country is required.' }"
+          [submitAttempted]="stateSubmitAttempted()"
+          wrapperClass="w-full"
+          (itemSelected)="onFormCountrySelected($event)"
+          (cleared)="onFormCountryCleared()"
+        />
+      </div>
+
+      <div class="col-span-12 md:col-span-6">
+        <app-form-input formControlName="name" inputId="state-name" label="State Name" placeholder="Name" variant="floating"
+          autocomplete="off" [required]="true" [maxLength]="150" [validationMessages]="{
+            required: 'State Name is required.',
+            maxlength: 'State Name cannot exceed 150 characters.'
+          }" [submitAttempted]="stateSubmitAttempted()" />
+      </div>
+
+      <div class="col-span-12 md:col-span-6">
+        <app-form-input formControlName="code" inputId="state-code" label="State Code" placeholder="e.g.: CA" variant="floating"
+          autocomplete="off" [required]="true" [maxLength]="16" [validationMessages]="{
+            required: 'State Code is required.',
+            maxlength: 'State Code cannot exceed 16 characters.',
+            pattern: 'State Code can contain letters, numbers, hyphens, and underscores only.'
+          }" [submitAttempted]="stateSubmitAttempted()" />
+      </div>
+    </div>
+  </form>
+</modal>
diff --git a/src/app/features/global-masters/states/pages/state-list/state-list.scss b/src/app/features/global-masters/states/pages/state-list/state-list.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/src/app/features/global-masters/states/pages/state-list/state-list.ts b/src/app/features/global-masters/states/pages/state-list/state-list.ts
new file mode 100644
index 00000000..1c7ed70a
--- /dev/null
+++ b/src/app/features/global-masters/states/pages/state-list/state-list.ts
@@ -0,0 +1,570 @@
+import { Component, DestroyRef, ElementRef, computed, inject, signal, viewChild } from '@angular/core';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import {
+  FormBuilder,
+  ReactiveFormsModule,
+  Validators
+} from '@angular/forms';
+import { ToastrService } from 'ngx-toastr';
+import { Subject, catchError, distinctUntilChanged, finalize, map, of, switchMap } from 'rxjs';
+
+import {
+  CountryLookupDto
+} from '../../../countries/public-api';
+import {
+  CreateStateRequest,
+  StateDto,
+  StateModalMode,
+  UpdateStateRequest
+} from '../../models/state.model';
+import { CountryService } from '../../../countries/public-api';
+import { StateService } from '../../data-access/state.service';
+import { DataTableQueryState } from '../../../../../shared/components/data-table/data-table-query.state';
+import {
+  DataTableAction,
+  DataTableActionEvent,
+  DataTableColumn,
+  DataTablePageEvent,
+  DataTableQuery,
+  DataTableRecord,
+  DataTableSortEvent
+} from '../../../../../shared/components/data-table/data-table.types';
+import { DataTable } from '../../../../../shared/components/data-table/data-table';
+import { Autocomplete } from '../../../../../shared/components/form/autocomplete/autocomplete';
+import {
+  AutocompleteDisplayFn,
+  AutocompleteResolveValueFn,
+  AutocompleteSearchFn,
+  AutocompleteValueFn
+} from '../../../../../shared/components/form/autocomplete/autocomplete.types';
+import { FormInput } from '../../../../../shared/components/form/form-input/form-input';
+import { Modal } from '../../../../../shared/components/modal/modal';
+import { ConfirmDialog } from '../../../../../shared/components/confirm-dialog/confirm-dialog';
+import { FilterCard } from '../../../../../shared/components/filter-card/filter-card';
+
+interface StateTableRow extends DataTableRecord {
+  id: string;
+  countryId: string;
+  name: string;
+  code: string | null;
+  isActive: boolean;
+  serialNumber: number;
+  createdOn?: string;
+  modifiedOn?: string | null;
+}
+
+@Component({
+  selector: 'state-list',
+  standalone: true,
+  imports: [DataTable, Modal, ReactiveFormsModule, FormInput, Autocomplete, ConfirmDialog, FilterCard],
+  templateUrl: './state-list.html',
+  styleUrl: './state-list.scss',
+})
+export class StateList {
+
+  private readonly destroyRef = inject(DestroyRef);
+  private readonly stateApi = inject(StateService);
+  private readonly countryApi = inject(CountryService);
+  private readonly formBuilder = inject(FormBuilder);
+  private readonly elementRef = inject<ElementRef<HTMLElement>>(ElementRef);
+  private readonly toastr = inject(ToastrService);
+  private readonly stateQueryRequests$ = new Subject<DataTableQuery>();
+
+  readonly queryState = new DataTableQueryState();
+
+  readonly states = signal<StateTableRow[]>([]);
+  readonly selectedCountryLookup = signal<CountryLookupDto | null>(null);
+  readonly selectedFormCountry = signal<CountryLookupDto | null>(null);
+  readonly selectedCountryId = signal<string | null>(null);
+  readonly appliedCountryId = signal<string | null>(null);
+  readonly totalRecords = signal(0);
+  readonly filteredRecords = signal(0);
+  readonly saving = signal(false);
+
+  readonly showStateModal = signal(false);
+  readonly stateModalMode = signal<StateModalMode>('create');
+  readonly selectedStateId = signal<string | null>(null);
+  readonly selectedState = signal<StateDto | null>(null);
+  readonly stateSubmitAttempted = signal(false);
+  readonly pendingDeleteState = signal<StateDto | null>(null);
+  readonly deleteConfirmDialog = viewChild(ConfirmDialog);
+
+  readonly countryFilterForm = this.formBuilder.nonNullable.group({
+    countryId: ['']
+  });
+
+  readonly searchCountries: AutocompleteSearchFn<CountryLookupDto> =
+    (term, limit) => this.countryApi.autocomplete(term, limit);
+  readonly displayCountry: AutocompleteDisplayFn<CountryLookupDto> = country => country.name;
+  readonly countryValue: AutocompleteValueFn<CountryLookupDto, string> = country => country.id;
+  readonly resolveCountry: AutocompleteResolveValueFn<CountryLookupDto, string> =
+    value => this.countryApi.getCountryById(value).pipe(
+      map(country => ({ id: country.id, iso2: country.iso2, name: country.name }))
+    );
+
+  readonly stateForm = this.formBuilder.nonNullable.group({
+    countryId: [
+      '',
+      [
+        Validators.required
+      ]
+    ],
+    name: [
+      '',
+      [
+        Validators.required,
+        Validators.maxLength(150)
+      ]
+    ],
+    code: [
+      '',
+      [
+        Validators.required,
+        Validators.maxLength(16),
+        Validators.pattern(/^[A-Za-z0-9_-]+$/)
+      ]
+    ]
+  });
+
+  readonly emptyMessage = computed(() =>
+    this.appliedCountryId()
+      ? 'No states found'
+      : 'No records found'
+  );
+
+  readonly emptyDescription = computed(() =>
+    this.appliedCountryId()
+      ? 'There are no states available for the selected country.'
+      : 'There is currently no data to display.'
+  );
+
+  readonly stateModalTitle = computed(() =>
+    this.stateModalMode() === 'create'
+      ? 'Add State'
+      : 'Edit State'
+  );
+
+  readonly stateSubmitLabel = computed(() =>
+    this.stateModalMode() === 'create'
+      ? 'Save'
+      : 'Update'
+  );
+
+  readonly stateLoadingLabel = computed(() =>
+    this.stateModalMode() === 'create'
+      ? 'Saving...'
+      : 'Updating...'
+  );
+
+  readonly stateSubmitAction = computed<'save' | 'update'>(() =>
+    this.stateModalMode() === 'create'
+      ? 'save'
+      : 'update'
+  );
+
+  readonly columns = signal<DataTableColumn<StateTableRow>[]>([
+    { key: 'serialNumber', label: 'Sr. No.', header: 'Sr.No.', sortable: false, width: '60px' },
+    { key: 'name', header: 'Name', label: 'Name', sortable: true, align: 'left' },
+    { key: 'code', header: 'Code', label: 'Code', sortable: true },
+    {
+      key: 'isActive',
+      label: 'Status',
+      header: 'Status',
+      sortable: true,
+      badge: true,
+      badgeClass: value =>
+        value === true
+          ? 'badge bg-success/10 text-success'
+          : 'badge bg-danger/10 text-danger',
+      width: '100px',
+      formatter: value => value ? 'Active' : 'Inactive'
+    }
+  ]);
+
+  readonly actions = signal<DataTableAction<StateTableRow>[]>([
+    {
+      type: 'edit',
+      label: 'Edit',
+      icon: 'ti ti-edit',
+      className: 'text-primary'
+    },
+    {
+      type: 'delete',
+      label: 'Delete',
+      icon: 'ti ti-trash',
+      className: 'text-danger',
+      visible: row => row.isActive
+    },
+    {
+      type: 'activate',
+      label: 'Activate',
+      icon: 'ti ti-check',
+      className: 'text-success',
+      visible: row => !row.isActive
+    }
+  ]);
+
+  constructor() {
+    this.countryFilterForm.controls.countryId.valueChanges
+      .pipe(
+        distinctUntilChanged(),
+        takeUntilDestroyed(this.destroyRef)
+      )
+      .subscribe(countryId => {
+        this.onCountrySelected(countryId || null);
+      });
+
+    this.stateQueryRequests$
+      .pipe(
+        switchMap(query => {
+          const countryId = this.appliedCountryId();
+
+          return this.stateApi.getStateDataTable(query, countryId).pipe(
+            catchError(() => {
+              this.toastr.error('Unable to load states.');
+              this.clearStateGrid();
+              return of(null);
+            })
+          );
+        }),
+        takeUntilDestroyed(this.destroyRef)
+      )
+      .subscribe(response => {
+        if (!response) {
+          return;
+        }
+
+        const query = this.queryState.getQuery();
+
+        if (response.draw !== query.draw) {
+          return;
+        }
+
+        const statesWithSerialNumbers: StateTableRow[] = response.rows.map((state, index) => ({
+          ...state,
+          serialNumber: (query.page - 1) * query.pageSize + index + 1
+        }));
+
+        this.states.set(statesWithSerialNumbers);
+        this.totalRecords.set(response.total);
+        this.filteredRecords.set(response.filtered);
+      });
+  }
+
+  ngOnInit(): void {
+    this.loadStates(this.queryState.getQuery());
+  }
+
+  loadStates(query: DataTableQuery): void {
+    this.stateQueryRequests$.next(query);
+  }
+
+  onCountryLookupSelected(country: CountryLookupDto): void {
+    this.selectedCountryLookup.set(country);
+  }
+
+  applyCountryFilter(): void {
+    const countryId = this.countryFilterForm.controls.countryId.value || null;
+    this.appliedCountryId.set(countryId);
+
+    this.loadStates(this.queryState.setPage({
+      pageIndex: 1,
+      pageSize: this.queryState.pageSize()
+    }));
+  }
+
+  onFormCountrySelected(country: CountryLookupDto): void {
+    this.selectedFormCountry.set(country);
+  }
+
+  onFormCountryCleared(): void {
+    this.selectedFormCountry.set(null);
+  }
+
+  onSearch(value: string): void {
+    const query = this.queryState.setSearch(value.trim());
+    this.loadStates(query);
+  }
+
+  onPageChange(event: DataTablePageEvent): void {
+    const query = this.queryState.setPage(event);
+    this.loadStates(query);
+  }
+
+  onSortChange(event: DataTableSortEvent): void {
+    const query = this.queryState.setSort(event);
+    this.loadStates(query);
+  }
+
+  onRefresh(): void {
+    const currentQuery = this.queryState.getQuery();
+
+    const query: DataTableQuery = {
+      ...currentQuery,
+      draw: currentQuery.draw + 1
+    };
+
+    this.loadStates(query);
+  }
+
+  onReset(): void {
+    const query = this.queryState.reset();
+    this.loadStates(query);
+  }
+
+  onDeleteConfirmed(): void {
+    const state = this.pendingDeleteState();
+
+    if (!state) {
+      return;
+    }
+
+    this.pendingDeleteState.set(null);
+    this.deleteState(state);
+  }
+
+  onDeleteCancelled(): void {
+    this.pendingDeleteState.set(null);
+  }
+
+  onActionClick(event: DataTableActionEvent<StateTableRow>): void {
+    const action = event.action.type;
+    const state = this.toStateDto(event.row);
+
+    switch (action) {
+      case 'view':
+        this.viewState(state);
+        break;
+      case 'edit':
+        this.openEditState(state);
+        break;
+      case 'delete':
+        this.requestDeleteState(state);
+        break;
+      case 'activate':
+        this.activateState(state);
+        break;
+    }
+  }
+
+  onAddState(): void {
+    this.stateModalMode.set('create');
+    this.selectedStateId.set(null);
+    this.selectedState.set(null);
+    this.stateSubmitAttempted.set(false);
+
+    this.selectedFormCountry.set(null);
+    this.stateForm.reset({
+      countryId: '',
+      name: '',
+      code: ''
+    });
+    this.resetStateFormState();
+
+    this.showStateModal.set(true);
+  }
+
+  closeStateModal(): void {
+    if (this.saving()) {
+      return;
+    }
+
+    this.showStateModal.set(false);
+    this.selectedStateId.set(null);
+    this.selectedState.set(null);
+    this.selectedFormCountry.set(null);
+    this.stateSubmitAttempted.set(false);
+  }
+
+  saveState(): void {
+    if (this.stateForm.invalid) {
+      this.stateSubmitAttempted.set(true);
+      this.stateForm.markAllAsTouched();
+      this.focusFirstInvalidStateControl();
+      return;
+    }
+
+    if (this.saving()) {
+      return;
+    }
+
+    this.saving.set(true);
+
+    if (this.stateModalMode() === 'create') {
+      this.stateApi
+        .createState(this.buildCreateStateRequest())
+        .pipe(finalize(() => this.saving.set(false)))
+        .subscribe({
+          next: () => {
+            this.toastr.success('State saved successfully.');
+            this.finishStateSave();
+          }
+        });
+
+      return;
+    }
+
+    const stateId = this.selectedStateId();
+
+    if (!stateId) {
+      this.saving.set(false);
+      return;
+    }
+
+    this.stateApi
+      .updateState(
+        stateId,
+        this.buildUpdateStateRequest(this.selectedState()?.isActive ?? true)
+      )
+      .pipe(finalize(() => this.saving.set(false)))
+      .subscribe({
+        next: () => {
+          this.toastr.success('State updated successfully.');
+          this.finishStateSave();
+        }
+      });
+  }
+
+  private onCountrySelected(countryId: string | null): void {
+    this.selectedCountryId.set(countryId);
+
+    if (!countryId || this.selectedCountryLookup()?.id !== countryId) {
+      this.selectedCountryLookup.set(null);
+    }
+
+  }
+
+  private clearStateGrid(): void {
+    this.states.set([]);
+    this.totalRecords.set(0);
+    this.filteredRecords.set(0);
+  }
+
+  private viewState(state: StateDto): void {
+    this.openEditState(state);
+  }
+
+  private openEditState(state: StateDto): void {
+    this.stateModalMode.set('edit');
+    this.selectedStateId.set(state.id);
+    this.selectedState.set(state);
+    this.stateSubmitAttempted.set(false);
+
+    this.stateApi
+      .getStateById(state.id)
+      .subscribe({
+        next: stateDetails => {
+          this.selectedState.set(stateDetails);
+          this.selectedFormCountry.set(null);
+          this.stateForm.reset({
+            countryId: stateDetails.countryId ?? '',
+            name: stateDetails.name ?? '',
+            code: stateDetails.code ?? ''
+          });
+          this.resetStateFormState();
+
+          this.showStateModal.set(true);
+        }
+      });
+  }
+
+  private requestDeleteState(state: StateDto): void {
+    this.pendingDeleteState.set(state);
+    this.deleteConfirmDialog()?.open();
+  }
+
+  private deleteState(state: StateDto): void {
+    this.updateStateStatus(state, false);
+  }
+
+  private activateState(state: StateDto): void {
+    this.updateStateStatus(state, true);
+  }
+
+  private buildCreateStateRequest(): CreateStateRequest {
+    const value = this.stateForm.getRawValue();
+
+    return {
+      countryId: value.countryId,
+      name: value.name.trim(),
+      code: value.code.trim().toUpperCase()
+    };
+  }
+
+  private buildUpdateStateRequest(isActive: boolean): UpdateStateRequest {
+    const value = this.stateForm.getRawValue();
+
+    return {
+      countryId: null,
+      name: value.name.trim(),
+      code: value.code.trim().toUpperCase(),
+      isActive
+    };
+  }
+
+  private stateToUpdateRequest(state: StateDto, isActive: boolean): UpdateStateRequest {
+    return {
+      countryId: null,
+      name: state.name?.trim() ?? '',
+      code: state.code?.trim().toUpperCase() ?? '',
+      isActive
+    };
+  }
+
+  private updateStateStatus(state: StateDto, isActive: boolean): void {
+    this.stateApi
+      .updateState(state.id, this.stateToUpdateRequest(state, isActive))
+      .subscribe({
+        next: () => {
+          this.toastr.success(
+            isActive
+              ? 'State activated successfully.'
+              : 'State deactivated successfully.'
+          );
+          this.loadStates(this.queryState.getQuery());
+        }
+      });
+  }
+
+  private resetStateFormState(): void {
+    this.stateForm.markAsPristine();
+    this.stateForm.markAsUntouched();
+    this.stateForm.updateValueAndValidity();
+  }
+
+  private finishStateSave(): void {
+    this.showStateModal.set(false);
+    this.selectedStateId.set(null);
+    this.selectedState.set(null);
+    this.selectedFormCountry.set(null);
+    this.stateSubmitAttempted.set(false);
+    this.loadStates(this.queryState.getQuery());
+  }
+
+  private focusFirstInvalidStateControl(): void {
+    queueMicrotask(() => {
+      const firstInvalidControl =
+        this.elementRef.nativeElement.querySelector<HTMLElement>(
+          'modal [data-form-control][aria-invalid="true"]'
+        );
+
+      firstInvalidControl?.focus();
+      firstInvalidControl?.scrollIntoView({
+        behavior: 'smooth',
+        block: 'center'
+      });
+    });
+  }
+
+  private toStateDto(row: StateTableRow): StateDto {
+    return {
+      id: row.id,
+      countryId: row.countryId,
+      name: row.name,
+      code: row.code,
+      isActive: row.isActive,
+      createdOn: row.createdOn,
+      modifiedOn: row.modifiedOn
+    };
+  }
+}
diff --git a/src/app/features/global-masters/states/public-api.ts b/src/app/features/global-masters/states/public-api.ts
new file mode 100644
index 00000000..6b7e957b
--- /dev/null
+++ b/src/app/features/global-masters/states/public-api.ts
@@ -0,0 +1,2 @@
+export { StateService } from './data-access/state.service';
+export type { StateLookupDto } from './models/state.model';
diff --git a/src/app/features/global-masters/timezones/data-access/timezone.endpoints.ts b/src/app/features/global-masters/timezones/data-access/timezone.endpoints.ts
new file mode 100644
index 00000000..6a5d5516
--- /dev/null
+++ b/src/app/features/global-masters/timezones/data-access/timezone.endpoints.ts
@@ -0,0 +1,11 @@
+import { buildApiUrl } from '../../../../core/config/api-url.util';
+
+export const TIMEZONE_ENDPOINTS = {
+  dataTable: buildApiUrl('masterAdmin', '/v1/timezones/datatable'),
+  create: buildApiUrl('masterAdmin', '/v1/timezones'),
+  getById: (id: string) =>
+    buildApiUrl('masterAdmin', `/v1/timezones/${encodeURIComponent(id)}`),
+  update: (id: string) =>
+    buildApiUrl('masterAdmin', `/v1/timezones/${encodeURIComponent(id)}`),
+  autocomplete: buildApiUrl('masterAdmin', '/v1/timezones/autocomplete')
+} as const;
diff --git a/src/app/features/global-masters/timezones/data-access/timezone.service.ts b/src/app/features/global-masters/timezones/data-access/timezone.service.ts
new file mode 100644
index 00000000..559982a6
--- /dev/null
+++ b/src/app/features/global-masters/timezones/data-access/timezone.service.ts
@@ -0,0 +1,45 @@
+import { HttpClient, HttpParams } from '@angular/common/http';
+import { Injectable, inject } from '@angular/core';
+import { Observable } from 'rxjs';
+
+import { TIMEZONE_ENDPOINTS } from './timezone.endpoints';
+import {
+  CreateTimezoneRequest,
+  TimezoneDto,
+  TimezoneLookupDto,
+  UpdateTimezoneRequest
+} from '../models/timezone.model';
+import {
+  DataTableQuery,
+  DataTableResult
+} from '../../../../shared/components/data-table/data-table.types';
+
+@Injectable({ providedIn: 'root' })
+export class TimezoneService {
+  private readonly http = inject(HttpClient);
+
+  getDataTable(query: DataTableQuery): Observable<DataTableResult<TimezoneDto>> {
+    return this.http.post<DataTableResult<TimezoneDto>>(TIMEZONE_ENDPOINTS.dataTable, query);
+  }
+
+  getById(id: string): Observable<TimezoneDto> {
+    return this.http.get<TimezoneDto>(TIMEZONE_ENDPOINTS.getById(id));
+  }
+
+  create(request: CreateTimezoneRequest): Observable<TimezoneDto> {
+    return this.http.post<TimezoneDto>(TIMEZONE_ENDPOINTS.create, request);
+  }
+
+  update(id: string, request: UpdateTimezoneRequest): Observable<TimezoneDto> {
+    return this.http.put<TimezoneDto>(TIMEZONE_ENDPOINTS.update(id), request);
+  }
+
+  autocomplete(term: string | null, limit = 10): Observable<readonly TimezoneLookupDto[]> {
+    const normalizedTerm = term?.trim() || null;
+    let params = new HttpParams().set('limit', limit);
+    if (normalizedTerm !== null) {
+      params = params.set('term', normalizedTerm);
+    }
+    return this.http.get<readonly TimezoneLookupDto[]>(TIMEZONE_ENDPOINTS.autocomplete, { params });
+  }
+}
diff --git a/src/app/features/global-masters/timezones/models/timezone.model.ts b/src/app/features/global-masters/timezones/models/timezone.model.ts
new file mode 100644
index 00000000..31a75ee6
--- /dev/null
+++ b/src/app/features/global-masters/timezones/models/timezone.model.ts
@@ -0,0 +1,27 @@
+export interface TimezoneDto {
+  readonly id: string;
+  readonly ianaId: string;
+  readonly displayName: string;
+  readonly utcOffsetMinutes: number;
+  readonly isActive: boolean;
+  readonly createdOn: string;
+  readonly modifiedOn: string | null;
+}
+
+export interface TimezoneLookupDto {
+  readonly id: string;
+  readonly ianaId: string;
+  readonly displayName: string;
+}
+
+export interface CreateTimezoneRequest {
+  readonly ianaId: string;
+  readonly displayName: string;
+  readonly utcOffsetMinutes: number;
+}
+
+export interface UpdateTimezoneRequest extends CreateTimezoneRequest {
+  readonly isActive: boolean;
+}
+
+export type TimezoneModalMode = 'create' | 'edit' | 'view';
diff --git a/src/app/features/global-masters/timezones/pages/timezone-list/timezone-list.html b/src/app/features/global-masters/timezones/pages/timezone-list/timezone-list.html
new file mode 100644
index 00000000..bd22a860
--- /dev/null
+++ b/src/app/features/global-masters/timezones/pages/timezone-list/timezone-list.html
@@ -0,0 +1,137 @@
+<app-data-table
+  [columns]="columns()"
+  [rows]="timezones()"
+  [actions]="actions()"
+  [totalRecords]="totalRecords()"
+  [pageIndex]="queryState.pageIndex()"
+  [pageSize]="queryState.pageSize()"
+  tableTitle="Timezones"
+  buttonTitle="Add"
+  [showSearch]="true"
+  [showAddButton]="true"
+  searchPlaceholder="Search timezones..."
+  [searchDebounceTime]="300"
+  toolTip="Add Timezone"
+  (addClicked)="onAddTimezone()"
+  (searchChanged)="onSearch($event)"
+  (pageChanged)="onPageChange($event)"
+  (sortChanged)="onSortChange($event)"
+  (actionClicked)="onActionClick($event)"
+>
+  <ng-template appDataTableCell="ianaId" let-value="value">
+    <span class="block max-w-72 truncate font-semibold" title="{{ value }}">{{ value }}</span>
+  </ng-template>
+  <ng-template appDataTableCell="displayName" let-value="value">
+    <span class="block max-w-72 truncate" title="{{ value }}">{{ value }}</span>
+  </ng-template>
+</app-data-table>
+
+<app-confirm-dialog
+  title="Delete Timezone"
+  text="Do you really want to delete this timezone?"
+  confirmButtonText="Delete"
+  cancelButtonText="Cancel"
+  (confirmed)="onDeleteConfirmed()"
+  (cancelled)="onDeleteCancelled()"
+/>
+
+<modal
+  [open]="showModal()"
+  [title]="modalTitle()"
+  size="md"
+  [submitAction]="submitAction()"
+  [submitLabel]="submitLabel()"
+  [loadingLabel]="loadingLabel()"
+  [loading]="saving() || modalLoading()"
+  [showSubmitButton]="!isViewMode()"
+  [cancelLabel]="isViewMode() ? 'Close' : 'Cancel'"
+  (closed)="closeModal()"
+  (submitted)="saveTimezone()"
+>
+  @if (modalLoading()) {
+    <div class="flex min-h-32 items-center justify-center" role="status" aria-live="polite">
+      <span class="ti ti-loader-2 animate-spin text-2xl text-primary" aria-hidden="true"></span>
+      <span class="ms-2">Loading timezone...</span>
+    </div>
+  } @else {
+    <form [formGroup]="timezoneForm" (ngSubmit)="saveTimezone()" autocomplete="off">
+      <div class="grid grid-cols-12 gap-x-5 gap-y-5">
+        <div class="col-span-12 md:col-span-6">
+          <app-form-input
+            formControlName="ianaId"
+            inputId="timezone-iana-id"
+            variant="floating"
+            label="IANA Timezone ID"
+            placeholder="Id"
+            help="e.g.: Asia/Kolkata"
+            autocomplete="off"
+            [required]="true"
+            [readonly]="isViewMode()"
+            [maxLength]="64"
+            [submitAttempted]="submitAttempted()"
+            [validationMessages]="{
+              required: 'Timezone ID is required.',
+              maxlength: 'Timezone ID must be 64 characters or fewer.',
+              pattern: 'Use a valid IANA timezone ID, for example Asia/Kolkata or America/New_York.'
+            }"
+          />
+        </div>
+        <div class="col-span-12 md:col-span-6">
+          <app-form-input
+            formControlName="displayName"
+            inputId="timezone-display-name"
+            variant="floating"
+            label="Display Name"
+            placeholder="Name"
+            help="e.g.: India Standard Time"
+            autocomplete="off"
+            [required]="true"
+            [readonly]="isViewMode()"
+            [maxLength]="128"
+            [submitAttempted]="submitAttempted()"
+            [validationMessages]="{
+              required: 'Timezone display name is required.',
+              maxlength: 'Timezone display name must be 128 characters or fewer.',
+              pattern: 'Timezone display name cannot contain only whitespace.'
+            }"
+          />
+        </div>
+        <div class="col-span-12 md:col-span-6">
+          <app-form-input
+            formControlName="utcOffsetMinutes"
+            inputId="timezone-utc-offset"
+            variant="floating"
+            label="UTC Offset (minutes)"
+            type="number"
+            inputMode="numeric"
+            placeholder="Minutes"
+            help="Enter an offset from -720 (-12:00) to 840 (+14:00)."
+            [required]="true"
+            [readonly]="isViewMode()"
+            [min]="-720"
+            [max]="840"
+            [step]="1"
+            [submitAttempted]="submitAttempted()"
+            [validationMessages]="{
+              required: 'UTC offset is required.',
+              min: 'UTC offset must be between -12:00 and +14:00.',
+              max: 'UTC offset must be between -12:00 and +14:00.'
+            }"
+          />
+        </div>
+        @if (isViewMode() && selectedTimezone(); as timezone) {
+          <div class="col-span-12 md:col-span-6 pt-1">
+            <span class="block text-sm text-textmuted">Formatted UTC Offset</span>
+            <span class="mt-2 block font-semibold">{{ formatUtcOffset(timezone.utcOffsetMinutes) }}</span>
+          </div>
+          <div class="col-span-12 md:col-span-6">
+            <span class="block text-sm text-textmuted">Status</span>
+            <span class="badge mt-2" [class.bg-success]="timezone.isActive" [class.bg-danger]="!timezone.isActive">
+              {{ timezone.isActive ? 'Active' : 'Inactive' }}
+            </span>
+          </div>
+        }
+      </div>
+    </form>
+  }
+</modal>
diff --git a/src/app/features/global-masters/timezones/pages/timezone-list/timezone-list.scss b/src/app/features/global-masters/timezones/pages/timezone-list/timezone-list.scss
new file mode 100644
index 00000000..8b137891
--- /dev/null
+++ b/src/app/features/global-masters/timezones/pages/timezone-list/timezone-list.scss
@@ -0,0 +1 @@
+
diff --git a/src/app/features/global-masters/timezones/pages/timezone-list/timezone-list.ts b/src/app/features/global-masters/timezones/pages/timezone-list/timezone-list.ts
new file mode 100644
index 00000000..a1ffe667
--- /dev/null
+++ b/src/app/features/global-masters/timezones/pages/timezone-list/timezone-list.ts
@@ -0,0 +1,348 @@
+import { HttpErrorResponse } from '@angular/common/http';
+import { Component, DestroyRef, ElementRef, OnInit, computed, inject, signal, viewChild } from '@angular/core';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { FormBuilder, ReactiveFormsModule, Validators } from '@angular/forms';
+import { ToastrService } from 'ngx-toastr';
+import { Subject, catchError, finalize, of, switchMap } from 'rxjs';
+
+import {
+  CreateTimezoneRequest,
+  TimezoneDto,
+  TimezoneModalMode,
+  UpdateTimezoneRequest
+} from '../../models/timezone.model';
+import { TimezoneService } from '../../data-access/timezone.service';
+import { DataTable } from '../../../../../shared/components/data-table/data-table';
+import { DataTableQueryState } from '../../../../../shared/components/data-table/data-table-query.state';
+import {
+  DataTableAction,
+  DataTableActionEvent,
+  DataTableColumn,
+  DataTablePageEvent,
+  DataTableQuery,
+  DataTableRecord,
+  DataTableSortEvent
+} from '../../../../../shared/components/data-table/data-table.types';
+import { FormInput } from '../../../../../shared/components/form/form-input/form-input';
+import { Modal } from '../../../../../shared/components/modal/modal';
+import { DataTableCellDirective } from '../../../../../shared/directives/data-table-cell.directive';
+import { ConfirmDialog } from '../../../../../shared/components/confirm-dialog/confirm-dialog';
+
+interface TimezoneTableRow extends DataTableRecord {
+  readonly id: string;
+  readonly ianaId: string;
+  readonly displayName: string;
+  readonly utcOffsetMinutes: number;
+  readonly isActive: boolean;
+  readonly serialNumber: number;
+  readonly createdOn: string;
+  readonly modifiedOn: string | null;
+}
+
+@Component({
+  selector: 'timezone-list',
+  standalone: true,
+  imports: [DataTable, DataTableCellDirective, Modal, ReactiveFormsModule, FormInput, ConfirmDialog],
+  templateUrl: './timezone-list.html',
+  styleUrl: './timezone-list.scss'
+})
+export class TimezoneList implements OnInit {
+  private readonly destroyRef = inject(DestroyRef);
+  private readonly timezoneApi = inject(TimezoneService);
+  private readonly formBuilder = inject(FormBuilder);
+  private readonly elementRef = inject<ElementRef<HTMLElement>>(ElementRef);
+  private readonly toastr = inject(ToastrService);
+  private readonly queryRequests$ = new Subject<DataTableQuery>();
+
+  readonly queryState = new DataTableQueryState();
+  readonly timezones = signal<TimezoneTableRow[]>([]);
+  readonly totalRecords = signal(0);
+  readonly modalLoading = signal(false);
+  readonly saving = signal(false);
+  readonly statusChangingId = signal<string | null>(null);
+  readonly showModal = signal(false);
+  readonly modalMode = signal<TimezoneModalMode>('create');
+  readonly selectedTimezoneId = signal<string | null>(null);
+  readonly selectedTimezone = signal<TimezoneDto | null>(null);
+  readonly submitAttempted = signal(false);
+  readonly pendingDeleteTimezoneId = signal<string | null>(null);
+  readonly deleteConfirmDialog = viewChild(ConfirmDialog);
+
+  readonly timezoneForm = this.formBuilder.nonNullable.group({
+    ianaId: ['', [
+      Validators.required,
+      Validators.maxLength(64),
+      Validators.pattern(/^[A-Za-z]+(?:[._+-]?[A-Za-z0-9]+)*(?:\/[A-Za-z0-9._+-]+)+$/)
+    ]],
+    displayName: ['', [Validators.required, Validators.maxLength(128), Validators.pattern(/.*\S.*/)]],
+    utcOffsetMinutes: [0, [Validators.required, Validators.min(-720), Validators.max(840)]]
+  });
+
+  readonly isViewMode = computed(() => this.modalMode() === 'view');
+  readonly modalTitle = computed(() => {
+    switch (this.modalMode()) {
+      case 'create': return 'Add Timezone';
+      case 'edit': return 'Edit Timezone';
+      case 'view': return 'View Timezone';
+    }
+  });
+  readonly submitLabel = computed(() => this.modalMode() === 'create' ? 'Save' : 'Update');
+  readonly loadingLabel = computed(() => this.modalMode() === 'create' ? 'Saving...' : 'Updating...');
+  readonly submitAction = computed<'save' | 'update'>(() => this.modalMode() === 'create' ? 'save' : 'update');
+
+  readonly columns = signal<DataTableColumn<TimezoneTableRow>[]>([
+    { key: 'serialNumber', label: 'Sr. No.', header: 'Sr.No.', sortable: false, width: '90px' },
+    { key: 'ianaId', label: 'IANA ID', header: 'IANA ID', sortable: true, headerAlign: 'center', align: 'left' },
+    { key: 'displayName', label: 'Display Name', header: 'Display Name', sortable: true, headerAlign: 'center', align: 'left' },
+    {
+      key: 'utcOffsetMinutes', label: 'UTC Offset', header: 'UTC Offset', sortable: true,
+      formatter: value => this.formatUtcOffset(Number(value))
+    },
+    {
+      key: 'isActive', label: 'Status', header: 'Status', sortable: true, badge: true,
+      badgeClass: value => value === true
+        ? 'badge bg-success/10 text-success'
+        : 'badge bg-danger/10 text-danger',
+      formatter: value => value ? 'Active' : 'Inactive'
+    }
+  ]);
+
+  readonly actions = signal<DataTableAction<TimezoneTableRow>[]>([
+    {
+      type: 'edit',
+      label: 'Edit',
+      icon: 'ti ti-edit',
+      className: 'text-primary'
+    },
+    {
+      type: 'delete',
+      label: 'Delete',
+      icon: 'ti ti-trash',
+      className: 'text-danger',
+      visible: row => row.isActive,
+      disabled: row => this.statusChangingId() === row.id
+    },
+    {
+      type: 'activate',
+      label: 'Activate',
+      icon: 'ti ti-check',
+      className: 'text-success',
+      visible: row => !row.isActive,
+      disabled: row => this.statusChangingId() === row.id
+    }
+  ]);
+
+  constructor() {
+    this.queryRequests$.pipe(
+      switchMap(query => this.timezoneApi.getDataTable(query).pipe(
+        catchError(() => {
+          this.timezones.set([]);
+          this.totalRecords.set(0);
+          return of(null);
+        })
+      )),
+      takeUntilDestroyed(this.destroyRef)
+    ).subscribe(response => {
+      if (!response || response.draw !== this.queryState.getQuery().draw) return;
+      const query = this.queryState.getQuery();
+      this.timezones.set(response.rows.map((timezone, index) => ({
+        ...timezone,
+        serialNumber: (query.page - 1) * query.pageSize + index + 1
+      })));
+      this.totalRecords.set(response.total);
+    });
+  }
+
+  ngOnInit(): void { this.loadTimezones(this.queryState.getQuery()); }
+  loadTimezones(query: DataTableQuery): void { this.queryRequests$.next(query); }
+  onSearch(value: string): void { this.loadTimezones(this.queryState.setSearch(value.trim())); }
+  onPageChange(event: DataTablePageEvent): void { this.loadTimezones(this.queryState.setPage(event)); }
+  onSortChange(event: DataTableSortEvent): void { this.loadTimezones(this.queryState.setSort(event)); }
+
+  onDeleteConfirmed(): void {
+    const timezoneId = this.pendingDeleteTimezoneId();
+
+    if (!timezoneId) {
+      return;
+    }
+
+    this.pendingDeleteTimezoneId.set(null);
+    this.changeTimezoneStatus(timezoneId, false);
+  }
+
+  onDeleteCancelled(): void {
+    this.pendingDeleteTimezoneId.set(null);
+  }
+
+  onActionClick(event: DataTableActionEvent<TimezoneTableRow>): void {
+    if (event.action.type === 'view') this.openTimezone(event.row.id, 'view');
+    if (event.action.type === 'edit') this.openTimezone(event.row.id, 'edit');
+    if (event.action.type === 'delete') this.requestDeleteTimezone(event.row.id);
+    if (event.action.type === 'activate') this.changeTimezoneStatus(event.row.id, true);
+  }
+
+  private requestDeleteTimezone(id: string): void {
+    this.pendingDeleteTimezoneId.set(id);
+    this.deleteConfirmDialog()?.open();
+  }
+
+  onAddTimezone(): void {
+    this.modalMode.set('create');
+    this.prepareModal(null);
+    this.showModal.set(true);
+  }
+
+  openTimezone(id: string, mode: 'edit' | 'view'): void {
+    this.modalMode.set(mode);
+    this.prepareModal(id);
+    this.modalLoading.set(true);
+    this.showModal.set(true);
+    this.timezoneApi.getById(id).pipe(
+      finalize(() => this.modalLoading.set(false)),
+      takeUntilDestroyed(this.destroyRef)
+    ).subscribe({
+      next: timezone => {
+        if (this.selectedTimezoneId() !== timezone.id || !this.showModal()) return;
+        this.selectedTimezone.set(timezone);
+        this.timezoneForm.reset({
+          ianaId: timezone.ianaId,
+          displayName: timezone.displayName,
+          utcOffsetMinutes: timezone.utcOffsetMinutes
+        });
+        if (mode === 'view') this.timezoneForm.disable();
+        this.resetFormState();
+      },
+      error: (error: HttpErrorResponse) => {
+        this.showModal.set(false);
+        if (error.status === 404) this.toastr.error('The timezone is no longer available.');
+      }
+    });
+  }
+
+  closeModal(): void {
+    if (this.saving()) return;
+    this.showModal.set(false);
+    this.selectedTimezoneId.set(null);
+    this.selectedTimezone.set(null);
+    this.submitAttempted.set(false);
+    this.timezoneForm.enable();
+  }
+
+  saveTimezone(): void {
+    if (this.isViewMode() || this.saving() || this.modalLoading()) return;
+    if (this.timezoneForm.invalid) {
+      this.submitAttempted.set(true);
+      this.timezoneForm.markAllAsTouched();
+      this.focusFirstInvalidControl();
+      return;
+    }
+    const selected = this.selectedTimezone();
+    const id = this.selectedTimezoneId();
+    if (this.modalMode() === 'edit' && (!selected || !id)) return;
+
+    this.saving.set(true);
+    const createRequest = this.buildCreateRequest();
+    const operation = this.modalMode() === 'create'
+      ? this.timezoneApi.create(createRequest)
+      : this.timezoneApi.update(id!, { ...createRequest, isActive: selected!.isActive });
+    operation.pipe(
+      finalize(() => this.saving.set(false)),
+      takeUntilDestroyed(this.destroyRef)
+    ).subscribe({
+      next: () => {
+        this.toastr.success(this.modalMode() === 'create'
+          ? 'Timezone saved successfully.'
+          : 'Timezone updated successfully.');
+        this.finishSave();
+      },
+      error: (error: HttpErrorResponse) => this.handleSaveError(error)
+    });
+  }
+
+  formatUtcOffset(minutes: number): string {
+    const sign = minutes >= 0 ? '+' : '-';
+    const absolute = Math.abs(minutes);
+    return `UTC${sign}${String(Math.floor(absolute / 60)).padStart(2, '0')}:${String(absolute % 60).padStart(2, '0')}`;
+  }
+
+  private prepareModal(id: string | null): void {
+    this.selectedTimezoneId.set(id);
+    this.selectedTimezone.set(null);
+    this.submitAttempted.set(false);
+    this.timezoneForm.enable();
+    this.timezoneForm.reset({ ianaId: '', displayName: '', utcOffsetMinutes: 0 });
+    this.resetFormState();
+  }
+
+  private buildCreateRequest(): CreateTimezoneRequest {
+    const value = this.timezoneForm.getRawValue();
+    return {
+      ianaId: value.ianaId.trim(),
+      displayName: value.displayName.trim(),
+      utcOffsetMinutes: value.utcOffsetMinutes
+    };
+  }
+
+  private changeTimezoneStatus(id: string, isActive: boolean): void {
+    if (this.statusChangingId()) return;
+    this.statusChangingId.set(id);
+    this.timezoneApi.getById(id).pipe(
+      switchMap(timezone => this.timezoneApi.update(id, {
+        ianaId: timezone.ianaId,
+        displayName: timezone.displayName,
+        utcOffsetMinutes: timezone.utcOffsetMinutes,
+        isActive
+      })),
+      finalize(() => this.statusChangingId.set(null)),
+      takeUntilDestroyed(this.destroyRef)
+    ).subscribe({
+      next: () => {
+        this.toastr.success(isActive
+          ? 'Timezone activated successfully.'
+          : 'Timezone deleted successfully.');
+        this.loadTimezones(this.queryState.getQuery());
+      },
+      error: (error: HttpErrorResponse) => {
+        if (error.status === 404) this.toastr.error('The timezone is no longer available.');
+      }
+    });
+  }
+
+  private handleSaveError(error: HttpErrorResponse): void {
+    if (error.status === 409) {
+      const message = this.apiErrorMessage(error) ?? 'A timezone with this IANA ID already exists.';
+      this.toastr.error(message, 'Duplicate IANA timezone ID');
+    } else if (error.status === 404) {
+      this.toastr.error('The timezone is no longer available.');
+      this.closeModal();
+    }
+  }
+
+  private apiErrorMessage(error: HttpErrorResponse): string | null {
+    const body: unknown = error.error;
+    if (!body || typeof body !== 'object') return null;
+    if ('detail' in body && typeof body.detail === 'string') return body.detail;
+    if ('message' in body && typeof body.message === 'string') return body.message;
+    return null;
+  }
+
+  private finishSave(): void {
+    this.showModal.set(false);
+    this.selectedTimezoneId.set(null);
+    this.selectedTimezone.set(null);
+    this.submitAttempted.set(false);
+    this.loadTimezones(this.queryState.getQuery());
+  }
+
+  private resetFormState(): void {
+    this.timezoneForm.markAsPristine();
+    this.timezoneForm.markAsUntouched();
+    this.timezoneForm.updateValueAndValidity();
+  }
+
+  private focusFirstInvalidControl(): void {
+    queueMicrotask(() => this.elementRef.nativeElement
+      .querySelector<HTMLElement>('modal [data-form-control][aria-invalid="true"]')
+      ?.focus());
+  }
+}
diff --git a/src/app/features/global-masters/timezones/public-api.ts b/src/app/features/global-masters/timezones/public-api.ts
new file mode 100644
index 00000000..ec3675e9
--- /dev/null
+++ b/src/app/features/global-masters/timezones/public-api.ts
@@ -0,0 +1,2 @@
+export { TimezoneService } from './data-access/timezone.service';
+export type { TimezoneDto, TimezoneLookupDto } from './models/timezone.model';
diff --git a/src/app/features/organizations/organization-list/organization-list.html b/src/app/features/organizations/organization-list/organization-list.html
new file mode 100644
index 00000000..4c6f643d
--- /dev/null
+++ b/src/app/features/organizations/organization-list/organization-list.html
@@ -0,0 +1 @@
+<p>organization-list works!</p>
diff --git a/src/app/features/organizations/organization-list/organization-list.scss b/src/app/features/organizations/organization-list/organization-list.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/src/app/features/organizations/organization-list/organization-list.ts b/src/app/features/organizations/organization-list/organization-list.ts
new file mode 100644
index 00000000..0aa9bef6
--- /dev/null
+++ b/src/app/features/organizations/organization-list/organization-list.ts
@@ -0,0 +1,11 @@
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'organization-list',
+  imports: [],
+  templateUrl: './organization-list.html',
+  styleUrl: './organization-list.scss',
+})
+export class OrganizationList {
+
+}
diff --git a/src/app/features/organizations/organization-onboarding/components/onboarding-stepper/onboarding-stepper.html b/src/app/features/organizations/organization-onboarding/components/onboarding-stepper/onboarding-stepper.html
new file mode 100644
index 00000000..9def9eba
--- /dev/null
+++ b/src/app/features/organizations/organization-onboarding/components/onboarding-stepper/onboarding-stepper.html
@@ -0,0 +1,239 @@
+<div class="w-full">
+  <!-- Stepper Nav -->
+  <nav aria-label="Organization onboarding progress">
+    <ul
+      class="relative flex-row gap-x-2 space-y-4
+             sm:flex sm:space-y-0"
+    >
+      @for (step of steps(); track step.key; let index = $index) {
+        <li
+          class="group flex flex-1 basis-0 shrink items-center gap-x-2"
+          [class.active]="isCurrentStep(index)"
+          [class.success]="isCompletedStep(index)"
+          [attr.data-hs-stepper-nav-item]="
+            '{&quot;index&quot;:' + (index + 1) + '}'
+          "
+        >
+          <button
+            type="button"
+            class="group inline-flex min-h-7 min-w-7 items-center
+                   text-start text-xs align-middle
+                   focus-visible:outline-none focus-visible:ring-2
+                   focus-visible:ring-primary focus-visible:ring-offset-2"
+            [class.cursor-pointer]="canOpenStep(index)"
+            [class.cursor-default]="!canOpenStep(index)"
+            [attr.aria-current]="
+              isCurrentStep(index) ? 'step' : null
+            "
+            [attr.aria-disabled]="
+              canOpenStep(index) ? null : true
+            "
+            (click)="selectStep(index)"
+          >
+            <span
+              class="flex size-7 shrink-0 items-center justify-center
+                     rounded-full bg-gray-100 font-medium text-gray-800
+                     group-focus:bg-gray-200 dark:bg-bodybg dark:text-white
+                     dark:group-focus:bg-gray-600
+                     hs-stepper-active:!bg-primary
+                     hs-stepper-active:!text-white
+                     hs-stepper-success:!bg-primary
+                     hs-stepper-success:!text-white
+                     hs-stepper-completed:!bg-success
+                     hs-stepper-completed:group-focus:!bg-success"
+            >
+              <span
+                class="hs-stepper-success:hidden
+                       hs-stepper-completed:hidden"
+              >
+                {{ index + 1 }}
+              </span>
+
+              <svg
+                class="hidden size-3 shrink-0 hs-stepper-success:block"
+                xmlns="http://www.w3.org/2000/svg"
+                width="24"
+                height="24"
+                viewBox="0 0 24 24"
+                fill="none"
+                stroke="currentColor"
+                stroke-width="3"
+                stroke-linecap="round"
+                stroke-linejoin="round"
+                aria-hidden="true"
+              >
+                <polyline points="20 6 9 17 4 12" />
+              </svg>
+
+              <span class="sr-only">
+                @if (isCompletedStep(index)) {
+                  Completed
+                } @else if (isCurrentStep(index)) {
+                  Current step
+                } @else {
+                  Pending
+                }
+              </span>
+            </span>
+
+            <span
+              class="ms-2 whitespace-nowrap text-sm font-medium
+                     text-gray-800 dark:text-white
+                     hs-stepper-active:!text-primary
+                     hs-stepper-success:!text-primary
+                     hs-stepper-completed:!text-success"
+            >
+              {{ step.label }}
+            </span>
+          </button>
+
+          @if (index < steps().length - 1) {
+            <div
+              class="hidden h-px w-full flex-1 bg-gray-200
+                     dark:bg-bodybg sm:block
+                     hs-stepper-success:!bg-primary
+                     hs-stepper-completed:!bg-success"
+              aria-hidden="true"
+            ></div>
+          }
+        </li>
+      }
+    </ul>
+  </nav>
+  <!-- End Stepper Nav -->
+
+  <!-- Stepper Content -->
+  <div class="mt-5 sm:mt-8">
+    <div
+      class="rounded-xl border border-dashed border-gray-200
+             bg-gray-50 p-6 dark:border-white/10 dark:bg-bodybg"
+    >
+      <ng-content />
+    </div>
+
+    <!-- Button Group -->
+    <footer
+      class="mt-5 flex flex-col-reverse gap-3
+             sm:flex-row sm:items-center sm:justify-between"
+    >
+      <!-- Cancel or Back -->
+      <div class="flex w-full sm:w-auto">
+        @if (isFirstStep()) {
+          <button
+            type="button"
+            class="ti-btn ti-btn-light h-10 w-full justify-center
+                   gap-2 disabled:pointer-events-none
+                   disabled:opacity-50 sm:w-44"
+            [disabled]="navigationDisabled()"
+            (click)="requestCancel()"
+          >
+            <i class="ri-close-line" aria-hidden="true"></i>
+            <span>Cancel</span>
+          </button>
+        } @else {
+          <button
+            type="button"
+            class="ti-btn ti-btn-light h-10 w-full justify-center
+                   gap-2 disabled:pointer-events-none
+                   disabled:opacity-50 sm:w-44"
+            [disabled]="navigationDisabled()"
+            (click)="requestBack()"
+          >
+            <i
+              class="ri-arrow-left-s-line rtl:rotate-180"
+              aria-hidden="true"
+            ></i>
+
+            <span>Back</span>
+          </button>
+        }
+      </div>
+
+      <!-- Save and Next/Finish -->
+      <div
+        class="flex w-full flex-col gap-2
+               sm:w-auto sm:flex-row"
+      >
+        <button
+          type="button"
+          class="ti-btn ti-btn-outline-primary h-10 w-full
+                 justify-center gap-2 disabled:pointer-events-none
+                 disabled:opacity-50 sm:w-44"
+          [disabled]="
+            navigationDisabled() ||
+            savingDraft() ||
+            finishing()
+          "
+          (click)="requestSaveDraft()"
+        >
+          @if (savingDraft()) {
+            <span
+              class="size-4 animate-spin rounded-full border-2
+                     border-current border-t-transparent"
+              aria-hidden="true"
+            ></span>
+
+            <span>Saving...</span>
+          } @else {
+            <i class="ri-save-line" aria-hidden="true"></i>
+            <span>Save Draft</span>
+          }
+        </button>
+
+        @if (!isLastStep()) {
+          <button
+            type="button"
+            class="ti-btn ti-btn-primary-full h-10 w-full
+                   justify-center gap-2 disabled:pointer-events-none
+                   disabled:opacity-50 sm:w-44"
+            [disabled]="
+              navigationDisabled() ||
+              savingDraft() ||
+              finishing()
+            "
+            (click)="requestNext()"
+          >
+            <span>Next</span>
+
+            <i
+              class="ri-arrow-right-s-line rtl:rotate-180"
+              aria-hidden="true"
+            ></i>
+          </button>
+        } @else {
+          <button
+            type="button"
+            class="ti-btn ti-btn-success-full h-10 w-full
+                   justify-center gap-2 disabled:pointer-events-none
+                   disabled:opacity-50 sm:w-44"
+            [disabled]="
+              navigationDisabled() ||
+              savingDraft() ||
+              finishing()
+            "
+            (click)="requestFinish()"
+          >
+            @if (finishing()) {
+              <span
+                class="size-4 animate-spin rounded-full border-2
+                       border-current border-t-transparent"
+                aria-hidden="true"
+              ></span>
+
+              <span>Provisioning...</span>
+            } @else {
+              <i
+                class="ri-checkbox-circle-line"
+                aria-hidden="true"
+              ></i>
+
+              <span>Finish & Provision</span>
+            }
+          </button>
+        }
+      </div>
+    </footer>
+    <!-- End Button Group -->
+  </div>
+  <!-- End Stepper Content -->
+</div>
\ No newline at end of file
diff --git a/src/app/features/organizations/organization-onboarding/components/onboarding-stepper/onboarding-stepper.scss b/src/app/features/organizations/organization-onboarding/components/onboarding-stepper/onboarding-stepper.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/src/app/features/organizations/organization-onboarding/components/onboarding-stepper/onboarding-stepper.ts b/src/app/features/organizations/organization-onboarding/components/onboarding-stepper/onboarding-stepper.ts
new file mode 100644
index 00000000..c5de3d6f
--- /dev/null
+++ b/src/app/features/organizations/organization-onboarding/components/onboarding-stepper/onboarding-stepper.ts
@@ -0,0 +1,119 @@
+import {
+  ChangeDetectionStrategy,
+  Component,
+  input,
+  output
+} from '@angular/core';
+
+export interface OnboardingStep {
+  readonly key: string;
+  readonly label: string;
+}
+
+@Component({
+  selector: 'onboarding-stepper',
+  standalone: true,
+  imports: [],
+  templateUrl: './onboarding-stepper.html',
+  styleUrl: './onboarding-stepper.scss',
+  changeDetection: ChangeDetectionStrategy.OnPush
+})
+export class OnboardingStepper {
+  readonly steps = input.required<readonly OnboardingStep[]>();
+  readonly currentStepIndex = input.required<number>();
+  readonly completedStepIndexes = input<readonly number[]>([]);
+
+  readonly savingDraft = input(false);
+  readonly finishing = input(false);
+  readonly navigationDisabled = input(false);
+
+  readonly stepSelected = output<number>();
+  readonly backClicked = output<void>();
+  readonly nextClicked = output<void>();
+  readonly saveDraftClicked = output<void>();
+  readonly finishClicked = output<void>();
+  readonly cancelClicked = output<void>();
+
+  isFirstStep(): boolean {
+    return this.currentStepIndex() === 0;
+  }
+
+  isLastStep(): boolean {
+    return this.currentStepIndex() === this.steps().length - 1;
+  }
+
+  isCurrentStep(index: number): boolean {
+    return index === this.currentStepIndex();
+  }
+
+  isCompletedStep(index: number): boolean {
+    return this.completedStepIndexes().includes(index);
+  }
+
+  isPendingStep(index: number): boolean {
+    return !this.isCurrentStep(index) && !this.isCompletedStep(index);
+  }
+
+  canOpenStep(index: number): boolean {
+    if (this.navigationDisabled()) {
+      return false;
+    }
+
+    return (
+      index < this.currentStepIndex() ||
+      this.isCompletedStep(index)
+    );
+  }
+
+  selectStep(index: number): void {
+    if (!this.canOpenStep(index)) {
+      return;
+    }
+
+    this.stepSelected.emit(index);
+  }
+
+  requestBack(): void {
+    if (this.navigationDisabled() || this.isFirstStep()) {
+      return;
+    }
+
+    this.backClicked.emit();
+  }
+
+  requestNext(): void {
+    if (this.navigationDisabled() || this.isLastStep()) {
+      return;
+    }
+
+    this.nextClicked.emit();
+  }
+
+  requestSaveDraft(): void {
+    if (this.navigationDisabled() || this.savingDraft()) {
+      return;
+    }
+
+    this.saveDraftClicked.emit();
+  }
+
+  requestFinish(): void {
+    if (
+      this.navigationDisabled() ||
+      this.finishing() ||
+      !this.isLastStep()
+    ) {
+      return;
+    }
+
+    this.finishClicked.emit();
+  }
+
+  requestCancel(): void {
+    if (this.navigationDisabled()) {
+      return;
+    }
+
+    this.cancelClicked.emit();
+  }
+}
\ No newline at end of file
diff --git a/src/app/features/organizations/organization-onboarding/models/organization-draft.model.ts b/src/app/features/organizations/organization-onboarding/models/organization-draft.model.ts
new file mode 100644
index 00000000..0cb32e33
--- /dev/null
+++ b/src/app/features/organizations/organization-onboarding/models/organization-draft.model.ts
@@ -0,0 +1,18 @@
+import {
+  OrganizationAdminValue,
+  OrganizationBasicsValue,
+  OrganizationLocalizationValue,
+  OrganizationPlanLimitsValue,
+} from './organization-onboarding.model';
+
+export interface OrganizationOnboardingDraft {
+  readonly schemaVersion: 1;
+  readonly draftId: string | null;
+  readonly currentStepIndex: number;
+  readonly completedStepIndexes: readonly number[];
+  readonly basics: Partial<OrganizationBasicsValue> | null;
+  readonly localization: Partial<OrganizationLocalizationValue> | null;
+  readonly planLimits: Partial<OrganizationPlanLimitsValue> | null;
+  readonly admin: Partial<OrganizationAdminValue> | null;
+  readonly savedAt: string;
+}
\ No newline at end of file
diff --git a/src/app/features/organizations/organization-onboarding/models/organization-onboarding.model.ts b/src/app/features/organizations/organization-onboarding/models/organization-onboarding.model.ts
new file mode 100644
index 00000000..7e591a24
--- /dev/null
+++ b/src/app/features/organizations/organization-onboarding/models/organization-onboarding.model.ts
@@ -0,0 +1,119 @@
+export type OnboardingStepKey =
+  | 'basics'
+  | 'localization'
+  | 'plan-limits'
+  | 'admin-user';
+
+export interface OnboardingStepDefinition {
+  readonly key: OnboardingStepKey;
+  readonly label: string;
+}
+
+export interface OnboardingLookupValue {
+  readonly id: string;
+  readonly label: string;
+  readonly secondaryLabel?: string | null;
+}
+
+export interface CountryLookupValue extends OnboardingLookupValue {
+  readonly iso2?: string | null;
+}
+
+export interface OrganizationBasicsValue {
+  readonly organizationCode: string | null;
+  readonly organizationName: string;
+  readonly shortName: string;
+  readonly localLanguageName: string | null;
+  readonly organizationType: OnboardingLookupValue;
+  readonly industry: OnboardingLookupValue;
+  readonly registrationCountry: CountryLookupValue;
+}
+
+export type TimeFormatValue = 'TwelveHour' | 'TwentyFourHour';
+
+export type DateFormatValue =
+  | 'DD/MM/YYYY'
+  | 'MM/DD/YYYY'
+  | 'YYYY-MM-DD';
+
+export type NumberFormatValue =
+  | 'OneTwoThreeCommaFourFiveSixPointSevenEight'
+  | 'OneTwoThreePointFourFiveSixCommaSevenEight';
+
+export type FiscalYearConventionValue =
+  | 'CalendarYear'
+  | 'AprilToMarch'
+  | 'JulyToJune';
+
+export interface OrganizationLocalizationValue {
+  readonly timeZone: OnboardingLookupValue;
+  readonly currency: OnboardingLookupValue;
+  readonly defaultLanguage: OnboardingLookupValue;
+  readonly additionalLanguageIds: readonly string[];
+  readonly additionalLanguageSelections: readonly OnboardingLookupValue[];
+  readonly dateFormat: DateFormatValue;
+  readonly timeFormat: TimeFormatValue;
+  readonly numberFormat: NumberFormatValue;
+  readonly fiscalYearConvention: FiscalYearConventionValue;
+  readonly localizationDefaultsCountryId: string | null;
+}
+
+export type OrganizationLicenseType = 'Trial' | 'Paid';
+
+export interface OrganizationPlanLookupValue extends OnboardingLookupValue {
+  readonly code?: string | null;
+}
+
+export interface OrganizationPlanLimitsValue {
+  readonly subscriptionPlan: OrganizationPlanLookupValue;
+  readonly licenseType: OrganizationLicenseType;
+  readonly maximumCompanies: number;
+  readonly maximumUsers: number;
+  readonly maximumStorageGb: number;
+  readonly goLiveDate: string;
+  readonly systemAccessStartDate: string;
+  readonly systemAccessEndDate: string | null;
+  readonly limitsEditable: boolean;
+}
+
+export interface OrganizationAdminValue {
+  readonly organizationEmail: string;
+  readonly organizationPhone: string;
+  readonly administratorFullName: string;
+  readonly administratorEmail: string;
+  readonly administratorMobile: string;
+}
+
+export interface OrganizationOnboardingData {
+  readonly basics: OrganizationBasicsValue | null;
+  readonly localization: OrganizationLocalizationValue | null;
+  readonly planLimits: OrganizationPlanLimitsValue | null;
+  readonly admin: OrganizationAdminValue | null;
+}
+
+export interface CountryLocalizationDefaults {
+  readonly countryId: string;
+  readonly timeZone: OnboardingLookupValue;
+  readonly currency: OnboardingLookupValue;
+  readonly defaultLanguage: OnboardingLookupValue;
+  readonly dateFormat: DateFormatValue;
+  readonly timeFormat: TimeFormatValue;
+  readonly numberFormat: NumberFormatValue;
+  readonly fiscalYearConvention: FiscalYearConventionValue;
+}
+
+export interface OrganizationPlanDefaults {
+  readonly plan: OrganizationPlanLookupValue;
+  readonly licenseType: OrganizationLicenseType;
+  readonly maximumCompanies: number;
+  readonly maximumUsers: number;
+  readonly maximumStorageGb: number;
+  readonly limitsEditable: boolean;
+}
+
+export interface OnboardingStepForm<TValue> {
+  validate(): boolean;
+  getValue(): TValue;
+  getDraftValue(): Partial<TValue>;
+  patchValue(value: Partial<TValue>): void;
+}
\ No newline at end of file
diff --git a/src/app/features/organizations/organization-onboarding/models/organization-provisioning.model.ts b/src/app/features/organizations/organization-onboarding/models/organization-provisioning.model.ts
new file mode 100644
index 00000000..70ca18d3
--- /dev/null
+++ b/src/app/features/organizations/organization-onboarding/models/organization-provisioning.model.ts
@@ -0,0 +1,23 @@
+import {
+  OrganizationAdminValue,
+  OrganizationBasicsValue,
+  OrganizationLocalizationValue,
+  OrganizationPlanLimitsValue,
+} from './organization-onboarding.model';
+
+export interface OrganizationProvisioningRequest {
+  readonly basics: OrganizationBasicsValue;
+  readonly localization: OrganizationLocalizationValue;
+  readonly planLimits: OrganizationPlanLimitsValue;
+  readonly admin: OrganizationAdminValue;
+}
+
+export type OrganizationProvisioningStatus =
+  | 'not-configured'
+  | 'submitted'
+  | 'failed';
+
+export interface OrganizationProvisioningResult {
+  readonly status: OrganizationProvisioningStatus;
+  readonly message: string;
+}
\ No newline at end of file
diff --git a/src/app/features/organizations/organization-onboarding/organization-onboarding.html b/src/app/features/organizations/organization-onboarding/organization-onboarding.html
new file mode 100644
index 00000000..4c21af5f
--- /dev/null
+++ b/src/app/features/organizations/organization-onboarding/organization-onboarding.html
@@ -0,0 +1,66 @@
+<div class="main-content">
+  <div class="container-fluid">
+    <div class="mb-6">
+      <h1 class="text-xl font-semibold text-defaulttextcolor">
+        Create Organization
+      </h1>
+
+    </div>
+
+    <section
+      class="rounded-xl border border-defaultborder bg-white
+             p-5 shadow-sm dark:border-white/10 dark:bg-bodybg"
+    >
+      <onboarding-stepper
+        [steps]="steps"
+        [currentStepIndex]="currentStepIndex()"
+        [completedStepIndexes]="completedStepIndexes()"
+        [savingDraft]="savingDraft()"
+        [finishing]="finishing()"
+        [navigationDisabled]="navigationDisabled()"
+        (stepSelected)="onStepSelected($event)"
+        (backClicked)="onBack()"
+        (nextClicked)="onNext()"
+        (saveDraftClicked)="onSaveDraft()"
+        (finishClicked)="onFinish()"
+        (cancelClicked)="onCancel()"
+      >
+        @switch (currentStep().key) {
+          @case ('basics') {
+            <app-organization-basics-step #basicsStep />
+          }
+
+          @case ('localization') {
+            <div
+              class="min-h-72 rounded-xl border border-dashed
+                     border-defaultborder bg-gray-50 p-6
+                     dark:border-white/10 dark:bg-bodybg"
+            >
+              Localization content
+            </div>
+          }
+
+          @case ('plan-limits') {
+            <div
+              class="min-h-72 rounded-xl border border-dashed
+                     border-defaultborder bg-gray-50 p-6
+                     dark:border-white/10 dark:bg-bodybg"
+            >
+              Plan and Limits content
+            </div>
+          }
+
+          @case ('admin-user') {
+            <div
+              class="min-h-72 rounded-xl border border-dashed
+                     border-defaultborder bg-gray-50 p-6
+                     dark:border-white/10 dark:bg-bodybg"
+            >
+              Admin and User content
+            </div>
+          }
+        }
+      </onboarding-stepper>
+    </section>
+  </div>
+</div>
\ No newline at end of file
diff --git a/src/app/features/organizations/organization-onboarding/organization-onboarding.scss b/src/app/features/organizations/organization-onboarding/organization-onboarding.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/src/app/features/organizations/organization-onboarding/organization-onboarding.ts b/src/app/features/organizations/organization-onboarding/organization-onboarding.ts
new file mode 100644
index 00000000..5d18da07
--- /dev/null
+++ b/src/app/features/organizations/organization-onboarding/organization-onboarding.ts
@@ -0,0 +1,164 @@
+import {
+  ChangeDetectionStrategy,
+  Component,
+  computed,
+  DestroyRef,
+  inject,
+  signal
+} from '@angular/core';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { Router } from '@angular/router';
+import { ToastrService } from 'ngx-toastr';
+import { catchError, finalize, of } from 'rxjs';
+import {
+  OnboardingStep,
+  OnboardingStepper
+} from './components/onboarding-stepper/onboarding-stepper';
+import { OrganizationBasicsStepComponent } from './steps/organization-basics/organization-basics';
+import { OrganizationOnboardingStateService } from './services/organization-onboarding-state.service';
+import { OrganizationOnboardingService } from './services/organization-onboarding.service';
+
+@Component({
+  selector: 'app-organization-onboarding',
+  standalone: true,
+  imports: [OnboardingStepper, OrganizationBasicsStepComponent],
+  templateUrl: './organization-onboarding.html',
+  styleUrl: './organization-onboarding.scss',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  providers: [OrganizationOnboardingStateService, OrganizationOnboardingService]
+})
+export class OrganizationOnboarding {
+  private readonly destroyRef = inject(DestroyRef);
+  private readonly router = inject(Router);
+  private readonly toastr = inject(ToastrService);
+  private readonly stateService = inject(OrganizationOnboardingStateService);
+  private readonly onboardingService = inject(OrganizationOnboardingService);
+
+  readonly steps: readonly OnboardingStep[] = this.stateService.createStepDefinitions();
+
+  readonly savingDraft = signal(false);
+  readonly finishing = signal(false);
+
+  private basicsStep?: OrganizationBasicsStepComponent;
+
+  readonly currentStepIndex = this.stateService.currentStepIndex;
+  readonly completedStepIndexes = this.stateService.completedStepIndexes;
+
+  readonly currentStep = computed(
+    () => this.steps[this.currentStepIndex()]
+  );
+
+  readonly navigationDisabled = computed(
+    () => this.savingDraft() || this.finishing()
+  );
+
+  constructor() {
+    this.onboardingService.loadDraft()
+      .pipe(
+        catchError(() => {
+          this.toastr.error('Unable to restore the onboarding draft.', 'Draft restore failed');
+          return of(null);
+        }),
+        takeUntilDestroyed(this.destroyRef)
+      )
+      .subscribe(draft => {
+        if (!draft) {
+          return;
+        }
+
+        this.stateService.restoreDraft(draft);
+      });
+  }
+
+  registerBasicsStep(component: OrganizationBasicsStepComponent): void {
+    this.basicsStep = component;
+    const basicsDraft = this.stateService.onboardingDraft().basics;
+
+    if (basicsDraft) {
+      component.patchValue(basicsDraft);
+    }
+  }
+
+  onStepSelected(index: number): void {
+    if (!this.stateService.canOpenStep(index)) {
+      return;
+    }
+
+    this.stateService.setCurrentStepIndex(index);
+  }
+
+  onBack(): void {
+    const currentIndex = this.currentStepIndex();
+
+    if (currentIndex <= 0) {
+      return;
+    }
+
+    this.stateService.setCurrentStepIndex(currentIndex - 1);
+  }
+
+  onNext(): void {
+    const currentIndex = this.currentStepIndex();
+
+    if (currentIndex >= this.steps.length - 1) {
+      return;
+    }
+
+    if (currentIndex === 0) {
+      if (!this.basicsStep?.validate()) {
+        this.stateService.unmarkStepCompleted(currentIndex);
+        return;
+      }
+
+      this.stateService.updateBasics(this.basicsStep.getValue());
+    }
+
+    this.stateService.markStepCompleted(currentIndex);
+    this.stateService.setCurrentStepIndex(currentIndex + 1);
+  }
+
+  onSaveDraft(): void {
+    if (this.savingDraft()) {
+      return;
+    }
+
+    if (this.currentStepIndex() === 0 && this.basicsStep) {
+      this.stateService.updateBasicsDraft(this.basicsStep.getDraftValue());
+    }
+
+    this.savingDraft.set(true);
+
+    this.onboardingService.saveDraft(this.stateService.buildDraft())
+      .pipe(
+        finalize(() => {
+          this.savingDraft.set(false);
+        }),
+        takeUntilDestroyed(this.destroyRef)
+      )
+      .subscribe({
+        next: () => {
+          this.toastr.success('Onboarding draft saved successfully.', 'Draft saved');
+        },
+        error: () => {
+          this.toastr.error('Unable to save the onboarding draft.', 'Draft save failed');
+        }
+      });
+  }
+
+  onFinish(): void {
+    if (this.finishing()) {
+      return;
+    }
+
+    this.finishing.set(true);
+
+    queueMicrotask(() => {
+      this.finishing.set(false);
+    });
+  }
+
+  onCancel(): void {
+    this.stateService.clear();
+    void this.router.navigate(['/configuration/organizations']);
+  }
+}
\ No newline at end of file
diff --git a/src/app/features/organizations/organization-onboarding/services/organization-onboarding-state.service.ts b/src/app/features/organizations/organization-onboarding/services/organization-onboarding-state.service.ts
new file mode 100644
index 00000000..7ae2e8a6
--- /dev/null
+++ b/src/app/features/organizations/organization-onboarding/services/organization-onboarding-state.service.ts
@@ -0,0 +1,189 @@
+import { Injectable, computed, signal } from '@angular/core';
+
+import { OrganizationOnboardingDraft } from '../models/organization-draft.model';
+import {
+  OnboardingStepDefinition,
+  OrganizationAdminValue,
+  OrganizationBasicsValue,
+  OrganizationLocalizationValue,
+  OrganizationOnboardingData,
+  OrganizationPlanLimitsValue,
+} from '../models/organization-onboarding.model';
+
+const INITIAL_DATA: OrganizationOnboardingData = {
+  basics: null,
+  localization: null,
+  planLimits: null,
+  admin: null,
+};
+
+type OnboardingDraftState = {
+  readonly basics: Partial<OrganizationBasicsValue> | null;
+  readonly localization: Partial<OrganizationLocalizationValue> | null;
+  readonly planLimits: Partial<OrganizationPlanLimitsValue> | null;
+  readonly admin: Partial<OrganizationAdminValue> | null;
+};
+
+const INITIAL_DRAFT_STATE: OnboardingDraftState = {
+  basics: null,
+  localization: null,
+  planLimits: null,
+  admin: null,
+};
+
+@Injectable()
+export class OrganizationOnboardingStateService {
+  private readonly onboardingDataState = signal<OrganizationOnboardingData>(INITIAL_DATA);
+  private readonly onboardingDraftState = signal<OnboardingDraftState>(INITIAL_DRAFT_STATE);
+  private readonly currentStepIndexState = signal(0);
+  private readonly completedStepIndexesState = signal<readonly number[]>([]);
+  private readonly savedDraftIdState = signal<string | null>(null);
+  private readonly savedAtState = signal<string | null>(null);
+
+  readonly onboardingData = this.onboardingDataState.asReadonly();
+  readonly onboardingDraft = this.onboardingDraftState.asReadonly();
+  readonly currentStepIndex = this.currentStepIndexState.asReadonly();
+  readonly completedStepIndexes = this.completedStepIndexesState.asReadonly();
+  readonly savedDraftId = this.savedDraftIdState.asReadonly();
+  readonly savedAt = this.savedAtState.asReadonly();
+
+  readonly basics = computed(() => this.onboardingDataState().basics);
+  readonly localization = computed(() => this.onboardingDataState().localization);
+  readonly planLimits = computed(() => this.onboardingDataState().planLimits);
+  readonly admin = computed(() => this.onboardingDataState().admin);
+  readonly hasAnyData = computed(() => {
+    const data = this.onboardingDataState();
+    return !!(data.basics || data.localization || data.planLimits || data.admin);
+  });
+
+  setCurrentStepIndex(index: number): void {
+    this.currentStepIndexState.set(Math.max(0, index));
+  }
+
+  updateBasics(value: OrganizationBasicsValue | null): void {
+    this.onboardingDataState.update(current => ({ ...current, basics: value }));
+    this.onboardingDraftState.update(current => ({ ...current, basics: value }));
+  }
+
+  updateLocalization(value: OrganizationLocalizationValue | null): void {
+    this.onboardingDataState.update(current => ({ ...current, localization: value }));
+    this.onboardingDraftState.update(current => ({ ...current, localization: value }));
+  }
+
+  updatePlanLimits(value: OrganizationPlanLimitsValue | null): void {
+    this.onboardingDataState.update(current => ({ ...current, planLimits: value }));
+    this.onboardingDraftState.update(current => ({ ...current, planLimits: value }));
+  }
+
+  updateAdmin(value: OrganizationAdminValue | null): void {
+    this.onboardingDataState.update(current => ({ ...current, admin: value }));
+    this.onboardingDraftState.update(current => ({ ...current, admin: value }));
+  }
+
+  updateBasicsDraft(value: Partial<OrganizationBasicsValue> | null): void {
+    this.onboardingDraftState.update(current => ({ ...current, basics: value }));
+  }
+
+  updateLocalizationDraft(value: Partial<OrganizationLocalizationValue> | null): void {
+    this.onboardingDraftState.update(current => ({ ...current, localization: value }));
+  }
+
+  updatePlanLimitsDraft(value: Partial<OrganizationPlanLimitsValue> | null): void {
+    this.onboardingDraftState.update(current => ({ ...current, planLimits: value }));
+  }
+
+  updateAdminDraft(value: Partial<OrganizationAdminValue> | null): void {
+    this.onboardingDraftState.update(current => ({ ...current, admin: value }));
+  }
+
+  markStepCompleted(index: number): void {
+    this.completedStepIndexesState.update(current =>
+      current.includes(index)
+        ? current
+        : [...current, index].sort((left, right) => left - right)
+    );
+  }
+
+  unmarkStepCompleted(index: number): void {
+    this.completedStepIndexesState.update(current => current.filter(item => item !== index));
+  }
+
+  setCompletedStepIndexes(indexes: readonly number[]): void {
+    const uniqueIndexes = [...new Set(indexes.filter(index => index >= 0))].sort((left, right) => left - right);
+    this.completedStepIndexesState.set(uniqueIndexes);
+  }
+
+  canOpenStep(index: number): boolean {
+    return index <= this.currentStepIndexState() || this.completedStepIndexesState().includes(index);
+  }
+
+  isStepCompleted(index: number): boolean {
+    return this.completedStepIndexesState().includes(index);
+  }
+
+  buildDraft(): OrganizationOnboardingDraft {
+    const draft = this.onboardingDraftState();
+
+    return {
+      schemaVersion: 1,
+      draftId: this.savedDraftIdState(),
+      currentStepIndex: this.currentStepIndexState(),
+      completedStepIndexes: this.completedStepIndexesState(),
+      basics: draft.basics,
+      localization: draft.localization,
+      planLimits: draft.planLimits,
+      admin: draft.admin,
+      savedAt: new Date().toISOString(),
+    };
+  }
+
+  restoreDraft(draft: OrganizationOnboardingDraft): void {
+    this.onboardingDraftState.set({
+      basics: draft.basics ? { ...draft.basics } : null,
+      localization: draft.localization ? { ...draft.localization } : null,
+      planLimits: draft.planLimits ? { ...draft.planLimits } : null,
+      admin: draft.admin ? { ...draft.admin } : null,
+    });
+    this.onboardingDataState.set({
+      basics: draft.completedStepIndexes.includes(0) && draft.basics
+        ? { ...draft.basics } as OrganizationBasicsValue
+        : null,
+      localization: draft.completedStepIndexes.includes(1) && draft.localization
+        ? { ...draft.localization } as OrganizationLocalizationValue
+        : null,
+      planLimits: draft.completedStepIndexes.includes(2) && draft.planLimits
+        ? { ...draft.planLimits } as OrganizationPlanLimitsValue
+        : null,
+      admin: draft.completedStepIndexes.includes(3) && draft.admin
+        ? { ...draft.admin } as OrganizationAdminValue
+        : null,
+    });
+    this.currentStepIndexState.set(Math.max(0, draft.currentStepIndex));
+    this.setCompletedStepIndexes(draft.completedStepIndexes);
+    this.savedDraftIdState.set(draft.draftId);
+    this.savedAtState.set(draft.savedAt);
+  }
+
+  updateSavedDraftMetadata(draftId: string | null, savedAt: string): void {
+    this.savedDraftIdState.set(draftId);
+    this.savedAtState.set(savedAt);
+  }
+
+  clear(): void {
+    this.onboardingDataState.set(INITIAL_DATA);
+    this.onboardingDraftState.set(INITIAL_DRAFT_STATE);
+    this.currentStepIndexState.set(0);
+    this.completedStepIndexesState.set([]);
+    this.savedDraftIdState.set(null);
+    this.savedAtState.set(null);
+  }
+
+  createStepDefinitions(): readonly OnboardingStepDefinition[] {
+    return [
+      { key: 'basics', label: 'Basics' },
+      { key: 'localization', label: 'Localization' },
+      { key: 'plan-limits', label: 'Plan & Limits' },
+      { key: 'admin-user', label: 'Admin & User' },
+    ];
+  }
+}
\ No newline at end of file
diff --git a/src/app/features/organizations/organization-onboarding/services/organization-onboarding.service.ts b/src/app/features/organizations/organization-onboarding/services/organization-onboarding.service.ts
new file mode 100644
index 00000000..e87fb201
--- /dev/null
+++ b/src/app/features/organizations/organization-onboarding/services/organization-onboarding.service.ts
@@ -0,0 +1,331 @@
+import { Injectable, inject } from '@angular/core';
+import { FormSelectOption } from '../../../../../shared/components/form/models/form-select.models';
+import { Observable, catchError, map, of, throwError } from 'rxjs';
+
+import {
+  CountryLookupDto,
+  CountryService,
+} from '../../../../global-masters/countries/public-api';
+import {
+  CurrencyLookupDto,
+  CurrencyService,
+} from '../../../../global-masters/currencies/public-api';
+import {
+  LanguageLookupDto,
+  LanguageService,
+} from '../../../../global-masters/languages/public-api';
+import {
+  TimezoneLookupDto,
+  TimezoneService,
+} from '../../../../global-masters/timezones/public-api';
+import { OrganizationOnboardingDraft } from '../models/organization-draft.model';
+import {
+  CountryLocalizationDefaults,
+  DateFormatValue,
+  FiscalYearConventionValue,
+  NumberFormatValue,
+  OnboardingLookupValue,
+  OrganizationLicenseType,
+  OrganizationPlanDefaults,
+  OrganizationPlanLookupValue,
+  TimeFormatValue,
+} from '../models/organization-onboarding.model';
+import {
+  OrganizationProvisioningRequest,
+  OrganizationProvisioningResult,
+} from '../models/organization-provisioning.model';
+
+const ORGANIZATION_ONBOARDING_DRAFT_KEY = 'organization-onboarding-draft-v1';
+
+const ORGANIZATION_TYPE_OPTIONS: readonly OnboardingLookupValue[] = [
+  { id: 'enterprise', label: 'Enterprise' },
+  { id: 'group', label: 'Group' },
+  { id: 'non-profit', label: 'Non Profit' },
+  { id: 'public-sector', label: 'Public Sector' },
+];
+
+const INDUSTRY_OPTIONS: readonly OnboardingLookupValue[] = [
+  { id: 'healthcare', label: 'Healthcare' },
+  { id: 'manufacturing', label: 'Manufacturing' },
+  { id: 'professional-services', label: 'Professional Services' },
+  { id: 'retail', label: 'Retail' },
+  { id: 'technology', label: 'Technology' },
+];
+
+const SUBSCRIPTION_PLAN_OPTIONS: readonly OrganizationPlanLookupValue[] = [
+  { id: 'starter', label: 'Starter', code: 'STARTER' },
+  { id: 'growth', label: 'Growth', code: 'GROWTH' },
+  { id: 'enterprise', label: 'Enterprise', code: 'ENTERPRISE' },
+];
+
+const PLAN_DEFAULTS: readonly OrganizationPlanDefaults[] = [
+  {
+    plan: { id: 'starter', label: 'Starter', code: 'STARTER' },
+    licenseType: 'Trial',
+    maximumCompanies: 1,
+    maximumUsers: 10,
+    maximumStorageGb: 10,
+    limitsEditable: true,
+  },
+  {
+    plan: { id: 'growth', label: 'Growth', code: 'GROWTH' },
+    licenseType: 'Paid',
+    maximumCompanies: 5,
+    maximumUsers: 100,
+    maximumStorageGb: 100,
+    limitsEditable: true,
+  },
+  {
+    plan: { id: 'enterprise', label: 'Enterprise', code: 'ENTERPRISE' },
+    licenseType: 'Paid',
+    maximumCompanies: 25,
+    maximumUsers: 1000,
+    maximumStorageGb: 500,
+    limitsEditable: true,
+  },
+];
+
+const DATE_FORMAT_OPTIONS: readonly FormSelectOption<DateFormatValue>[] = [
+  { value: 'DD/MM/YYYY', label: 'DD/MM/YYYY' },
+  { value: 'MM/DD/YYYY', label: 'MM/DD/YYYY' },
+  { value: 'YYYY-MM-DD', label: 'YYYY-MM-DD' },
+];
+
+const TIME_FORMAT_OPTIONS: readonly FormSelectOption<TimeFormatValue>[] = [
+  { value: 'TwelveHour', label: '12 hour' },
+  { value: 'TwentyFourHour', label: '24 hour' },
+];
+
+const NUMBER_FORMAT_OPTIONS: readonly FormSelectOption<NumberFormatValue>[] = [
+  { value: 'OneTwoThreeCommaFourFiveSixPointSevenEight', label: '123,456.78' },
+  { value: 'OneTwoThreePointFourFiveSixCommaSevenEight', label: '123.456,78' },
+];
+
+const FISCAL_YEAR_OPTIONS: readonly FormSelectOption<FiscalYearConventionValue>[] = [
+  { value: 'CalendarYear', label: 'Calendar Year (Jan-Dec)' },
+  { value: 'AprilToMarch', label: 'April - March' },
+  { value: 'JulyToJune', label: 'July - June' },
+];
+
+const LICENSE_TYPE_OPTIONS: readonly FormSelectOption<OrganizationLicenseType>[] = [
+  { value: 'Trial', label: 'Trial' },
+  { value: 'Paid', label: 'Paid' },
+];
+
+const LOCALIZATION_DEFAULTS: readonly CountryLocalizationDefaults[] = [
+  {
+    countryId: 'IN',
+    timeZone: { id: 'asia-kolkata', label: 'India Standard Time', secondaryLabel: 'Asia/Kolkata' },
+    currency: { id: 'inr', label: 'Indian Rupee', secondaryLabel: 'INR' },
+    defaultLanguage: { id: 'en-in', label: 'English', secondaryLabel: 'en-IN' },
+    dateFormat: 'DD/MM/YYYY',
+    timeFormat: 'TwelveHour',
+    numberFormat: 'OneTwoThreeCommaFourFiveSixPointSevenEight',
+    fiscalYearConvention: 'AprilToMarch',
+  },
+  {
+    countryId: 'US',
+    timeZone: { id: 'america-new-york', label: 'Eastern Time', secondaryLabel: 'America/New_York' },
+    currency: { id: 'usd', label: 'US Dollar', secondaryLabel: 'USD' },
+    defaultLanguage: { id: 'en-us', label: 'English', secondaryLabel: 'en-US' },
+    dateFormat: 'MM/DD/YYYY',
+    timeFormat: 'TwelveHour',
+    numberFormat: 'OneTwoThreeCommaFourFiveSixPointSevenEight',
+    fiscalYearConvention: 'CalendarYear',
+  },
+];
+
+@Injectable()
+export class OrganizationOnboardingService {
+  private readonly countryService = inject(CountryService);
+  private readonly currencyService = inject(CurrencyService);
+  private readonly languageService = inject(LanguageService);
+  private readonly timezoneService = inject(TimezoneService);
+
+  searchOrganizationTypes(term: string | null, limit = 10): Observable<readonly OnboardingLookupValue[]> {
+    return of(this.filterLookupValues(ORGANIZATION_TYPE_OPTIONS, term, limit));
+  }
+
+  resolveOrganizationType(id: string): Observable<OnboardingLookupValue | null> {
+    return of(ORGANIZATION_TYPE_OPTIONS.find(option => option.id === id) ?? null);
+  }
+
+  searchIndustries(term: string | null, limit = 10): Observable<readonly OnboardingLookupValue[]> {
+    return of(this.filterLookupValues(INDUSTRY_OPTIONS, term, limit));
+  }
+
+  resolveIndustry(id: string): Observable<OnboardingLookupValue | null> {
+    return of(INDUSTRY_OPTIONS.find(option => option.id === id) ?? null);
+  }
+
+  searchRegistrationCountries(term: string | null, limit = 10): Observable<readonly CountryLookupDto[]> {
+    return this.countryService.autocomplete(term ?? '', limit);
+  }
+
+  resolveCountry(id: string): Observable<CountryLookupDto | null> {
+    return this.countryService.getCountryById(id).pipe(
+      map(country => ({ id: country.id, iso2: country.iso2, name: country.name }))
+    );
+  }
+
+  searchTimezones(term: string | null, limit = 10): Observable<readonly TimezoneLookupDto[]> {
+    return this.timezoneService.autocomplete(term, limit);
+  }
+
+  resolveTimezone(id: string): Observable<TimezoneLookupDto | null> {
+    return this.timezoneService.getById(id).pipe(
+      map(timezone => ({ id: timezone.id, ianaId: timezone.ianaId, displayName: timezone.displayName }))
+    );
+  }
+
+  searchCurrencies(term: string | null, limit = 10): Observable<readonly CurrencyLookupDto[]> {
+    return this.currencyService.autocomplete(term, limit);
+  }
+
+  resolveCurrency(id: string): Observable<CurrencyLookupDto | null> {
+    return this.currencyService.getCurrencyById(id).pipe(
+      map(currency => ({ id: currency.id, code: currency.code, name: currency.name, symbol: currency.symbol }))
+    );
+  }
+
+  searchLanguages(term: string | null, limit = 10): Observable<readonly LanguageLookupDto[]> {
+    return this.languageService.autocomplete(term, limit);
+  }
+
+  resolveLanguage(id: string): Observable<LanguageLookupDto | null> {
+    return this.languageService.getById(id).pipe(
+      map(language => ({
+        id: language.id,
+        code: language.code,
+        name: language.name,
+        nativeName: language.nativeName,
+        isRightToLeft: language.isRightToLeft,
+      }))
+    );
+  }
+
+  loadLanguageOptions(limit = 50): Observable<readonly FormSelectOption<string>[]> {
+    return this.languageService.autocomplete('', limit).pipe(
+      map(items => items.map(item => ({
+        value: item.id,
+        label: `${item.code} - ${item.name}`,
+      })))
+    );
+  }
+
+  getDateFormatOptions(): readonly FormSelectOption<DateFormatValue>[] {
+    return DATE_FORMAT_OPTIONS;
+  }
+
+  getTimeFormatOptions(): readonly FormSelectOption<TimeFormatValue>[] {
+    return TIME_FORMAT_OPTIONS;
+  }
+
+  getNumberFormatOptions(): readonly FormSelectOption<NumberFormatValue>[] {
+    return NUMBER_FORMAT_OPTIONS;
+  }
+
+  getFiscalYearOptions(): readonly FormSelectOption<FiscalYearConventionValue>[] {
+    return FISCAL_YEAR_OPTIONS;
+  }
+
+  getLicenseTypeOptions(): readonly FormSelectOption<OrganizationLicenseType>[] {
+    return LICENSE_TYPE_OPTIONS;
+  }
+
+  searchSubscriptionPlans(term: string | null, limit = 10): Observable<readonly OrganizationPlanLookupValue[]> {
+    return of(this.filterLookupValues(SUBSCRIPTION_PLAN_OPTIONS, term, limit));
+  }
+
+  resolveSubscriptionPlan(id: string): Observable<OrganizationPlanLookupValue | null> {
+    return of(SUBSCRIPTION_PLAN_OPTIONS.find(option => option.id === id) ?? null);
+  }
+
+  getPlanDefaults(planId: string): Observable<OrganizationPlanDefaults | null> {
+    return of(PLAN_DEFAULTS.find(item => item.plan.id === planId) ?? null);
+  }
+
+  getCountryLocalizationDefaults(countryIso2: string | null): Observable<CountryLocalizationDefaults | null> {
+    if (!countryIso2?.trim()) {
+      return of(null);
+    }
+
+    return of(LOCALIZATION_DEFAULTS.find(item => item.countryId === countryIso2.trim().toUpperCase()) ?? null);
+  }
+
+  loadDraft(): Observable<OrganizationOnboardingDraft | null> {
+    try {
+      const rawDraft = sessionStorage.getItem(ORGANIZATION_ONBOARDING_DRAFT_KEY);
+
+      if (!rawDraft) {
+        return of(null);
+      }
+
+      const parsedDraft = JSON.parse(rawDraft) as Partial<OrganizationOnboardingDraft>;
+
+      if (!this.isValidDraft(parsedDraft)) {
+        sessionStorage.removeItem(ORGANIZATION_ONBOARDING_DRAFT_KEY);
+        return of(null);
+      }
+
+      return of(parsedDraft);
+    } catch (error) {
+      sessionStorage.removeItem(ORGANIZATION_ONBOARDING_DRAFT_KEY);
+      return throwError(() => error);
+    }
+  }
+
+  saveDraft(draft: OrganizationOnboardingDraft): Observable<void> {
+    try {
+      sessionStorage.setItem(ORGANIZATION_ONBOARDING_DRAFT_KEY, JSON.stringify(draft));
+      return of(void 0);
+    } catch (error) {
+      return throwError(() => error);
+    }
+  }
+
+  clearDraft(): Observable<void> {
+    try {
+      sessionStorage.removeItem(ORGANIZATION_ONBOARDING_DRAFT_KEY);
+      return of(void 0);
+    } catch (error) {
+      return throwError(() => error);
+    }
+  }
+
+  provisionOrganization(_request: OrganizationProvisioningRequest): Observable<OrganizationProvisioningResult> {
+    return of({
+      status: 'not-configured',
+      message: 'Provisioning is not configured yet for organization onboarding.',
+    });
+  }
+
+  private filterLookupValues<TValue extends OnboardingLookupValue>(
+    source: readonly TValue[],
+    term: string | null,
+    limit: number,
+  ): readonly TValue[] {
+    const normalizedTerm = term?.trim().toLowerCase() ?? '';
+
+    return source
+      .filter(option => {
+        if (!normalizedTerm) {
+          return true;
+        }
+
+        return [option.label, option.secondaryLabel]
+          .filter((value): value is string => !!value)
+          .some(value => value.toLowerCase().includes(normalizedTerm));
+      })
+      .slice(0, Math.max(1, limit));
+  }
+
+  private isValidDraft(value: Partial<OrganizationOnboardingDraft>): value is OrganizationOnboardingDraft {
+    return (
+      value.schemaVersion === 1 &&
+      typeof value.currentStepIndex === 'number' &&
+      Array.isArray(value.completedStepIndexes) &&
+      typeof value.savedAt === 'string'
+    );
+  }
+}
\ No newline at end of file
diff --git a/src/app/features/organizations/organization-onboarding/steps/organization-basics/organization-basics.html b/src/app/features/organizations/organization-onboarding/steps/organization-basics/organization-basics.html
new file mode 100644
index 00000000..61a039c5
--- /dev/null
+++ b/src/app/features/organizations/organization-onboarding/steps/organization-basics/organization-basics.html
@@ -0,0 +1,134 @@
+<form [formGroup]="form" autocomplete="off">
+  <div class="grid grid-cols-12 gap-x-5 gap-y-5">
+    <div class="col-span-12 md:col-span-6 xl:col-span-4">
+      <app-form-input
+        [formControl]="organizationCodeControl"
+        inputId="organization-code"
+        variant="floating"
+        label="Organization Code"
+        [readonly]="true"
+        help="System generated and cannot be changed."
+      />
+    </div>
+
+    <div class="col-span-12 md:col-span-6 xl:col-span-4">
+      <app-form-input
+        formControlName="organizationName"
+        inputId="organization-name"
+        variant="floating"
+        label="Organization Name"
+        placeholder="Name"
+        autocomplete="off"
+        [required]="true"
+        [maxLength]="150"
+        [submitAttempted]="submitAttempted()"
+        [validationMessages]="{
+          required: 'Organization Name is required.',
+          maxlength: 'Organization Name cannot exceed 150 characters.'
+        }"
+      />
+    </div>
+
+    <div class="col-span-12 md:col-span-6 xl:col-span-4">
+      <app-form-input
+        formControlName="shortName"
+        inputId="organization-short-name"
+        variant="floating"
+        label="Short Name"
+        placeholder="Short name"
+        autocomplete="off"
+        [required]="true"
+        [maxLength]="50"
+        [submitAttempted]="submitAttempted()"
+        [validationMessages]="{
+          required: 'Short Name is required.',
+          maxlength: 'Short Name cannot exceed 50 characters.'
+        }"
+      />
+    </div>
+
+    <div class="col-span-12 md:col-span-6 xl:col-span-4">
+      <app-form-input
+        formControlName="localLanguageName"
+        inputId="organization-local-language-name"
+        variant="floating"
+        label="Local Language Name"
+        placeholder="Local language name"
+        autocomplete="off"
+        help="Optional — shown on localized documents."
+        [maxLength]="150"
+        [submitAttempted]="submitAttempted()"
+        [validationMessages]="{
+          maxlength: 'Local Language Name cannot exceed 150 characters.'
+        }"
+      />
+    </div>
+
+    <div class="col-span-12 md:col-span-6 xl:col-span-4">
+      <app-autocomplete
+        formControlName="organizationTypeId"
+        inputId="organization-type"
+        variant="floating"
+        label="Organization Type"
+        placeholder="Search"
+        [searchFn]="searchOrganizationTypes"
+        [displayWith]="displayLookup"
+        [valueWith]="lookupValue"
+        [resolveValueFn]="resolveOrganizationType"
+        [selectedItem]="organizationTypeSelection()"
+        [required]="true"
+        [submitAttempted]="submitAttempted()"
+        [validationMessages]="{
+          required: 'Organization Type is required.'
+        }"
+        (itemSelected)="onOrganizationTypeSelected($event)"
+        (cleared)="onOrganizationTypeCleared()"
+      />
+    </div>
+
+    <div class="col-span-12 md:col-span-6 xl:col-span-4">
+      <app-autocomplete
+        formControlName="industryId"
+        inputId="organization-industry"
+        variant="floating"
+        label="Industry"
+        placeholder="Search"
+        [searchFn]="searchIndustries"
+        [displayWith]="displayLookup"
+        [valueWith]="lookupValue"
+        [resolveValueFn]="resolveIndustry"
+        [selectedItem]="industrySelection()"
+        [required]="true"
+        [submitAttempted]="submitAttempted()"
+        [validationMessages]="{
+          required: 'Industry is required.'
+        }"
+        (itemSelected)="onIndustrySelected($event)"
+        (cleared)="onIndustryCleared()"
+      />
+    </div>
+
+    <div class="col-span-12 md:col-span-6 xl:col-span-4">
+      <app-autocomplete
+        formControlName="registrationCountryId"
+        inputId="organization-registration-country"
+        variant="floating"
+        label="Country of Registration"
+        placeholder="Search"
+        [searchFn]="searchCountries"
+        [displayWith]="displayCountry"
+        [valueWith]="countryValue"
+        [resolveValueFn]="resolveCountry"
+        [selectedItem]="registrationCountrySelection()"
+        help="Determines the localization defaults in Step 2."
+        [required]="true"
+        [submitAttempted]="submitAttempted()"
+        [validationMessages]="{
+          required: 'Country of Registration is required.'
+        }"
+        (itemSelected)="onRegistrationCountrySelected($event)"
+        (cleared)="onRegistrationCountryCleared()"
+      />
+    </div>
+  </div>
+</form>
\ No newline at end of file
diff --git a/src/app/features/organizations/organization-onboarding/steps/organization-basics/organization-basics.scss b/src/app/features/organizations/organization-onboarding/steps/organization-basics/organization-basics.scss
new file mode 100644
index 00000000..8b137891
--- /dev/null
+++ b/src/app/features/organizations/organization-onboarding/steps/organization-basics/organization-basics.scss
@@ -0,0 +1 @@
+
diff --git a/src/app/features/organizations/organization-onboarding/steps/organization-basics/organization-basics.ts b/src/app/features/organizations/organization-onboarding/steps/organization-basics/organization-basics.ts
new file mode 100644
index 00000000..7d37ead3
--- /dev/null
+++ b/src/app/features/organizations/organization-onboarding/steps/organization-basics/organization-basics.ts
@@ -0,0 +1,217 @@
+import { ChangeDetectionStrategy, Component, ElementRef, inject, signal } from '@angular/core';
+import { FormBuilder, ReactiveFormsModule, Validators } from '@angular/forms';
+import { ToastrService } from 'ngx-toastr';
+import { catchError, map, of } from 'rxjs';
+
+import {
+  CountryLookupDto,
+} from '../../../../global-masters/countries/public-api';
+import { Autocomplete } from '../../../../../shared/components/form/autocomplete/autocomplete';
+import {
+  AutocompleteDisplayFn,
+  AutocompleteResolveValueFn,
+  AutocompleteSearchFn,
+  AutocompleteValueFn,
+} from '../../../../../shared/components/form/autocomplete/autocomplete.types';
+import { FormInput } from '../../../../../shared/components/form/form-input/form-input';
+import {
+  OnboardingLookupValue,
+  OnboardingStepForm,
+  OrganizationBasicsValue,
+} from '../../models/organization-onboarding.model';
+import { OrganizationOnboardingService } from '../../services/organization-onboarding.service';
+
+interface OrganizationBasicsFormModel {
+  readonly organizationName: string;
+  readonly shortName: string;
+  readonly localLanguageName: string;
+  readonly organizationTypeId: string | null;
+  readonly industryId: string | null;
+  readonly registrationCountryId: string | null;
+}
+
+@Component({
+  selector: 'app-organization-basics-step',
+  standalone: true,
+  imports: [ReactiveFormsModule, FormInput, Autocomplete],
+  templateUrl: './organization-basics.html',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class OrganizationBasicsStepComponent implements OnboardingStepForm<OrganizationBasicsValue> {
+  private readonly formBuilder = inject(FormBuilder);
+  private readonly onboardingService = inject(OrganizationOnboardingService);
+  private readonly toastr = inject(ToastrService);
+  private readonly elementRef = inject<ElementRef<HTMLElement>>(ElementRef);
+
+  readonly submitAttempted = signal(false);
+  readonly organizationCodeControl = this.formBuilder.nonNullable.control('Pending generation');
+  readonly organizationTypeSelection = signal<OnboardingLookupValue | null>(null);
+  readonly industrySelection = signal<OnboardingLookupValue | null>(null);
+  readonly registrationCountrySelection = signal<CountryLookupDto | null>(null);
+
+  readonly form = this.formBuilder.group({
+    organizationName: this.formBuilder.nonNullable.control('', [Validators.required, Validators.maxLength(150)]),
+    shortName: this.formBuilder.nonNullable.control('', [Validators.required, Validators.maxLength(50)]),
+    localLanguageName: this.formBuilder.nonNullable.control('', [Validators.maxLength(150)]),
+    organizationTypeId: this.formBuilder.control<string | null>(null, [Validators.required]),
+    industryId: this.formBuilder.control<string | null>(null, [Validators.required]),
+    registrationCountryId: this.formBuilder.control<string | null>(null, [Validators.required]),
+  });
+
+  readonly searchOrganizationTypes: AutocompleteSearchFn<OnboardingLookupValue> = (term, limit) =>
+    this.onboardingService.searchOrganizationTypes(term, limit).pipe(
+      catchError(() => {
+        this.toastr.error('Unable to load organization types.');
+        return of<readonly OnboardingLookupValue[]>([]);
+      })
+    );
+
+  readonly searchIndustries: AutocompleteSearchFn<OnboardingLookupValue> = (term, limit) =>
+    this.onboardingService.searchIndustries(term, limit).pipe(
+      catchError(() => {
+        this.toastr.error('Unable to load industries.');
+        return of<readonly OnboardingLookupValue[]>([]);
+      })
+    );
+
+  readonly searchCountries: AutocompleteSearchFn<CountryLookupDto> = (term, limit) =>
+    this.onboardingService.searchRegistrationCountries(term, limit).pipe(
+      catchError(() => {
+        this.toastr.error('Unable to load countries.');
+        return of<readonly CountryLookupDto[]>([]);
+      })
+    );
+
+  readonly displayLookup: AutocompleteDisplayFn<OnboardingLookupValue> = item =>
+    [item.label, item.secondaryLabel].filter(Boolean).join(' - ');
+
+  readonly lookupValue: AutocompleteValueFn<OnboardingLookupValue, string> = item => item.id;
+
+  readonly resolveOrganizationType: AutocompleteResolveValueFn<OnboardingLookupValue, string> = value =>
+    this.onboardingService.resolveOrganizationType(value);
+
+  readonly resolveIndustry: AutocompleteResolveValueFn<OnboardingLookupValue, string> = value =>
+    this.onboardingService.resolveIndustry(value);
+
+  readonly displayCountry: AutocompleteDisplayFn<CountryLookupDto> = country => country.name;
+
+  readonly countryValue: AutocompleteValueFn<CountryLookupDto, string> = country => country.id;
+
+  readonly resolveCountry: AutocompleteResolveValueFn<CountryLookupDto, string> = value =>
+    this.onboardingService.resolveCountry(value);
+
+  validate(): boolean {
+    this.submitAttempted.set(true);
+
+    if (this.form.valid) {
+      return true;
+    }
+
+    this.form.markAllAsTouched();
+    this.focusFirstInvalidControl();
+    return false;
+  }
+
+  getValue(): OrganizationBasicsValue {
+    const value = this.form.getRawValue() as OrganizationBasicsFormModel;
+    const organizationType = this.organizationTypeSelection();
+    const industry = this.industrySelection();
+    const registrationCountry = this.registrationCountrySelection();
+
+    if (!organizationType || !industry || !registrationCountry) {
+      throw new Error('Organization basics selections are incomplete.');
+    }
+
+    return {
+      organizationCode: null,
+      organizationName: value.organizationName.trim(),
+      shortName: value.shortName.trim(),
+      localLanguageName: value.localLanguageName.trim() || null,
+      organizationType,
+      industry,
+      registrationCountry: {
+        id: registrationCountry.id,
+        label: registrationCountry.name,
+        iso2: registrationCountry.iso2,
+      },
+    };
+  }
+
+  getDraftValue(): Partial<OrganizationBasicsValue> {
+    const value = this.form.getRawValue() as OrganizationBasicsFormModel;
+
+    return {
+      organizationCode: null,
+      organizationName: value.organizationName,
+      shortName: value.shortName,
+      localLanguageName: value.localLanguageName || null,
+      organizationType: this.organizationTypeSelection() ?? undefined,
+      industry: this.industrySelection() ?? undefined,
+      registrationCountry: this.registrationCountrySelection()
+        ? {
+            id: this.registrationCountrySelection()!.id,
+            label: this.registrationCountrySelection()!.name,
+            iso2: this.registrationCountrySelection()!.iso2,
+          }
+        : undefined,
+    };
+  }
+
+  patchValue(value: Partial<OrganizationBasicsValue>): void {
+    this.form.patchValue({
+      organizationName: value.organizationName ?? '',
+      shortName: value.shortName ?? '',
+      localLanguageName: value.localLanguageName ?? '',
+      organizationTypeId: value.organizationType?.id ?? null,
+      industryId: value.industry?.id ?? null,
+      registrationCountryId: value.registrationCountry?.id ?? null,
+    }, { emitEvent: false });
+
+    this.organizationTypeSelection.set(value.organizationType ?? null);
+    this.industrySelection.set(value.industry ?? null);
+    this.registrationCountrySelection.set(
+      value.registrationCountry
+        ? {
+            id: value.registrationCountry.id,
+            iso2: value.registrationCountry.iso2 ?? '',
+            name: value.registrationCountry.label,
+          }
+        : null
+    );
+    this.submitAttempted.set(false);
+  }
+
+  onOrganizationTypeSelected(value: OnboardingLookupValue): void {
+    this.organizationTypeSelection.set(value);
+  }
+
+  onOrganizationTypeCleared(): void {
+    this.organizationTypeSelection.set(null);
+  }
+
+  onIndustrySelected(value: OnboardingLookupValue): void {
+    this.industrySelection.set(value);
+  }
+
+  onIndustryCleared(): void {
+    this.industrySelection.set(null);
+  }
+
+  onRegistrationCountrySelected(value: CountryLookupDto): void {
+    this.registrationCountrySelection.set(value);
+  }
+
+  onRegistrationCountryCleared(): void {
+    this.registrationCountrySelection.set(null);
+  }
+
+  private focusFirstInvalidControl(): void {
+    queueMicrotask(() => {
+      const invalidElement = this.elementRef.nativeElement.querySelector<HTMLElement>(
+        '.ng-invalid [data-form-control], [data-form-control].ng-invalid, .ng-invalid .ng-select-container'
+      );
+
+      invalidElement?.focus();
+    });
+  }
+}
\ No newline at end of file
diff --git a/src/app/features/organizations/organization-onboarding/steps/organization-localization/organization-localization.html b/src/app/features/organizations/organization-onboarding/steps/organization-localization/organization-localization.html
new file mode 100644
index 00000000..c190a167
--- /dev/null
+++ b/src/app/features/organizations/organization-onboarding/steps/organization-localization/organization-localization.html
@@ -0,0 +1,139 @@
+<form [formGroup]="form" autocomplete="off">
+  <div class="grid grid-cols-12 gap-x-5 gap-y-5">
+    <div class="col-span-12 md:col-span-6 xl:col-span-4">
+      <app-autocomplete
+        formControlName="timeZoneId"
+        inputId="organization-time-zone"
+        variant="floating"
+        label="Time Zone"
+        placeholder="Search"
+        [searchFn]="searchTimezones"
+        [displayWith]="displayTimezone"
+        [valueWith]="timeZoneValue"
+        [resolveValueFn]="resolveTimezone"
+        [selectedItem]="timeZoneSelection()"
+        [required]="true"
+        [submitAttempted]="submitAttempted()"
+        [validationMessages]="{ required: 'Time Zone is required.' }"
+        (itemSelected)="onTimeZoneSelected($event)"
+        (cleared)="onTimeZoneCleared()"
+      />
+    </div>
+
+    <div class="col-span-12 md:col-span-6 xl:col-span-4">
+      <app-autocomplete
+        formControlName="currencyId"
+        inputId="organization-currency"
+        variant="floating"
+        label="Currency"
+        placeholder="Search"
+        [searchFn]="searchCurrencies"
+        [displayWith]="displayCurrency"
+        [valueWith]="currencyValue"
+        [resolveValueFn]="resolveCurrency"
+        [selectedItem]="currencySelection()"
+        [required]="true"
+        [submitAttempted]="submitAttempted()"
+        [validationMessages]="{ required: 'Currency is required.' }"
+        (itemSelected)="onCurrencySelected($event)"
+        (cleared)="onCurrencyCleared()"
+      />
+    </div>
+
+    <div class="col-span-12 md:col-span-6 xl:col-span-4">
+      <app-autocomplete
+        formControlName="defaultLanguageId"
+        inputId="organization-default-language"
+        variant="floating"
+        label="Default Language"
+        placeholder="Search"
+        [searchFn]="searchLanguages"
+        [displayWith]="displayLanguage"
+        [valueWith]="languageValue"
+        [resolveValueFn]="resolveLanguage"
+        [selectedItem]="defaultLanguageSelection()"
+        [required]="true"
+        [submitAttempted]="submitAttempted()"
+        [validationMessages]="{ required: 'Default Language is required.' }"
+        (itemSelected)="onDefaultLanguageSelected($event)"
+        (cleared)="onDefaultLanguageCleared()"
+      />
+    </div>
+
+    <div class="col-span-12 md:col-span-6 xl:col-span-4">
+      <app-form-select
+        formControlName="additionalLanguageIds"
+        inputId="organization-additional-languages"
+        variant="floating"
+        label="Additional Languages"
+        mode="multiple"
+        [options]="additionalLanguageOptions()"
+        [showCheckboxes]="true"
+        [showSelectAll]="true"
+        [clearable]="true"
+        [searchable]="true"
+        [submitAttempted]="submitAttempted()"
+      />
+    </div>
+
+    <div class="col-span-12 md:col-span-6 xl:col-span-4">
+      <app-form-select
+        formControlName="dateFormat"
+        inputId="organization-date-format"
+        variant="floating"
+        label="Date Format"
+        [options]="dateFormatOptions"
+        [required]="true"
+        [clearable]="false"
+        [searchable]="false"
+        [submitAttempted]="submitAttempted()"
+        [validationMessages]="{ required: 'Date Format is required.' }"
+      />
+    </div>
+
+    <div class="col-span-12 md:col-span-6 xl:col-span-4">
+      <app-form-select
+        formControlName="timeFormat"
+        inputId="organization-time-format"
+        variant="floating"
+        label="Time Format"
+        [options]="timeFormatOptions"
+        [required]="true"
+        [clearable]="false"
+        [searchable]="false"
+        [submitAttempted]="submitAttempted()"
+        [validationMessages]="{ required: 'Time Format is required.' }"
+      />
+    </div>
+
+    <div class="col-span-12 md:col-span-6 xl:col-span-4">
+      <app-form-select
+        formControlName="numberFormat"
+        inputId="organization-number-format"
+        variant="floating"
+        label="Number Format"
+        [options]="numberFormatOptions"
+        [required]="true"
+        [clearable]="false"
+        [searchable]="false"
+        [submitAttempted]="submitAttempted()"
+        [validationMessages]="{ required: 'Number Format is required.' }"
+      />
+    </div>
+
+    <div class="col-span-12 md:col-span-6 xl:col-span-4">
+      <app-form-select
+        formControlName="fiscalYearConvention"
+        inputId="organization-fiscal-year-convention"
+        variant="floating"
+        label="Fiscal Year Convention"
+        [options]="fiscalYearOptions"
+        [required]="true"
+        [clearable]="false"
+        [searchable]="false"
+        [submitAttempted]="submitAttempted()"
+        [validationMessages]="{ required: 'Fiscal Year Convention is required.' }"
+      />
+    </div>
+  </div>
+</form>
\ No newline at end of file
diff --git a/src/app/features/organizations/organization-onboarding/steps/organization-localization/organization-localization.ts b/src/app/features/organizations/organization-onboarding/steps/organization-localization/organization-localization.ts
new file mode 100644
index 00000000..2ad18f6b
--- /dev/null
+++ b/src/app/features/organizations/organization-onboarding/steps/organization-localization/organization-localization.ts
@@ -0,0 +1,409 @@
+import { ChangeDetectionStrategy, Component, DestroyRef, ElementRef, inject, signal } from '@angular/core';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { FormBuilder, ReactiveFormsModule, Validators } from '@angular/forms';
+import { ToastrService } from 'ngx-toastr';
+import { catchError, of } from 'rxjs';
+
+import {
+  CurrencyLookupDto,
+} from '../../../../global-masters/currencies/public-api';
+import {
+  LanguageLookupDto,
+} from '../../../../global-masters/languages/public-api';
+import {
+  TimezoneLookupDto,
+} from '../../../../global-masters/timezones/public-api';
+import { Autocomplete } from '../../../../../shared/components/form/autocomplete/autocomplete';
+import {
+  AutocompleteDisplayFn,
+  AutocompleteResolveValueFn,
+  AutocompleteSearchFn,
+  AutocompleteValueFn,
+} from '../../../../../shared/components/form/autocomplete/autocomplete.types';
+import { FormSelect } from '../../../../../shared/components/form/form-select/form-select';
+import { FormSelectOption } from '../../../../../shared/components/form/models/form-select.models';
+import {
+  CountryLocalizationDefaults,
+  DateFormatValue,
+  FiscalYearConventionValue,
+  NumberFormatValue,
+  OnboardingLookupValue,
+  OnboardingStepForm,
+  OrganizationLocalizationValue,
+  TimeFormatValue,
+} from '../../models/organization-onboarding.model';
+import { OrganizationOnboardingService } from '../../services/organization-onboarding.service';
+
+interface OrganizationLocalizationFormModel {
+  readonly timeZoneId: string | null;
+  readonly currencyId: string | null;
+  readonly defaultLanguageId: string | null;
+  readonly additionalLanguageIds: readonly string[];
+  readonly dateFormat: DateFormatValue | null;
+  readonly timeFormat: TimeFormatValue | null;
+  readonly numberFormat: NumberFormatValue | null;
+  readonly fiscalYearConvention: FiscalYearConventionValue | null;
+}
+
+@Component({
+  selector: 'app-organization-localization-step',
+  standalone: true,
+  imports: [ReactiveFormsModule, Autocomplete, FormSelect],
+  templateUrl: './organization-localization.html',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class OrganizationLocalizationStepComponent implements OnboardingStepForm<OrganizationLocalizationValue> {
+  private readonly destroyRef = inject(DestroyRef);
+  private readonly formBuilder = inject(FormBuilder);
+  private readonly onboardingService = inject(OrganizationOnboardingService);
+  private readonly toastr = inject(ToastrService);
+  private readonly elementRef = inject<ElementRef<HTMLElement>>(ElementRef);
+
+  readonly submitAttempted = signal(false);
+  readonly timeZoneSelection = signal<TimezoneLookupDto | null>(null);
+  readonly currencySelection = signal<CurrencyLookupDto | null>(null);
+  readonly defaultLanguageSelection = signal<LanguageLookupDto | null>(null);
+  readonly additionalLanguageOptions = signal<readonly FormSelectOption<string>[]>([]);
+
+  readonly dateFormatOptions = this.onboardingService.getDateFormatOptions();
+  readonly timeFormatOptions = this.onboardingService.getTimeFormatOptions();
+  readonly numberFormatOptions = this.onboardingService.getNumberFormatOptions();
+  readonly fiscalYearOptions = this.onboardingService.getFiscalYearOptions();
+
+  readonly form = this.formBuilder.group({
+    timeZoneId: this.formBuilder.control<string | null>(null, [Validators.required]),
+    currencyId: this.formBuilder.control<string | null>(null, [Validators.required]),
+    defaultLanguageId: this.formBuilder.control<string | null>(null, [Validators.required]),
+    additionalLanguageIds: this.formBuilder.nonNullable.control<readonly string[]>([]),
+    dateFormat: this.formBuilder.control<DateFormatValue | null>(null, [Validators.required]),
+    timeFormat: this.formBuilder.control<TimeFormatValue | null>(null, [Validators.required]),
+    numberFormat: this.formBuilder.control<NumberFormatValue | null>(null, [Validators.required]),
+    fiscalYearConvention: this.formBuilder.control<FiscalYearConventionValue | null>(null, [Validators.required]),
+  });
+
+  readonly searchTimezones: AutocompleteSearchFn<TimezoneLookupDto> = (term, limit) =>
+    this.onboardingService.searchTimezones(term, limit).pipe(
+      catchError(() => {
+        this.toastr.error('Unable to load timezones.');
+        return of<readonly TimezoneLookupDto[]>([]);
+      })
+    );
+
+  readonly searchCurrencies: AutocompleteSearchFn<CurrencyLookupDto> = (term, limit) =>
+    this.onboardingService.searchCurrencies(term, limit).pipe(
+      catchError(() => {
+        this.toastr.error('Unable to load currencies.');
+        return of<readonly CurrencyLookupDto[]>([]);
+      })
+    );
+
+  readonly searchLanguages: AutocompleteSearchFn<LanguageLookupDto> = (term, limit) =>
+    this.onboardingService.searchLanguages(term, limit).pipe(
+      catchError(() => {
+        this.toastr.error('Unable to load languages.');
+        return of<readonly LanguageLookupDto[]>([]);
+      })
+    );
+
+  readonly displayTimezone: AutocompleteDisplayFn<TimezoneLookupDto> = item =>
+    [item.ianaId, item.displayName].filter(Boolean).join(' - ');
+
+  readonly timeZoneValue: AutocompleteValueFn<TimezoneLookupDto, string> = item => item.id;
+
+  readonly resolveTimezone: AutocompleteResolveValueFn<TimezoneLookupDto, string> = value =>
+    this.onboardingService.resolveTimezone(value);
+
+  readonly displayCurrency: AutocompleteDisplayFn<CurrencyLookupDto> = item =>
+    [item.code, item.name, item.symbol ? `(${item.symbol})` : null].filter(Boolean).join(' ');
+
+  readonly currencyValue: AutocompleteValueFn<CurrencyLookupDto, string> = item => item.id;
+
+  readonly resolveCurrency: AutocompleteResolveValueFn<CurrencyLookupDto, string> = value =>
+    this.onboardingService.resolveCurrency(value);
+
+  readonly displayLanguage: AutocompleteDisplayFn<LanguageLookupDto> = item =>
+    [item.code, item.name].filter(Boolean).join(' - ');
+
+  readonly languageValue: AutocompleteValueFn<LanguageLookupDto, string> = item => item.id;
+
+  readonly resolveLanguage: AutocompleteResolveValueFn<LanguageLookupDto, string> = value =>
+    this.onboardingService.resolveLanguage(value);
+
+  constructor() {
+    this.onboardingService.loadLanguageOptions(100)
+      .pipe(
+        catchError(() => {
+          this.toastr.error('Unable to load language options.');
+          return of<readonly FormSelectOption<string>[]>([]);
+        }),
+        takeUntilDestroyed(this.destroyRef)
+      )
+      .subscribe(options => {
+        this.additionalLanguageOptions.update(current => this.mergeLanguageOptions(current, options));
+      });
+
+    this.form.controls.defaultLanguageId.valueChanges
+      .pipe(takeUntilDestroyed(this.destroyRef))
+      .subscribe(defaultLanguageId => {
+        if (!defaultLanguageId) {
+          return;
+        }
+
+        const filteredIds = this.form.controls.additionalLanguageIds.value.filter(id => id !== defaultLanguageId);
+
+        if (filteredIds.length !== this.form.controls.additionalLanguageIds.value.length) {
+          this.form.controls.additionalLanguageIds.setValue(filteredIds, { emitEvent: false });
+        }
+      });
+  }
+
+  validate(): boolean {
+    this.submitAttempted.set(true);
+
+    if (this.form.valid) {
+      return true;
+    }
+
+    this.form.markAllAsTouched();
+    this.focusFirstInvalidControl();
+    return false;
+  }
+
+  getValue(): OrganizationLocalizationValue {
+    const value = this.form.getRawValue() as OrganizationLocalizationFormModel;
+    const timeZone = this.timeZoneSelection();
+    const currency = this.currencySelection();
+    const defaultLanguage = this.defaultLanguageSelection();
+
+    if (!timeZone || !currency || !defaultLanguage || !value.dateFormat || !value.timeFormat || !value.numberFormat || !value.fiscalYearConvention) {
+      throw new Error('Organization localization values are incomplete.');
+    }
+
+    const additionalLanguageSelections = this.resolveAdditionalLanguageSelections(value.additionalLanguageIds);
+
+    return {
+      timeZone: { id: timeZone.id, label: timeZone.displayName, secondaryLabel: timeZone.ianaId },
+      currency: { id: currency.id, label: currency.name, secondaryLabel: currency.code },
+      defaultLanguage: { id: defaultLanguage.id, label: defaultLanguage.name, secondaryLabel: defaultLanguage.code },
+      additionalLanguageIds: value.additionalLanguageIds.filter(id => id !== defaultLanguage.id),
+      additionalLanguageSelections,
+      dateFormat: value.dateFormat,
+      timeFormat: value.timeFormat,
+      numberFormat: value.numberFormat,
+      fiscalYearConvention: value.fiscalYearConvention,
+      localizationDefaultsCountryId: null,
+    };
+  }
+
+  getDraftValue(): Partial<OrganizationLocalizationValue> {
+    const value = this.form.getRawValue() as OrganizationLocalizationFormModel;
+
+    return {
+      timeZone: this.timeZoneSelection()
+        ? {
+            id: this.timeZoneSelection()!.id,
+            label: this.timeZoneSelection()!.displayName,
+            secondaryLabel: this.timeZoneSelection()!.ianaId,
+          }
+        : undefined,
+      currency: this.currencySelection()
+        ? {
+            id: this.currencySelection()!.id,
+            label: this.currencySelection()!.name,
+            secondaryLabel: this.currencySelection()!.code,
+          }
+        : undefined,
+      defaultLanguage: this.defaultLanguageSelection()
+        ? {
+            id: this.defaultLanguageSelection()!.id,
+            label: this.defaultLanguageSelection()!.name,
+            secondaryLabel: this.defaultLanguageSelection()!.code,
+          }
+        : undefined,
+      additionalLanguageIds: value.additionalLanguageIds,
+      additionalLanguageSelections: this.resolveAdditionalLanguageSelections(value.additionalLanguageIds),
+      dateFormat: value.dateFormat ?? undefined,
+      timeFormat: value.timeFormat ?? undefined,
+      numberFormat: value.numberFormat ?? undefined,
+      fiscalYearConvention: value.fiscalYearConvention ?? undefined,
+      localizationDefaultsCountryId: null,
+    };
+  }
+
+  patchValue(value: Partial<OrganizationLocalizationValue>): void {
+    this.form.patchValue({
+      timeZoneId: value.timeZone?.id ?? null,
+      currencyId: value.currency?.id ?? null,
+      defaultLanguageId: value.defaultLanguage?.id ?? null,
+      additionalLanguageIds: value.additionalLanguageIds ?? [],
+      dateFormat: value.dateFormat ?? null,
+      timeFormat: value.timeFormat ?? null,
+      numberFormat: value.numberFormat ?? null,
+      fiscalYearConvention: value.fiscalYearConvention ?? null,
+    }, { emitEvent: false });
+
+    this.timeZoneSelection.set(
+      value.timeZone
+        ? {
+            id: value.timeZone.id,
+            ianaId: value.timeZone.secondaryLabel ?? value.timeZone.label,
+            displayName: value.timeZone.label,
+          }
+        : null
+    );
+    this.currencySelection.set(
+      value.currency
+        ? {
+            id: value.currency.id,
+            code: value.currency.secondaryLabel ?? value.currency.label,
+            name: value.currency.label,
+            symbol: '',
+          }
+        : null
+    );
+    this.defaultLanguageSelection.set(
+      value.defaultLanguage
+        ? {
+            id: value.defaultLanguage.id,
+            code: value.defaultLanguage.secondaryLabel ?? value.defaultLanguage.label,
+            name: value.defaultLanguage.label,
+            nativeName: value.defaultLanguage.label,
+            isRightToLeft: false,
+          }
+        : null
+    );
+    this.additionalLanguageOptions.update(current => this.mergeSelectionOptions(current, value.additionalLanguageSelections ?? []));
+    this.submitAttempted.set(false);
+  }
+
+  applyCountryDefaults(defaults: CountryLocalizationDefaults, replaceExisting: boolean): void {
+    const nextValue = {
+      timeZoneId: replaceExisting || !this.form.controls.timeZoneId.value ? defaults.timeZone.id : this.form.controls.timeZoneId.value,
+      currencyId: replaceExisting || !this.form.controls.currencyId.value ? defaults.currency.id : this.form.controls.currencyId.value,
+      defaultLanguageId: replaceExisting || !this.form.controls.defaultLanguageId.value ? defaults.defaultLanguage.id : this.form.controls.defaultLanguageId.value,
+      dateFormat: replaceExisting || !this.form.controls.dateFormat.value ? defaults.dateFormat : this.form.controls.dateFormat.value,
+      timeFormat: replaceExisting || !this.form.controls.timeFormat.value ? defaults.timeFormat : this.form.controls.timeFormat.value,
+      numberFormat: replaceExisting || !this.form.controls.numberFormat.value ? defaults.numberFormat : this.form.controls.numberFormat.value,
+      fiscalYearConvention: replaceExisting || !this.form.controls.fiscalYearConvention.value ? defaults.fiscalYearConvention : this.form.controls.fiscalYearConvention.value,
+    };
+
+    this.form.patchValue(nextValue, { emitEvent: false });
+    this.timeZoneSelection.set(
+      replaceExisting || !this.timeZoneSelection()
+        ? {
+            id: defaults.timeZone.id,
+            ianaId: defaults.timeZone.secondaryLabel ?? defaults.timeZone.label,
+            displayName: defaults.timeZone.label,
+          }
+        : this.timeZoneSelection()
+    );
+    this.currencySelection.set(
+      replaceExisting || !this.currencySelection()
+        ? {
+            id: defaults.currency.id,
+            code: defaults.currency.secondaryLabel ?? defaults.currency.label,
+            name: defaults.currency.label,
+            symbol: '',
+          }
+        : this.currencySelection()
+    );
+    this.defaultLanguageSelection.set(
+      replaceExisting || !this.defaultLanguageSelection()
+        ? {
+            id: defaults.defaultLanguage.id,
+            code: defaults.defaultLanguage.secondaryLabel ?? defaults.defaultLanguage.label,
+            name: defaults.defaultLanguage.label,
+            nativeName: defaults.defaultLanguage.label,
+            isRightToLeft: false,
+          }
+        : this.defaultLanguageSelection()
+    );
+
+    if (replaceExisting) {
+      const filteredIds = this.form.controls.additionalLanguageIds.value.filter(id => id !== defaults.defaultLanguage.id);
+      this.form.controls.additionalLanguageIds.setValue(filteredIds, { emitEvent: false });
+    }
+  }
+
+  hasSavedOrEnteredValues(): boolean {
+    const value = this.form.getRawValue() as OrganizationLocalizationFormModel;
+
+    return !!(
+      value.timeZoneId ||
+      value.currencyId ||
+      value.defaultLanguageId ||
+      value.additionalLanguageIds.length ||
+      value.dateFormat ||
+      value.timeFormat ||
+      value.numberFormat ||
+      value.fiscalYearConvention
+    );
+  }
+
+  onTimeZoneSelected(item: TimezoneLookupDto): void {
+    this.timeZoneSelection.set(item);
+  }
+
+  onTimeZoneCleared(): void {
+    this.timeZoneSelection.set(null);
+  }
+
+  onCurrencySelected(item: CurrencyLookupDto): void {
+    this.currencySelection.set(item);
+  }
+
+  onCurrencyCleared(): void {
+    this.currencySelection.set(null);
+  }
+
+  onDefaultLanguageSelected(item: LanguageLookupDto): void {
+    this.defaultLanguageSelection.set(item);
+  }
+
+  onDefaultLanguageCleared(): void {
+    this.defaultLanguageSelection.set(null);
+  }
+
+  private resolveAdditionalLanguageSelections(languageIds: readonly string[]): readonly OnboardingLookupValue[] {
+    const uniqueIds = [...new Set(languageIds)];
+    const optionMap = new Map(this.additionalLanguageOptions().map(option => [option.value, option.label]));
+
+    return uniqueIds.map(languageId => ({
+      id: languageId,
+      label: optionMap.get(languageId) ?? languageId,
+    }));
+  }
+
+  private mergeLanguageOptions(
+    current: readonly FormSelectOption<string>[],
+    incoming: readonly FormSelectOption<string>[],
+  ): readonly FormSelectOption<string>[] {
+    const merged = new Map<string, FormSelectOption<string>>();
+
+    [...current, ...incoming].forEach(option => {
+      merged.set(option.value, option);
+    });
+
+    return [...merged.values()];
+  }
+
+  private mergeSelectionOptions(
+    current: readonly FormSelectOption<string>[],
+    selections: readonly OnboardingLookupValue[],
+  ): readonly FormSelectOption<string>[] {
+    return this.mergeLanguageOptions(
+      current,
+      selections.map(selection => ({ value: selection.id, label: selection.label }))
+    );
+  }
+
+  private focusFirstInvalidControl(): void {
+    queueMicrotask(() => {
+      const invalidElement = this.elementRef.nativeElement.querySelector<HTMLElement>(
+        '.ng-invalid [data-form-control], [data-form-control].ng-invalid, .ng-invalid .ng-select-container'
+      );
+
+      invalidElement?.focus();
+    });
+  }
+}
\ No newline at end of file
diff --git a/src/app/features/organizations/organization-onboarding/steps/organization-plan-limits/organization-plan-limits.html b/src/app/features/organizations/organization-onboarding/steps/organization-plan-limits/organization-plan-limits.html
new file mode 100644
index 00000000..8c2a5695
--- /dev/null
+++ b/src/app/features/organizations/organization-onboarding/steps/organization-plan-limits/organization-plan-limits.html
@@ -0,0 +1,151 @@
+<form [formGroup]="form" autocomplete="off">
+  <div class="grid grid-cols-12 gap-x-5 gap-y-5">
+    <div class="col-span-12 md:col-span-6 xl:col-span-4">
+      <app-autocomplete
+        formControlName="subscriptionPlanId"
+        inputId="organization-subscription-plan"
+        variant="floating"
+        label="Subscription Plan"
+        placeholder="Search"
+        [searchFn]="searchPlans"
+        [displayWith]="displayPlan"
+        [valueWith]="planValue"
+        [resolveValueFn]="resolvePlan"
+        [selectedItem]="planSelection()"
+        [required]="true"
+        [submitAttempted]="submitAttempted()"
+        [validationMessages]="{ required: 'Subscription Plan is required.' }"
+        (itemSelected)="onPlanSelected($event)"
+        (cleared)="onPlanCleared()"
+      />
+    </div>
+
+    <div class="col-span-12 md:col-span-6 xl:col-span-4">
+      <app-form-select
+        formControlName="licenseType"
+        inputId="organization-license-type"
+        variant="floating"
+        label="License Type"
+        [options]="licenseTypeOptions"
+        [required]="true"
+        [clearable]="false"
+        [searchable]="false"
+        [submitAttempted]="submitAttempted()"
+        [validationMessages]="{ required: 'License Type is required.' }"
+      />
+    </div>
+
+    <div class="col-span-12 md:col-span-6 xl:col-span-4">
+      <app-form-input
+        formControlName="maximumCompanies"
+        inputId="organization-maximum-companies"
+        variant="floating"
+        label="Maximum Companies"
+        type="number"
+        inputMode="numeric"
+        [required]="true"
+        [min]="1"
+        [step]="1"
+        [readonly]="!limitsEditable()"
+        [submitAttempted]="submitAttempted()"
+        [validationMessages]="{
+          required: 'Maximum Companies is required.',
+          min: 'Maximum Companies must be at least 1.'
+        }"
+      />
+    </div>
+
+    <div class="col-span-12 md:col-span-6 xl:col-span-4">
+      <app-form-input
+        formControlName="maximumUsers"
+        inputId="organization-maximum-users"
+        variant="floating"
+        label="Maximum Users"
+        type="number"
+        inputMode="numeric"
+        [required]="true"
+        [min]="1"
+        [step]="1"
+        [readonly]="!limitsEditable()"
+        [submitAttempted]="submitAttempted()"
+        [validationMessages]="{
+          required: 'Maximum Users is required.',
+          min: 'Maximum Users must be at least 1.'
+        }"
+      />
+    </div>
+
+    <div class="col-span-12 md:col-span-6 xl:col-span-4">
+      <app-form-input
+        formControlName="maximumStorageGb"
+        inputId="organization-maximum-storage"
+        variant="floating"
+        label="Maximum Storage (GB)"
+        type="number"
+        inputMode="numeric"
+        [required]="true"
+        [min]="1"
+        [step]="1"
+        [readonly]="!limitsEditable()"
+        [submitAttempted]="submitAttempted()"
+        [validationMessages]="{
+          required: 'Maximum Storage is required.',
+          min: 'Maximum Storage must be at least 1 GB.'
+        }"
+      />
+    </div>
+
+    <div class="col-span-12 md:col-span-6 xl:col-span-4">
+      <app-form-date-picker
+        formControlName="goLiveDate"
+        inputId="organization-go-live-date"
+        variant="floating"
+        label="Go-Live Date"
+        [required]="true"
+        [submitAttempted]="submitAttempted()"
+        [validationMessages]="{ required: 'Go-Live Date is required.' }"
+      />
+    </div>
+
+    <div class="col-span-12 md:col-span-6 xl:col-span-4">
+      <app-form-date-picker
+        formControlName="systemAccessStartDate"
+        inputId="organization-system-access-start-date"
+        variant="floating"
+        label="System Access Start Date"
+        [required]="true"
+        [submitAttempted]="submitAttempted()"
+        [validationMessages]="{ required: 'System Access Start Date is required.' }"
+      />
+    </div>
+
+    <div class="col-span-12 md:col-span-6 xl:col-span-4">
+      <app-form-date-picker
+        formControlName="systemAccessEndDate"
+        inputId="organization-system-access-end-date"
+        variant="floating"
+        label="System Access End Date"
+        [required]="requiresAccessEndDate()"
+        [submitAttempted]="submitAttempted()"
+        [validationMessages]="{
+          required: 'System Access End Date is required for Trial.',
+          trialEndDateRequired: 'System Access End Date is required for Trial.',
+          accessDateRange: 'System Access End Date must be on or after the access start date.',
+          trialEndDateOrder: 'Trial end date must be later than the access start date.'
+        }"
+      />
+    </div>
+
+    @if (submitAttempted() && form.errors?.['accessDateRange']) {
+      <div class="col-span-12 text-sm text-danger">
+        System Access Start Date cannot be later than System Access End Date.
+      </div>
+    }
+
+    @if (submitAttempted() && form.errors?.['trialEndDateOrder']) {
+      <div class="col-span-12 text-sm text-danger">
+        Trial end date must be later than the access start date.
+      </div>
+    }
+  </div>
+</form>
\ No newline at end of file
diff --git a/src/app/features/organizations/organization-onboarding/steps/organization-plan-limits/organization-plan-limits.ts b/src/app/features/organizations/organization-onboarding/steps/organization-plan-limits/organization-plan-limits.ts
new file mode 100644
index 00000000..0fb4688f
--- /dev/null
+++ b/src/app/features/organizations/organization-onboarding/steps/organization-plan-limits/organization-plan-limits.ts
@@ -0,0 +1,266 @@
+import { ChangeDetectionStrategy, Component, DestroyRef, ElementRef, computed, inject, signal } from '@angular/core';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import {
+  AbstractControl,
+  FormBuilder,
+  ReactiveFormsModule,
+  ValidationErrors,
+  ValidatorFn,
+  Validators,
+} from '@angular/forms';
+import { ToastrService } from 'ngx-toastr';
+import { catchError, of, switchMap } from 'rxjs';
+
+import { Autocomplete } from '../../../../../shared/components/form/autocomplete/autocomplete';
+import {
+  AutocompleteDisplayFn,
+  AutocompleteResolveValueFn,
+  AutocompleteSearchFn,
+  AutocompleteValueFn,
+} from '../../../../../shared/components/form/autocomplete/autocomplete.types';
+import { FormDatePicker } from '../../../../../shared/components/form/form-date-picker/form-date-picker';
+import { FormInput } from '../../../../../shared/components/form/form-input/form-input';
+import { FormSelect } from '../../../../../shared/components/form/form-select/form-select';
+import {
+  OnboardingStepForm,
+  OrganizationLicenseType,
+  OrganizationPlanDefaults,
+  OrganizationPlanLimitsValue,
+  OrganizationPlanLookupValue,
+} from '../../models/organization-onboarding.model';
+import { OrganizationOnboardingService } from '../../services/organization-onboarding.service';
+
+interface OrganizationPlanLimitsFormModel {
+  readonly subscriptionPlanId: string | null;
+  readonly licenseType: OrganizationLicenseType | null;
+  readonly maximumCompanies: number | null;
+  readonly maximumUsers: number | null;
+  readonly maximumStorageGb: number | null;
+  readonly goLiveDate: string | null;
+  readonly systemAccessStartDate: string | null;
+  readonly systemAccessEndDate: string | null;
+}
+
+const accessDateValidator: ValidatorFn = (control: AbstractControl): ValidationErrors | null => {
+  const value = control.value as OrganizationPlanLimitsFormModel;
+
+  if (!value) {
+    return null;
+  }
+
+  const errors: ValidationErrors = {};
+  const { licenseType, systemAccessStartDate, systemAccessEndDate } = value;
+
+  if (licenseType === 'Trial' && !systemAccessEndDate) {
+    errors['trialEndDateRequired'] = true;
+  }
+
+  if (systemAccessStartDate && systemAccessEndDate && systemAccessStartDate > systemAccessEndDate) {
+    errors['accessDateRange'] = true;
+  }
+
+  if (licenseType === 'Trial' && systemAccessStartDate && systemAccessEndDate && systemAccessStartDate >= systemAccessEndDate) {
+    errors['trialEndDateOrder'] = true;
+  }
+
+  return Object.keys(errors).length ? errors : null;
+};
+
+@Component({
+  selector: 'app-organization-plan-limits-step',
+  standalone: true,
+  imports: [ReactiveFormsModule, Autocomplete, FormSelect, FormInput, FormDatePicker],
+  templateUrl: './organization-plan-limits.html',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class OrganizationPlanLimitsStepComponent implements OnboardingStepForm<OrganizationPlanLimitsValue> {
+  private readonly destroyRef = inject(DestroyRef);
+  private readonly formBuilder = inject(FormBuilder);
+  private readonly onboardingService = inject(OrganizationOnboardingService);
+  private readonly toastr = inject(ToastrService);
+  private readonly elementRef = inject<ElementRef<HTMLElement>>(ElementRef);
+
+  readonly submitAttempted = signal(false);
+  readonly planSelection = signal<OrganizationPlanLookupValue | null>(null);
+  readonly limitsEditable = signal(true);
+  readonly licenseTypeOptions = this.onboardingService.getLicenseTypeOptions();
+
+  readonly form = this.formBuilder.group({
+    subscriptionPlanId: this.formBuilder.control<string | null>(null, [Validators.required]),
+    licenseType: this.formBuilder.control<OrganizationLicenseType | null>(null, [Validators.required]),
+    maximumCompanies: this.formBuilder.control<number | null>(null, [Validators.required, Validators.min(1)]),
+    maximumUsers: this.formBuilder.control<number | null>(null, [Validators.required, Validators.min(1)]),
+    maximumStorageGb: this.formBuilder.control<number | null>(null, [Validators.required, Validators.min(1)]),
+    goLiveDate: this.formBuilder.control<string | null>(null, [Validators.required]),
+    systemAccessStartDate: this.formBuilder.control<string | null>(null, [Validators.required]),
+    systemAccessEndDate: this.formBuilder.control<string | null>(null),
+  }, { validators: accessDateValidator });
+
+  readonly requiresAccessEndDate = computed(() => this.form.controls.licenseType.value === 'Trial');
+
+  readonly searchPlans: AutocompleteSearchFn<OrganizationPlanLookupValue> = (term, limit) =>
+    this.onboardingService.searchSubscriptionPlans(term, limit).pipe(
+      catchError(() => {
+        this.toastr.error('Unable to load subscription plans.');
+        return of<readonly OrganizationPlanLookupValue[]>([]);
+      })
+    );
+
+  readonly displayPlan: AutocompleteDisplayFn<OrganizationPlanLookupValue> = item =>
+    [item.label, item.code].filter(Boolean).join(' - ');
+
+  readonly planValue: AutocompleteValueFn<OrganizationPlanLookupValue, string> = item => item.id;
+
+  readonly resolvePlan: AutocompleteResolveValueFn<OrganizationPlanLookupValue, string> = value =>
+    this.onboardingService.resolveSubscriptionPlan(value);
+
+  constructor() {
+    this.form.controls.licenseType.valueChanges
+      .pipe(takeUntilDestroyed(this.destroyRef))
+      .subscribe(licenseType => {
+        if (licenseType === 'Trial') {
+          this.form.controls.systemAccessEndDate.addValidators([Validators.required]);
+        } else {
+          this.form.controls.systemAccessEndDate.removeValidators([Validators.required]);
+        }
+
+        this.form.controls.systemAccessEndDate.updateValueAndValidity({ emitEvent: false });
+      });
+
+    this.form.controls.subscriptionPlanId.valueChanges
+      .pipe(
+        switchMap(planId => {
+          if (!planId) {
+            return of<OrganizationPlanDefaults | null>(null);
+          }
+
+          return this.onboardingService.getPlanDefaults(planId).pipe(
+            catchError(() => {
+              this.toastr.error('Unable to load plan defaults.');
+              return of<OrganizationPlanDefaults | null>(null);
+            })
+          );
+        }),
+        takeUntilDestroyed(this.destroyRef)
+      )
+      .subscribe(defaults => {
+        if (!defaults) {
+          return;
+        }
+
+        this.applyPlanDefaults(defaults);
+      });
+  }
+
+  validate(): boolean {
+    this.submitAttempted.set(true);
+
+    if (this.form.valid) {
+      return true;
+    }
+
+    this.form.markAllAsTouched();
+    this.focusFirstInvalidControl();
+    return false;
+  }
+
+  getValue(): OrganizationPlanLimitsValue {
+    const value = this.form.getRawValue() as OrganizationPlanLimitsFormModel;
+    const subscriptionPlan = this.planSelection();
+
+    if (!subscriptionPlan || !value.licenseType || !value.maximumCompanies || !value.maximumUsers || !value.maximumStorageGb || !value.goLiveDate || !value.systemAccessStartDate) {
+      throw new Error('Organization plan and limits values are incomplete.');
+    }
+
+    return {
+      subscriptionPlan,
+      licenseType: value.licenseType,
+      maximumCompanies: value.maximumCompanies,
+      maximumUsers: value.maximumUsers,
+      maximumStorageGb: value.maximumStorageGb,
+      goLiveDate: value.goLiveDate,
+      systemAccessStartDate: value.systemAccessStartDate,
+      systemAccessEndDate: value.systemAccessEndDate,
+      limitsEditable: this.limitsEditable(),
+    };
+  }
+
+  getDraftValue(): Partial<OrganizationPlanLimitsValue> {
+    const value = this.form.getRawValue() as OrganizationPlanLimitsFormModel;
+
+    return {
+      subscriptionPlan: this.planSelection() ?? undefined,
+      licenseType: value.licenseType ?? undefined,
+      maximumCompanies: value.maximumCompanies ?? undefined,
+      maximumUsers: value.maximumUsers ?? undefined,
+      maximumStorageGb: value.maximumStorageGb ?? undefined,
+      goLiveDate: value.goLiveDate ?? undefined,
+      systemAccessStartDate: value.systemAccessStartDate ?? undefined,
+      systemAccessEndDate: value.systemAccessEndDate,
+      limitsEditable: this.limitsEditable(),
+    };
+  }
+
+  patchValue(value: Partial<OrganizationPlanLimitsValue>): void {
+    this.form.patchValue({
+      subscriptionPlanId: value.subscriptionPlan?.id ?? null,
+      licenseType: value.licenseType ?? null,
+      maximumCompanies: value.maximumCompanies ?? null,
+      maximumUsers: value.maximumUsers ?? null,
+      maximumStorageGb: value.maximumStorageGb ?? null,
+      goLiveDate: value.goLiveDate ?? null,
+      systemAccessStartDate: value.systemAccessStartDate ?? null,
+      systemAccessEndDate: value.systemAccessEndDate ?? null,
+    }, { emitEvent: false });
+
+    this.planSelection.set(value.subscriptionPlan ?? null);
+    this.limitsEditable.set(value.limitsEditable ?? true);
+    this.applyLimitsEditableState();
+    this.submitAttempted.set(false);
+  }
+
+  onPlanSelected(item: OrganizationPlanLookupValue): void {
+    this.planSelection.set(item);
+  }
+
+  onPlanCleared(): void {
+    this.planSelection.set(null);
+  }
+
+  private applyPlanDefaults(defaults: OrganizationPlanDefaults): void {
+    this.planSelection.set(defaults.plan);
+    this.limitsEditable.set(defaults.limitsEditable);
+    this.form.patchValue({
+      licenseType: defaults.licenseType,
+      maximumCompanies: defaults.maximumCompanies,
+      maximumUsers: defaults.maximumUsers,
+      maximumStorageGb: defaults.maximumStorageGb,
+    }, { emitEvent: false });
+    this.applyLimitsEditableState();
+  }
+
+  private applyLimitsEditableState(): void {
+    const controls = [
+      this.form.controls.maximumCompanies,
+      this.form.controls.maximumUsers,
+      this.form.controls.maximumStorageGb,
+    ];
+
+    if (this.limitsEditable()) {
+      controls.forEach(control => control.enable({ emitEvent: false }));
+      return;
+    }
+
+    controls.forEach(control => control.disable({ emitEvent: false }));
+  }
+
+  private focusFirstInvalidControl(): void {
+    queueMicrotask(() => {
+      const invalidElement = this.elementRef.nativeElement.querySelector<HTMLElement>(
+        '.ng-invalid [data-form-control], [data-form-control].ng-invalid, .ng-invalid .ng-select-container, .ng-invalid input'
+      );
+
+      invalidElement?.focus();
+    });
+  }
+}
\ No newline at end of file
diff --git a/src/app/features/organizations/organizations.routes.ts b/src/app/features/organizations/organizations.routes.ts
new file mode 100644
index 00000000..46ac1584
--- /dev/null
+++ b/src/app/features/organizations/organizations.routes.ts
@@ -0,0 +1,14 @@
+import { Routes } from '@angular/router';
+
+export const organizationsRoutes: Routes = [
+  {
+    path: '',
+    loadComponent: () => import('./organization-list/organization-list').then((m) => m.OrganizationList),
+    data: { childTitle: 'Organization Management', parentTitle: 'Organizations', subParentTitle: 'Configuration' },
+  },
+  {
+    path:'onboarding',
+    loadComponent: () => import('./organization-onboarding/organization-onboarding').then((m) => m.OrganizationOnboarding),
+    data: { childTitle: 'Organization Onboarding', parentTitle: 'Organizations', subParentTitle: 'Configuration' },
+  }
+];
\ No newline at end of file
diff --git a/src/app/features/tenants/data-access/tenant-currencies.endpoints.ts b/src/app/features/tenants/data-access/tenant-currencies.endpoints.ts
new file mode 100644
index 00000000..d72adfa8
--- /dev/null
+++ b/src/app/features/tenants/data-access/tenant-currencies.endpoints.ts
@@ -0,0 +1,32 @@
+import { buildApiUrl } from '../../../core/config/api-url.util';
+
+
+export const TENANT_CURRENCIES_ENDPOINTS = {
+    dataTable: buildApiUrl(
+        'masterAdmin',
+        '/v1/tenant-currencies/datatable'
+    ),
+
+    create: buildApiUrl(
+        'masterAdmin',
+        '/v1/tenant-currencies'
+    ),
+
+    getById: (id: string) =>
+        buildApiUrl(
+            'masterAdmin',
+            `/v1/tenant-currencies/${encodeURIComponent(id)}`
+        ),
+
+    autocomplete: buildApiUrl(
+        'masterAdmin',
+        '/v1/tenant-currencies/autocomplete'
+    ),
+
+    update: (id: string) =>
+        buildApiUrl(
+            'masterAdmin',
+            `/v1/tenant-currencies/${encodeURIComponent(id)}`
+        )
+
+} as const;
diff --git a/src/app/features/tenants/data-access/tenant-currencies.service.ts b/src/app/features/tenants/data-access/tenant-currencies.service.ts
new file mode 100644
index 00000000..9bb22c6a
--- /dev/null
+++ b/src/app/features/tenants/data-access/tenant-currencies.service.ts
@@ -0,0 +1,47 @@
+import { HttpClient, HttpParams } from '@angular/common/http';
+import { Injectable, inject } from '@angular/core';
+import { Observable } from 'rxjs';
+
+import { TENANT_CURRENCIES_ENDPOINTS } from './tenant-currencies.endpoints';
+import { DataTableQuery, DataTableResult } from '../../../shared/components/data-table/data-table.types';
+import {
+  CreateTenantCurrencyRequest,
+  TenantCurrencyDto,
+  TenantCurrencyDto as TenantCurrencyDtoAlias,
+  TenantCurrencyLookupDto,
+  UpdateTenantCurrencyRequest
+} from '../models/tenant-currencies.model';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class TenantCurrenciesService {
+    private readonly http = inject(HttpClient);
+
+    getTenantDataTable(query: DataTableQuery): Observable<DataTableResult<TenantCurrencyDto>> {
+        return this.http.post<DataTableResult<TenantCurrencyDto>>(TENANT_CURRENCIES_ENDPOINTS.dataTable, query);
+    }
+
+    createTenant(request: CreateTenantCurrencyRequest): Observable<TenantCurrencyDto> {
+        return this.http.post<TenantCurrencyDto>(TENANT_CURRENCIES_ENDPOINTS.create, request);
+    }
+
+    updateTenant(id: string, request: UpdateTenantCurrencyRequest): Observable<TenantCurrencyDto> {
+        return this.http.put<TenantCurrencyDto>(TENANT_CURRENCIES_ENDPOINTS.update(id), request);
+    }
+
+    getTenantById(id: string): Observable<TenantCurrencyDto> {
+        return this.http.get<TenantCurrencyDto>(TENANT_CURRENCIES_ENDPOINTS.getById(id));
+    }
+
+    autocomplete(term?: string, limit = 10): Observable<readonly TenantCurrencyLookupDto[]> {
+        let params = new HttpParams().set('limit', limit);
+        const normalizedTerm = term?.trim();
+
+        if (normalizedTerm) {
+            params = params.set('term', normalizedTerm);
+        }
+
+        return this.http.get<readonly TenantCurrencyLookupDto[]>(TENANT_CURRENCIES_ENDPOINTS.autocomplete, { params });
+    }
+}
diff --git a/src/app/features/tenants/data-access/tenant.endpoints.ts b/src/app/features/tenants/data-access/tenant.endpoints.ts
new file mode 100644
index 00000000..85a4fb62
--- /dev/null
+++ b/src/app/features/tenants/data-access/tenant.endpoints.ts
@@ -0,0 +1,32 @@
+import { buildApiUrl } from '../../../core/config/api-url.util';
+
+
+export const TENANT_ENDPOINTS = {
+    dataTable: buildApiUrl(
+        'masterAdmin',
+        '/v1/tenants/datatable'
+    ),
+
+    create: buildApiUrl(
+        'masterAdmin',
+        '/v1/tenants'
+    ),
+
+    getById: (id: string) =>
+        buildApiUrl(
+            'masterAdmin',
+            `/v1/tenants/${encodeURIComponent(id)}`
+        ),
+
+    autocomplete: buildApiUrl(
+        'masterAdmin',
+        '/v1/tenants/autocomplete'
+    ),
+
+    update: (id: string) =>
+        buildApiUrl(
+            'masterAdmin',
+            `/v1/tenants/${encodeURIComponent(id)}`
+        )
+
+} as const;
diff --git a/src/app/features/tenants/data-access/tenant.service.ts b/src/app/features/tenants/data-access/tenant.service.ts
new file mode 100644
index 00000000..9df4502e
--- /dev/null
+++ b/src/app/features/tenants/data-access/tenant.service.ts
@@ -0,0 +1,46 @@
+import { HttpClient, HttpParams } from '@angular/common/http';
+import { Injectable, inject } from '@angular/core';
+import { Observable } from 'rxjs';
+
+import { TENANT_ENDPOINTS } from './tenant.endpoints';
+import { DataTableQuery, DataTableResult } from '../../../shared/components/data-table/data-table.types';
+import {
+  CreateTenantRequest,
+  TenantDto,
+  TenantLookupDto,
+  UpdateTenantRequest
+} from '../models/tenant.model';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class TenantService {
+    private readonly http = inject(HttpClient);
+
+    getTenantDataTable(query: DataTableQuery): Observable<DataTableResult<TenantDto>> {
+        return this.http.post<DataTableResult<TenantDto>>(TENANT_ENDPOINTS.dataTable, query);
+    }
+
+    createTenant(request: CreateTenantRequest): Observable<TenantDto> {
+        return this.http.post<TenantDto>(TENANT_ENDPOINTS.create, request);
+    }
+
+    updateTenant(id: string, request: UpdateTenantRequest): Observable<TenantDto> {
+        return this.http.put<TenantDto>(TENANT_ENDPOINTS.update(id), request);
+    }
+
+    getTenantById(id: string): Observable<TenantDto> {
+        return this.http.get<TenantDto>(TENANT_ENDPOINTS.getById(id));
+    }
+
+    autocomplete(term?: string, limit = 10): Observable<readonly TenantLookupDto[]> {
+        let params = new HttpParams().set('limit', limit);
+        const normalizedTerm = term?.trim();
+
+        if (normalizedTerm) {
+            params = params.set('term', normalizedTerm);
+        }
+
+        return this.http.get<readonly TenantLookupDto[]>(TENANT_ENDPOINTS.autocomplete, { params });
+    }
+}
diff --git a/src/app/features/tenants/models/tenant-currencies.model.ts b/src/app/features/tenants/models/tenant-currencies.model.ts
new file mode 100644
index 00000000..697591d7
--- /dev/null
+++ b/src/app/features/tenants/models/tenant-currencies.model.ts
@@ -0,0 +1,53 @@
+import { DataTableRecord } from '../../../shared/components/data-table/data-table.types';
+
+
+export interface TenantCurrencyDto {
+    id: string;
+    tenantId: string;
+    tenantName: string;
+    currencyId: string;
+    currencyName: string;
+    isBaseCurrency: boolean;
+    isReporting: boolean;
+    isActive: boolean;
+    createdOn?: string;
+    modifiedOn?: string | null;
+}
+
+export interface TenantCurrencyLookupDto {
+    id: string;
+    tenantId: string;
+    currencyId: string;
+    isBaseCurrency: boolean;
+    isReporting: boolean;
+}
+
+export interface CreateTenantCurrencyRequest {
+    tenantId: string;
+    currencyId: string;
+    isBaseCurrency: boolean;
+    isReporting: boolean;
+}
+
+export interface UpdateTenantCurrencyRequest {
+    isBaseCurrency: boolean;
+    isReporting: boolean;
+    isActive: boolean;
+}
+
+
+export interface TenantCurrencyTableRow extends DataTableRecord {
+    readonly id: string;
+    readonly tenantId: string;
+    readonly tenantName: string;
+    readonly currencyId: string;
+    readonly currencyName: string;
+    readonly isBaseCurrency: boolean;
+    readonly isReporting: boolean;
+    readonly isActive: boolean;
+    readonly serialNumber: number;
+    readonly createdOn?: string;
+    readonly modifiedOn?: string | null;
+}
+
+export type TenantCurrencyModalMode = 'create' | 'edit';
diff --git a/src/app/features/tenants/models/tenant.model.ts b/src/app/features/tenants/models/tenant.model.ts
new file mode 100644
index 00000000..b0071ef5
--- /dev/null
+++ b/src/app/features/tenants/models/tenant.model.ts
@@ -0,0 +1,68 @@
+import { DataTableRecord } from '../../../shared/components/data-table/data-table.types';
+
+export enum TenantStatus { Trial = 0, Active = 1, Suspended = 2, Cancelled = 3 }
+
+export interface TenantDto {
+    id: string;
+    code: string;
+    name: string;
+    status: TenantStatus;
+    defaultLanguageId: string;
+    defaultLanguageName: string | null;
+    defaultDbConnectionId: string | null;
+    defaultDbConnectionName: string | null;
+    defaultCurrencyId: string;
+    defaultCurrencyName: string | null;
+    defaultTimezoneId: string;
+    defaultTimezoneName: string | null;
+    dataRegion: string;
+    isActive: boolean;
+    createdOn?: string;
+    modifiedOn?: string | null;
+}
+
+export interface TenantLookupDto {
+    id: string;
+    name: string;
+    code: string;
+}
+
+export interface CreateTenantRequest {
+    code: string;
+    name: string;
+    status: TenantStatus;
+    defaultLanguageId: string;
+    defaultCurrencyId: string;
+    defaultTimezoneId: string;
+    dataRegion: string;
+}
+
+export interface UpdateTenantRequest {
+    code: string;
+    name: string;
+    status: TenantStatus;
+    defaultLanguageId: string;
+    defaultCurrencyId: string;
+    defaultTimezoneId: string;
+    defaultDbConnectionId: string | null;
+    dataRegion: string;
+    isActive: boolean;
+}
+
+
+export interface TenantTableRow extends DataTableRecord {
+  readonly id: string;
+  readonly code: string;
+  readonly name: string;
+  readonly status: TenantStatus;
+  readonly dataRegion: string;
+  readonly isActive: boolean;
+  readonly serialNumber: number;
+  readonly createdOn?: string;
+  readonly modifiedOn?: string | null;
+  readonly defaultLanguageName: string | null;
+  readonly defaultCurrencyName: string | null;
+  readonly defaultTimezoneName: string | null;
+}
+
+export type TenantModalMode = 'create' | 'edit';
diff --git a/src/app/features/tenants/pages/tenant-currencies/tenant-currencies.html b/src/app/features/tenants/pages/tenant-currencies/tenant-currencies.html
new file mode 100644
index 00000000..73d4a18c
--- /dev/null
+++ b/src/app/features/tenants/pages/tenant-currencies/tenant-currencies.html
@@ -0,0 +1,55 @@
+
+<div class="grid grid-cols-12 gap-6">
+  <div class="xl:col-span-12 col-span-12">
+    <app-filter-card title="Tenant Selection" bodyClass="p-4">
+        <div class="flex items-center justify-between flex-wrap gap-4">
+          <form [formGroup]="tenantCurrencyFilterForm" autocomplete="off" class="grid w-full grid-cols-12 gap-4">
+            <div class="col-span-12 md:col-span-6 lg:col-span-4 xl:col-span-3">
+              <app-autocomplete
+                formControlName="tenantId"
+                inputId="tenant-filter"
+                variant="floating"
+                label="Tenant"
+                placeholder="Search"
+                [searchFn]="searchTenants"
+                [displayWith]="displayTenant"
+                [valueWith]="tenantValue"
+                [selectedItem]="selectedTenantLookup()"
+                [minSearchLength]="1"
+                [debounceTime]="300"
+                [limit]="50"
+                [clearable]="true"
+                [hideValidation]="true"
+                wrapperClass="!mb-0 w-full"
+                (itemSelected)="onTenantLookupSelected($event)"
+              />
+            </div>
+          </form>
+        </div>
+    </app-filter-card>
+  </div>
+</div>
+<app-data-table
+  [columns]="columns()"
+  [rows]="tenantCurrencies()"
+  [actions]="actions()"
+  [totalRecords]="totalRecords()"
+  [pageIndex]="queryState.pageIndex()"
+  [pageSize]="queryState.pageSize()"
+  [pageSizeOptions]="[5, 10, 20, 50]"
+  tableTitle="Tenant Management"
+  buttonTitle="Add Tenant"
+  [showSearch]="true"
+  [showAddButton]="true"
+  searchPlaceholder="Search tenants..."
+  [searchDebounceTime]="300"
+  actionHeaderClass="!text-center"
+  actionCellClass="!text-center"
+  emptyMessage="No tenants found"
+  emptyDescription="There is currently no data to display."
+  (addClicked)="onAddTenantCurrency()"
+  (searchChanged)="onSearch($event)"
+  (pageChanged)="onPageChange($event)"
+  (sortChanged)="onSortChange($event)"
+  (actionClicked)="onActionClick($event)"
+/>
diff --git a/src/app/features/tenants/pages/tenant-currencies/tenant-currencies.scss b/src/app/features/tenants/pages/tenant-currencies/tenant-currencies.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/src/app/features/tenants/pages/tenant-currencies/tenant-currencies.ts b/src/app/features/tenants/pages/tenant-currencies/tenant-currencies.ts
new file mode 100644
index 00000000..632985a6
--- /dev/null
+++ b/src/app/features/tenants/pages/tenant-currencies/tenant-currencies.ts
@@ -0,0 +1,408 @@
+import { HttpErrorResponse } from '@angular/common/http';
+import { Component, DestroyRef, ElementRef, computed, inject, signal } from '@angular/core';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { FormBuilder, ReactiveFormsModule, Validators } from '@angular/forms';
+import { ToastrService } from 'ngx-toastr';
+import { Subject, catchError, finalize, map, of, switchMap } from 'rxjs';
+import { TenantCurrenciesService } from '../../data-access/tenant-currencies.service';
+import { LanguageLookupDto, LanguageService } from '../../../global-masters/languages/public-api';
+import { CurrencyLookupDto, CurrencyService } from '../../../global-masters/currencies/public-api';
+import { TimezoneService } from '../../../global-masters/timezones/public-api';
+import { DataTable } from '../../../../shared/components/data-table/data-table';
+import { DataTableAction, DataTableActionEvent, DataTableColumn, DataTablePageEvent, DataTableQuery, DataTableSortEvent } from '../../../../shared/components/data-table/data-table.types';
+import { DataTableQueryState } from '../../../../shared/components/data-table/data-table-query.state';
+
+import { CreateTenantCurrencyRequest, TenantCurrencyDto, TenantCurrencyModalMode, TenantCurrencyTableRow, UpdateTenantCurrencyRequest } from '../../models/tenant-currencies.model';
+import { AutocompleteDisplayFn, AutocompleteResolveValueFn, AutocompleteSearchFn, AutocompleteValueFn } from '../../../../shared/components/form/autocomplete/autocomplete.types';
+import { TenantLookupDto } from '../../models/tenant.model';
+import { TenantService } from '../../data-access/tenant.service';
+import { Autocomplete } from '../../../../shared/components/form/autocomplete/autocomplete';
+import { FormSelect } from '../../../../shared/components/form/form-select/form-select';
+import { FormInput } from '../../../../shared/components/form/form-input/form-input';
+import { Modal } from '../../../../shared/components/modal/modal';
+import { ConfirmDialog } from '../../../../shared/components/confirm-dialog/confirm-dialog';
+import { FilterCard } from '../../../../shared/components/filter-card/filter-card';
+
+@Component({
+  selector: 'tenant-currencies',
+  imports: [DataTable, Modal, ReactiveFormsModule, FormInput, FormSelect, Autocomplete, ConfirmDialog, FilterCard],
+  templateUrl: './tenant-currencies.html',
+  styleUrl: './tenant-currencies.scss',
+})
+export class TenantCurrencies {
+
+  private readonly destroyRef = inject(DestroyRef);
+  private readonly tenantCurrencyApi = inject(TenantCurrenciesService);
+  private readonly tenantApi = inject(TenantService);
+  private readonly languageApi = inject(LanguageService);
+  private readonly currencyApi = inject(CurrencyService);
+  private readonly timezoneApi = inject(TimezoneService);
+  private readonly formBuilder = inject(FormBuilder);
+  private readonly elementRef = inject<ElementRef<HTMLElement>>(ElementRef);
+  private readonly toastr = inject(ToastrService);
+  private readonly queryRequests$ = new Subject<{ tenantId: string; query: DataTableQuery; }>();
+
+  readonly queryState = new DataTableQueryState();
+  readonly tenantCurrencies = signal<TenantCurrencyTableRow[]>([]);
+  readonly totalRecords = signal(0);
+  readonly filteredRecords = signal(0);
+
+  readonly saving = signal(false);
+  readonly showTenantCurrencyModal = signal(false);
+  readonly tenantCurrencyModalMode = signal<TenantCurrencyModalMode>('create');
+  readonly selectedTenantId = signal<string | null>(null);
+  readonly selectedTenantLookup = signal<TenantLookupDto | null>(null);
+  readonly tenantSubmitAttempted = signal(false);
+
+
+
+  readonly tenantCurrencyForm = this.formBuilder.group({
+    tenantId: this.formBuilder.control<string | null>(null, [Validators.required]),
+    currencyId: this.formBuilder.control<string | null>(null, [Validators.required]),
+    isActive: this.formBuilder.control<number | null>(1, [Validators.required]),
+    isBaseCurrency: this.formBuilder.control<boolean>(false, [Validators.required]),
+    isReporting: this.formBuilder.control<boolean>(false, [Validators.required]),
+  });
+  readonly tenantCurrencyFilterForm = this.formBuilder.nonNullable.group({
+    tenantId: ['']
+  });
+
+  readonly searchTenants:
+    AutocompleteSearchFn<TenantLookupDto> =
+    (term, limit) =>
+      this.tenantApi.autocomplete(term, limit).pipe(
+        catchError(() => {
+          this.toastr.error(
+            'Unable to load tenants.'
+          );
+
+          return of<
+            readonly TenantLookupDto[]
+          >([]);
+        })
+      );
+
+  readonly displayTenant:
+    AutocompleteDisplayFn<TenantLookupDto> =
+    tenant =>
+      [tenant.code, tenant.name]
+        .filter(Boolean)
+        .join(' - ');
+
+  readonly tenantValue:
+    AutocompleteValueFn<
+      TenantLookupDto,
+      string
+    > =
+    tenant => tenant.id;
+
+  readonly resolveTenant:
+    AutocompleteResolveValueFn<
+      TenantLookupDto,
+      string
+    > =
+    tenantId =>
+      this.tenantApi
+        .getTenantById(tenantId)
+        .pipe(
+          map(tenant => ({
+            id: tenant.id,
+            code: tenant.code,
+            name: tenant.name
+          }))
+        );
+
+  readonly searchCurrencies: AutocompleteSearchFn<CurrencyLookupDto> = (term, limit) =>
+    this.currencyApi.autocomplete(term, limit).pipe(
+      catchError(() => {
+        this.toastr.error('Unable to load currencies.');
+        return of<readonly CurrencyLookupDto[]>([]);
+      })
+    );
+
+  readonly displayCurrency: AutocompleteDisplayFn<CurrencyLookupDto> = currency => [currency.code, currency.name, currency.symbol ? `(${currency.symbol})` : '']
+    .filter(Boolean)
+    .join(' ');
+
+  readonly currencyValue: AutocompleteValueFn<CurrencyLookupDto, string> = currency => currency.id;
+
+  readonly resolveCurrency: AutocompleteResolveValueFn<CurrencyLookupDto, string> = value =>
+    this.currencyApi.getCurrencyById(value).pipe(
+      map(currency => ({
+        id: currency.id,
+        code: currency.code,
+        name: currency.name,
+        symbol: currency.symbol
+      }))
+    );
+
+
+  readonly modalTitle = computed(() =>
+    this.tenantCurrencyModalMode() === 'create' ? 'Add Tenant' : 'Edit Tenant'
+  );
+
+  readonly submitLabel = computed(() =>
+    this.tenantCurrencyModalMode() === 'create' ? 'Save' : 'Update'
+  );
+
+  readonly loadingLabel = computed(() =>
+    this.tenantCurrencyModalMode() === 'create' ? 'Saving...' : 'Updating...'
+  );
+
+  readonly submitAction = computed<'save' | 'update'>(() =>
+    this.tenantCurrencyModalMode() === 'create' ? 'save' : 'update'
+  );
+
+  readonly columns = signal<DataTableColumn<TenantCurrencyTableRow>[]>([
+    { key: 'serialNumber', label: 'Sr. No.', header: 'Sr.No.', sortable: false, width: '100px' },
+    { key: 'code', label: 'Code', header: 'Code', sortable: true, align: 'left' },
+    { key: 'name', label: 'Tenant Name', header: 'Tenant Name', sortable: true, align: 'left' },
+    {
+      key: 'isBaseCurrency',
+      label: 'Base Currency',
+      header: 'Base Currency',
+      sortable: true,
+      badge: true,
+      formatter: value => value === true ? 'Yes' : 'No'
+    },
+    {
+      key: 'isReporting',
+      label: 'Reporting Currency',
+      header: 'Reporting Currency',
+      sortable: true,
+      badge: true,
+      formatter: value => value === true ? 'Yes' : 'No'
+    },
+    {
+      key: 'isActive',
+      label: 'Active',
+      header: 'Active',
+      sortable: true,
+      badge: true,
+      badgeClass: value => value === true
+        ? 'badge bg-success/10 text-success'
+        : 'badge bg-danger/10 text-danger',
+      formatter: value => value === true ? 'Active' : 'Inactive'
+    },
+    {
+      key: 'createdOn',
+      label: 'Created On',
+      header: 'Created On',
+      sortable: true,
+      formatter: value => this.formatDateTime(value)
+    }
+  ]);
+
+  readonly actions = signal<DataTableAction<TenantCurrencyTableRow>[]>([
+    {
+      type: 'edit',
+      label: 'Edit',
+      icon: 'ti ti-edit',
+      className: 'text-primary'
+    },
+    {
+      type: 'delete',
+      label: 'Delete',
+      icon: 'ti ti-trash',
+      className: 'text-danger',
+      visible: row => row.isActive
+    },
+    {
+      type: 'activate',
+      label: 'Activate',
+      icon: 'ti ti-check',
+      className: 'text-success',
+      visible: row => !row.isActive
+    }
+  ]);
+
+  private formatDateTime(value: unknown): string {
+    if (typeof value !== 'string' || value.trim().length === 0) {
+      return '';
+    }
+
+    const date = new Date(value);
+
+    if (Number.isNaN(date.getTime())) {
+      return value;
+    }
+
+    return date.toLocaleString();
+  }
+
+  constructor() {
+    this.queryRequests$
+      .pipe(
+        switchMap(({ tenantId, query }) =>
+          this.tenantCurrencyApi
+            .getTenantDataTable(this.buildTenantCurrencyQuery(query))
+            .pipe(
+              map(response => ({
+                response,
+                tenantId,
+                query
+              })),
+              catchError(() => {
+                this.toastr.error(
+                  'Unable to load tenant currencies.'
+                );
+
+                this.clearTenantCurrencyGrid();
+
+                return of(null);
+              })
+            )
+        ),
+        takeUntilDestroyed(this.destroyRef)
+      )
+      .subscribe(result => {
+        if (!result) {
+          return;
+        }
+
+        const {
+          response,
+          tenantId,
+          query
+        } = result;
+
+        if (this.selectedTenantId() !== tenantId) {
+          return;
+        }
+
+        if (response.draw !== query.draw) {
+          return;
+        }
+
+        const rows: TenantCurrencyTableRow[] =
+          response.rows.map(
+            (tenantCurrency, index) => ({
+              ...tenantCurrency,
+              serialNumber:
+                (query.page - 1) *
+                query.pageSize +
+                index +
+                1
+            })
+          );
+
+        this.tenantCurrencies.set(rows);
+        this.totalRecords.set(response.total);
+        this.filteredRecords.set(
+          response.filtered
+        );
+      });
+  }
+  ngOnInit(): void {
+    this.clearTenantCurrencyGrid();
+  }
+
+  loadTenantCurrencies(query: DataTableQuery): void {
+    const tenantId = this.selectedTenantId();
+
+    if (!tenantId) {
+      this.clearTenantCurrencyGrid();
+      return;
+    }
+
+    this.queryRequests$.next({
+      tenantId,
+      query
+    });
+  }
+
+  onSearch(value: string): void {
+    this.loadTenantCurrencies(this.queryState.setSearch(value.trim()));
+  }
+
+  onPageChange(event: DataTablePageEvent): void {
+    this.loadTenantCurrencies(this.queryState.setPage(event));
+  }
+
+  onSortChange(event: DataTableSortEvent): void {
+    this.loadTenantCurrencies(this.queryState.setSort(event));
+  }
+
+  onActionClick(event: DataTableActionEvent<TenantCurrencyTableRow>): void {
+    if (event.action.type === 'edit') {
+      this.openEditTenantCurrency(event.row.id);
+    }
+  }
+  private buildTenantCurrencyQuery(query: DataTableQuery): DataTableQuery {
+    return {
+      ...query,
+      sortBy: this.resolveSortField(query.sortBy ?? null)
+    };
+  }
+
+  private resolveSortField(sortBy: string | null | undefined): string | null {
+    if (!sortBy) {
+      return null;
+    }
+
+    switch (sortBy) {
+      case 'code':
+      case 'name':
+      case 'status':
+      case 'dataRegion':
+      case 'isActive':
+      case 'createdOn':
+        return sortBy;
+      default:
+        return null;
+    }
+  }
+
+  onTenantLookupSelected(tenant: TenantLookupDto | null): void {
+    this.selectedTenantLookup.set(tenant);
+
+    const tenantId = tenant?.id ?? null;
+
+    this.tenantCurrencyFilterForm.controls.tenantId
+      .setValue(tenantId ?? '');
+
+    this.onTenantSelected(tenantId);
+  }
+
+  onAddTenantCurrency(): void {
+    this.tenantCurrencyModalMode.set('create');
+
+    this.showTenantCurrencyModal.set(true);
+  }
+
+  closeTenantCurrencyModal(): void {
+    if (this.saving()) {
+      return;
+    }
+
+    this.showTenantCurrencyModal.set(false);
+  }
+
+  private openEditTenantCurrency(id: string): void {
+    this.tenantCurrencyModalMode.set('edit');
+
+  }
+
+  private onTenantSelected(tenantId: string | null): void {
+    this.selectedTenantId.set(tenantId);
+
+
+    this.clearTenantCurrencyGrid();
+
+    const query = this.queryState.reset();
+
+    if (!tenantId) {
+      return;
+    }
+
+    this.loadTenantCurrencies(query);
+  }
+
+
+  private clearTenantCurrencyGrid(): void {
+    this.tenantCurrencies.set([]);
+    this.totalRecords.set(0);
+    this.filteredRecords.set(0);
+  }
+
+}
diff --git a/src/app/features/tenants/pages/tenant-list/tenant-list.html b/src/app/features/tenants/pages/tenant-list/tenant-list.html
index 3e622b7f..1bcebce6 100644
--- a/src/app/features/tenants/pages/tenant-list/tenant-list.html
+++ b/src/app/features/tenants/pages/tenant-list/tenant-list.html
@@ -1,18 +1,192 @@
-
- <data-table
-  title="Tenant List"
+<app-data-table
+  [columns]="columns()"
+  [rows]="tenants()"
+  [actions]="actions()"
+  [totalRecords]="totalRecords()"
+  [pageIndex]="queryState.pageIndex()"
+  [pageSize]="queryState.pageSize()"
+  [pageSizeOptions]="[5, 10, 20, 50]"
+  tableTitle="Tenant Management"
+  buttonTitle="Add Tenant"
   [showSearch]="true"
-  [columns]="columns"
-  [rows]="tenants"
-  [actions]="tableActions"
-  [loading]="loading"
-  [totalRecords]="totalRecords"
-  [pageIndex]="pageIndex"
-  [pageSize]="pageSize"
+  [showAddButton]="true"
   searchPlaceholder="Search tenants..."
+  [searchDebounceTime]="300"
+  actionHeaderClass="!text-center"
+  actionCellClass="!text-center"
+  emptyMessage="No tenants found"
+  emptyDescription="There is currently no data to display."
+  (addClicked)="onAddTenant()"
   (searchChanged)="onSearch($event)"
   (pageChanged)="onPageChange($event)"
   (sortChanged)="onSortChange($event)"
-  (actionClicked)="onTableAction($event)"
-  (rowClicked)="onRowClick($event)"
+  (actionClicked)="onActionClick($event)"
 />
+
+<modal
+  [open]="showTenantModal()"
+  [title]="modalTitle()"
+  size="lg"
+  [submitAction]="submitAction()"
+  [submitLabel]="submitLabel()"
+  [loadingLabel]="loadingLabel()"
+  [loading]="saving()"
+  (closed)="closeTenantModal()"
+  (submitted)="saveTenant()"
+>
+  <form [formGroup]="tenantForm" (ngSubmit)="saveTenant()" autocomplete="off">
+    <div class="grid grid-cols-12 gap-x-5 gap-y-5">
+      <div class="col-span-12 md:col-span-6">
+        <app-form-input
+          formControlName="code"
+          inputId="tenant-code"
+          variant="floating"
+          label="Tenant Code"
+          placeholder="Code"
+          autocomplete="off"
+          [required]="true"
+          [maxLength]="50"
+          [validationMessages]="{
+            required: 'Tenant Code is required.',
+            maxlength: 'Tenant Code cannot exceed 50 characters.'
+          }"
+          [submitAttempted]="tenantSubmitAttempted()"
+        />
+      </div>
+
+      <div class="col-span-12 md:col-span-6">
+        <app-form-input
+          formControlName="name"
+          inputId="tenant-name"
+          variant="floating"
+          label="Tenant Name"
+          placeholder="Name"
+          autocomplete="off"
+          [required]="true"
+          [maxLength]="150"
+          [validationMessages]="{
+            required: 'Tenant Name is required.',
+            maxlength: 'Tenant Name cannot exceed 150 characters.'
+          }"
+          [submitAttempted]="tenantSubmitAttempted()"
+        />
+      </div>
+
+      <div class="col-span-12 md:col-span-6">
+        <app-form-select
+          formControlName="status"
+          inputId="tenant-status"
+          variant="floating"
+          label="Tenant Status"
+          placeholder="Select"
+          [options]="tenantStatusOptions()"
+          [required]="true"
+          [clearable]="false"
+          [searchable]="false"
+          [submitAttempted]="tenantSubmitAttempted()"
+          [validationMessages]="{
+            required: 'Tenant Status is required.'
+          }"
+        />
+      </div>
+
+
+      <div class="col-span-12 md:col-span-6">
+        <app-autocomplete
+          formControlName="defaultLanguageId"
+          inputId="tenant-default-language-id"
+          variant="floating"
+          label="Default Language"
+          placeholder="Search"
+          [searchFn]="searchLanguages"
+          [displayWith]="displayLanguage"
+          [valueWith]="languageValue"
+          [resolveValueFn]="resolveLanguage"
+          [minSearchLength]="1"
+          [debounceTime]="300"
+          [limit]="10"
+          [clearable]="true"
+          emptyText="No languages found"
+          typeToSearchText="Type to search languages"
+          [required]="true"
+          [submitAttempted]="tenantSubmitAttempted()"
+          wrapperClass="w-full"
+          [validationMessages]="{
+            required: 'Default Language is required.'
+          }"
+        />
+      </div>
+
+      <div class="col-span-12 md:col-span-6">
+        <app-autocomplete
+          formControlName="defaultCurrencyId"
+          inputId="tenant-default-currency-id"
+          variant="floating"
+          label="Default Currency"
+          placeholder="Search"
+          [searchFn]="searchCurrencies"
+          [displayWith]="displayCurrency"
+          [valueWith]="currencyValue"
+          [resolveValueFn]="resolveCurrency"
+          [minSearchLength]="1"
+          [debounceTime]="300"
+          [limit]="10"
+          [clearable]="true"
+          emptyText="No currencies found"
+          typeToSearchText="Type to search currencies"
+          [required]="true"
+          [submitAttempted]="tenantSubmitAttempted()"
+          wrapperClass="w-full"
+          [validationMessages]="{
+            required: 'Default Currency is required.'
+          }"
+        />
+      </div>
+
+      <div class="col-span-12 md:col-span-6">
+        <app-autocomplete
+          formControlName="defaultTimezoneId"
+          inputId="tenant-default-timezone-id"
+          variant="floating"
+          label="Default Timezone"
+          placeholder="Search"
+          [searchFn]="searchTimezones"
+          [displayWith]="displayTimezone"
+          [valueWith]="timezoneValue"
+          [resolveValueFn]="resolveTimezone"
+          [minSearchLength]="1"
+          [debounceTime]="300"
+          [limit]="10"
+          [clearable]="true"
+          emptyText="No timezones found"
+          typeToSearchText="Type to search timezones"
+          [required]="true"
+          [submitAttempted]="tenantSubmitAttempted()"
+          wrapperClass="w-full"
+          [validationMessages]="{
+            required: 'Default Timezone is required.'
+          }"
+        />
+      </div>
+
+      <div class="col-span-12 md:col-span-6">
+        <app-form-input
+          formControlName="dataRegion"
+          inputId="tenant-data-region"
+          variant="floating"
+          label="Data Region"
+          placeholder="Region"
+          help="e.g.: IN"
+          autocomplete="off"
+          [required]="true"
+          [maxLength]="100"
+          [validationMessages]="{
+            required: 'Data Region is required.',
+            maxlength: 'Data Region cannot exceed 100 characters.'
+          }"
+          [submitAttempted]="tenantSubmitAttempted()"
+        />
+      </div>
+    </div>
+  </form>
+</modal>
diff --git a/src/app/features/tenants/pages/tenant-list/tenant-list.scss b/src/app/features/tenants/pages/tenant-list/tenant-list.scss
index e69de29b..a0638cc7 100644
--- a/src/app/features/tenants/pages/tenant-list/tenant-list.scss
+++ b/src/app/features/tenants/pages/tenant-list/tenant-list.scss
@@ -0,0 +1 @@
+/* Intentionally empty: tenant screen reuses the shared Ynex layout classes. */
diff --git a/src/app/features/tenants/pages/tenant-list/tenant-list.ts b/src/app/features/tenants/pages/tenant-list/tenant-list.ts
index 231ef738..dd39dfca 100644
--- a/src/app/features/tenants/pages/tenant-list/tenant-list.ts
+++ b/src/app/features/tenants/pages/tenant-list/tenant-list.ts
@@ -1,89 +1,576 @@
-import { Component } from '@angular/core';
-import { CommonModule } from '@angular/common';
+import { HttpErrorResponse } from '@angular/common/http';
+import { Component, DestroyRef, ElementRef, computed, inject, signal } from '@angular/core';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { FormBuilder, ReactiveFormsModule, Validators } from '@angular/forms';
+import { ToastrService } from 'ngx-toastr';
+import { Subject, catchError, finalize, map, of, switchMap } from 'rxjs';
+
+import { CreateTenantRequest, TenantDto, TenantModalMode, TenantStatus, TenantTableRow, UpdateTenantRequest } from '../../models/tenant.model';
+import { CurrencyLookupDto, CurrencyService } from '../../../global-masters/currencies/public-api';
+import { LanguageLookupDto, LanguageService } from '../../../global-masters/languages/public-api';
+import { TimezoneLookupDto, TimezoneService } from '../../../global-masters/timezones/public-api';
+import { TenantService } from '../../data-access/tenant.service';
 import { DataTable } from '../../../../shared/components/data-table/data-table';
-import { DataTableColumn, DataTableAction } from '../../../../shared/components/data-table/data-table.types';
+import { DataTableQueryState } from '../../../../shared/components/data-table/data-table-query.state';
+import { DataTableAction, DataTableActionEvent, DataTableColumn, DataTablePageEvent, DataTableQuery, DataTableRecord, DataTableSortEvent } from '../../../../shared/components/data-table/data-table.types';
+import { Autocomplete } from '../../../../shared/components/form/autocomplete/autocomplete';
+import { AutocompleteDisplayFn, AutocompleteResolveValueFn, AutocompleteSearchFn, AutocompleteValueFn } from '../../../../shared/components/form/autocomplete/autocomplete.types';
+import { FormInput } from '../../../../shared/components/form/form-input/form-input';
+import { FormSelect } from '../../../../shared/components/form/form-select/form-select';
+import { FormSelectOption } from '../../../../shared/components/form/models/form-select.models';
+import { Modal } from '../../../../shared/components/modal/modal';
+
+
 
 @Component({
-  selector: 'app-tenant-list',
-  standalone: true,
-  imports: [CommonModule, DataTable],
-  templateUrl: './tenant-list.html',
-  styleUrl: './tenant-list.scss',
+    selector: 'tenant-list',
+    standalone: true,
+    imports: [DataTable, Modal, ReactiveFormsModule, FormInput, FormSelect, Autocomplete],
+    templateUrl: './tenant-list.html',
+    styleUrl: './tenant-list.scss'
 })
 export class TenantList {
+    private readonly destroyRef = inject(DestroyRef);
+    private readonly tenantApi = inject(TenantService);
+    private readonly languageApi = inject(LanguageService);
+    private readonly currencyApi = inject(CurrencyService);
+    private readonly timezoneApi = inject(TimezoneService);
+    private readonly formBuilder = inject(FormBuilder);
+    private readonly elementRef = inject<ElementRef<HTMLElement>>(ElementRef);
+    private readonly toastr = inject(ToastrService);
+    private readonly queryRequests$ = new Subject<DataTableQuery>();
 
-  loading = false;
-  pageIndex = 1;
-  pageSize = 10;
-  totalRecords = 3;
+    readonly queryState = new DataTableQueryState();
+    readonly tenants = signal<TenantTableRow[]>([]);
+    readonly totalRecords = signal(0);
+    readonly filteredRecords = signal(0);
+    readonly saving = signal(false);
+    readonly showTenantModal = signal(false);
+    readonly tenantModalMode = signal<TenantModalMode>('create');
+    readonly selectedTenantId = signal<string | null>(null);
+    readonly selectedTenant = signal<TenantDto | null>(null);
+    readonly tenantSubmitAttempted = signal(false);
 
-  columns: DataTableColumn[] = [
-    { key: 'id', label: 'Id', sortable: true, headerClass: 'text-center', cellClass: 'text-center' },
-    { key: 'tenantName', label: 'Tenant Name', sortable: true },
-    { key: 'companyCode', label: 'Company Code', sortable: true },
-    { key: 'email', label: 'Email' },
-    { key: 'country', label: 'Country', sortable: true },
-    { key: 'status', label: 'Status', sortable: true, cellClass: 'text-center' }
-  ];
+    readonly tenantForm = this.formBuilder.group({
+        code: this.formBuilder.nonNullable.control('', [Validators.required, Validators.maxLength(50)]),
+        name: this.formBuilder.nonNullable.control('', [Validators.required, Validators.maxLength(150)]),
+        status: this.formBuilder.control<TenantStatus | null>(TenantStatus.Trial, [Validators.required]),
+        defaultLanguageId: this.formBuilder.control<string | null>(null, [Validators.required]),
+        defaultCurrencyId: this.formBuilder.control<string | null>(null, [Validators.required]),
+        defaultTimezoneId: this.formBuilder.control<string | null>(null, [Validators.required]),
+        dataRegion: this.formBuilder.nonNullable.control('', [Validators.required, Validators.maxLength(100)]),
+        isActive: this.formBuilder.control<number | null>(1, [Validators.required])
+    });
 
-  tenants = [
-    {
-      id: 1,
-      tenantName: 'Syscom Corporation',
-      companyCode: 'SYSCOM',
-      email: 'admin@syscom.com',
-      country: 'UAE',
-      status: 'Active'
-    },
-    {
-      id: 2,
-      tenantName: 'Biz360 Demo',
-      companyCode: 'BIZ360',
-      email: 'demo@biz360.com',
-      country: 'India',
-      status: 'Active'
-    },
-    {
-      id: 3,
-      tenantName: 'Test Tenant',
-      companyCode: 'TEST',
-      email: 'test@test.com',
-      country: 'India',
-      status: 'Inactive'
+    readonly tenantStatusOptions = signal<FormSelectOption<TenantStatus>[]>([
+        { value: TenantStatus.Trial, label: 'Trial' },
+        { value: TenantStatus.Active, label: 'Active' },
+        { value: TenantStatus.Suspended, label: 'Suspended' },
+        { value: TenantStatus.Cancelled, label: 'Cancelled' }
+    ]);
+
+    readonly activeStatusOptions = signal<FormSelectOption<number>[]>([
+        { value: 1, label: 'Active' },
+        { value: 0, label: 'Inactive' }
+    ]);
+
+    readonly searchLanguages: AutocompleteSearchFn<LanguageLookupDto> = (term, limit) =>
+        this.languageApi.autocomplete(term, limit).pipe(
+            catchError(() => {
+                this.toastr.error('Unable to load languages.');
+                return of<readonly LanguageLookupDto[]>([]);
+            })
+        );
+
+    readonly searchCurrencies: AutocompleteSearchFn<CurrencyLookupDto> = (term, limit) =>
+        this.currencyApi.autocomplete(term, limit).pipe(
+            catchError(() => {
+                this.toastr.error('Unable to load currencies.');
+                return of<readonly CurrencyLookupDto[]>([]);
+            })
+        );
+
+    readonly searchTimezones: AutocompleteSearchFn<TimezoneLookupDto> = (term, limit) =>
+        this.timezoneApi.autocomplete(term, limit).pipe(
+            catchError(() => {
+                this.toastr.error('Unable to load timezones.');
+                return of<readonly TimezoneLookupDto[]>([]);
+            })
+        );
+
+    readonly displayLanguage: AutocompleteDisplayFn<LanguageLookupDto> = language => [language.code, language.name].filter(Boolean).join(' - ');
+
+    readonly languageValue: AutocompleteValueFn<LanguageLookupDto, string> = language => language.id;
+
+    readonly resolveLanguage: AutocompleteResolveValueFn<LanguageLookupDto, string> = value =>
+        this.languageApi.getById(value).pipe(
+            map(language => ({
+                id: language.id,
+                code: language.code,
+                name: language.name,
+                nativeName: language.nativeName,
+                isRightToLeft: language.isRightToLeft
+            }))
+        );
+
+    readonly displayCurrency: AutocompleteDisplayFn<CurrencyLookupDto> = currency => [currency.code, currency.name, currency.symbol ? `(${currency.symbol})` : '']
+        .filter(Boolean)
+        .join(' ');
+
+    readonly currencyValue: AutocompleteValueFn<CurrencyLookupDto, string> = currency => currency.id;
+
+    readonly resolveCurrency: AutocompleteResolveValueFn<CurrencyLookupDto, string> = value =>
+        this.currencyApi.getCurrencyById(value).pipe(
+            map(currency => ({
+                id: currency.id,
+                code: currency.code,
+                name: currency.name,
+                symbol: currency.symbol
+            }))
+        );
+
+    readonly displayTimezone: AutocompleteDisplayFn<TimezoneLookupDto> = timezone => [timezone.ianaId, timezone.displayName].filter(Boolean).join(' — ');
+
+    readonly timezoneValue: AutocompleteValueFn<TimezoneLookupDto, string> = timezone => timezone.id;
+
+    readonly resolveTimezone: AutocompleteResolveValueFn<TimezoneLookupDto, string> = value =>
+        this.timezoneApi.getById(value).pipe(
+            map(timezone => ({
+                id: timezone.id,
+                ianaId: timezone.ianaId,
+                displayName: timezone.displayName
+            }))
+        );
+
+    readonly modalTitle = computed(() =>
+        this.tenantModalMode() === 'create' ? 'Add Tenant' : 'Edit Tenant'
+    );
+
+    readonly submitLabel = computed(() =>
+        this.tenantModalMode() === 'create' ? 'Save' : 'Update'
+    );
+
+    readonly loadingLabel = computed(() =>
+        this.tenantModalMode() === 'create' ? 'Saving...' : 'Updating...'
+    );
+
+    readonly submitAction = computed<'save' | 'update'>(() =>
+        this.tenantModalMode() === 'create' ? 'save' : 'update'
+    );
+
+    readonly columns = signal<DataTableColumn<TenantTableRow>[]>([
+        { key: 'serialNumber', label: 'Sr. No.', header: 'Sr.No.', sortable: false, width: '100px' },
+        { key: 'code', label: 'Code', header: 'Code', sortable: true, align: 'left' },
+        { key: 'name', label: 'Tenant Name', header: 'Tenant Name', sortable: true, align: 'left' },
+        {
+            key: 'status',
+            label: 'Status',
+            header: 'Status',
+            sortable: true,
+            badge: true,
+            badgeClass: value => this.getTenantStatusBadgeClass(value as TenantStatus),
+            formatter: value => this.formatTenantStatus(value as TenantStatus)
+        },
+        { key: 'dataRegion', label: 'Data Region', header: 'Data Region', sortable: true, align: 'left' },
+        {
+            key: 'isActive',
+            label: 'Active',
+            header: 'Active',
+            sortable: true,
+            badge: true,
+            badgeClass: value => value === true
+                ? 'badge bg-success/10 text-success'
+                : 'badge bg-danger/10 text-danger',
+            formatter: value => value === true ? 'Active' : 'Inactive'
+        },
+        {
+            key: 'createdOn',
+            label: 'Created On',
+            header: 'Created On',
+            sortable: true,
+            formatter: value => this.formatDateTime(value)
+        }
+    ]);
+
+    readonly actions = signal<DataTableAction<TenantTableRow>[]>([
+        {
+            type: 'edit',
+            label: 'Edit',
+            icon: 'ti ti-edit',
+            className: 'text-primary'
+        },
+        {
+            type: 'delete',
+            label: 'Delete',
+            icon: 'ti ti-trash',
+            className: 'text-danger',
+            visible: row => row.isActive
+        },
+        {
+            type: 'activate',
+            label: 'Activate',
+            icon: 'ti ti-check',
+            className: 'text-success',
+            visible: row => !row.isActive
+        }
+    ]);
+
+    constructor() {
+        this.queryRequests$
+            .pipe(
+                switchMap(query =>
+                    this.tenantApi.getTenantDataTable(this.buildTenantQuery(query)).pipe(
+                        catchError(() => {
+                            this.toastr.error('Unable to load tenants.');
+                            this.clearTenantGrid();
+                            return of(null);
+                        })
+                    )
+                ),
+                takeUntilDestroyed(this.destroyRef)
+            )
+            .subscribe(response => {
+                if (!response) {
+                    return;
+                }
+
+                const query = this.queryState.getQuery();
+
+                if (response.draw !== query.draw) {
+                    return;
+                }
+
+                const tenantsWithSerialNumbers: TenantTableRow[] = response.rows.map((tenant, index) => ({
+                    ...tenant,
+                    serialNumber: (query.page - 1) * query.pageSize + index + 1
+                }));
+
+                this.tenants.set(tenantsWithSerialNumbers);
+                this.totalRecords.set(response.total);
+                this.filteredRecords.set(response.filtered);
+            });
     }
-  ];
 
-  tableActions: DataTableAction[] = [
-    { type: 'view', label: 'View', icon: 'ri-eye-line', className: 'btn-light' },
-    { type: 'edit', label: 'Edit', icon: 'ri-edit-line', className: 'btn-primary' },
-    {
-      type: 'delete',
-      label: 'Delete',
-      icon: 'ri-delete-bin-line',
-      className: 'btn-danger',
-      visible: row => row.status !== 'Active'
+    ngOnInit(): void {
+        this.loadTenants(this.queryState.getQuery());
     }
-  ];
 
-  onSearch(searchText: string): void {
-    console.log('Search:', searchText);
-  }
+    loadTenants(query: DataTableQuery): void {
+        this.queryRequests$.next(query);
+    }
 
-  onPageChange(event: any): void {
-    this.pageIndex = event.pageIndex;
-    this.pageSize = event.pageSize;
-    console.log('Page:', event);
-  }
+    onSearch(value: string): void {
+        this.loadTenants(this.queryState.setSearch(value.trim()));
+    }
 
-  onSortChange(event: any): void {
-    console.log('Sort:', event);
-  }
+    onPageChange(event: DataTablePageEvent): void {
+        this.loadTenants(this.queryState.setPage(event));
+    }
 
-  onTableAction(event: any): void {
-    console.log('Action:', event.action.type, event.row);
-  }
+    onSortChange(event: DataTableSortEvent): void {
+        this.loadTenants(this.queryState.setSort(event));
+    }
 
-  onRowClick(row: any): void {
-    console.log('Row clicked:', row);
-  }
+    onActionClick(event: DataTableActionEvent<TenantTableRow>): void {
+        if (event.action.type === 'edit') {
+            this.openEditTenant(event.row.id);
+        }
+    }
+
+    onAddTenant(): void {
+        this.tenantModalMode.set('create');
+        this.selectedTenantId.set(null);
+        this.selectedTenant.set(null);
+        this.tenantSubmitAttempted.set(false);
+        this.resetTenantForm({
+            code: '',
+            name: '',
+            status: TenantStatus.Trial,
+            defaultLanguageId: null,
+            defaultCurrencyId: null,
+            defaultTimezoneId: null,
+            dataRegion: '',
+            isActive: 1
+        });
+        this.showTenantModal.set(true);
+    }
+
+    closeTenantModal(): void {
+        if (this.saving()) {
+            return;
+        }
+
+        this.showTenantModal.set(false);
+        this.selectedTenantId.set(null);
+        this.selectedTenant.set(null);
+        this.tenantSubmitAttempted.set(false);
+        this.resetTenantForm({
+            code: '',
+            name: '',
+            status: TenantStatus.Trial,
+            defaultLanguageId: null,
+            defaultCurrencyId: null,
+            defaultTimezoneId: null,
+            dataRegion: '',
+            isActive: 1
+        });
+    }
+
+    saveTenant(): void {
+        if (this.tenantForm.invalid) {
+            this.tenantSubmitAttempted.set(true);
+            this.tenantForm.markAllAsTouched();
+            this.focusFirstInvalidControl();
+            return;
+        }
+
+        if (this.saving()) {
+            return;
+        }
+
+        this.saving.set(true);
+
+        if (this.tenantModalMode() === 'create') {
+            this.tenantApi
+                .createTenant(this.buildCreateTenantRequest())
+                .pipe(
+                    finalize(() => this.saving.set(false)),
+                    takeUntilDestroyed(this.destroyRef)
+                )
+                .subscribe({
+                    next: () => {
+                        this.toastr.success('Tenant saved successfully.');
+                        this.finishTenantSave();
+                    },
+                    error: (error: HttpErrorResponse) => this.handleSaveError(error)
+                });
+
+            return;
+        }
+
+        const tenantId = this.selectedTenantId();
+
+        if (!tenantId) {
+            this.saving.set(false);
+            return;
+        }
+
+        this.tenantApi
+            .updateTenant(tenantId, this.buildUpdateTenantRequest())
+            .pipe(
+                finalize(() => this.saving.set(false)),
+                takeUntilDestroyed(this.destroyRef)
+            )
+            .subscribe({
+                next: () => {
+                    this.toastr.success('Tenant updated successfully.');
+                    this.finishTenantSave();
+                },
+                error: (error: HttpErrorResponse) => this.handleSaveError(error)
+            });
+    }
+
+    openEditTenant(id: string): void {
+        this.tenantModalMode.set('edit');
+        this.selectedTenantId.set(id);
+        this.selectedTenant.set(null);
+        this.tenantSubmitAttempted.set(false);
+        this.resetTenantForm({
+            code: '',
+            name: '',
+            status: TenantStatus.Trial,
+            defaultLanguageId: null,
+            defaultCurrencyId: null,
+            defaultTimezoneId: null,
+            dataRegion: '',
+            isActive: 1
+        });
+
+        this.tenantApi
+            .getTenantById(id)
+            .pipe(takeUntilDestroyed(this.destroyRef))
+            .subscribe({
+                next: tenant => {
+                    if (this.selectedTenantId() !== tenant.id) {
+                        return;
+                    }
+
+                    this.selectedTenant.set(tenant);
+                    this.resetTenantForm({
+                        code: tenant.code ?? '',
+                        name: tenant.name ?? '',
+                        status: tenant.status ?? TenantStatus.Trial,
+                        defaultLanguageId: tenant.defaultLanguageId ?? null,
+                        defaultCurrencyId: tenant.defaultCurrencyId ?? null,
+                        defaultTimezoneId: tenant.defaultTimezoneId ?? null,
+                        dataRegion: tenant.dataRegion ?? '',
+                        isActive: tenant.isActive ? 1 : 0
+                    });
+                    this.showTenantModal.set(true);
+                },
+                error: (error: HttpErrorResponse) => {
+                    if (error.status === 404) {
+                        this.toastr.error('The tenant is no longer available.');
+                    }
+
+                    this.selectedTenantId.set(null);
+                }
+            });
+    }
+
+    private buildTenantQuery(query: DataTableQuery): DataTableQuery {
+        return {
+            ...query,
+            sortBy: this.resolveSortField(query.sortBy ?? null)
+        };
+    }
+
+    private resolveSortField(sortBy: string | null | undefined): string | null {
+        if (!sortBy) {
+            return null;
+        }
+
+        switch (sortBy) {
+            case 'code':
+            case 'name':
+            case 'status':
+            case 'dataRegion':
+            case 'isActive':
+            case 'createdOn':
+                return sortBy;
+            default:
+                return null;
+        }
+    }
+
+    private buildCreateTenantRequest(): CreateTenantRequest {
+        const value = this.tenantForm.getRawValue();
+
+        return {
+            code: value.code.trim(),
+            name: value.name.trim(),
+            status: value.status ?? TenantStatus.Trial,
+            defaultLanguageId: value.defaultLanguageId ?? '',
+            defaultCurrencyId: value.defaultCurrencyId ?? '',
+            defaultTimezoneId: value.defaultTimezoneId ?? '',
+            dataRegion: value.dataRegion.trim()
+        };
+    }
+
+    private buildUpdateTenantRequest(): UpdateTenantRequest {
+        const value = this.tenantForm.getRawValue();
+
+        return {
+            code: value.code.trim(),
+            name: value.name.trim(),
+            status: value.status ?? TenantStatus.Trial,
+            defaultLanguageId: value.defaultLanguageId ?? '',
+            defaultCurrencyId: value.defaultCurrencyId ?? '',
+            defaultTimezoneId: value.defaultTimezoneId ?? '',
+            defaultDbConnectionId: this.selectedTenant()?.defaultDbConnectionId ?? null,
+            dataRegion: value.dataRegion.trim(),
+            isActive: value.isActive === 1
+        };
+    }
+
+    private finishTenantSave(): void {
+        this.showTenantModal.set(false);
+        this.selectedTenantId.set(null);
+        this.selectedTenant.set(null);
+        this.tenantSubmitAttempted.set(false);
+        this.resetTenantForm({
+            code: '',
+            name: '',
+            status: TenantStatus.Trial,
+            defaultLanguageId: null,
+            defaultCurrencyId: null,
+            defaultTimezoneId: null,
+            dataRegion: '',
+            isActive: 1
+        });
+        this.loadTenants(this.queryState.getQuery());
+    }
+
+    private resetTenantForm(value: {
+        code: string;
+        name: string;
+        status: TenantStatus;
+        defaultLanguageId: string | null;
+        defaultCurrencyId: string | null;
+        defaultTimezoneId: string | null;
+        dataRegion: string;
+        isActive: number | null;
+    }): void {
+        this.tenantForm.reset(value);
+        this.tenantForm.markAsPristine();
+        this.tenantForm.markAsUntouched();
+        this.tenantForm.updateValueAndValidity();
+    }
+
+    private formatTenantStatus(status: TenantStatus): string {
+        switch (status) {
+            case TenantStatus.Trial:
+                return 'Trial';
+            case TenantStatus.Active:
+                return 'Active';
+            case TenantStatus.Suspended:
+                return 'Suspended';
+            case TenantStatus.Cancelled:
+                return 'Cancelled';
+            default:
+                return 'Unknown';
+        }
+    }
+
+    private getTenantStatusBadgeClass(status: TenantStatus): string {
+        switch (status) {
+            case TenantStatus.Trial:
+                return 'badge bg-warning/10 text-warning';
+            case TenantStatus.Active:
+                return 'badge bg-success/10 text-success';
+            case TenantStatus.Suspended:
+                return 'badge bg-info/10 text-info';
+            case TenantStatus.Cancelled:
+                return 'badge bg-danger/10 text-danger';
+            default:
+                return 'badge bg-secondary/10 text-secondary';
+        }
+    }
+
+    private formatDateTime(value: unknown): string {
+        if (typeof value !== 'string' || value.trim().length === 0) {
+            return '';
+        }
+
+        const date = new Date(value);
+
+        if (Number.isNaN(date.getTime())) {
+            return value;
+        }
+
+        return date.toLocaleString();
+    }
+
+    private handleSaveError(error: HttpErrorResponse): void {
+        if (error.status === 409) {
+            this.toastr.error('A tenant with this code already exists.', 'Duplicate tenant code');
+        }
+    }
+
+    private focusFirstInvalidControl(): void {
+        queueMicrotask(() => {
+            const control = this.elementRef.nativeElement.querySelector<HTMLElement>(
+                'modal [data-form-control][aria-invalid="true"]'
+            );
+
+            control?.focus();
+            control?.scrollIntoView({ behavior: 'smooth', block: 'center' });
+        });
+    }
+
+    private clearTenantGrid(): void {
+        this.tenants.set([]);
+        this.totalRecords.set(0);
+        this.filteredRecords.set(0);
+    }
 }
diff --git a/src/app/features/tenants/tenants.routes.ts b/src/app/features/tenants/tenants.routes.ts
index f40eb275..17d06206 100644
--- a/src/app/features/tenants/tenants.routes.ts
+++ b/src/app/features/tenants/tenants.routes.ts
@@ -4,6 +4,11 @@ export const tenantsRoutes: Routes = [
   {
     path: '',
     loadComponent: () => import('./pages/tenant-list/tenant-list').then((m) => m.TenantList),
-    data: { childTitle: 'Tenants', parentTitle: 'Platform', subParentTitle: 'Multi-tenancy' },
+    data: { childTitle: 'Tenant Management', parentTitle: 'Platform', subParentTitle: 'Configuration' },
   },
-];
+  {
+    path: 'tenant-currencies',
+    loadComponent: () => import('./pages/tenant-currencies/tenant-currencies').then((m) => m.TenantCurrencies),
+    data: { childTitle: 'Tenant Currencies', parentTitle: 'Platform', subParentTitle: 'Configuration' },
+  },
+];
\ No newline at end of file
diff --git a/src/app/features/users/data-access/user.endpoints.ts b/src/app/features/users/data-access/user.endpoints.ts
new file mode 100644
index 00000000..55e1e272
--- /dev/null
+++ b/src/app/features/users/data-access/user.endpoints.ts
@@ -0,0 +1,10 @@
+import { buildApiUrl } from '../../../core/config/api-url.util';
+
+
+export const USER_ENDPOINTS = {
+    dataTable: buildApiUrl('identity', '/v1/users/datatable'),
+    create: buildApiUrl('identity', '/v1/users'),
+    getById: (id: string) => buildApiUrl('identity', `/v1/users/${encodeURIComponent(id)}`),
+    update: (id: string) => buildApiUrl('identity', `/v1/users/${encodeURIComponent(id)}`),
+    autocomplete: buildApiUrl('identity', '/v1/users/autocomplete')
+} as const;
diff --git a/src/app/features/users/data-access/user.service.ts b/src/app/features/users/data-access/user.service.ts
new file mode 100644
index 00000000..e6d07117
--- /dev/null
+++ b/src/app/features/users/data-access/user.service.ts
@@ -0,0 +1,40 @@
+import { inject, Injectable } from '@angular/core';
+import { HttpClient, HttpParams } from '@angular/common/http';
+import { Observable } from 'rxjs';
+
+import { CreateUserRequest, UpdateUserRequest, UserDto, UserLookupDto } from '../models/user.model';
+import { USER_ENDPOINTS } from './user.endpoints';
+import { DataTableQuery, DataTableResult } from '../../../shared/components/data-table/data-table.types';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class UserService {
+  private readonly http = inject(HttpClient);
+
+  createUser(request: CreateUserRequest): Observable<UserDto> {
+    return this.http.post<UserDto>(USER_ENDPOINTS.create, request);
+  }
+
+  getById(id: string): Observable<UserDto> {
+    return this.http.get<UserDto>(USER_ENDPOINTS.getById(id));
+  }
+
+   getDataTable(query: DataTableQuery): Observable<DataTableResult<UserDto>> {
+    return this.http.post<DataTableResult<UserDto>>(USER_ENDPOINTS.dataTable, query);
+  }
+
+  update(id: string, request: UpdateUserRequest): Observable<UserDto> {
+    return this.http.put<UserDto>(USER_ENDPOINTS.update(id), request);
+  }
+
+  autocomplete(term: string | null, limit = 10): Observable<readonly UserLookupDto[]> {
+    const normalizedTerm = term?.trim() || null;
+    let params = new HttpParams().set('limit', limit);
+    if (normalizedTerm !== null) {
+      params = params.set('term', normalizedTerm);
+    }
+    return this.http.get<readonly UserLookupDto[]>(USER_ENDPOINTS.autocomplete, { params });
+  }
+
+}
diff --git a/src/app/features/users/models/user.model.ts b/src/app/features/users/models/user.model.ts
new file mode 100644
index 00000000..b1d5a240
--- /dev/null
+++ b/src/app/features/users/models/user.model.ts
@@ -0,0 +1,29 @@
+export enum UserStatus { Pending = 0, Active = 1, Suspended = 2, Locked = 3, Disabled = 4 }
+
+export interface CreateUserRequest {
+  email: string;
+  password: string;
+  roleCodes: string[];
+}
+
+export interface UserDto {
+  id: string;
+  email: string;
+  status: UserStatus;
+  roles: string[];
+  isActive: boolean;
+  createdOn: string;
+  updatedOn?: string | null;
+  lastLoginOn: string | null;
+}
+
+export interface UserLookupDto {
+  readonly id: string;
+  readonly ianaId: string;
+  readonly displayName: string;
+}
+export interface UpdateUserRequest extends CreateUserRequest {
+  readonly isActive: boolean;
+}
+
+export type UserModalMode = 'create' | 'edit';
diff --git a/src/app/features/users/pages/users-list/users-list.html b/src/app/features/users/pages/users-list/users-list.html
index cd3dfc73..e373e763 100644
--- a/src/app/features/users/pages/users-list/users-list.html
+++ b/src/app/features/users/pages/users-list/users-list.html
@@ -1,4 +1,19 @@
-<div class="rounded-2xl border border-gray-200 bg-white p-6 shadow-sm dark:border-white/10 dark:bg-bodybg">
-  <h3 class="text-lg font-semibold text-gray-900 dark:text-white">Platform users</h3>
-  <p class="mt-2 text-sm text-gray-500 dark:text-gray-400">Users, roles, assignment, deactivation, and password reset will be implemented here.</p>
-</div>
+<app-data-table [columns]="columns()" [rows]="users()" [actions]="actions()"
+  (addClicked)="onAddUser()" [totalRecords]="totalRecords()" [pageIndex]="queryState.pageIndex()"
+  [pageSizeOptions]="[5, 10, 20, 50]" tableTitle="Users" buttonTitle="Add"
+  [showSearch]="true" [showAddButton]="true" searchPlaceholder="Search users..." [searchDebounceTime]="300"
+  (searchChanged)="onSearch($event)" (pageChanged)="onPageChange($event)" (sortChanged)="onSortChange($event)"
+  (actionClicked)="onActionClick($event)" toolTip="Add User">
+  <!-- <ng-template appDataTableCell="name" let-row let-value="value">
+    <div class="flex items-center gap-2">
+      @if (getFlagUrl(row.iso2); as flagUrl) {
+      <img [src]="flagUrl" [alt]="value + ' flag'" class="w-6 h-[18px] object-cover rounded-sm shrink-0"
+        (error)="onFlagError($event)" />
+      }
+
+      <span class="font-semibold">
+        {{ value }}
+      </span>
+    </div>
+  </ng-template> -->
+</app-data-table>
diff --git a/src/app/features/users/pages/users-list/users-list.ts b/src/app/features/users/pages/users-list/users-list.ts
index 0c2637bb..9dcf49ab 100644
--- a/src/app/features/users/pages/users-list/users-list.ts
+++ b/src/app/features/users/pages/users-list/users-list.ts
@@ -1,11 +1,521 @@
-import { Component } from '@angular/core';
-import { CommonModule } from '@angular/common';
+import {
+  ChangeDetectionStrategy,
+  Component,
+  DestroyRef,
+  OnInit,
+  inject,
+  signal
+} from '@angular/core';
+import {
+  FormBuilder,
+  ReactiveFormsModule,
+  Validators
+} from '@angular/forms';
+import { RouterLink } from '@angular/router';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import {
+  catchError,
+  finalize,
+  of,
+  Subject,
+  switchMap
+} from 'rxjs';
+import { HttpErrorResponse } from '@angular/common/http';
+import { ToastrService } from 'ngx-toastr';
+
+import {
+  CreateUserRequest,
+  UserModalMode,
+  UserStatus
+} from '../../models/user.model';
+import { UserService } from '../../data-access/user.service';
+
+import { DataTable } from '../../../../shared/components/data-table/data-table';
+import { DataTableQueryState } from '../../../../shared/components/data-table/data-table-query.state';
+import {
+  DataTableAction,
+  DataTableActionEvent,
+  DataTableColumn,
+  DataTablePageEvent,
+  DataTableQuery,
+  DataTableRecord,
+  DataTableSortEvent
+} from '../../../../shared/components/data-table/data-table.types';
+import { Modal } from '../../../../shared/components/modal/modal';
+
+interface UserTableRow extends DataTableRecord {
+  id: string;
+  email: string;
+  status: UserStatus;
+  roles: string[];
+  isActive: boolean;
+  serialNumber: number;
+  createdOn: string;
+  lastLoginOn: string | null;
+}
 
 @Component({
   selector: 'app-users-list',
   standalone: true,
-  imports: [CommonModule],
+  imports: [
+    ReactiveFormsModule,
+    RouterLink,
+    DataTable,
+    Modal
+  ],
   templateUrl: './users-list.html',
   styleUrl: './users-list.scss',
+  changeDetection: ChangeDetectionStrategy.OnPush
 })
-export class UsersList {}
+export class UsersList implements OnInit {
+  private readonly destroyRef = inject(DestroyRef);
+  private readonly formBuilder = inject(FormBuilder);
+  private readonly usersApi = inject(UserService);
+  private readonly toastr = inject(ToastrService);
+
+  private readonly usersQueryRequests$ =
+    new Subject<DataTableQuery>();
+
+  readonly users = signal<UserTableRow[]>([]);
+  readonly queryState = new DataTableQueryState();
+
+  readonly totalRecords = signal(0);
+  readonly filteredRecords = signal(0);
+
+  readonly userModalMode = signal<UserModalMode>('create');
+  readonly showUserModal = signal(false);
+
+  readonly saving = signal(false);
+  readonly userSubmitAttempted = signal(false);
+
+  readonly userForm = this.formBuilder.nonNullable.group({
+    email: [
+      '',
+      [
+        Validators.required,
+        Validators.email,
+        Validators.maxLength(256)
+      ]
+    ],
+    password: [
+      '',
+      [
+        Validators.required,
+        Validators.minLength(8),
+        Validators.maxLength(128)
+      ]
+    ],
+    roleCodes: this.formBuilder.nonNullable.control<string[]>(
+      [],
+      [
+        Validators.required,
+        control =>
+          control.value.length > 0
+            ? null
+            : { required: true }
+      ]
+    )
+  });
+
+  readonly columns = signal<DataTableColumn<UserTableRow>[]>([
+    {
+      key: 'serialNumber',
+      label: 'Sr. No.',
+      header: 'Sr. No.',
+      sortable: false,
+      width: '100px'
+    },
+    {
+      key: 'email',
+      label: 'Email',
+      header: 'Email',
+      sortable: true,
+      align: 'left'
+    },
+    {
+      key: 'status',
+      label: 'User Status',
+      header: 'User Status',
+      sortable: true,
+      formatter: value =>
+        this.formatUserStatus(value as UserStatus)
+    },
+    {
+      key: 'roles',
+      label: 'Roles',
+      header: 'Roles',
+      sortable: false,
+      align: 'left',
+      formatter: value =>
+        this.formatRoles(
+          Array.isArray(value)
+            ? value.filter(
+                (item): item is string =>
+                  typeof item === 'string'
+              )
+            : []
+        )
+    },
+    {
+      key: 'createdOn',
+      label: 'Created On',
+      header: 'Created On',
+      sortable: true
+    },
+    {
+      key: 'lastLoginOn',
+      label: 'Last Login On',
+      header: 'Last Login On',
+      sortable: true,
+      formatter: value =>
+        typeof value === 'string' && value.trim().length > 0
+          ? value
+          : 'Never'
+    },
+    {
+      key: 'isActive',
+      label: 'Active',
+      header: 'Active',
+      sortable: true,
+      badge: true,
+      badgeClass: value =>
+        value === true
+          ? 'badge bg-success/10 text-success'
+          : 'badge bg-danger/10 text-danger',
+      formatter: value =>
+        value === true ? 'Active' : 'Inactive'
+    }
+  ]);
+
+   onActionClick(event: DataTableActionEvent<UserTableRow>): void {
+      // const user = this.toUserDto(event.row);
+  
+      // switch (event.action.type) {
+      //   case 'view':
+      //     this.viewUser(user);
+      //     break;
+      //   case 'edit':
+      //     this.openEditUser(user);
+      //     break;
+      //   case 'delete':
+      //     this.requestDeleteUser(user);
+      //     break;
+      //   case 'activate':
+      //     this.activateUser(user);
+      //     break;
+      // }
+    }
+  readonly actions = signal<DataTableAction<UserTableRow>[]>([]);
+
+  constructor() {
+    this.initializeUserQueryStream();
+  }
+
+  ngOnInit(): void {
+    this.loadUsers(this.queryState.getQuery());
+  }
+
+  loadUsers(query: DataTableQuery): void {
+    this.usersQueryRequests$.next(query);
+  }
+
+  onSearch(value: string): void {
+    const query = this.queryState.setSearch(value.trim());
+    this.loadUsers(query);
+  }
+
+  onPageChange(event: DataTablePageEvent): void {
+    const query = this.queryState.setPage(event);
+    this.loadUsers(query);
+  }
+
+  onSortChange(event: DataTableSortEvent): void {
+    const query = this.queryState.setSort(event);
+    this.loadUsers(query);
+  }
+
+  onRefresh(): void {
+    const query = this.queryState.reset();
+    this.loadUsers(query);
+  }
+
+  onAddUser(): void {
+    this.userModalMode.set('create');
+    this.resetUserForm();
+    this.showUserModal.set(true);
+  }
+
+  closeUserModal(): void {
+    if (this.saving()) {
+      return;
+    }
+
+    this.showUserModal.set(false);
+    this.resetUserForm();
+  }
+
+  saveUser(): void {
+    this.userSubmitAttempted.set(true);
+
+    if (this.userForm.invalid || this.saving()) {
+      return;
+    }
+
+    const request = this.buildCreateUserRequest();
+
+    if (request.roleCodes.length === 0) {
+      this.userForm.controls.roleCodes.setErrors({
+        required: true
+      });
+
+      return;
+    }
+
+    this.saving.set(true);
+
+    this.usersApi
+      .createUser(request)
+      .pipe(
+        finalize(() => {
+          this.saving.set(false);
+        }),
+        takeUntilDestroyed(this.destroyRef)
+      )
+      .subscribe({
+        next: () => {
+          this.toastr.success('User created successfully.');
+
+          this.showUserModal.set(false);
+          this.resetUserForm();
+          this.refreshUsersAfterSave();
+        },
+        error: (error: HttpErrorResponse) => {
+          this.handleCreateUserError(error);
+        }
+      });
+  }
+
+  isControlInvalid(
+    controlName: keyof typeof this.userForm.controls
+  ): boolean {
+    const control = this.userForm.controls[controlName];
+
+    return this.userSubmitAttempted() && control.invalid;
+  }
+
+  hasControlError(
+    controlName: keyof typeof this.userForm.controls,
+    errorName: string
+  ): boolean {
+    const control = this.userForm.controls[controlName];
+
+    return (
+      this.userSubmitAttempted() &&
+      control.hasError(errorName)
+    );
+  }
+
+  private initializeUserQueryStream(): void {
+    this.usersQueryRequests$
+      .pipe(
+        switchMap(requestedQuery =>
+          this.usersApi.getDataTable(requestedQuery).pipe(
+            catchError(() => {
+              this.clearUsersGrid();
+              this.toastr.error('Unable to load users.');
+
+              return of(null);
+            })
+          )
+        ),
+        takeUntilDestroyed(this.destroyRef)
+      )
+      .subscribe(response => {
+        if (response === null) {
+          return;
+        }
+
+        const currentQuery = this.queryState.getQuery();
+
+        if (response.draw !== currentQuery.draw) {
+          return;
+        }
+
+        const usersWithSerialNumbers: UserTableRow[] =
+          response.rows.map((user, index) => ({
+            id: user.id,
+            email: user.email,
+            status: user.status,
+            roles: [...user.roles],
+            isActive: user.isActive,
+            createdOn: user.createdOn,
+            lastLoginOn: user.lastLoginOn,
+            serialNumber:
+              (currentQuery.page - 1) *
+                currentQuery.pageSize +
+              index +
+              1
+          }));
+
+        this.users.set(usersWithSerialNumbers);
+        this.totalRecords.set(response.total);
+        this.filteredRecords.set(response.filtered);
+      });
+  }
+
+  private buildCreateUserRequest(): CreateUserRequest {
+    const value = this.userForm.getRawValue();
+
+    const normalizedRoleCodes = Array.from(
+      new Set(
+        value.roleCodes
+          .map(roleCode => roleCode.trim())
+          .filter(roleCode => roleCode.length > 0)
+      )
+    );
+
+    return {
+      email: value.email.trim(),
+      password: value.password,
+      roleCodes: normalizedRoleCodes
+    };
+  }
+
+  private refreshUsersAfterSave(): void {
+    const query = this.queryState.reset();
+    this.loadUsers(query);
+  }
+
+  private resetUserForm(): void {
+    this.userForm.reset({
+      email: '',
+      password: '',
+      roleCodes: []
+    });
+
+    this.userSubmitAttempted.set(false);
+
+    this.userForm.markAsPristine();
+    this.userForm.markAsUntouched();
+    this.userForm.updateValueAndValidity({
+      emitEvent: false
+    });
+  }
+
+  private clearUsersGrid(): void {
+    this.users.set([]);
+    this.totalRecords.set(0);
+    this.filteredRecords.set(0);
+  }
+
+  private handleCreateUserError(
+    error: HttpErrorResponse
+  ): void {
+    if (error.status === 409) {
+      this.toastr.error(
+        'A user with this email address already exists.'
+      );
+
+      return;
+    }
+
+    if (error.status === 400) {
+      this.toastr.error(
+        this.extractApiErrorMessage(error) ??
+          'The user information is invalid.'
+      );
+
+      return;
+    }
+
+    /*
+     * Authentication/session errors should normally be handled
+     * by the global authentication interceptor.
+     */
+    if (error.status === 401 || error.status === 403) {
+      return;
+    }
+
+    this.toastr.error(
+      'Unable to create the user. Please try again.'
+    );
+  }
+
+  private extractApiErrorMessage(
+    error: HttpErrorResponse
+  ): string | null {
+    const responseBody: unknown = error.error;
+
+    if (
+      typeof responseBody !== 'object' ||
+      responseBody === null
+    ) {
+      return null;
+    }
+
+    const apiError = responseBody as {
+      detail?: unknown;
+      message?: unknown;
+      title?: unknown;
+    };
+
+    if (typeof apiError.detail === 'string') {
+      return apiError.detail;
+    }
+
+    if (typeof apiError.message === 'string') {
+      return apiError.message;
+    }
+
+    if (typeof apiError.title === 'string') {
+      return apiError.title;
+    }
+
+    return null;
+  }
+
+  private formatRoles(roles: readonly string[]): string {
+    if (roles.length === 0) {
+      return '—';
+    }
+
+    return roles
+      .map(role => this.formatRoleCode(role))
+      .join(', ');
+  }
+
+  private formatRoleCode(roleCode: string): string {
+    return roleCode
+      .split('_')
+      .filter(part => part.length > 0)
+      .map(
+        part =>
+          `${part.charAt(0).toUpperCase()}${part
+            .slice(1)
+            .toLowerCase()}`
+      )
+      .join(' ');
+  }
+
+  private formatUserStatus(status: UserStatus): string {
+    switch (status) {
+      case UserStatus.Pending:
+        return 'Pending';
+
+      case UserStatus.Active:
+        return 'Active';
+
+      case UserStatus.Suspended:
+        return 'Suspended';
+
+      case UserStatus.Locked:
+        return 'Locked';
+
+      case UserStatus.Disabled:
+        return 'Disabled';
+
+      default:
+        return 'Unknown';
+    }
+  }
+}
diff --git a/src/app/features/users/users.routes.ts b/src/app/features/users/users.routes.ts
index efc2a578..5f2a8847 100644
--- a/src/app/features/users/users.routes.ts
+++ b/src/app/features/users/users.routes.ts
@@ -1,9 +1,11 @@
 import { Routes } from '@angular/router';
+import { superAdminGuard } from '../../core/guards/auth/super-admin.guard';
 
 export const usersRoutes: Routes = [
   {
     path: '',
+    canActivate: [superAdminGuard],
     loadComponent: () => import('./pages/users-list/users-list').then((m) => m.UsersList),
     data: { childTitle: 'Platform Users', parentTitle: 'Platform', subParentTitle: 'Security' },
-  },
+  }  
 ];
diff --git a/src/app/package-lock.json b/src/app/package-lock.json
new file mode 100644
index 00000000..741b5dc5
--- /dev/null
+++ b/src/app/package-lock.json
@@ -0,0 +1,14438 @@
+{
+  "name": "ynex-tailwind",
+  "version": "1.0.0",
+  "lockfileVersion": 3,
+  "requires": true,
+  "packages": {
+    "": {
+      "name": "ynex-tailwind",
+      "version": "1.0.0",
+      "dependencies": {
+        "@angular/animations": "^21.2.14",
+        "@angular/cdk": "^21.2.8",
+        "@angular/common": "^21.2.10",
+        "@angular/compiler": "^21.2.10",
+        "@angular/core": "^21.2.10",
+        "@angular/fire": "^21.0.0-rc.0",
+        "@angular/forms": "^21.2.10",
+        "@angular/google-maps": "^21.2.8",
+        "@angular/material": "^21.2.14",
+        "@angular/platform-browser": "^21.2.10",
+        "@angular/platform-browser-dynamic": "^21.2.10",
+        "@angular/router": "^21.2.10",
+        "@ng-select/ng-select": "^21.8.2",
+        "@tailwindcss/forms": "^0.5.11",
+        "@tsparticles/angular": "^3.0.0",
+        "apexcharts": "^5.10.5",
+        "chart.js": "^4.5.1",
+        "gridjs": "^6.2.0",
+        "ng-apexcharts": "^2.3.0",
+        "ng2-charts": "^10.0.0",
+        "ngx-color-picker": "^20.1.1",
+        "ngx-echarts": "^21.0.0",
+        "ngx-toastr": "^20.0.5",
+        "preline": "^4.1.2",
+        "rxjs": "~7.8.0",
+        "simplebar-angular": "^3.3.2",
+        "sweetalert2": "^11.26.25",
+        "tslib": "^2.3.0",
+        "tsparticles": "^3.9.1"
+      },
+      "devDependencies": {
+        "@angular/build": "^21.0.5",
+        "@angular/cli": "^21.0.5",
+        "@angular/compiler-cli": "^21.2.10",
+        "@eslint/js": "^10.0.1",
+        "@tailwindcss/postcss": "^4.2.2",
+        "angular-eslint": "21.4.0",
+        "autoprefixer": "^10.4.27",
+        "eslint": "^10.3.0",
+        "jsdom": "^27.1.0",
+        "postcss": "^8.5.8",
+        "postcss-cli": "^11.0.1",
+        "tailwindcss": "^4.2.2",
+        "typescript": "~5.9.2",
+        "typescript-eslint": "8.59.2",
+        "vitest": "^4.0.8"
+      }
+    },
+    "node_modules/@acemir/cssom": {
+      "version": "0.9.31",
+      "resolved": "https://registry.npmjs.org/@acemir/cssom/-/cssom-0.9.31.tgz",
+      "integrity": "sha512-ZnR3GSaH+/vJ0YlHau21FjfLYjMpYVIzTD8M8vIEQvIGxeOXyXdzCI140rrCY862p/C/BbzWsjc1dgnM9mkoTA==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@algolia/abtesting": {
+      "version": "1.14.1",
+      "resolved": "https://registry.npmjs.org/@algolia/abtesting/-/abtesting-1.14.1.tgz",
+      "integrity": "sha512-Dkj0BgPiLAaim9sbQ97UKDFHJE/880wgStAM18U++NaJ/2Cws34J5731ovJifr6E3Pv4T2CqvMXf8qLCC417Ew==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@algolia/client-common": "5.48.1",
+        "@algolia/requester-browser-xhr": "5.48.1",
+        "@algolia/requester-fetch": "5.48.1",
+        "@algolia/requester-node-http": "5.48.1"
+      },
+      "engines": {
+        "node": ">= 14.0.0"
+      }
+    },
+    "node_modules/@algolia/client-abtesting": {
+      "version": "5.48.1",
+      "resolved": "https://registry.npmjs.org/@algolia/client-abtesting/-/client-abtesting-5.48.1.tgz",
+      "integrity": "sha512-LV5qCJdj+/m9I+Aj91o+glYszrzd7CX6NgKaYdTOj4+tUYfbS62pwYgUfZprYNayhkQpVFcrW8x8ZlIHpS23Vw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@algolia/client-common": "5.48.1",
+        "@algolia/requester-browser-xhr": "5.48.1",
+        "@algolia/requester-fetch": "5.48.1",
+        "@algolia/requester-node-http": "5.48.1"
+      },
+      "engines": {
+        "node": ">= 14.0.0"
+      }
+    },
+    "node_modules/@algolia/client-analytics": {
+      "version": "5.48.1",
+      "resolved": "https://registry.npmjs.org/@algolia/client-analytics/-/client-analytics-5.48.1.tgz",
+      "integrity": "sha512-/AVoMqHhPm14CcHq7mwB+bUJbfCv+jrxlNvRjXAuO+TQa+V37N8k1b0ijaRBPdmSjULMd8KtJbQyUyabXOu6Kg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@algolia/client-common": "5.48.1",
+        "@algolia/requester-browser-xhr": "5.48.1",
+        "@algolia/requester-fetch": "5.48.1",
+        "@algolia/requester-node-http": "5.48.1"
+      },
+      "engines": {
+        "node": ">= 14.0.0"
+      }
+    },
+    "node_modules/@algolia/client-common": {
+      "version": "5.48.1",
+      "resolved": "https://registry.npmjs.org/@algolia/client-common/-/client-common-5.48.1.tgz",
+      "integrity": "sha512-VXO+qu2Ep6ota28ktvBm3sG53wUHS2n7bgLWmce5jTskdlCD0/JrV4tnBm1l7qpla1CeoQb8D7ShFhad+UoSOw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 14.0.0"
+      }
+    },
+    "node_modules/@algolia/client-insights": {
+      "version": "5.48.1",
+      "resolved": "https://registry.npmjs.org/@algolia/client-insights/-/client-insights-5.48.1.tgz",
+      "integrity": "sha512-zl+Qyb0nLg+Y5YvKp1Ij+u9OaPaKg2/EPzTwKNiVyOHnQJlFxmXyUZL1EInczAZsEY8hVpPCLtNfhMhfxluXKQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@algolia/client-common": "5.48.1",
+        "@algolia/requester-browser-xhr": "5.48.1",
+        "@algolia/requester-fetch": "5.48.1",
+        "@algolia/requester-node-http": "5.48.1"
+      },
+      "engines": {
+        "node": ">= 14.0.0"
+      }
+    },
+    "node_modules/@algolia/client-personalization": {
+      "version": "5.48.1",
+      "resolved": "https://registry.npmjs.org/@algolia/client-personalization/-/client-personalization-5.48.1.tgz",
+      "integrity": "sha512-r89Qf9Oo9mKWQXumRu/1LtvVJAmEDpn8mHZMc485pRfQUMAwSSrsnaw1tQ3sszqzEgAr1c7rw6fjBI+zrAXTOw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@algolia/client-common": "5.48.1",
+        "@algolia/requester-browser-xhr": "5.48.1",
+        "@algolia/requester-fetch": "5.48.1",
+        "@algolia/requester-node-http": "5.48.1"
+      },
+      "engines": {
+        "node": ">= 14.0.0"
+      }
+    },
+    "node_modules/@algolia/client-query-suggestions": {
+      "version": "5.48.1",
+      "resolved": "https://registry.npmjs.org/@algolia/client-query-suggestions/-/client-query-suggestions-5.48.1.tgz",
+      "integrity": "sha512-TPKNPKfghKG/bMSc7mQYD9HxHRUkBZA4q1PEmHgICaSeHQscGqL4wBrKkhfPlDV1uYBKW02pbFMUhsOt7p4ZpA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@algolia/client-common": "5.48.1",
+        "@algolia/requester-browser-xhr": "5.48.1",
+        "@algolia/requester-fetch": "5.48.1",
+        "@algolia/requester-node-http": "5.48.1"
+      },
+      "engines": {
+        "node": ">= 14.0.0"
+      }
+    },
+    "node_modules/@algolia/client-search": {
+      "version": "5.48.1",
+      "resolved": "https://registry.npmjs.org/@algolia/client-search/-/client-search-5.48.1.tgz",
+      "integrity": "sha512-4Fu7dnzQyQmMFknYwTiN/HxPbH4DyxvQ1m+IxpPp5oslOgz8m6PG5qhiGbqJzH4HiT1I58ecDiCAC716UyVA8Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@algolia/client-common": "5.48.1",
+        "@algolia/requester-browser-xhr": "5.48.1",
+        "@algolia/requester-fetch": "5.48.1",
+        "@algolia/requester-node-http": "5.48.1"
+      },
+      "engines": {
+        "node": ">= 14.0.0"
+      }
+    },
+    "node_modules/@algolia/ingestion": {
+      "version": "1.48.1",
+      "resolved": "https://registry.npmjs.org/@algolia/ingestion/-/ingestion-1.48.1.tgz",
+      "integrity": "sha512-/RFq3TqtXDUUawwic/A9xylA2P3LDMO8dNhphHAUOU51b1ZLHrmZ6YYJm3df1APz7xLY1aht6okCQf+/vmrV9w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@algolia/client-common": "5.48.1",
+        "@algolia/requester-browser-xhr": "5.48.1",
+        "@algolia/requester-fetch": "5.48.1",
+        "@algolia/requester-node-http": "5.48.1"
+      },
+      "engines": {
+        "node": ">= 14.0.0"
+      }
+    },
+    "node_modules/@algolia/monitoring": {
+      "version": "1.48.1",
+      "resolved": "https://registry.npmjs.org/@algolia/monitoring/-/monitoring-1.48.1.tgz",
+      "integrity": "sha512-Of0jTeAZRyRhC7XzDSjJef0aBkgRcvRAaw0ooYRlOw57APii7lZdq+layuNdeL72BRq1snaJhoMMwkmLIpJScw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@algolia/client-common": "5.48.1",
+        "@algolia/requester-browser-xhr": "5.48.1",
+        "@algolia/requester-fetch": "5.48.1",
+        "@algolia/requester-node-http": "5.48.1"
+      },
+      "engines": {
+        "node": ">= 14.0.0"
+      }
+    },
+    "node_modules/@algolia/recommend": {
+      "version": "5.48.1",
+      "resolved": "https://registry.npmjs.org/@algolia/recommend/-/recommend-5.48.1.tgz",
+      "integrity": "sha512-bE7JcpFXzxF5zHwj/vkl2eiCBvyR1zQ7aoUdO+GDXxGp0DGw7nI0p8Xj6u8VmRQ+RDuPcICFQcCwRIJT5tDJFw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@algolia/client-common": "5.48.1",
+        "@algolia/requester-browser-xhr": "5.48.1",
+        "@algolia/requester-fetch": "5.48.1",
+        "@algolia/requester-node-http": "5.48.1"
+      },
+      "engines": {
+        "node": ">= 14.0.0"
+      }
+    },
+    "node_modules/@algolia/requester-browser-xhr": {
+      "version": "5.48.1",
+      "resolved": "https://registry.npmjs.org/@algolia/requester-browser-xhr/-/requester-browser-xhr-5.48.1.tgz",
+      "integrity": "sha512-MK3wZ2koLDnvH/AmqIF1EKbJlhRS5j74OZGkLpxI4rYvNi9Jn/C7vb5DytBnQ4KUWts7QsmbdwHkxY5txQHXVw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@algolia/client-common": "5.48.1"
+      },
+      "engines": {
+        "node": ">= 14.0.0"
+      }
+    },
+    "node_modules/@algolia/requester-fetch": {
+      "version": "5.48.1",
+      "resolved": "https://registry.npmjs.org/@algolia/requester-fetch/-/requester-fetch-5.48.1.tgz",
+      "integrity": "sha512-2oDT43Y5HWRSIQMPQI4tA/W+TN/N2tjggZCUsqQV440kxzzoPGsvv9QP1GhQ4CoDa+yn6ygUsGp6Dr+a9sPPSg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@algolia/client-common": "5.48.1"
+      },
+      "engines": {
+        "node": ">= 14.0.0"
+      }
+    },
+    "node_modules/@algolia/requester-node-http": {
+      "version": "5.48.1",
+      "resolved": "https://registry.npmjs.org/@algolia/requester-node-http/-/requester-node-http-5.48.1.tgz",
+      "integrity": "sha512-xcaCqbhupVWhuBP1nwbk1XNvwrGljozutEiLx06mvqDf3o8cHyEgQSHS4fKJM+UAggaWVnnFW+Nne5aQ8SUJXg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@algolia/client-common": "5.48.1"
+      },
+      "engines": {
+        "node": ">= 14.0.0"
+      }
+    },
+    "node_modules/@alloc/quick-lru": {
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/@alloc/quick-lru/-/quick-lru-5.2.0.tgz",
+      "integrity": "sha512-UrcABB+4bUrFABwbluTIBErXwvbsU/V7TZWfmbgJfbkwiBuziS9gxdODUyuiecfdGQ85jglMW6juS3+z5TsKLw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/@ampproject/remapping": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/@ampproject/remapping/-/remapping-2.3.0.tgz",
+      "integrity": "sha512-30iZtAPgz+LTIYoeivqYo853f02jBYSd5uGnGpkFV0M3xOt9aN73erkgYAmZU43x4VfqcnLxW9Kpg3R5LC4YYw==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@jridgewell/gen-mapping": "^0.3.5",
+        "@jridgewell/trace-mapping": "^0.3.24"
+      },
+      "engines": {
+        "node": ">=6.0.0"
+      }
+    },
+    "node_modules/@angular-devkit/architect": {
+      "version": "0.2102.12",
+      "resolved": "https://registry.npmjs.org/@angular-devkit/architect/-/architect-0.2102.12.tgz",
+      "integrity": "sha512-w9FSMHYeeHkk0kRSAOCvNqEVyOHqpC1SUf3iN7tDnXBOA0dtc6JYvJU7O4joiwf7wMPZDK8LKc/6eu8/Tx87Fw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@angular-devkit/core": "21.2.12",
+        "rxjs": "7.8.2"
+      },
+      "bin": {
+        "architect": "bin/cli.js"
+      },
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0",
+        "npm": "^6.11.0 || ^7.5.6 || >=8.0.0",
+        "yarn": ">= 1.13.0"
+      }
+    },
+    "node_modules/@angular-devkit/core": {
+      "version": "21.2.12",
+      "resolved": "https://registry.npmjs.org/@angular-devkit/core/-/core-21.2.12.tgz",
+      "integrity": "sha512-nXms0jVWwHOJK+z6vHvhw7HYFBelxh2gEnkij0OQMABXZN5hoUlTD0DDP1lYR7hQNi8Yb2Ar0UN9ihyUFVM5Kg==",
+      "license": "MIT",
+      "dependencies": {
+        "ajv": "8.18.0",
+        "ajv-formats": "3.0.1",
+        "jsonc-parser": "3.3.1",
+        "picomatch": "4.0.4",
+        "rxjs": "7.8.2",
+        "source-map": "0.7.6"
+      },
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0",
+        "npm": "^6.11.0 || ^7.5.6 || >=8.0.0",
+        "yarn": ">= 1.13.0"
+      },
+      "peerDependencies": {
+        "chokidar": "^5.0.0"
+      },
+      "peerDependenciesMeta": {
+        "chokidar": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@angular-devkit/schematics": {
+      "version": "21.2.12",
+      "resolved": "https://registry.npmjs.org/@angular-devkit/schematics/-/schematics-21.2.12.tgz",
+      "integrity": "sha512-29xe6C9nwHejV9zBcu0js7NmzLWuCFzBGBTmL6eD4JN1NcxEZ/nO1JuaGINjPjzb/UDXPZIqEwHbnFNcGS5v1A==",
+      "license": "MIT",
+      "dependencies": {
+        "@angular-devkit/core": "21.2.12",
+        "jsonc-parser": "3.3.1",
+        "magic-string": "0.30.21",
+        "ora": "9.3.0",
+        "rxjs": "7.8.2"
+      },
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0",
+        "npm": "^6.11.0 || ^7.5.6 || >=8.0.0",
+        "yarn": ">= 1.13.0"
+      }
+    },
+    "node_modules/@angular-eslint/builder": {
+      "version": "21.4.0",
+      "resolved": "https://registry.npmjs.org/@angular-eslint/builder/-/builder-21.4.0.tgz",
+      "integrity": "sha512-3kgGmrVaCYbLtDjC8g4BmMBbdz4thsOB8/NYly8JtXM8EuDZEk5Pz6VTRpJR02ARprwayraTTmhyvq6OGBlQ9w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@angular-devkit/architect": ">= 0.2100.0 < 0.2200.0",
+        "@angular-devkit/core": ">= 21.0.0 < 22.0.0"
+      },
+      "peerDependencies": {
+        "@angular/cli": ">= 21.0.0 < 22.0.0",
+        "eslint": "^8.57.0 || ^9.0.0 || ^10.0.0",
+        "typescript": "*"
+      }
+    },
+    "node_modules/@angular-eslint/bundled-angular-compiler": {
+      "version": "21.4.0",
+      "resolved": "https://registry.npmjs.org/@angular-eslint/bundled-angular-compiler/-/bundled-angular-compiler-21.4.0.tgz",
+      "integrity": "sha512-/3H4BPbQ1BHJkkrUsfusZtmHc+qiFWBBZ9UDPWah4xZMjflexOK9U4GYeH7nMjcuyqFnIlMMeJJNwNLGt/hmdg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@angular-eslint/eslint-plugin": {
+      "version": "21.4.0",
+      "resolved": "https://registry.npmjs.org/@angular-eslint/eslint-plugin/-/eslint-plugin-21.4.0.tgz",
+      "integrity": "sha512-mow2DMj+xBvGl5t7jzC34R8YfbHbaGNyCNFzpovtl9qc0JbuqLyg6htmt8xb05f8ZjATOr4nz0ESt6HV4c51hw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@angular-eslint/bundled-angular-compiler": "21.4.0",
+        "@angular-eslint/utils": "21.4.0",
+        "ts-api-utils": "^2.1.0"
+      },
+      "peerDependencies": {
+        "@typescript-eslint/utils": "^7.11.0 || ^8.0.0",
+        "eslint": "^8.57.0 || ^9.0.0 || ^10.0.0",
+        "typescript": "*"
+      }
+    },
+    "node_modules/@angular-eslint/eslint-plugin-template": {
+      "version": "21.4.0",
+      "resolved": "https://registry.npmjs.org/@angular-eslint/eslint-plugin-template/-/eslint-plugin-template-21.4.0.tgz",
+      "integrity": "sha512-sJEHx2WYnvOgPpzP1eHnUdRS06zgKmRxbiIR0JiCcaSen5iv1HlsMieXy//FS9TtNW+abHOy4UtDuGuSPflPFA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@angular-eslint/bundled-angular-compiler": "21.4.0",
+        "@angular-eslint/utils": "21.4.0",
+        "aria-query": "5.3.2",
+        "axobject-query": "4.1.0"
+      },
+      "peerDependencies": {
+        "@angular-eslint/template-parser": "21.4.0",
+        "@typescript-eslint/types": "^7.11.0 || ^8.0.0",
+        "@typescript-eslint/utils": "^7.11.0 || ^8.0.0",
+        "eslint": "^8.57.0 || ^9.0.0 || ^10.0.0",
+        "typescript": "*"
+      }
+    },
+    "node_modules/@angular-eslint/schematics": {
+      "version": "21.4.0",
+      "resolved": "https://registry.npmjs.org/@angular-eslint/schematics/-/schematics-21.4.0.tgz",
+      "integrity": "sha512-crD6Hfxs7x5bN9FCqTZI7uVSiGvprfCS3MCPOpyIQl87bRr/9aNhnicJ3ROUHv+2A713BgPHIgiCII/bxzrfPw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@angular-devkit/core": ">= 21.0.0 < 22.0.0",
+        "@angular-devkit/schematics": ">= 21.0.0 < 22.0.0",
+        "@angular-eslint/eslint-plugin": "21.4.0",
+        "@angular-eslint/eslint-plugin-template": "21.4.0",
+        "ignore": "7.0.5",
+        "semver": "7.7.4",
+        "strip-json-comments": "3.1.1"
+      },
+      "peerDependencies": {
+        "@angular/cli": ">= 21.0.0 < 22.0.0"
+      }
+    },
+    "node_modules/@angular-eslint/template-parser": {
+      "version": "21.4.0",
+      "resolved": "https://registry.npmjs.org/@angular-eslint/template-parser/-/template-parser-21.4.0.tgz",
+      "integrity": "sha512-BaUSLSyS+43fzDoJkTMkGqNdCXq3fGnUZsfXTmrlZPJf5AYFbgAlAPGZXDJyoNWw43fux+DafdlrlKcYUSgSIw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@angular-eslint/bundled-angular-compiler": "21.4.0",
+        "eslint-scope": "9.1.2"
+      },
+      "peerDependencies": {
+        "eslint": "^8.57.0 || ^9.0.0 || ^10.0.0",
+        "typescript": "*"
+      }
+    },
+    "node_modules/@angular-eslint/utils": {
+      "version": "21.4.0",
+      "resolved": "https://registry.npmjs.org/@angular-eslint/utils/-/utils-21.4.0.tgz",
+      "integrity": "sha512-7pi+Ga7QmdH5Ig/diau6fR5L4yubgKr9TOjdCg7OeuE/zo0O3osTCNT6JOodzS/iQM1kSCJFDoIBKFeUOttiNw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@angular-eslint/bundled-angular-compiler": "21.4.0"
+      },
+      "peerDependencies": {
+        "@typescript-eslint/utils": "^7.11.0 || ^8.0.0",
+        "eslint": "^8.57.0 || ^9.0.0 || ^10.0.0",
+        "typescript": "*"
+      }
+    },
+    "node_modules/@angular/animations": {
+      "version": "21.2.14",
+      "resolved": "https://registry.npmjs.org/@angular/animations/-/animations-21.2.14.tgz",
+      "integrity": "sha512-9WLnsJE0xqtd1rVtHMvsAUxFy3OdPks4bdmUIqyw23X/je7ytUALAGWNadffcZBwRpa1A6TUnLr9X4+Draz3kw==",
+      "license": "MIT",
+      "dependencies": {
+        "tslib": "^2.3.0"
+      },
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
+      },
+      "peerDependencies": {
+        "@angular/core": "21.2.14"
+      }
+    },
+    "node_modules/@angular/build": {
+      "version": "21.2.12",
+      "resolved": "https://registry.npmjs.org/@angular/build/-/build-21.2.12.tgz",
+      "integrity": "sha512-zYfo21RuldDWXnshuPfWYtmh5ltlO9+XFHpNObdIInQTFxKD6grLNVNOblFFpi+oIIm4Km+CGSXvBHs/aH0ufA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@ampproject/remapping": "2.3.0",
+        "@angular-devkit/architect": "0.2102.12",
+        "@babel/core": "7.29.0",
+        "@babel/helper-annotate-as-pure": "7.27.3",
+        "@babel/helper-split-export-declaration": "7.24.7",
+        "@inquirer/confirm": "5.1.21",
+        "@vitejs/plugin-basic-ssl": "2.1.4",
+        "beasties": "0.4.1",
+        "browserslist": "^4.26.0",
+        "esbuild": "0.27.3",
+        "https-proxy-agent": "7.0.6",
+        "istanbul-lib-instrument": "6.0.3",
+        "jsonc-parser": "3.3.1",
+        "listr2": "9.0.5",
+        "magic-string": "0.30.21",
+        "mrmime": "2.0.1",
+        "parse5-html-rewriting-stream": "8.0.0",
+        "picomatch": "4.0.4",
+        "piscina": "5.1.4",
+        "rolldown": "1.0.0-rc.4",
+        "sass": "1.97.3",
+        "semver": "7.7.4",
+        "source-map-support": "0.5.21",
+        "tinyglobby": "0.2.15",
+        "undici": "7.24.4",
+        "vite": "7.3.2",
+        "watchpack": "2.5.1"
+      },
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0",
+        "npm": "^6.11.0 || ^7.5.6 || >=8.0.0",
+        "yarn": ">= 1.13.0"
+      },
+      "optionalDependencies": {
+        "lmdb": "3.5.1"
+      },
+      "peerDependencies": {
+        "@angular/compiler": "^21.0.0",
+        "@angular/compiler-cli": "^21.0.0",
+        "@angular/core": "^21.0.0",
+        "@angular/localize": "^21.0.0",
+        "@angular/platform-browser": "^21.0.0",
+        "@angular/platform-server": "^21.0.0",
+        "@angular/service-worker": "^21.0.0",
+        "@angular/ssr": "^21.2.12",
+        "karma": "^6.4.0",
+        "less": "^4.2.0",
+        "ng-packagr": "^21.0.0",
+        "postcss": "^8.4.0",
+        "tailwindcss": "^2.0.0 || ^3.0.0 || ^4.0.0",
+        "tslib": "^2.3.0",
+        "typescript": ">=5.9 <6.0",
+        "vitest": "^4.0.8"
+      },
+      "peerDependenciesMeta": {
+        "@angular/core": {
+          "optional": true
+        },
+        "@angular/localize": {
+          "optional": true
+        },
+        "@angular/platform-browser": {
+          "optional": true
+        },
+        "@angular/platform-server": {
+          "optional": true
+        },
+        "@angular/service-worker": {
+          "optional": true
+        },
+        "@angular/ssr": {
+          "optional": true
+        },
+        "karma": {
+          "optional": true
+        },
+        "less": {
+          "optional": true
+        },
+        "ng-packagr": {
+          "optional": true
+        },
+        "postcss": {
+          "optional": true
+        },
+        "tailwindcss": {
+          "optional": true
+        },
+        "vitest": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@angular/cdk": {
+      "version": "21.2.14",
+      "resolved": "https://registry.npmjs.org/@angular/cdk/-/cdk-21.2.14.tgz",
+      "integrity": "sha512-806REq/CLf37nEhmmd8Q+ILN8z/RVG2vk2n8YZ/4TdHpcBCi5ux4AxLbpMmduLwGPOzPagJ6ggRzE5fnX0rmcQ==",
+      "license": "MIT",
+      "dependencies": {
+        "parse5": "^8.0.0",
+        "tslib": "^2.3.0"
+      },
+      "peerDependencies": {
+        "@angular/common": "^21.0.0 || ^22.0.0",
+        "@angular/core": "^21.0.0 || ^22.0.0",
+        "@angular/platform-browser": "^21.0.0 || ^22.0.0",
+        "rxjs": "^6.5.3 || ^7.4.0"
+      }
+    },
+    "node_modules/@angular/cli": {
+      "version": "21.2.12",
+      "resolved": "https://registry.npmjs.org/@angular/cli/-/cli-21.2.12.tgz",
+      "integrity": "sha512-oLEL1C1fI39b1eQo5f2cyQhQfE+QMv7dm8z2MmxbP7YR7jAdQPVfGU8CXECR5g7mrYi9WgvIRKB+9Oeq2aH6Jw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@angular-devkit/architect": "0.2102.12",
+        "@angular-devkit/core": "21.2.12",
+        "@angular-devkit/schematics": "21.2.12",
+        "@inquirer/prompts": "7.10.1",
+        "@listr2/prompt-adapter-inquirer": "3.0.5",
+        "@modelcontextprotocol/sdk": "1.26.0",
+        "@schematics/angular": "21.2.12",
+        "@yarnpkg/lockfile": "1.1.0",
+        "algoliasearch": "5.48.1",
+        "ini": "6.0.0",
+        "jsonc-parser": "3.3.1",
+        "listr2": "9.0.5",
+        "npm-package-arg": "13.0.2",
+        "pacote": "21.3.1",
+        "parse5-html-rewriting-stream": "8.0.0",
+        "semver": "7.7.4",
+        "yargs": "18.0.0",
+        "zod": "4.3.6"
+      },
+      "bin": {
+        "ng": "bin/ng.js"
+      },
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0",
+        "npm": "^6.11.0 || ^7.5.6 || >=8.0.0",
+        "yarn": ">= 1.13.0"
+      }
+    },
+    "node_modules/@angular/common": {
+      "version": "21.2.14",
+      "resolved": "https://registry.npmjs.org/@angular/common/-/common-21.2.14.tgz",
+      "integrity": "sha512-J6K7cE7uKOKmg4+sxLeGfsmaYDjP5l1XCiMMI0WPT0t68uxLk8g3MzV5Trqfb6ZnRxWcfp9c4c+XxAvMBB7ymA==",
+      "license": "MIT",
+      "dependencies": {
+        "tslib": "^2.3.0"
+      },
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
+      },
+      "peerDependencies": {
+        "@angular/core": "21.2.14",
+        "rxjs": "^6.5.3 || ^7.4.0"
+      }
+    },
+    "node_modules/@angular/compiler": {
+      "version": "21.2.14",
+      "resolved": "https://registry.npmjs.org/@angular/compiler/-/compiler-21.2.14.tgz",
+      "integrity": "sha512-8mqgwRYfn2Z1vg/5YVt60dDBattnZL45nNJd2vTMwAiDTzhWhgKgRWKOeVL0aj2JqHeHiwuIlrLnz46acJMulQ==",
+      "license": "MIT",
+      "dependencies": {
+        "tslib": "^2.3.0"
+      },
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
+      }
+    },
+    "node_modules/@angular/compiler-cli": {
+      "version": "21.2.14",
+      "resolved": "https://registry.npmjs.org/@angular/compiler-cli/-/compiler-cli-21.2.14.tgz",
+      "integrity": "sha512-h+WQfPKFxaDfDhMqUUdOQ1TsDMccav8kLFERmKTRfD4MNOczSMpOMyeXJHCL0Rq4I8WDQvaBJGMG7DXRDefSog==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/core": "7.29.0",
+        "@jridgewell/sourcemap-codec": "^1.4.14",
+        "chokidar": "^5.0.0",
+        "convert-source-map": "^1.5.1",
+        "reflect-metadata": "^0.2.0",
+        "semver": "^7.0.0",
+        "tslib": "^2.3.0",
+        "yargs": "^18.0.0"
+      },
+      "bin": {
+        "ng-xi18n": "bundles/src/bin/ng_xi18n.js",
+        "ngc": "bundles/src/bin/ngc.js"
+      },
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
+      },
+      "peerDependencies": {
+        "@angular/compiler": "21.2.14",
+        "typescript": ">=5.9 <6.1"
+      },
+      "peerDependenciesMeta": {
+        "typescript": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@angular/core": {
+      "version": "21.2.14",
+      "resolved": "https://registry.npmjs.org/@angular/core/-/core-21.2.14.tgz",
+      "integrity": "sha512-Z1Ivjh7L2lT//8LA7vQ3tj7Rg6wl2XRA5kPSAukgn8u0Yu0XxG8NE8KG0Eypb3v9CEcbwATwpgnxzbJFZ8TFcw==",
+      "license": "MIT",
+      "dependencies": {
+        "tslib": "^2.3.0"
+      },
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
+      },
+      "peerDependencies": {
+        "@angular/compiler": "21.2.14",
+        "rxjs": "^6.5.3 || ^7.4.0",
+        "zone.js": "~0.15.0 || ~0.16.0"
+      },
+      "peerDependenciesMeta": {
+        "@angular/compiler": {
+          "optional": true
+        },
+        "zone.js": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@angular/fire": {
+      "version": "21.0.0-rc.0-canary.ac3dd7c",
+      "resolved": "https://registry.npmjs.org/@angular/fire/-/fire-21.0.0-rc.0-canary.ac3dd7c.tgz",
+      "integrity": "sha512-Z1T9FrA8pd4JxUdQt1kDpsPGuXmqJSofsyiIZEJWboG4K1rezqN2JsB3cVGucIJ9uLljaFdvAtXYc+unBmAADQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@angular-devkit/schematics": "^21.0.0",
+        "@schematics/angular": "^21.0.0",
+        "firebase": "^12.4.0",
+        "rxfire": "^6.1.0",
+        "tslib": "^2.3.0"
+      },
+      "peerDependencies": {
+        "@angular/common": "^21.0.0",
+        "@angular/core": "^21.0.0",
+        "@angular/platform-browser": "^21.0.0",
+        "@angular/platform-browser-dynamic": "^21.0.0",
+        "@angular/platform-server": "^21.0.0",
+        "firebase-tools": "^14.0.0",
+        "rxjs": "~7.8.0"
+      },
+      "peerDependenciesMeta": {
+        "@angular/platform-server": {
+          "optional": true
+        },
+        "firebase-tools": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/ai": {
+      "version": "2.12.0",
+      "resolved": "https://registry.npmjs.org/@firebase/ai/-/ai-2.12.0.tgz",
+      "integrity": "sha512-b+OL4vdyiSLZL/7dLd67V55CjKJvU9MpNmwnday7eA6GG2+J4iwUEsEHgw0/jKY3A41FfkF0SrnYFvtKbQZ65A==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@firebase/app-check-interop-types": "0.3.4",
+        "@firebase/component": "0.7.3",
+        "@firebase/logger": "0.5.1",
+        "@firebase/util": "1.15.1",
+        "tslib": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=20.0.0"
+      },
+      "peerDependencies": {
+        "@firebase/app": "0.x",
+        "@firebase/app-types": "0.x"
+      }
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/analytics": {
+      "version": "0.10.22",
+      "resolved": "https://registry.npmjs.org/@firebase/analytics/-/analytics-0.10.22.tgz",
+      "integrity": "sha512-8BSaq/QRGU1+xyi8L2PTLTJU7MH9aMA72RQdIxrbhWFauOZY9OXo8f2YDN/972xA8d588tlnNVEQ2Mo69pT9Ow==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@firebase/component": "0.7.3",
+        "@firebase/installations": "0.6.22",
+        "@firebase/logger": "0.5.1",
+        "@firebase/util": "1.15.1",
+        "tslib": "^2.1.0"
+      },
+      "peerDependencies": {
+        "@firebase/app": "0.x"
+      }
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/analytics-compat": {
+      "version": "0.2.28",
+      "resolved": "https://registry.npmjs.org/@firebase/analytics-compat/-/analytics-compat-0.2.28.tgz",
+      "integrity": "sha512-lIAlqUUbBu93FJMlQfslryQtBwwzdzvp23ePC6FNgymXk6Ook5v4Uvc0vdutvoIeqmyA3LfP0ZeRFK8+11kOOQ==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@firebase/analytics": "0.10.22",
+        "@firebase/analytics-types": "0.8.4",
+        "@firebase/component": "0.7.3",
+        "@firebase/util": "1.15.1",
+        "tslib": "^2.1.0"
+      },
+      "peerDependencies": {
+        "@firebase/app-compat": "0.x"
+      }
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/analytics-types": {
+      "version": "0.8.4",
+      "resolved": "https://registry.npmjs.org/@firebase/analytics-types/-/analytics-types-0.8.4.tgz",
+      "integrity": "sha512-zQ+XTgkwH6CY/eUSHJRP7e4LxM30RCxlCmob5sy2axs25GE3Ny0XdgpDscMTHHQIGqWkxPXad4w2Mw9sCgT8zQ==",
+      "license": "Apache-2.0"
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/app": {
+      "version": "0.14.12",
+      "resolved": "https://registry.npmjs.org/@firebase/app/-/app-0.14.12.tgz",
+      "integrity": "sha512-FT+HoNp1NdaZ/N26hCwV3WbxS1m6gTn3p2QRBQ3KH7YqyCQqJx0iT7126RgVk68/Rq+9DeL/zCFnHZ0C4u1nLQ==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@firebase/component": "0.7.3",
+        "@firebase/logger": "0.5.1",
+        "@firebase/util": "1.15.1",
+        "idb": "7.1.1",
+        "tslib": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=20.0.0"
+      }
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/app-check": {
+      "version": "0.11.3",
+      "resolved": "https://registry.npmjs.org/@firebase/app-check/-/app-check-0.11.3.tgz",
+      "integrity": "sha512-aJ4DfubWfTO8/2vhEhIAizOoOmiycESTU32e+OUgbWcS/G3PA4Vxlr/9zaiN2wfUG2AptQ7DTvj00tyuFZP5Bg==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@firebase/component": "0.7.3",
+        "@firebase/logger": "0.5.1",
+        "@firebase/util": "1.15.1",
+        "tslib": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=20.0.0"
+      },
+      "peerDependencies": {
+        "@firebase/app": "0.x"
+      }
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/app-check-compat": {
+      "version": "0.4.3",
+      "resolved": "https://registry.npmjs.org/@firebase/app-check-compat/-/app-check-compat-0.4.3.tgz",
+      "integrity": "sha512-L3AKIRTJxT9b7cDUH3OyV8gWTnmW3vYkwdzRsukWt4kbPBTct12xalnyvHDkm1lKkr+cQq/4uzBx1bOWsQ2ciw==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@firebase/app-check": "0.11.3",
+        "@firebase/app-check-types": "0.5.4",
+        "@firebase/component": "0.7.3",
+        "@firebase/logger": "0.5.1",
+        "@firebase/util": "1.15.1",
+        "tslib": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=20.0.0"
+      },
+      "peerDependencies": {
+        "@firebase/app-compat": "0.x"
+      }
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/app-check-interop-types": {
+      "version": "0.3.4",
+      "resolved": "https://registry.npmjs.org/@firebase/app-check-interop-types/-/app-check-interop-types-0.3.4.tgz",
+      "integrity": "sha512-zz3i6e13B8BfWiLy8MABtTh8aGIACgKbf9UVnyHcWs+yQzJXgQcl8A46b0zfaiJHdQ+niF0ouAfcpuf+3LMPQg==",
+      "license": "Apache-2.0"
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/app-check-types": {
+      "version": "0.5.4",
+      "resolved": "https://registry.npmjs.org/@firebase/app-check-types/-/app-check-types-0.5.4.tgz",
+      "integrity": "sha512-xV7JsIyzVr15aA7f3Pi0rB9gdBuVubs89FGA8VkRYA4g0l78poADgdfrScgf7NndSg9mm7cR7PJyY0+t22KaGw==",
+      "license": "Apache-2.0"
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/app-compat": {
+      "version": "0.5.12",
+      "resolved": "https://registry.npmjs.org/@firebase/app-compat/-/app-compat-0.5.12.tgz",
+      "integrity": "sha512-Pe513OBerK/CIBxz4/za9atd5MsZtd6DzHz4cmqkvkrcDWhQChAoHBpZ3McuZNuSP8YZiKwfX/J1frR07l15/w==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@firebase/app": "0.14.12",
+        "@firebase/component": "0.7.3",
+        "@firebase/logger": "0.5.1",
+        "@firebase/util": "1.15.1",
+        "tslib": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=20.0.0"
+      }
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/app-types": {
+      "version": "0.9.5",
+      "resolved": "https://registry.npmjs.org/@firebase/app-types/-/app-types-0.9.5.tgz",
+      "integrity": "sha512-YevqTjvo7Iujsa9Dwowmd6dSoElhzmD63ZSrq6bzjvQ6POjYgNjOFHLmNIgJs48eNO093NCERibuFnxbfOvU7A==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@firebase/logger": "0.5.1"
+      }
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/auth": {
+      "version": "1.13.1",
+      "resolved": "https://registry.npmjs.org/@firebase/auth/-/auth-1.13.1.tgz",
+      "integrity": "sha512-/1nkKY/MicI+I9WWcx6R4NKs77AaW9NQ0IwsFdUBomWrW0/cXEmopfM2dtLm2oI1qG6z6vom3CXZDHJIJXoMuw==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@firebase/component": "0.7.3",
+        "@firebase/logger": "0.5.1",
+        "@firebase/util": "1.15.1",
+        "tslib": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=20.0.0"
+      },
+      "peerDependencies": {
+        "@firebase/app": "0.x",
+        "@react-native-async-storage/async-storage": "^2.2.0 || ^3.0.0"
+      },
+      "peerDependenciesMeta": {
+        "@react-native-async-storage/async-storage": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/auth-compat": {
+      "version": "0.6.6",
+      "resolved": "https://registry.npmjs.org/@firebase/auth-compat/-/auth-compat-0.6.6.tgz",
+      "integrity": "sha512-KDJ/GAf/rt7galOpn3DRb2buFfGkZCsHTryKjXDG0eeRnok4+2B4nnkMOMdjRnPkElmcJv2Ao0vEA6kp5m98PQ==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@firebase/auth": "1.13.1",
+        "@firebase/auth-types": "0.13.1",
+        "@firebase/component": "0.7.3",
+        "@firebase/util": "1.15.1",
+        "tslib": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=20.0.0"
+      },
+      "peerDependencies": {
+        "@firebase/app-compat": "0.x"
+      }
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/auth-interop-types": {
+      "version": "0.2.5",
+      "resolved": "https://registry.npmjs.org/@firebase/auth-interop-types/-/auth-interop-types-0.2.5.tgz",
+      "integrity": "sha512-1Li/YuBDBAXcKv7BzY4U28gontUmAaw53sYiqbaVOMCFb2lFKK/c3CGMUWqtwe7+TXrl3poWnTCL5umYBg85Eg==",
+      "license": "Apache-2.0"
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/auth-types": {
+      "version": "0.13.1",
+      "resolved": "https://registry.npmjs.org/@firebase/auth-types/-/auth-types-0.13.1.tgz",
+      "integrity": "sha512-0c1Mnid0uMDfGJHeUS4zfvBa4/CedJXotGy/n/NZJnBjwiJawt0ZYU+wH2VAVLiRCEfG2ncCkAX3yd1/2nrB7g==",
+      "license": "Apache-2.0",
+      "peerDependencies": {
+        "@firebase/app-types": "0.x",
+        "@firebase/util": "1.x"
+      }
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/component": {
+      "version": "0.7.3",
+      "resolved": "https://registry.npmjs.org/@firebase/component/-/component-0.7.3.tgz",
+      "integrity": "sha512-wFofIaa2879ogD/WvkjYXJxRmfnL0scen6ORgaC3na1FNOR9ASIUANQdhqQcmWu/h77/pVHY7ch5flewa5Bcew==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@firebase/util": "1.15.1",
+        "tslib": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=20.0.0"
+      }
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/data-connect": {
+      "version": "0.7.0",
+      "resolved": "https://registry.npmjs.org/@firebase/data-connect/-/data-connect-0.7.0.tgz",
+      "integrity": "sha512-ar9sNOJh5poQCSMSVlnVE8eo8+usTD1POWDCv65omkKUvnFMcdXaQ7J/e7WGKqJzcEMgiezSX/TZiKHZkItMbQ==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@firebase/auth-interop-types": "0.2.5",
+        "@firebase/component": "0.7.3",
+        "@firebase/logger": "0.5.1",
+        "@firebase/util": "1.15.1",
+        "tslib": "^2.1.0"
+      },
+      "peerDependencies": {
+        "@firebase/app": "0.x"
+      }
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/database": {
+      "version": "1.1.3",
+      "resolved": "https://registry.npmjs.org/@firebase/database/-/database-1.1.3.tgz",
+      "integrity": "sha512-XwWCa+E4TvNGpGwXrycLRNfdogADwFcvuhyow6wDWma9W54roaQIhe+4PM0KiLsIftBdSCGI7OKCXrdSRHbIhw==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@firebase/app-check-interop-types": "0.3.4",
+        "@firebase/auth-interop-types": "0.2.5",
+        "@firebase/component": "0.7.3",
+        "@firebase/logger": "0.5.1",
+        "@firebase/util": "1.15.1",
+        "faye-websocket": "0.11.4",
+        "tslib": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=20.0.0"
+      }
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/database-compat": {
+      "version": "2.1.4",
+      "resolved": "https://registry.npmjs.org/@firebase/database-compat/-/database-compat-2.1.4.tgz",
+      "integrity": "sha512-3pK35F1MAgmqFJQlf2nhQl44vtAXQO1uaCaQOEUI9kCRtLFqi7N+QRKR7lFZPg+xIZIyubgxQaxY69YgfZRZWg==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@firebase/component": "0.7.3",
+        "@firebase/database": "1.1.3",
+        "@firebase/database-types": "1.0.20",
+        "@firebase/logger": "0.5.1",
+        "@firebase/util": "1.15.1",
+        "tslib": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=20.0.0"
+      }
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/database-types": {
+      "version": "1.0.20",
+      "resolved": "https://registry.npmjs.org/@firebase/database-types/-/database-types-1.0.20.tgz",
+      "integrity": "sha512-kegbOk/w8iU64pr0q6k2ItyNGjnQBMHFhwS7ohdWI4W+pc0/zhhdGXTdFj6X1oxItRjPoYOsSQmERgBkn/ihxw==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@firebase/app-types": "0.9.5",
+        "@firebase/util": "1.15.1"
+      }
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/firestore": {
+      "version": "4.14.1",
+      "resolved": "https://registry.npmjs.org/@firebase/firestore/-/firestore-4.14.1.tgz",
+      "integrity": "sha512-PouS0NJZ3NYOZE/tPDvXa8VUeJ10Ll//7jIdFvMYdhQkd/P3O7nlqhyoTmY0h8Xa9hxg+H0j6gxUytJcoZ9YOg==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@firebase/component": "0.7.3",
+        "@firebase/logger": "0.5.1",
+        "@firebase/util": "1.15.1",
+        "@firebase/webchannel-wrapper": "1.0.6",
+        "@grpc/grpc-js": "~1.9.0",
+        "@grpc/proto-loader": "^0.7.8",
+        "tslib": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=20.0.0"
+      },
+      "peerDependencies": {
+        "@firebase/app": "0.x"
+      }
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/firestore-compat": {
+      "version": "0.4.9",
+      "resolved": "https://registry.npmjs.org/@firebase/firestore-compat/-/firestore-compat-0.4.9.tgz",
+      "integrity": "sha512-NPtBuFr79BbIQJXFWhW4xFC6rBksK8/ewqCTYbbAYfZBDDx0/iHTUj4WpKi5D4d0Pn2Md/3T/e5V9379G5N/Zg==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@firebase/component": "0.7.3",
+        "@firebase/firestore": "4.14.1",
+        "@firebase/firestore-types": "3.0.4",
+        "@firebase/util": "1.15.1",
+        "tslib": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=20.0.0"
+      },
+      "peerDependencies": {
+        "@firebase/app-compat": "0.x"
+      }
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/firestore-types": {
+      "version": "3.0.4",
+      "resolved": "https://registry.npmjs.org/@firebase/firestore-types/-/firestore-types-3.0.4.tgz",
+      "integrity": "sha512-jGn+JSS4X9zZsrfu7Yw66v5YRdOLD1oyQh4USR0xWl4CUqV/DA6bNIXRPpxH/cUl3iVTNiP6MN7g+EL42A4qfA==",
+      "license": "Apache-2.0",
+      "peerDependencies": {
+        "@firebase/app-types": "0.x",
+        "@firebase/util": "1.x"
+      }
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/functions": {
+      "version": "0.13.4",
+      "resolved": "https://registry.npmjs.org/@firebase/functions/-/functions-0.13.4.tgz",
+      "integrity": "sha512-oB5rpm2Emxn2+IS1gRelAeT/5tSZMwM/KhqC5LnJsmTNnS1ZDhD7ZMZNgCI8vchTW6PbaXIwEnpUryGuIQsNbg==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@firebase/app-check-interop-types": "0.3.4",
+        "@firebase/auth-interop-types": "0.2.5",
+        "@firebase/component": "0.7.3",
+        "@firebase/messaging-interop-types": "0.2.4",
+        "@firebase/util": "1.15.1",
+        "tslib": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=20.0.0"
+      },
+      "peerDependencies": {
+        "@firebase/app": "0.x"
+      }
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/functions-compat": {
+      "version": "0.4.4",
+      "resolved": "https://registry.npmjs.org/@firebase/functions-compat/-/functions-compat-0.4.4.tgz",
+      "integrity": "sha512-Be+MwhseVf/eFAZwGrFJGok6S7cmsLrAPK8MgyM8LjM0MewTsx2n01WOOca9jio1UsCZOJ0aVyQobnINcdNuIQ==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@firebase/component": "0.7.3",
+        "@firebase/functions": "0.13.4",
+        "@firebase/functions-types": "0.6.4",
+        "@firebase/util": "1.15.1",
+        "tslib": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=20.0.0"
+      },
+      "peerDependencies": {
+        "@firebase/app-compat": "0.x"
+      }
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/functions-types": {
+      "version": "0.6.4",
+      "resolved": "https://registry.npmjs.org/@firebase/functions-types/-/functions-types-0.6.4.tgz",
+      "integrity": "sha512-zV6kgqtduR4rUAdC/ilS7kmb93XD7bEZoJDlVBZqlOw2uGGGCNBQBuleww2rr0Ulr3L9o2TDjumEt68/l1f9DQ==",
+      "license": "Apache-2.0"
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/installations": {
+      "version": "0.6.22",
+      "resolved": "https://registry.npmjs.org/@firebase/installations/-/installations-0.6.22.tgz",
+      "integrity": "sha512-ef6nn3GGQTdReCfotRMG77PJZu8CqEbiK5pEoBnM0gTu/Z9v0i/az2p3HABsa/1beQmmyh1OsOjf7P5+pgwdZw==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@firebase/component": "0.7.3",
+        "@firebase/util": "1.15.1",
+        "idb": "7.1.1",
+        "tslib": "^2.1.0"
+      },
+      "peerDependencies": {
+        "@firebase/app": "0.x"
+      }
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/installations-compat": {
+      "version": "0.2.22",
+      "resolved": "https://registry.npmjs.org/@firebase/installations-compat/-/installations-compat-0.2.22.tgz",
+      "integrity": "sha512-C/zpAuTP5S9OgKSPvXRupw3hoY/JZSlA1wFjD/Sb7LIQE0FNbcMdO8Y4KXVEkjVzma/DDDDIAzxEXqKMAzc88w==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@firebase/component": "0.7.3",
+        "@firebase/installations": "0.6.22",
+        "@firebase/installations-types": "0.5.4",
+        "@firebase/util": "1.15.1",
+        "tslib": "^2.1.0"
+      },
+      "peerDependencies": {
+        "@firebase/app-compat": "0.x"
+      }
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/installations-types": {
+      "version": "0.5.4",
+      "resolved": "https://registry.npmjs.org/@firebase/installations-types/-/installations-types-0.5.4.tgz",
+      "integrity": "sha512-U2eFapdHwjb43Vx9o+Pmj4dFfvcHEK1IirEFLqMtWrTHvmdrS3gBpBD1kmJk/9HjsOtoHZxJ2Paoe79e+L1ZPg==",
+      "license": "Apache-2.0",
+      "peerDependencies": {
+        "@firebase/app-types": "0.x"
+      }
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/logger": {
+      "version": "0.5.1",
+      "resolved": "https://registry.npmjs.org/@firebase/logger/-/logger-0.5.1.tgz",
+      "integrity": "sha512-vZKLsqE1ABOy8OjQiE7cUTFn4gvaqlk88yp8N94Pk/sDpq61YqZGqmVFZTvOyflTwuYFcWirBdYGoJgbDaXKYQ==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "tslib": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=20.0.0"
+      }
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/messaging": {
+      "version": "0.12.26",
+      "resolved": "https://registry.npmjs.org/@firebase/messaging/-/messaging-0.12.26.tgz",
+      "integrity": "sha512-lHVTO9uLofymHVWkYeUtMddIPcmJvSzVbHRB88W6XKfxbcKF+p3QrfqKhDxremSB4NQjUla1Gwn7d9umSMmt/w==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@firebase/component": "0.7.3",
+        "@firebase/installations": "0.6.22",
+        "@firebase/messaging-interop-types": "0.2.4",
+        "@firebase/util": "1.15.1",
+        "idb": "7.1.1",
+        "tslib": "^2.1.0"
+      },
+      "peerDependencies": {
+        "@firebase/app": "0.x"
+      }
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/messaging-compat": {
+      "version": "0.2.26",
+      "resolved": "https://registry.npmjs.org/@firebase/messaging-compat/-/messaging-compat-0.2.26.tgz",
+      "integrity": "sha512-fn0XvWOfK4tsDLSipwJUW9Cp6ahWA6z+iJHxZ0pHp9MzMSUNQx85yuxZAuI7gkGXfqs7+DqEDHyyS7jDGswrmQ==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@firebase/component": "0.7.3",
+        "@firebase/messaging": "0.12.26",
+        "@firebase/util": "1.15.1",
+        "tslib": "^2.1.0"
+      },
+      "peerDependencies": {
+        "@firebase/app-compat": "0.x"
+      }
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/messaging-interop-types": {
+      "version": "0.2.4",
+      "resolved": "https://registry.npmjs.org/@firebase/messaging-interop-types/-/messaging-interop-types-0.2.4.tgz",
+      "integrity": "sha512-wrzITQq+xw5LtygX7O0fu43/k9ABQ4x5H9/sR5m1SbNnhIRI5xd3+raSNJaJkYC4BUhM9A4ZNSnyR2sjhxnb2Q==",
+      "license": "Apache-2.0"
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/performance": {
+      "version": "0.7.12",
+      "resolved": "https://registry.npmjs.org/@firebase/performance/-/performance-0.7.12.tgz",
+      "integrity": "sha512-fe7nV8teUU3OBHlMUZ9Lw4gLhCW2k4m5Uc3pfWGV+fl8uwJQBGp9Q3lqsJ+HSrFu3Q2pJyLAgrClPGSKyDeYgQ==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@firebase/component": "0.7.3",
+        "@firebase/installations": "0.6.22",
+        "@firebase/logger": "0.5.1",
+        "@firebase/util": "1.15.1",
+        "tslib": "^2.1.0",
+        "web-vitals": "^4.2.4"
+      },
+      "peerDependencies": {
+        "@firebase/app": "0.x"
+      }
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/performance-compat": {
+      "version": "0.2.25",
+      "resolved": "https://registry.npmjs.org/@firebase/performance-compat/-/performance-compat-0.2.25.tgz",
+      "integrity": "sha512-q6NjTXpIPoFuUmCmMN/maCdTgzT6aExs9xZo+PxfVLj6uLVGvpyAD6XWjmcrb7jChsFBYbq7E5dyNDF7Zhy9kA==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@firebase/component": "0.7.3",
+        "@firebase/logger": "0.5.1",
+        "@firebase/performance": "0.7.12",
+        "@firebase/performance-types": "0.2.4",
+        "@firebase/util": "1.15.1",
+        "tslib": "^2.1.0"
+      },
+      "peerDependencies": {
+        "@firebase/app-compat": "0.x"
+      }
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/performance-types": {
+      "version": "0.2.4",
+      "resolved": "https://registry.npmjs.org/@firebase/performance-types/-/performance-types-0.2.4.tgz",
+      "integrity": "sha512-kJSEk7b0uhpcPRyL4SQ/GPujLqk52XNKcXlnsKDbWGAb9vugcLvOU3u6zfEdwd+d8hWJb5S5ZizV1JFFI0nkKg==",
+      "license": "Apache-2.0"
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/remote-config": {
+      "version": "0.8.3",
+      "resolved": "https://registry.npmjs.org/@firebase/remote-config/-/remote-config-0.8.3.tgz",
+      "integrity": "sha512-ggGKAaLy9YNOvpFoQZgm5p5SiFw3ZFtwti08dojnBQmQicpThTxvG5xZMSpCTYMj2o3gM/yK9CVd2w+kZub8YA==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@firebase/component": "0.7.3",
+        "@firebase/installations": "0.6.22",
+        "@firebase/logger": "0.5.1",
+        "@firebase/util": "1.15.1",
+        "tslib": "^2.1.0"
+      },
+      "peerDependencies": {
+        "@firebase/app": "0.x"
+      }
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/remote-config-compat": {
+      "version": "0.2.24",
+      "resolved": "https://registry.npmjs.org/@firebase/remote-config-compat/-/remote-config-compat-0.2.24.tgz",
+      "integrity": "sha512-EWZTt6fJ7YmPHodQNsSxAIDZY2x8P5kRPvXAc5CmzzBm+NyPFhODbfDsNllDXDL8jlzp50bVWjDY+BXepZS9Mg==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@firebase/component": "0.7.3",
+        "@firebase/logger": "0.5.1",
+        "@firebase/remote-config": "0.8.3",
+        "@firebase/remote-config-types": "0.5.1",
+        "@firebase/util": "1.15.1",
+        "tslib": "^2.1.0"
+      },
+      "peerDependencies": {
+        "@firebase/app-compat": "0.x"
+      }
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/remote-config-types": {
+      "version": "0.5.1",
+      "resolved": "https://registry.npmjs.org/@firebase/remote-config-types/-/remote-config-types-0.5.1.tgz",
+      "integrity": "sha512-cX/1LT6KQwkXzck2eSzeKnuvXZCyr8qaPpDcikoJs7jmI+oBOXixpDLeDtWj1U6GNMkIoXrEDNoyT2Ypcyp5/A==",
+      "license": "Apache-2.0"
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/storage": {
+      "version": "0.14.3",
+      "resolved": "https://registry.npmjs.org/@firebase/storage/-/storage-0.14.3.tgz",
+      "integrity": "sha512-YX4/YL6P6/fufSSeGnVhjWddcIXbFq2cWIhMKFTZo1E/Rtcl2mJj/BYUQTwJfcE1Tl8un1FOya4L05jcSLN/Eg==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@firebase/component": "0.7.3",
+        "@firebase/util": "1.15.1",
+        "tslib": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=20.0.0"
+      },
+      "peerDependencies": {
+        "@firebase/app": "0.x"
+      }
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/storage-compat": {
+      "version": "0.4.3",
+      "resolved": "https://registry.npmjs.org/@firebase/storage-compat/-/storage-compat-0.4.3.tgz",
+      "integrity": "sha512-gruVqjtUGX8tEoeNbaWXZm0Zfcfcb7fvmDmBxV8yPAbWvExRnZYLO2+qw9idxNE7BvPXt5csyjSYHy//dAizxw==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@firebase/component": "0.7.3",
+        "@firebase/storage": "0.14.3",
+        "@firebase/storage-types": "0.8.4",
+        "@firebase/util": "1.15.1",
+        "tslib": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=20.0.0"
+      },
+      "peerDependencies": {
+        "@firebase/app-compat": "0.x"
+      }
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/storage-types": {
+      "version": "0.8.4",
+      "resolved": "https://registry.npmjs.org/@firebase/storage-types/-/storage-types-0.8.4.tgz",
+      "integrity": "sha512-BT7cwxJOx8SWwlQfrlC+bD/Sk3Cw+1odCi8UZNFNWTVZoPsBnA5W+mqtZzVnvsdJpXCFGSGQ7R7vOR6dtM/BRA==",
+      "license": "Apache-2.0",
+      "peerDependencies": {
+        "@firebase/app-types": "0.x",
+        "@firebase/util": "1.x"
+      }
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/util": {
+      "version": "1.15.1",
+      "resolved": "https://registry.npmjs.org/@firebase/util/-/util-1.15.1.tgz",
+      "integrity": "sha512-LUdM4Wg7YM9Pq/49nGYySJA0CSQEKnGffFzWV8+6gXN7mGxn+FL1IqvFbuZUtAQcfZgHYDwCE1wwlK7rB7gl2g==",
+      "hasInstallScript": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "tslib": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=20.0.0"
+      }
+    },
+    "node_modules/@angular/fire/node_modules/@firebase/webchannel-wrapper": {
+      "version": "1.0.6",
+      "resolved": "https://registry.npmjs.org/@firebase/webchannel-wrapper/-/webchannel-wrapper-1.0.6.tgz",
+      "integrity": "sha512-Vr/Mqu79dMwGRAyGbJ4uN4+BtXB3/mRTdzetD1daWNeG8QaWuzhhbG77GltO5c0yYmYls8i250iX73624GJd7Q==",
+      "license": "Apache-2.0"
+    },
+    "node_modules/@angular/fire/node_modules/firebase": {
+      "version": "12.13.0",
+      "resolved": "https://registry.npmjs.org/firebase/-/firebase-12.13.0.tgz",
+      "integrity": "sha512-iutR8ejvAqk6qUClnsPz3U3VIjTWp243AX4cD3iifak5t56to1J29xUIQgSDDzaAqKvhshZerzSahwMQj2TlvA==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@firebase/ai": "2.12.0",
+        "@firebase/analytics": "0.10.22",
+        "@firebase/analytics-compat": "0.2.28",
+        "@firebase/app": "0.14.12",
+        "@firebase/app-check": "0.11.3",
+        "@firebase/app-check-compat": "0.4.3",
+        "@firebase/app-compat": "0.5.12",
+        "@firebase/app-types": "0.9.5",
+        "@firebase/auth": "1.13.1",
+        "@firebase/auth-compat": "0.6.6",
+        "@firebase/data-connect": "0.7.0",
+        "@firebase/database": "1.1.3",
+        "@firebase/database-compat": "2.1.4",
+        "@firebase/firestore": "4.14.1",
+        "@firebase/firestore-compat": "0.4.9",
+        "@firebase/functions": "0.13.4",
+        "@firebase/functions-compat": "0.4.4",
+        "@firebase/installations": "0.6.22",
+        "@firebase/installations-compat": "0.2.22",
+        "@firebase/messaging": "0.12.26",
+        "@firebase/messaging-compat": "0.2.26",
+        "@firebase/performance": "0.7.12",
+        "@firebase/performance-compat": "0.2.25",
+        "@firebase/remote-config": "0.8.3",
+        "@firebase/remote-config-compat": "0.2.24",
+        "@firebase/storage": "0.14.3",
+        "@firebase/storage-compat": "0.4.3",
+        "@firebase/util": "1.15.1"
+      }
+    },
+    "node_modules/@angular/forms": {
+      "version": "21.2.14",
+      "resolved": "https://registry.npmjs.org/@angular/forms/-/forms-21.2.14.tgz",
+      "integrity": "sha512-HQYIybyMt0CrI31rW6vXbiDsSM2DDtTcOVeT/nWDRNCoqBrREDg8rVsm2Y+fUMsiQVJNa6dCXPwvYhjzJ4r7ug==",
+      "license": "MIT",
+      "dependencies": {
+        "@standard-schema/spec": "^1.0.0",
+        "tslib": "^2.3.0"
+      },
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
+      },
+      "peerDependencies": {
+        "@angular/common": "21.2.14",
+        "@angular/core": "21.2.14",
+        "@angular/platform-browser": "21.2.14",
+        "rxjs": "^6.5.3 || ^7.4.0"
+      }
+    },
+    "node_modules/@angular/google-maps": {
+      "version": "21.2.12",
+      "resolved": "https://registry.npmjs.org/@angular/google-maps/-/google-maps-21.2.12.tgz",
+      "integrity": "sha512-qzdS6Q1iNz+PuxDkuM1Iecva3ouCMYv9y6bekfrMzuKrMumaiSpHBJJRBESB3YTyJiG8aa+UDrCgwSZc3iWY/g==",
+      "license": "MIT",
+      "dependencies": {
+        "@types/google.maps": "^3.54.10",
+        "tslib": "^2.3.0"
+      },
+      "peerDependencies": {
+        "@angular/common": "^21.0.0 || ^22.0.0",
+        "@angular/core": "^21.0.0 || ^22.0.0",
+        "rxjs": "^6.5.3 || ^7.4.0"
+      }
+    },
+    "node_modules/@angular/material": {
+      "version": "21.2.14",
+      "resolved": "https://registry.npmjs.org/@angular/material/-/material-21.2.14.tgz",
+      "integrity": "sha512-fMQca8VRtei93JRRG9qQ+u08DCb0nga59Esoakq5yx3+A1NfdpFeUS1tBns56U04o8KAaIAwZK3NBqXz8ZKNqg==",
+      "license": "MIT",
+      "dependencies": {
+        "tslib": "^2.3.0"
+      },
+      "peerDependencies": {
+        "@angular/cdk": "21.2.14",
+        "@angular/common": "^21.0.0 || ^22.0.0",
+        "@angular/core": "^21.0.0 || ^22.0.0",
+        "@angular/forms": "^21.0.0 || ^22.0.0",
+        "@angular/platform-browser": "^21.0.0 || ^22.0.0",
+        "rxjs": "^6.5.3 || ^7.4.0"
+      }
+    },
+    "node_modules/@angular/platform-browser": {
+      "version": "21.2.14",
+      "resolved": "https://registry.npmjs.org/@angular/platform-browser/-/platform-browser-21.2.14.tgz",
+      "integrity": "sha512-34tBwxh86yN2YifBDhCesm6N+nn9WcbuXjRwfo0mTme15OZ/zt56yw7v1mcK3UFLegIIALtsIgpXXrPWWQoKkA==",
+      "license": "MIT",
+      "dependencies": {
+        "tslib": "^2.3.0"
+      },
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
+      },
+      "peerDependencies": {
+        "@angular/animations": "21.2.14",
+        "@angular/common": "21.2.14",
+        "@angular/core": "21.2.14"
+      },
+      "peerDependenciesMeta": {
+        "@angular/animations": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@angular/platform-browser-dynamic": {
+      "version": "21.2.14",
+      "resolved": "https://registry.npmjs.org/@angular/platform-browser-dynamic/-/platform-browser-dynamic-21.2.14.tgz",
+      "integrity": "sha512-m5U4zX8JFnxTAIGpsBXIAyefSmYqdORY/OfHC0aMmZovuFCbXXIYqYRQDBB7+YVNpSDSHllCrKEZFu/CC6dq3g==",
+      "license": "MIT",
+      "dependencies": {
+        "tslib": "^2.3.0"
+      },
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
+      },
+      "peerDependencies": {
+        "@angular/common": "21.2.14",
+        "@angular/compiler": "21.2.14",
+        "@angular/core": "21.2.14",
+        "@angular/platform-browser": "21.2.14"
+      }
+    },
+    "node_modules/@angular/router": {
+      "version": "21.2.14",
+      "resolved": "https://registry.npmjs.org/@angular/router/-/router-21.2.14.tgz",
+      "integrity": "sha512-Yo3LdgcqkfMu2/Ycl8o/4QjCBqZhtA+a7B8JVdW5cWdrpFTxKCOrzm+YRUMuIFmH5nzSv9oGnUuz64uk1+7r5Q==",
+      "license": "MIT",
+      "dependencies": {
+        "tslib": "^2.3.0"
+      },
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
+      },
+      "peerDependencies": {
+        "@angular/common": "21.2.14",
+        "@angular/core": "21.2.14",
+        "@angular/platform-browser": "21.2.14",
+        "rxjs": "^6.5.3 || ^7.4.0"
+      }
+    },
+    "node_modules/@asamuzakjp/css-color": {
+      "version": "4.1.2",
+      "resolved": "https://registry.npmjs.org/@asamuzakjp/css-color/-/css-color-4.1.2.tgz",
+      "integrity": "sha512-NfBUvBaYgKIuq6E/RBLY1m0IohzNHAYyaJGuTK79Z23uNwmz2jl1mPsC5ZxCCxylinKhT1Amn5oNTlx1wN8cQg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@csstools/css-calc": "^3.0.0",
+        "@csstools/css-color-parser": "^4.0.1",
+        "@csstools/css-parser-algorithms": "^4.0.0",
+        "@csstools/css-tokenizer": "^4.0.0",
+        "lru-cache": "^11.2.5"
+      }
+    },
+    "node_modules/@asamuzakjp/css-color/node_modules/lru-cache": {
+      "version": "11.5.0",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-11.5.0.tgz",
+      "integrity": "sha512-5YgH9UJd7wVb9hIouI2adWpgqrrICkt070Dnj8EUY1+B4B2P9eRLPAkAAo6NICA7CEhOIeBHl46u9zSNpNu7zA==",
+      "dev": true,
+      "license": "BlueOak-1.0.0",
+      "engines": {
+        "node": "20 || >=22"
+      }
+    },
+    "node_modules/@asamuzakjp/dom-selector": {
+      "version": "6.8.1",
+      "resolved": "https://registry.npmjs.org/@asamuzakjp/dom-selector/-/dom-selector-6.8.1.tgz",
+      "integrity": "sha512-MvRz1nCqW0fsy8Qz4dnLIvhOlMzqDVBabZx6lH+YywFDdjXhMY37SmpV1XFX3JzG5GWHn63j6HX6QPr3lZXHvQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@asamuzakjp/nwsapi": "^2.3.9",
+        "bidi-js": "^1.0.3",
+        "css-tree": "^3.1.0",
+        "is-potential-custom-element-name": "^1.0.1",
+        "lru-cache": "^11.2.6"
+      }
+    },
+    "node_modules/@asamuzakjp/dom-selector/node_modules/lru-cache": {
+      "version": "11.5.0",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-11.5.0.tgz",
+      "integrity": "sha512-5YgH9UJd7wVb9hIouI2adWpgqrrICkt070Dnj8EUY1+B4B2P9eRLPAkAAo6NICA7CEhOIeBHl46u9zSNpNu7zA==",
+      "dev": true,
+      "license": "BlueOak-1.0.0",
+      "engines": {
+        "node": "20 || >=22"
+      }
+    },
+    "node_modules/@asamuzakjp/nwsapi": {
+      "version": "2.3.9",
+      "resolved": "https://registry.npmjs.org/@asamuzakjp/nwsapi/-/nwsapi-2.3.9.tgz",
+      "integrity": "sha512-n8GuYSrI9bF7FFZ/SjhwevlHc8xaVlb/7HmHelnc/PZXBD2ZR49NnN9sMMuDdEGPeeRQ5d0hqlSlEpgCX3Wl0Q==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@babel/code-frame": {
+      "version": "7.29.0",
+      "resolved": "https://registry.npmjs.org/@babel/code-frame/-/code-frame-7.29.0.tgz",
+      "integrity": "sha512-9NhCeYjq9+3uxgdtp20LSiJXJvN0FeCtNGpJxuMFZ1Kv3cWUNb6DOhJwUvcVCzKGR66cw4njwM6hrJLqgOwbcw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/helper-validator-identifier": "^7.28.5",
+        "js-tokens": "^4.0.0",
+        "picocolors": "^1.1.1"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/compat-data": {
+      "version": "7.29.3",
+      "resolved": "https://registry.npmjs.org/@babel/compat-data/-/compat-data-7.29.3.tgz",
+      "integrity": "sha512-LIVqM46zQWZhj17qA8wb4nW/ixr2y1Nw+r1etiAWgRM6U1IqP+LNhL1yg440jYZR72jCWcWbLWzIosH+uP1fqg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/core": {
+      "version": "7.29.0",
+      "resolved": "https://registry.npmjs.org/@babel/core/-/core-7.29.0.tgz",
+      "integrity": "sha512-CGOfOJqWjg2qW/Mb6zNsDm+u5vFQ8DxXfbM09z69p5Z6+mE1ikP2jUXw+j42Pf1XTYED2Rni5f95npYeuwMDQA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/code-frame": "^7.29.0",
+        "@babel/generator": "^7.29.0",
+        "@babel/helper-compilation-targets": "^7.28.6",
+        "@babel/helper-module-transforms": "^7.28.6",
+        "@babel/helpers": "^7.28.6",
+        "@babel/parser": "^7.29.0",
+        "@babel/template": "^7.28.6",
+        "@babel/traverse": "^7.29.0",
+        "@babel/types": "^7.29.0",
+        "@jridgewell/remapping": "^2.3.5",
+        "convert-source-map": "^2.0.0",
+        "debug": "^4.1.0",
+        "gensync": "^1.0.0-beta.2",
+        "json5": "^2.2.3",
+        "semver": "^6.3.1"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/babel"
+      }
+    },
+    "node_modules/@babel/core/node_modules/convert-source-map": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-2.0.0.tgz",
+      "integrity": "sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@babel/core/node_modules/semver": {
+      "version": "6.3.1",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
+      "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
+      "dev": true,
+      "license": "ISC",
+      "bin": {
+        "semver": "bin/semver.js"
+      }
+    },
+    "node_modules/@babel/generator": {
+      "version": "7.29.1",
+      "resolved": "https://registry.npmjs.org/@babel/generator/-/generator-7.29.1.tgz",
+      "integrity": "sha512-qsaF+9Qcm2Qv8SRIMMscAvG4O3lJ0F1GuMo5HR/Bp02LopNgnZBC/EkbevHFeGs4ls/oPz9v+Bsmzbkbe+0dUw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/parser": "^7.29.0",
+        "@babel/types": "^7.29.0",
+        "@jridgewell/gen-mapping": "^0.3.12",
+        "@jridgewell/trace-mapping": "^0.3.28",
+        "jsesc": "^3.0.2"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/helper-annotate-as-pure": {
+      "version": "7.27.3",
+      "resolved": "https://registry.npmjs.org/@babel/helper-annotate-as-pure/-/helper-annotate-as-pure-7.27.3.tgz",
+      "integrity": "sha512-fXSwMQqitTGeHLBC08Eq5yXz2m37E4pJX1qAU1+2cNedz/ifv/bVXft90VeSav5nFO61EcNgwr0aJxbyPaWBPg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/types": "^7.27.3"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/helper-compilation-targets": {
+      "version": "7.28.6",
+      "resolved": "https://registry.npmjs.org/@babel/helper-compilation-targets/-/helper-compilation-targets-7.28.6.tgz",
+      "integrity": "sha512-JYtls3hqi15fcx5GaSNL7SCTJ2MNmjrkHXg4FSpOA/grxK8KwyZ5bubHsCq8FXCkua6xhuaaBit+3b7+VZRfcA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/compat-data": "^7.28.6",
+        "@babel/helper-validator-option": "^7.27.1",
+        "browserslist": "^4.24.0",
+        "lru-cache": "^5.1.1",
+        "semver": "^6.3.1"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/helper-compilation-targets/node_modules/semver": {
+      "version": "6.3.1",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.1.tgz",
+      "integrity": "sha512-BR7VvDCVHO+q2xBEWskxS6DJE1qRnb7DxzUrogb71CWoSficBxYsiAGd+Kl0mmq/MprG9yArRkyrQxTO6XjMzA==",
+      "dev": true,
+      "license": "ISC",
+      "bin": {
+        "semver": "bin/semver.js"
+      }
+    },
+    "node_modules/@babel/helper-globals": {
+      "version": "7.28.0",
+      "resolved": "https://registry.npmjs.org/@babel/helper-globals/-/helper-globals-7.28.0.tgz",
+      "integrity": "sha512-+W6cISkXFa1jXsDEdYA8HeevQT/FULhxzR99pxphltZcVaugps53THCeiWA8SguxxpSp3gKPiuYfSWopkLQ4hw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/helper-module-imports": {
+      "version": "7.28.6",
+      "resolved": "https://registry.npmjs.org/@babel/helper-module-imports/-/helper-module-imports-7.28.6.tgz",
+      "integrity": "sha512-l5XkZK7r7wa9LucGw9LwZyyCUscb4x37JWTPz7swwFE/0FMQAGpiWUZn8u9DzkSBWEcK25jmvubfpw2dnAMdbw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/traverse": "^7.28.6",
+        "@babel/types": "^7.28.6"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/helper-module-transforms": {
+      "version": "7.28.6",
+      "resolved": "https://registry.npmjs.org/@babel/helper-module-transforms/-/helper-module-transforms-7.28.6.tgz",
+      "integrity": "sha512-67oXFAYr2cDLDVGLXTEABjdBJZ6drElUSI7WKp70NrpyISso3plG9SAGEF6y7zbha/wOzUByWWTJvEDVNIUGcA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/helper-module-imports": "^7.28.6",
+        "@babel/helper-validator-identifier": "^7.28.5",
+        "@babel/traverse": "^7.28.6"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      },
+      "peerDependencies": {
+        "@babel/core": "^7.0.0"
+      }
+    },
+    "node_modules/@babel/helper-split-export-declaration": {
+      "version": "7.24.7",
+      "resolved": "https://registry.npmjs.org/@babel/helper-split-export-declaration/-/helper-split-export-declaration-7.24.7.tgz",
+      "integrity": "sha512-oy5V7pD+UvfkEATUKvIjvIAH/xCzfsFVw7ygW2SI6NClZzquT+mwdTfgfdbUiceh6iQO0CHtCPsyze/MZ2YbAA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/types": "^7.24.7"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/helper-string-parser": {
+      "version": "7.27.1",
+      "resolved": "https://registry.npmjs.org/@babel/helper-string-parser/-/helper-string-parser-7.27.1.tgz",
+      "integrity": "sha512-qMlSxKbpRlAridDExk92nSobyDdpPijUq2DW6oDnUqd0iOGxmQjyqhMIihI9+zv4LPyZdRje2cavWPbCbWm3eA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/helper-validator-identifier": {
+      "version": "7.28.5",
+      "resolved": "https://registry.npmjs.org/@babel/helper-validator-identifier/-/helper-validator-identifier-7.28.5.tgz",
+      "integrity": "sha512-qSs4ifwzKJSV39ucNjsvc6WVHs6b7S03sOh2OcHF9UHfVPqWWALUsNUVzhSBiItjRZoLHx7nIarVjqKVusUZ1Q==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/helper-validator-option": {
+      "version": "7.27.1",
+      "resolved": "https://registry.npmjs.org/@babel/helper-validator-option/-/helper-validator-option-7.27.1.tgz",
+      "integrity": "sha512-YvjJow9FxbhFFKDSuFnVCe2WxXk1zWc22fFePVNEaWJEu8IrZVlda6N0uHwzZrUM1il7NC9Mlp4MaJYbYd9JSg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/helpers": {
+      "version": "7.29.2",
+      "resolved": "https://registry.npmjs.org/@babel/helpers/-/helpers-7.29.2.tgz",
+      "integrity": "sha512-HoGuUs4sCZNezVEKdVcwqmZN8GoHirLUcLaYVNBK2J0DadGtdcqgr3BCbvH8+XUo4NGjNl3VOtSjEKNzqfFgKw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/template": "^7.28.6",
+        "@babel/types": "^7.29.0"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/parser": {
+      "version": "7.29.3",
+      "resolved": "https://registry.npmjs.org/@babel/parser/-/parser-7.29.3.tgz",
+      "integrity": "sha512-b3ctpQwp+PROvU/cttc4OYl4MzfJUWy6FZg+PMXfzmt/+39iHVF0sDfqay8TQM3JA2EUOyKcFZt75jWriQijsA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/types": "^7.29.0"
+      },
+      "bin": {
+        "parser": "bin/babel-parser.js"
+      },
+      "engines": {
+        "node": ">=6.0.0"
+      }
+    },
+    "node_modules/@babel/template": {
+      "version": "7.28.6",
+      "resolved": "https://registry.npmjs.org/@babel/template/-/template-7.28.6.tgz",
+      "integrity": "sha512-YA6Ma2KsCdGb+WC6UpBVFJGXL58MDA6oyONbjyF/+5sBgxY/dwkhLogbMT2GXXyU84/IhRw/2D1Os1B/giz+BQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/code-frame": "^7.28.6",
+        "@babel/parser": "^7.28.6",
+        "@babel/types": "^7.28.6"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/traverse": {
+      "version": "7.29.0",
+      "resolved": "https://registry.npmjs.org/@babel/traverse/-/traverse-7.29.0.tgz",
+      "integrity": "sha512-4HPiQr0X7+waHfyXPZpWPfWL/J7dcN1mx9gL6WdQVMbPnF3+ZhSMs8tCxN7oHddJE9fhNE7+lxdnlyemKfJRuA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/code-frame": "^7.29.0",
+        "@babel/generator": "^7.29.0",
+        "@babel/helper-globals": "^7.28.0",
+        "@babel/parser": "^7.29.0",
+        "@babel/template": "^7.28.6",
+        "@babel/types": "^7.29.0",
+        "debug": "^4.3.1"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@babel/types": {
+      "version": "7.29.0",
+      "resolved": "https://registry.npmjs.org/@babel/types/-/types-7.29.0.tgz",
+      "integrity": "sha512-LwdZHpScM4Qz8Xw2iKSzS+cfglZzJGvofQICy7W7v4caru4EaAmyUuO6BGrbyQ2mYV11W0U8j5mBhd14dd3B0A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@babel/helper-string-parser": "^7.27.1",
+        "@babel/helper-validator-identifier": "^7.28.5"
+      },
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/@csstools/color-helpers": {
+      "version": "6.0.2",
+      "resolved": "https://registry.npmjs.org/@csstools/color-helpers/-/color-helpers-6.0.2.tgz",
+      "integrity": "sha512-LMGQLS9EuADloEFkcTBR3BwV/CGHV7zyDxVRtVDTwdI2Ca4it0CCVTT9wCkxSgokjE5Ho41hEPgb8OEUwoXr6Q==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/csstools"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/csstools"
+        }
+      ],
+      "license": "MIT-0",
+      "engines": {
+        "node": ">=20.19.0"
+      }
+    },
+    "node_modules/@csstools/css-calc": {
+      "version": "3.2.1",
+      "resolved": "https://registry.npmjs.org/@csstools/css-calc/-/css-calc-3.2.1.tgz",
+      "integrity": "sha512-DtdHlgXh5ZkA43cwBcAm+huzgJiwx3ZTWVjBs94kwz2xKqSimDA3lBgCjphYgwgVUMWatSM0pDd8TILB1yrVVg==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/csstools"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/csstools"
+        }
+      ],
+      "license": "MIT",
+      "engines": {
+        "node": ">=20.19.0"
+      },
+      "peerDependencies": {
+        "@csstools/css-parser-algorithms": "^4.0.0",
+        "@csstools/css-tokenizer": "^4.0.0"
+      }
+    },
+    "node_modules/@csstools/css-color-parser": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/@csstools/css-color-parser/-/css-color-parser-4.1.1.tgz",
+      "integrity": "sha512-eZ5XOtyhK+mggRafYUWzA0tvaYOFgdY8AkgQiCJF9qNAePnUo/zmsqqYubBBb3sQ8uNUaSKTY9s9klfRaAXL0g==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/csstools"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/csstools"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "@csstools/color-helpers": "^6.0.2",
+        "@csstools/css-calc": "^3.2.1"
+      },
+      "engines": {
+        "node": ">=20.19.0"
+      },
+      "peerDependencies": {
+        "@csstools/css-parser-algorithms": "^4.0.0",
+        "@csstools/css-tokenizer": "^4.0.0"
+      }
+    },
+    "node_modules/@csstools/css-parser-algorithms": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/@csstools/css-parser-algorithms/-/css-parser-algorithms-4.0.0.tgz",
+      "integrity": "sha512-+B87qS7fIG3L5h3qwJ/IFbjoVoOe/bpOdh9hAjXbvx0o8ImEmUsGXN0inFOnk2ChCFgqkkGFQ+TpM5rbhkKe4w==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/csstools"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/csstools"
+        }
+      ],
+      "license": "MIT",
+      "engines": {
+        "node": ">=20.19.0"
+      },
+      "peerDependencies": {
+        "@csstools/css-tokenizer": "^4.0.0"
+      }
+    },
+    "node_modules/@csstools/css-syntax-patches-for-csstree": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/@csstools/css-syntax-patches-for-csstree/-/css-syntax-patches-for-csstree-1.1.4.tgz",
+      "integrity": "sha512-wgsqt92b7C7tQhIdPNxj0n9zuUbQlvAuI1exyzeNrOKOi62SD7ren8zqszmpVREjAOqg8cD2FqYhQfAuKjk4sw==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/csstools"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/csstools"
+        }
+      ],
+      "license": "MIT-0",
+      "peerDependencies": {
+        "css-tree": "^3.2.1"
+      },
+      "peerDependenciesMeta": {
+        "css-tree": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@csstools/css-tokenizer": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/@csstools/css-tokenizer/-/css-tokenizer-4.0.0.tgz",
+      "integrity": "sha512-QxULHAm7cNu72w97JUNCBFODFaXpbDg+dP8b/oWFAZ2MTRppA3U00Y2L1HqaS4J6yBqxwa/Y3nMBaxVKbB/NsA==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/csstools"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/csstools"
+        }
+      ],
+      "license": "MIT",
+      "engines": {
+        "node": ">=20.19.0"
+      }
+    },
+    "node_modules/@emnapi/core": {
+      "version": "1.10.0",
+      "resolved": "https://registry.npmjs.org/@emnapi/core/-/core-1.10.0.tgz",
+      "integrity": "sha512-yq6OkJ4p82CAfPl0u9mQebQHKPJkY7WrIuk205cTYnYe+k2Z8YBh11FrbRG/H6ihirqcacOgl2BIO8oyMQLeXw==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "@emnapi/wasi-threads": "1.2.1",
+        "tslib": "^2.4.0"
+      }
+    },
+    "node_modules/@emnapi/runtime": {
+      "version": "1.10.0",
+      "resolved": "https://registry.npmjs.org/@emnapi/runtime/-/runtime-1.10.0.tgz",
+      "integrity": "sha512-ewvYlk86xUoGI0zQRNq/mC+16R1QeDlKQy21Ki3oSYXNgLb45GV1P6A0M+/s6nyCuNDqe5VpaY84BzXGwVbwFA==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "tslib": "^2.4.0"
+      }
+    },
+    "node_modules/@emnapi/wasi-threads": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/@emnapi/wasi-threads/-/wasi-threads-1.2.1.tgz",
+      "integrity": "sha512-uTII7OYF+/Mes/MrcIOYp5yOtSMLBWSIoLPpcgwipoiKbli6k322tcoFsxoIIxPDqW01SQGAgko4EzZi2BNv2w==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "tslib": "^2.4.0"
+      }
+    },
+    "node_modules/@esbuild/aix-ppc64": {
+      "version": "0.27.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/aix-ppc64/-/aix-ppc64-0.27.3.tgz",
+      "integrity": "sha512-9fJMTNFTWZMh5qwrBItuziu834eOCUcEqymSH7pY+zoMVEZg3gcPuBNxH1EvfVYe9h0x/Ptw8KBzv7qxb7l8dg==",
+      "cpu": [
+        "ppc64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "aix"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/android-arm": {
+      "version": "0.27.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.27.3.tgz",
+      "integrity": "sha512-i5D1hPY7GIQmXlXhs2w8AWHhenb00+GxjxRncS2ZM7YNVGNfaMxgzSGuO8o8SJzRc/oZwU2bcScvVERk03QhzA==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/android-arm64": {
+      "version": "0.27.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.27.3.tgz",
+      "integrity": "sha512-YdghPYUmj/FX2SYKJ0OZxf+iaKgMsKHVPF1MAq/P8WirnSpCStzKJFjOjzsW0QQ7oIAiccHdcqjbHmJxRb/dmg==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/android-x64": {
+      "version": "0.27.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.27.3.tgz",
+      "integrity": "sha512-IN/0BNTkHtk8lkOM8JWAYFg4ORxBkZQf9zXiEOfERX/CzxW3Vg1ewAhU7QSWQpVIzTW+b8Xy+lGzdYXV6UZObQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/darwin-arm64": {
+      "version": "0.27.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.27.3.tgz",
+      "integrity": "sha512-Re491k7ByTVRy0t3EKWajdLIr0gz2kKKfzafkth4Q8A5n1xTHrkqZgLLjFEHVD+AXdUGgQMq+Godfq45mGpCKg==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/darwin-x64": {
+      "version": "0.27.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.27.3.tgz",
+      "integrity": "sha512-vHk/hA7/1AckjGzRqi6wbo+jaShzRowYip6rt6q7VYEDX4LEy1pZfDpdxCBnGtl+A5zq8iXDcyuxwtv3hNtHFg==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/freebsd-arm64": {
+      "version": "0.27.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.27.3.tgz",
+      "integrity": "sha512-ipTYM2fjt3kQAYOvo6vcxJx3nBYAzPjgTCk7QEgZG8AUO3ydUhvelmhrbOheMnGOlaSFUoHXB6un+A7q4ygY9w==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/freebsd-x64": {
+      "version": "0.27.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.27.3.tgz",
+      "integrity": "sha512-dDk0X87T7mI6U3K9VjWtHOXqwAMJBNN2r7bejDsc+j03SEjtD9HrOl8gVFByeM0aJksoUuUVU9TBaZa2rgj0oA==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-arm": {
+      "version": "0.27.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.27.3.tgz",
+      "integrity": "sha512-s6nPv2QkSupJwLYyfS+gwdirm0ukyTFNl3KTgZEAiJDd+iHZcbTPPcWCcRYH+WlNbwChgH2QkE9NSlNrMT8Gfw==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-arm64": {
+      "version": "0.27.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.27.3.tgz",
+      "integrity": "sha512-sZOuFz/xWnZ4KH3YfFrKCf1WyPZHakVzTiqji3WDc0BCl2kBwiJLCXpzLzUBLgmp4veFZdvN5ChW4Eq/8Fc2Fg==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-ia32": {
+      "version": "0.27.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.27.3.tgz",
+      "integrity": "sha512-yGlQYjdxtLdh0a3jHjuwOrxQjOZYD/C9PfdbgJJF3TIZWnm/tMd/RcNiLngiu4iwcBAOezdnSLAwQDPqTmtTYg==",
+      "cpu": [
+        "ia32"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-loong64": {
+      "version": "0.27.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.27.3.tgz",
+      "integrity": "sha512-WO60Sn8ly3gtzhyjATDgieJNet/KqsDlX5nRC5Y3oTFcS1l0KWba+SEa9Ja1GfDqSF1z6hif/SkpQJbL63cgOA==",
+      "cpu": [
+        "loong64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-mips64el": {
+      "version": "0.27.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.27.3.tgz",
+      "integrity": "sha512-APsymYA6sGcZ4pD6k+UxbDjOFSvPWyZhjaiPyl/f79xKxwTnrn5QUnXR5prvetuaSMsb4jgeHewIDCIWljrSxw==",
+      "cpu": [
+        "mips64el"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-ppc64": {
+      "version": "0.27.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.27.3.tgz",
+      "integrity": "sha512-eizBnTeBefojtDb9nSh4vvVQ3V9Qf9Df01PfawPcRzJH4gFSgrObw+LveUyDoKU3kxi5+9RJTCWlj4FjYXVPEA==",
+      "cpu": [
+        "ppc64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-riscv64": {
+      "version": "0.27.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.27.3.tgz",
+      "integrity": "sha512-3Emwh0r5wmfm3ssTWRQSyVhbOHvqegUDRd0WhmXKX2mkHJe1SFCMJhagUleMq+Uci34wLSipf8Lagt4LlpRFWQ==",
+      "cpu": [
+        "riscv64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-s390x": {
+      "version": "0.27.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.27.3.tgz",
+      "integrity": "sha512-pBHUx9LzXWBc7MFIEEL0yD/ZVtNgLytvx60gES28GcWMqil8ElCYR4kvbV2BDqsHOvVDRrOxGySBM9Fcv744hw==",
+      "cpu": [
+        "s390x"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/linux-x64": {
+      "version": "0.27.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.27.3.tgz",
+      "integrity": "sha512-Czi8yzXUWIQYAtL/2y6vogER8pvcsOsk5cpwL4Gk5nJqH5UZiVByIY8Eorm5R13gq+DQKYg0+JyQoytLQas4dA==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/netbsd-arm64": {
+      "version": "0.27.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/netbsd-arm64/-/netbsd-arm64-0.27.3.tgz",
+      "integrity": "sha512-sDpk0RgmTCR/5HguIZa9n9u+HVKf40fbEUt+iTzSnCaGvY9kFP0YKBWZtJaraonFnqef5SlJ8/TiPAxzyS+UoA==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "netbsd"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/netbsd-x64": {
+      "version": "0.27.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.27.3.tgz",
+      "integrity": "sha512-P14lFKJl/DdaE00LItAukUdZO5iqNH7+PjoBm+fLQjtxfcfFE20Xf5CrLsmZdq5LFFZzb5JMZ9grUwvtVYzjiA==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "netbsd"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/openbsd-arm64": {
+      "version": "0.27.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/openbsd-arm64/-/openbsd-arm64-0.27.3.tgz",
+      "integrity": "sha512-AIcMP77AvirGbRl/UZFTq5hjXK+2wC7qFRGoHSDrZ5v5b8DK/GYpXW3CPRL53NkvDqb9D+alBiC/dV0Fb7eJcw==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "openbsd"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/openbsd-x64": {
+      "version": "0.27.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.27.3.tgz",
+      "integrity": "sha512-DnW2sRrBzA+YnE70LKqnM3P+z8vehfJWHXECbwBmH/CU51z6FiqTQTHFenPlHmo3a8UgpLyH3PT+87OViOh1AQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "openbsd"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/openharmony-arm64": {
+      "version": "0.27.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/openharmony-arm64/-/openharmony-arm64-0.27.3.tgz",
+      "integrity": "sha512-NinAEgr/etERPTsZJ7aEZQvvg/A6IsZG/LgZy+81wON2huV7SrK3e63dU0XhyZP4RKGyTm7aOgmQk0bGp0fy2g==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "openharmony"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/sunos-x64": {
+      "version": "0.27.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.27.3.tgz",
+      "integrity": "sha512-PanZ+nEz+eWoBJ8/f8HKxTTD172SKwdXebZ0ndd953gt1HRBbhMsaNqjTyYLGLPdoWHy4zLU7bDVJztF5f3BHA==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "sunos"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/win32-arm64": {
+      "version": "0.27.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.27.3.tgz",
+      "integrity": "sha512-B2t59lWWYrbRDw/tjiWOuzSsFh1Y/E95ofKz7rIVYSQkUYBjfSgf6oeYPNWHToFRr2zx52JKApIcAS/D5TUBnA==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/win32-ia32": {
+      "version": "0.27.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.27.3.tgz",
+      "integrity": "sha512-QLKSFeXNS8+tHW7tZpMtjlNb7HKau0QDpwm49u0vUp9y1WOF+PEzkU84y9GqYaAVW8aH8f3GcBck26jh54cX4Q==",
+      "cpu": [
+        "ia32"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@esbuild/win32-x64": {
+      "version": "0.27.3",
+      "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.27.3.tgz",
+      "integrity": "sha512-4uJGhsxuptu3OcpVAzli+/gWusVGwZZHTlS63hh++ehExkVT8SgiEf7/uC/PclrPPkLhZqGgCTjd0VWLo6xMqA==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@eslint-community/eslint-utils": {
+      "version": "4.9.1",
+      "resolved": "https://registry.npmjs.org/@eslint-community/eslint-utils/-/eslint-utils-4.9.1.tgz",
+      "integrity": "sha512-phrYmNiYppR7znFEdqgfWHXR6NCkZEK7hwWDHZUjit/2/U0r6XvkDl0SYnoM51Hq7FhCGdLDT6zxCCOY1hexsQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "eslint-visitor-keys": "^3.4.3"
+      },
+      "engines": {
+        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      },
+      "peerDependencies": {
+        "eslint": "^6.0.0 || ^7.0.0 || >=8.0.0"
+      }
+    },
+    "node_modules/@eslint-community/regexpp": {
+      "version": "4.12.2",
+      "resolved": "https://registry.npmjs.org/@eslint-community/regexpp/-/regexpp-4.12.2.tgz",
+      "integrity": "sha512-EriSTlt5OC9/7SXkRSCAhfSxxoSUgBm33OH+IkwbdpgoqsSsUg7y3uh+IICI/Qg4BBWr3U2i39RpmycbxMq4ew==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^12.0.0 || ^14.0.0 || >=16.0.0"
+      }
+    },
+    "node_modules/@eslint/config-array": {
+      "version": "0.23.5",
+      "resolved": "https://registry.npmjs.org/@eslint/config-array/-/config-array-0.23.5.tgz",
+      "integrity": "sha512-Y3kKLvC1dvTOT+oGlqNQ1XLqK6D1HU2YXPc52NmAlJZbMMWDzGYXMiPRJ8TYD39muD/OTjlZmNJ4ib7dvSrMBA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@eslint/object-schema": "^3.0.5",
+        "debug": "^4.3.1",
+        "minimatch": "^10.2.4"
+      },
+      "engines": {
+        "node": "^20.19.0 || ^22.13.0 || >=24"
+      }
+    },
+    "node_modules/@eslint/config-helpers": {
+      "version": "0.6.0",
+      "resolved": "https://registry.npmjs.org/@eslint/config-helpers/-/config-helpers-0.6.0.tgz",
+      "integrity": "sha512-ii6Bw9jJ2zi2cWA2Z+9/QZ/+3DX6kwaV5Q986D/CdP3Lap3w/pgQZ373FV7byY/i7L4IRH/G43I5dz1ClsCbpA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@eslint/core": "^1.2.1"
+      },
+      "engines": {
+        "node": "^20.19.0 || ^22.13.0 || >=24"
+      }
+    },
+    "node_modules/@eslint/core": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/@eslint/core/-/core-1.2.1.tgz",
+      "integrity": "sha512-MwcE1P+AZ4C6DWlpin/OmOA54mmIZ/+xZuJiQd4SyB29oAJjN30UW9wkKNptW2ctp4cEsvhlLY/CsQ1uoHDloQ==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@types/json-schema": "^7.0.15"
+      },
+      "engines": {
+        "node": "^20.19.0 || ^22.13.0 || >=24"
+      }
+    },
+    "node_modules/@eslint/js": {
+      "version": "10.0.1",
+      "resolved": "https://registry.npmjs.org/@eslint/js/-/js-10.0.1.tgz",
+      "integrity": "sha512-zeR9k5pd4gxjZ0abRoIaxdc7I3nDktoXZk2qOv9gCNWx3mVwEn32VRhyLaRsDiJjTs0xq/T8mfPtyuXu7GWBcA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^20.19.0 || ^22.13.0 || >=24"
+      },
+      "funding": {
+        "url": "https://eslint.org/donate"
+      },
+      "peerDependencies": {
+        "eslint": "^10.0.0"
+      },
+      "peerDependenciesMeta": {
+        "eslint": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@eslint/object-schema": {
+      "version": "3.0.5",
+      "resolved": "https://registry.npmjs.org/@eslint/object-schema/-/object-schema-3.0.5.tgz",
+      "integrity": "sha512-vqTaUEgxzm+YDSdElad6PiRoX4t8VGDjCtt05zn4nU810UIx/uNEV7/lZJ6KwFThKZOzOxzXy48da+No7HZaMw==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": "^20.19.0 || ^22.13.0 || >=24"
+      }
+    },
+    "node_modules/@eslint/plugin-kit": {
+      "version": "0.7.2",
+      "resolved": "https://registry.npmjs.org/@eslint/plugin-kit/-/plugin-kit-0.7.2.tgz",
+      "integrity": "sha512-+CNAzxglkrpNf/kKywqQfk74QjtceuOE7Qm+AF8miRvPF/wmmK5+OJOgVh3AVTT3RP2mH3+FOaxlE5v72owk0A==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@eslint/core": "^1.2.1",
+        "levn": "^0.4.1"
+      },
+      "engines": {
+        "node": "^20.19.0 || ^22.13.0 || >=24"
+      }
+    },
+    "node_modules/@exodus/bytes": {
+      "version": "1.15.1",
+      "resolved": "https://registry.npmjs.org/@exodus/bytes/-/bytes-1.15.1.tgz",
+      "integrity": "sha512-S6mL0yNB/Abt9Ei4tq8gDhcczc4S3+vQ4ra7vxnAf+YHC02srtqxKKZghx2Dq6p0e66THKwR6r8N6P95wEty7Q==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
+      },
+      "peerDependencies": {
+        "@noble/hashes": "^1.8.0 || ^2.0.0"
+      },
+      "peerDependenciesMeta": {
+        "@noble/hashes": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@firebase/ai": {
+      "version": "1.4.1",
+      "resolved": "https://registry.npmjs.org/@firebase/ai/-/ai-1.4.1.tgz",
+      "integrity": "sha512-bcusQfA/tHjUjBTnMx6jdoPMpDl3r8K15Z+snHz9wq0Foox0F/V+kNLXucEOHoTL2hTc9l+onZCyBJs2QoIC3g==",
+      "license": "Apache-2.0",
+      "peer": true,
+      "dependencies": {
+        "@firebase/app-check-interop-types": "0.3.3",
+        "@firebase/component": "0.6.18",
+        "@firebase/logger": "0.4.4",
+        "@firebase/util": "1.12.1",
+        "tslib": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=18.0.0"
+      },
+      "peerDependencies": {
+        "@firebase/app": "0.x",
+        "@firebase/app-types": "0.x"
+      }
+    },
+    "node_modules/@firebase/analytics": {
+      "version": "0.10.17",
+      "resolved": "https://registry.npmjs.org/@firebase/analytics/-/analytics-0.10.17.tgz",
+      "integrity": "sha512-n5vfBbvzduMou/2cqsnKrIes4auaBjdhg8QNA2ZQZ59QgtO2QiwBaXQZQE4O4sgB0Ds1tvLgUUkY+pwzu6/xEg==",
+      "license": "Apache-2.0",
+      "peer": true,
+      "dependencies": {
+        "@firebase/component": "0.6.18",
+        "@firebase/installations": "0.6.18",
+        "@firebase/logger": "0.4.4",
+        "@firebase/util": "1.12.1",
+        "tslib": "^2.1.0"
+      },
+      "peerDependencies": {
+        "@firebase/app": "0.x"
+      }
+    },
+    "node_modules/@firebase/analytics-compat": {
+      "version": "0.2.23",
+      "resolved": "https://registry.npmjs.org/@firebase/analytics-compat/-/analytics-compat-0.2.23.tgz",
+      "integrity": "sha512-3AdO10RN18G5AzREPoFgYhW6vWXr3u+OYQv6pl3CX6Fky8QRk0AHurZlY3Q1xkXO0TDxIsdhO3y65HF7PBOJDw==",
+      "license": "Apache-2.0",
+      "peer": true,
+      "dependencies": {
+        "@firebase/analytics": "0.10.17",
+        "@firebase/analytics-types": "0.8.3",
+        "@firebase/component": "0.6.18",
+        "@firebase/util": "1.12.1",
+        "tslib": "^2.1.0"
+      },
+      "peerDependencies": {
+        "@firebase/app-compat": "0.x"
+      }
+    },
+    "node_modules/@firebase/analytics-types": {
+      "version": "0.8.3",
+      "resolved": "https://registry.npmjs.org/@firebase/analytics-types/-/analytics-types-0.8.3.tgz",
+      "integrity": "sha512-VrIp/d8iq2g501qO46uGz3hjbDb8xzYMrbu8Tp0ovzIzrvJZ2fvmj649gTjge/b7cCCcjT0H37g1gVtlNhnkbg==",
+      "license": "Apache-2.0",
+      "peer": true
+    },
+    "node_modules/@firebase/app": {
+      "version": "0.13.2",
+      "resolved": "https://registry.npmjs.org/@firebase/app/-/app-0.13.2.tgz",
+      "integrity": "sha512-jwtMmJa1BXXDCiDx1vC6SFN/+HfYG53UkfJa6qeN5ogvOunzbFDO3wISZy5n9xgYFUrEP6M7e8EG++riHNTv9w==",
+      "license": "Apache-2.0",
+      "peer": true,
+      "dependencies": {
+        "@firebase/component": "0.6.18",
+        "@firebase/logger": "0.4.4",
+        "@firebase/util": "1.12.1",
+        "idb": "7.1.1",
+        "tslib": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=18.0.0"
+      }
+    },
+    "node_modules/@firebase/app-check": {
+      "version": "0.10.1",
+      "resolved": "https://registry.npmjs.org/@firebase/app-check/-/app-check-0.10.1.tgz",
+      "integrity": "sha512-MgNdlms9Qb0oSny87pwpjKush9qUwCJhfmTJHDfrcKo4neLGiSeVE4qJkzP7EQTIUFKp84pbTxobSAXkiuQVYQ==",
+      "license": "Apache-2.0",
+      "peer": true,
+      "dependencies": {
+        "@firebase/component": "0.6.18",
+        "@firebase/logger": "0.4.4",
+        "@firebase/util": "1.12.1",
+        "tslib": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=18.0.0"
+      },
+      "peerDependencies": {
+        "@firebase/app": "0.x"
+      }
+    },
+    "node_modules/@firebase/app-check-compat": {
+      "version": "0.3.26",
+      "resolved": "https://registry.npmjs.org/@firebase/app-check-compat/-/app-check-compat-0.3.26.tgz",
+      "integrity": "sha512-PkX+XJMLDea6nmnopzFKlr+s2LMQGqdyT2DHdbx1v1dPSqOol2YzgpgymmhC67vitXVpNvS3m/AiWQWWhhRRPQ==",
+      "license": "Apache-2.0",
+      "peer": true,
+      "dependencies": {
+        "@firebase/app-check": "0.10.1",
+        "@firebase/app-check-types": "0.5.3",
+        "@firebase/component": "0.6.18",
+        "@firebase/logger": "0.4.4",
+        "@firebase/util": "1.12.1",
+        "tslib": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=18.0.0"
+      },
+      "peerDependencies": {
+        "@firebase/app-compat": "0.x"
+      }
+    },
+    "node_modules/@firebase/app-check-interop-types": {
+      "version": "0.3.3",
+      "resolved": "https://registry.npmjs.org/@firebase/app-check-interop-types/-/app-check-interop-types-0.3.3.tgz",
+      "integrity": "sha512-gAlxfPLT2j8bTI/qfe3ahl2I2YcBQ8cFIBdhAQA4I2f3TndcO+22YizyGYuttLHPQEpWkhmpFW60VCFEPg4g5A==",
+      "license": "Apache-2.0",
+      "peer": true
+    },
+    "node_modules/@firebase/app-check-types": {
+      "version": "0.5.3",
+      "resolved": "https://registry.npmjs.org/@firebase/app-check-types/-/app-check-types-0.5.3.tgz",
+      "integrity": "sha512-hyl5rKSj0QmwPdsAxrI5x1otDlByQ7bvNvVt8G/XPO2CSwE++rmSVf3VEhaeOR4J8ZFaF0Z0NDSmLejPweZ3ng==",
+      "license": "Apache-2.0",
+      "peer": true
+    },
+    "node_modules/@firebase/app-compat": {
+      "version": "0.4.2",
+      "resolved": "https://registry.npmjs.org/@firebase/app-compat/-/app-compat-0.4.2.tgz",
+      "integrity": "sha512-LssbyKHlwLeiV8GBATyOyjmHcMpX/tFjzRUCS1jnwGAew1VsBB4fJowyS5Ud5LdFbYpJeS+IQoC+RQxpK7eH3Q==",
+      "license": "Apache-2.0",
+      "peer": true,
+      "dependencies": {
+        "@firebase/app": "0.13.2",
+        "@firebase/component": "0.6.18",
+        "@firebase/logger": "0.4.4",
+        "@firebase/util": "1.12.1",
+        "tslib": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=18.0.0"
+      }
+    },
+    "node_modules/@firebase/app-types": {
+      "version": "0.9.3",
+      "resolved": "https://registry.npmjs.org/@firebase/app-types/-/app-types-0.9.3.tgz",
+      "integrity": "sha512-kRVpIl4vVGJ4baogMDINbyrIOtOxqhkZQg4jTq3l8Lw6WSk0xfpEYzezFu+Kl4ve4fbPl79dvwRtaFqAC/ucCw==",
+      "license": "Apache-2.0",
+      "peer": true
+    },
+    "node_modules/@firebase/auth": {
+      "version": "1.10.8",
+      "resolved": "https://registry.npmjs.org/@firebase/auth/-/auth-1.10.8.tgz",
+      "integrity": "sha512-GpuTz5ap8zumr/ocnPY57ZanX02COsXloY6Y/2LYPAuXYiaJRf6BAGDEdRq1BMjP93kqQnKNuKZUTMZbQ8MNYA==",
+      "license": "Apache-2.0",
+      "peer": true,
+      "dependencies": {
+        "@firebase/component": "0.6.18",
+        "@firebase/logger": "0.4.4",
+        "@firebase/util": "1.12.1",
+        "tslib": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=18.0.0"
+      },
+      "peerDependencies": {
+        "@firebase/app": "0.x",
+        "@react-native-async-storage/async-storage": "^1.18.1"
+      },
+      "peerDependenciesMeta": {
+        "@react-native-async-storage/async-storage": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@firebase/auth-compat": {
+      "version": "0.5.28",
+      "resolved": "https://registry.npmjs.org/@firebase/auth-compat/-/auth-compat-0.5.28.tgz",
+      "integrity": "sha512-HpMSo/cc6Y8IX7bkRIaPPqT//Jt83iWy5rmDWeThXQCAImstkdNo3giFLORJwrZw2ptiGkOij64EH1ztNJzc7Q==",
+      "license": "Apache-2.0",
+      "peer": true,
+      "dependencies": {
+        "@firebase/auth": "1.10.8",
+        "@firebase/auth-types": "0.13.0",
+        "@firebase/component": "0.6.18",
+        "@firebase/util": "1.12.1",
+        "tslib": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=18.0.0"
+      },
+      "peerDependencies": {
+        "@firebase/app-compat": "0.x"
+      }
+    },
+    "node_modules/@firebase/auth-interop-types": {
+      "version": "0.2.4",
+      "resolved": "https://registry.npmjs.org/@firebase/auth-interop-types/-/auth-interop-types-0.2.4.tgz",
+      "integrity": "sha512-JPgcXKCuO+CWqGDnigBtvo09HeBs5u/Ktc2GaFj2m01hLarbxthLNm7Fk8iOP1aqAtXV+fnnGj7U28xmk7IwVA==",
+      "license": "Apache-2.0",
+      "peer": true
+    },
+    "node_modules/@firebase/auth-types": {
+      "version": "0.13.0",
+      "resolved": "https://registry.npmjs.org/@firebase/auth-types/-/auth-types-0.13.0.tgz",
+      "integrity": "sha512-S/PuIjni0AQRLF+l9ck0YpsMOdE8GO2KU6ubmBB7P+7TJUCQDa3R1dlgYm9UzGbbePMZsp0xzB93f2b/CgxMOg==",
+      "license": "Apache-2.0",
+      "peer": true,
+      "peerDependencies": {
+        "@firebase/app-types": "0.x",
+        "@firebase/util": "1.x"
+      }
+    },
+    "node_modules/@firebase/component": {
+      "version": "0.6.18",
+      "resolved": "https://registry.npmjs.org/@firebase/component/-/component-0.6.18.tgz",
+      "integrity": "sha512-n28kPCkE2dL2U28fSxZJjzPPVpKsQminJ6NrzcKXAI0E/lYC8YhfwpyllScqVEvAI3J2QgJZWYgrX+1qGI+SQQ==",
+      "license": "Apache-2.0",
+      "peer": true,
+      "dependencies": {
+        "@firebase/util": "1.12.1",
+        "tslib": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=18.0.0"
+      }
+    },
+    "node_modules/@firebase/data-connect": {
+      "version": "0.3.10",
+      "resolved": "https://registry.npmjs.org/@firebase/data-connect/-/data-connect-0.3.10.tgz",
+      "integrity": "sha512-VMVk7zxIkgwlVQIWHOKFahmleIjiVFwFOjmakXPd/LDgaB/5vzwsB5DWIYo+3KhGxWpidQlR8geCIn39YflJIQ==",
+      "license": "Apache-2.0",
+      "peer": true,
+      "dependencies": {
+        "@firebase/auth-interop-types": "0.2.4",
+        "@firebase/component": "0.6.18",
+        "@firebase/logger": "0.4.4",
+        "@firebase/util": "1.12.1",
+        "tslib": "^2.1.0"
+      },
+      "peerDependencies": {
+        "@firebase/app": "0.x"
+      }
+    },
+    "node_modules/@firebase/database": {
+      "version": "1.0.20",
+      "resolved": "https://registry.npmjs.org/@firebase/database/-/database-1.0.20.tgz",
+      "integrity": "sha512-H9Rpj1pQ1yc9+4HQOotFGLxqAXwOzCHsRSRjcQFNOr8lhUt6LeYjf0NSRL04sc4X0dWe8DsCvYKxMYvFG/iOJw==",
+      "license": "Apache-2.0",
+      "peer": true,
+      "dependencies": {
+        "@firebase/app-check-interop-types": "0.3.3",
+        "@firebase/auth-interop-types": "0.2.4",
+        "@firebase/component": "0.6.18",
+        "@firebase/logger": "0.4.4",
+        "@firebase/util": "1.12.1",
+        "faye-websocket": "0.11.4",
+        "tslib": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=18.0.0"
+      }
+    },
+    "node_modules/@firebase/database-compat": {
+      "version": "2.0.11",
+      "resolved": "https://registry.npmjs.org/@firebase/database-compat/-/database-compat-2.0.11.tgz",
+      "integrity": "sha512-itEsHARSsYS95+udF/TtIzNeQ0Uhx4uIna0sk4E0wQJBUnLc/G1X6D7oRljoOuwwCezRLGvWBRyNrugv/esOEw==",
+      "license": "Apache-2.0",
+      "peer": true,
+      "dependencies": {
+        "@firebase/component": "0.6.18",
+        "@firebase/database": "1.0.20",
+        "@firebase/database-types": "1.0.15",
+        "@firebase/logger": "0.4.4",
+        "@firebase/util": "1.12.1",
+        "tslib": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=18.0.0"
+      }
+    },
+    "node_modules/@firebase/database-types": {
+      "version": "1.0.15",
+      "resolved": "https://registry.npmjs.org/@firebase/database-types/-/database-types-1.0.15.tgz",
+      "integrity": "sha512-XWHJ0VUJ0k2E9HDMlKxlgy/ZuTa9EvHCGLjaKSUvrQnwhgZuRU5N3yX6SZ+ftf2hTzZmfRkv+b3QRvGg40bKNw==",
+      "license": "Apache-2.0",
+      "peer": true,
+      "dependencies": {
+        "@firebase/app-types": "0.9.3",
+        "@firebase/util": "1.12.1"
+      }
+    },
+    "node_modules/@firebase/firestore": {
+      "version": "4.8.0",
+      "resolved": "https://registry.npmjs.org/@firebase/firestore/-/firestore-4.8.0.tgz",
+      "integrity": "sha512-QSRk+Q1/CaabKyqn3C32KSFiOdZpSqI9rpLK5BHPcooElumOBooPFa6YkDdiT+/KhJtel36LdAacha9BptMj2A==",
+      "license": "Apache-2.0",
+      "peer": true,
+      "dependencies": {
+        "@firebase/component": "0.6.18",
+        "@firebase/logger": "0.4.4",
+        "@firebase/util": "1.12.1",
+        "@firebase/webchannel-wrapper": "1.0.3",
+        "@grpc/grpc-js": "~1.9.0",
+        "@grpc/proto-loader": "^0.7.8",
+        "tslib": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=18.0.0"
+      },
+      "peerDependencies": {
+        "@firebase/app": "0.x"
+      }
+    },
+    "node_modules/@firebase/firestore-compat": {
+      "version": "0.3.53",
+      "resolved": "https://registry.npmjs.org/@firebase/firestore-compat/-/firestore-compat-0.3.53.tgz",
+      "integrity": "sha512-qI3yZL8ljwAYWrTousWYbemay2YZa+udLWugjdjju2KODWtLG94DfO4NALJgPLv8CVGcDHNFXoyQexdRA0Cz8Q==",
+      "license": "Apache-2.0",
+      "peer": true,
+      "dependencies": {
+        "@firebase/component": "0.6.18",
+        "@firebase/firestore": "4.8.0",
+        "@firebase/firestore-types": "3.0.3",
+        "@firebase/util": "1.12.1",
+        "tslib": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=18.0.0"
+      },
+      "peerDependencies": {
+        "@firebase/app-compat": "0.x"
+      }
+    },
+    "node_modules/@firebase/firestore-types": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/@firebase/firestore-types/-/firestore-types-3.0.3.tgz",
+      "integrity": "sha512-hD2jGdiWRxB/eZWF89xcK9gF8wvENDJkzpVFb4aGkzfEaKxVRD1kjz1t1Wj8VZEp2LCB53Yx1zD8mrhQu87R6Q==",
+      "license": "Apache-2.0",
+      "peer": true,
+      "peerDependencies": {
+        "@firebase/app-types": "0.x",
+        "@firebase/util": "1.x"
+      }
+    },
+    "node_modules/@firebase/functions": {
+      "version": "0.12.9",
+      "resolved": "https://registry.npmjs.org/@firebase/functions/-/functions-0.12.9.tgz",
+      "integrity": "sha512-FG95w6vjbUXN84Ehezc2SDjGmGq225UYbHrb/ptkRT7OTuCiQRErOQuyt1jI1tvcDekdNog+anIObihNFz79Lg==",
+      "license": "Apache-2.0",
+      "peer": true,
+      "dependencies": {
+        "@firebase/app-check-interop-types": "0.3.3",
+        "@firebase/auth-interop-types": "0.2.4",
+        "@firebase/component": "0.6.18",
+        "@firebase/messaging-interop-types": "0.2.3",
+        "@firebase/util": "1.12.1",
+        "tslib": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=18.0.0"
+      },
+      "peerDependencies": {
+        "@firebase/app": "0.x"
+      }
+    },
+    "node_modules/@firebase/functions-compat": {
+      "version": "0.3.26",
+      "resolved": "https://registry.npmjs.org/@firebase/functions-compat/-/functions-compat-0.3.26.tgz",
+      "integrity": "sha512-A798/6ff5LcG2LTWqaGazbFYnjBW8zc65YfID/en83ALmkhu2b0G8ykvQnLtakbV9ajrMYPn7Yc/XcYsZIUsjA==",
+      "license": "Apache-2.0",
+      "peer": true,
+      "dependencies": {
+        "@firebase/component": "0.6.18",
+        "@firebase/functions": "0.12.9",
+        "@firebase/functions-types": "0.6.3",
+        "@firebase/util": "1.12.1",
+        "tslib": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=18.0.0"
+      },
+      "peerDependencies": {
+        "@firebase/app-compat": "0.x"
+      }
+    },
+    "node_modules/@firebase/functions-types": {
+      "version": "0.6.3",
+      "resolved": "https://registry.npmjs.org/@firebase/functions-types/-/functions-types-0.6.3.tgz",
+      "integrity": "sha512-EZoDKQLUHFKNx6VLipQwrSMh01A1SaL3Wg6Hpi//x6/fJ6Ee4hrAeswK99I5Ht8roiniKHw4iO0B1Oxj5I4plg==",
+      "license": "Apache-2.0",
+      "peer": true
+    },
+    "node_modules/@firebase/installations": {
+      "version": "0.6.18",
+      "resolved": "https://registry.npmjs.org/@firebase/installations/-/installations-0.6.18.tgz",
+      "integrity": "sha512-NQ86uGAcvO8nBRwVltRL9QQ4Reidc/3whdAasgeWCPIcrhOKDuNpAALa6eCVryLnK14ua2DqekCOX5uC9XbU/A==",
+      "license": "Apache-2.0",
+      "peer": true,
+      "dependencies": {
+        "@firebase/component": "0.6.18",
+        "@firebase/util": "1.12.1",
+        "idb": "7.1.1",
+        "tslib": "^2.1.0"
+      },
+      "peerDependencies": {
+        "@firebase/app": "0.x"
+      }
+    },
+    "node_modules/@firebase/installations-compat": {
+      "version": "0.2.18",
+      "resolved": "https://registry.npmjs.org/@firebase/installations-compat/-/installations-compat-0.2.18.tgz",
+      "integrity": "sha512-aLFohRpJO5kKBL/XYL4tN+GdwEB/Q6Vo9eZOM/6Kic7asSUgmSfGPpGUZO1OAaSRGwF4Lqnvi1f/f9VZnKzChw==",
+      "license": "Apache-2.0",
+      "peer": true,
+      "dependencies": {
+        "@firebase/component": "0.6.18",
+        "@firebase/installations": "0.6.18",
+        "@firebase/installations-types": "0.5.3",
+        "@firebase/util": "1.12.1",
+        "tslib": "^2.1.0"
+      },
+      "peerDependencies": {
+        "@firebase/app-compat": "0.x"
+      }
+    },
+    "node_modules/@firebase/installations-types": {
+      "version": "0.5.3",
+      "resolved": "https://registry.npmjs.org/@firebase/installations-types/-/installations-types-0.5.3.tgz",
+      "integrity": "sha512-2FJI7gkLqIE0iYsNQ1P751lO3hER+Umykel+TkLwHj6plzWVxqvfclPUZhcKFVQObqloEBTmpi2Ozn7EkCABAA==",
+      "license": "Apache-2.0",
+      "peer": true,
+      "peerDependencies": {
+        "@firebase/app-types": "0.x"
+      }
+    },
+    "node_modules/@firebase/logger": {
+      "version": "0.4.4",
+      "resolved": "https://registry.npmjs.org/@firebase/logger/-/logger-0.4.4.tgz",
+      "integrity": "sha512-mH0PEh1zoXGnaR8gD1DeGeNZtWFKbnz9hDO91dIml3iou1gpOnLqXQ2dJfB71dj6dpmUjcQ6phY3ZZJbjErr9g==",
+      "license": "Apache-2.0",
+      "peer": true,
+      "dependencies": {
+        "tslib": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=18.0.0"
+      }
+    },
+    "node_modules/@firebase/messaging": {
+      "version": "0.12.22",
+      "resolved": "https://registry.npmjs.org/@firebase/messaging/-/messaging-0.12.22.tgz",
+      "integrity": "sha512-GJcrPLc+Hu7nk+XQ70Okt3M1u1eRr2ZvpMbzbc54oTPJZySHcX9ccZGVFcsZbSZ6o1uqumm8Oc7OFkD3Rn1/og==",
+      "license": "Apache-2.0",
+      "peer": true,
+      "dependencies": {
+        "@firebase/component": "0.6.18",
+        "@firebase/installations": "0.6.18",
+        "@firebase/messaging-interop-types": "0.2.3",
+        "@firebase/util": "1.12.1",
+        "idb": "7.1.1",
+        "tslib": "^2.1.0"
+      },
+      "peerDependencies": {
+        "@firebase/app": "0.x"
+      }
+    },
+    "node_modules/@firebase/messaging-compat": {
+      "version": "0.2.22",
+      "resolved": "https://registry.npmjs.org/@firebase/messaging-compat/-/messaging-compat-0.2.22.tgz",
+      "integrity": "sha512-5ZHtRnj6YO6f/QPa/KU6gryjmX4Kg33Kn4gRpNU6M1K47Gm8kcQwPkX7erRUYEH1mIWptfvjvXMHWoZaWjkU7A==",
+      "license": "Apache-2.0",
+      "peer": true,
+      "dependencies": {
+        "@firebase/component": "0.6.18",
+        "@firebase/messaging": "0.12.22",
+        "@firebase/util": "1.12.1",
+        "tslib": "^2.1.0"
+      },
+      "peerDependencies": {
+        "@firebase/app-compat": "0.x"
+      }
+    },
+    "node_modules/@firebase/messaging-interop-types": {
+      "version": "0.2.3",
+      "resolved": "https://registry.npmjs.org/@firebase/messaging-interop-types/-/messaging-interop-types-0.2.3.tgz",
+      "integrity": "sha512-xfzFaJpzcmtDjycpDeCUj0Ge10ATFi/VHVIvEEjDNc3hodVBQADZ7BWQU7CuFpjSHE+eLuBI13z5F/9xOoGX8Q==",
+      "license": "Apache-2.0",
+      "peer": true
+    },
+    "node_modules/@firebase/performance": {
+      "version": "0.7.7",
+      "resolved": "https://registry.npmjs.org/@firebase/performance/-/performance-0.7.7.tgz",
+      "integrity": "sha512-JTlTQNZKAd4+Q5sodpw6CN+6NmwbY72av3Lb6wUKTsL7rb3cuBIhQSrslWbVz0SwK3x0ZNcqX24qtRbwKiv+6w==",
+      "license": "Apache-2.0",
+      "peer": true,
+      "dependencies": {
+        "@firebase/component": "0.6.18",
+        "@firebase/installations": "0.6.18",
+        "@firebase/logger": "0.4.4",
+        "@firebase/util": "1.12.1",
+        "tslib": "^2.1.0",
+        "web-vitals": "^4.2.4"
+      },
+      "peerDependencies": {
+        "@firebase/app": "0.x"
+      }
+    },
+    "node_modules/@firebase/performance-compat": {
+      "version": "0.2.20",
+      "resolved": "https://registry.npmjs.org/@firebase/performance-compat/-/performance-compat-0.2.20.tgz",
+      "integrity": "sha512-XkFK5NmOKCBuqOKWeRgBUFZZGz9SzdTZp4OqeUg+5nyjapTiZ4XoiiUL8z7mB2q+63rPmBl7msv682J3rcDXIQ==",
+      "license": "Apache-2.0",
+      "peer": true,
+      "dependencies": {
+        "@firebase/component": "0.6.18",
+        "@firebase/logger": "0.4.4",
+        "@firebase/performance": "0.7.7",
+        "@firebase/performance-types": "0.2.3",
+        "@firebase/util": "1.12.1",
+        "tslib": "^2.1.0"
+      },
+      "peerDependencies": {
+        "@firebase/app-compat": "0.x"
+      }
+    },
+    "node_modules/@firebase/performance-types": {
+      "version": "0.2.3",
+      "resolved": "https://registry.npmjs.org/@firebase/performance-types/-/performance-types-0.2.3.tgz",
+      "integrity": "sha512-IgkyTz6QZVPAq8GSkLYJvwSLr3LS9+V6vNPQr0x4YozZJiLF5jYixj0amDtATf1X0EtYHqoPO48a9ija8GocxQ==",
+      "license": "Apache-2.0",
+      "peer": true
+    },
+    "node_modules/@firebase/remote-config": {
+      "version": "0.6.5",
+      "resolved": "https://registry.npmjs.org/@firebase/remote-config/-/remote-config-0.6.5.tgz",
+      "integrity": "sha512-fU0c8HY0vrVHwC+zQ/fpXSqHyDMuuuglV94VF6Yonhz8Fg2J+KOowPGANM0SZkLvVOYpTeWp3ZmM+F6NjwWLnw==",
+      "license": "Apache-2.0",
+      "peer": true,
+      "dependencies": {
+        "@firebase/component": "0.6.18",
+        "@firebase/installations": "0.6.18",
+        "@firebase/logger": "0.4.4",
+        "@firebase/util": "1.12.1",
+        "tslib": "^2.1.0"
+      },
+      "peerDependencies": {
+        "@firebase/app": "0.x"
+      }
+    },
+    "node_modules/@firebase/remote-config-compat": {
+      "version": "0.2.18",
+      "resolved": "https://registry.npmjs.org/@firebase/remote-config-compat/-/remote-config-compat-0.2.18.tgz",
+      "integrity": "sha512-YiETpldhDy7zUrnS8e+3l7cNs0sL7+tVAxvVYU0lu7O+qLHbmdtAxmgY+wJqWdW2c9nDvBFec7QiF58pEUu0qQ==",
+      "license": "Apache-2.0",
+      "peer": true,
+      "dependencies": {
+        "@firebase/component": "0.6.18",
+        "@firebase/logger": "0.4.4",
+        "@firebase/remote-config": "0.6.5",
+        "@firebase/remote-config-types": "0.4.0",
+        "@firebase/util": "1.12.1",
+        "tslib": "^2.1.0"
+      },
+      "peerDependencies": {
+        "@firebase/app-compat": "0.x"
+      }
+    },
+    "node_modules/@firebase/remote-config-types": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npmjs.org/@firebase/remote-config-types/-/remote-config-types-0.4.0.tgz",
+      "integrity": "sha512-7p3mRE/ldCNYt8fmWMQ/MSGRmXYlJ15Rvs9Rk17t8p0WwZDbeK7eRmoI1tvCPaDzn9Oqh+yD6Lw+sGLsLg4kKg==",
+      "license": "Apache-2.0",
+      "peer": true
+    },
+    "node_modules/@firebase/storage": {
+      "version": "0.13.14",
+      "resolved": "https://registry.npmjs.org/@firebase/storage/-/storage-0.13.14.tgz",
+      "integrity": "sha512-xTq5ixxORzx+bfqCpsh+o3fxOsGoDjC1nO0Mq2+KsOcny3l7beyBhP/y1u5T6mgsFQwI1j6oAkbT5cWdDBx87g==",
+      "license": "Apache-2.0",
+      "peer": true,
+      "dependencies": {
+        "@firebase/component": "0.6.18",
+        "@firebase/util": "1.12.1",
+        "tslib": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=18.0.0"
+      },
+      "peerDependencies": {
+        "@firebase/app": "0.x"
+      }
+    },
+    "node_modules/@firebase/storage-compat": {
+      "version": "0.3.24",
+      "resolved": "https://registry.npmjs.org/@firebase/storage-compat/-/storage-compat-0.3.24.tgz",
+      "integrity": "sha512-XHn2tLniiP7BFKJaPZ0P8YQXKiVJX+bMyE2j2YWjYfaddqiJnROJYqSomwW6L3Y+gZAga35ONXUJQju6MB6SOQ==",
+      "license": "Apache-2.0",
+      "peer": true,
+      "dependencies": {
+        "@firebase/component": "0.6.18",
+        "@firebase/storage": "0.13.14",
+        "@firebase/storage-types": "0.8.3",
+        "@firebase/util": "1.12.1",
+        "tslib": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=18.0.0"
+      },
+      "peerDependencies": {
+        "@firebase/app-compat": "0.x"
+      }
+    },
+    "node_modules/@firebase/storage-types": {
+      "version": "0.8.3",
+      "resolved": "https://registry.npmjs.org/@firebase/storage-types/-/storage-types-0.8.3.tgz",
+      "integrity": "sha512-+Muk7g9uwngTpd8xn9OdF/D48uiQ7I1Fae7ULsWPuKoCH3HU7bfFPhxtJYzyhjdniowhuDpQcfPmuNRAqZEfvg==",
+      "license": "Apache-2.0",
+      "peer": true,
+      "peerDependencies": {
+        "@firebase/app-types": "0.x",
+        "@firebase/util": "1.x"
+      }
+    },
+    "node_modules/@firebase/util": {
+      "version": "1.12.1",
+      "resolved": "https://registry.npmjs.org/@firebase/util/-/util-1.12.1.tgz",
+      "integrity": "sha512-zGlBn/9Dnya5ta9bX/fgEoNC3Cp8s6h+uYPYaDieZsFOAdHP/ExzQ/eaDgxD3GOROdPkLKpvKY0iIzr9adle0w==",
+      "hasInstallScript": true,
+      "license": "Apache-2.0",
+      "peer": true,
+      "dependencies": {
+        "tslib": "^2.1.0"
+      },
+      "engines": {
+        "node": ">=18.0.0"
+      }
+    },
+    "node_modules/@firebase/webchannel-wrapper": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/@firebase/webchannel-wrapper/-/webchannel-wrapper-1.0.3.tgz",
+      "integrity": "sha512-2xCRM9q9FlzGZCdgDMJwc0gyUkWFtkosy7Xxr6sFgQwn+wMNIWd7xIvYNauU1r64B5L5rsGKy/n9TKJ0aAFeqQ==",
+      "license": "Apache-2.0",
+      "peer": true
+    },
+    "node_modules/@floating-ui/core": {
+      "version": "1.7.5",
+      "resolved": "https://registry.npmjs.org/@floating-ui/core/-/core-1.7.5.tgz",
+      "integrity": "sha512-1Ih4WTWyw0+lKyFMcBHGbb5U5FtuHJuujoyyr5zTaWS5EYMeT6Jb2AuDeftsCsEuchO+mM2ij5+q9crhydzLhQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@floating-ui/utils": "^0.2.11"
+      }
+    },
+    "node_modules/@floating-ui/dom": {
+      "version": "1.7.6",
+      "resolved": "https://registry.npmjs.org/@floating-ui/dom/-/dom-1.7.6.tgz",
+      "integrity": "sha512-9gZSAI5XM36880PPMm//9dfiEngYoC6Am2izES1FF406YFsjvyBMmeJ2g4SAju3xWwtuynNRFL2s9hgxpLI5SQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@floating-ui/core": "^1.7.5",
+        "@floating-ui/utils": "^0.2.11"
+      }
+    },
+    "node_modules/@floating-ui/utils": {
+      "version": "0.2.11",
+      "resolved": "https://registry.npmjs.org/@floating-ui/utils/-/utils-0.2.11.tgz",
+      "integrity": "sha512-RiB/yIh78pcIxl6lLMG0CgBXAZ2Y0eVHqMPYugu+9U0AeT6YBeiJpf7lbdJNIugFP5SIjwNRgo4DhR1Qxi26Gg==",
+      "license": "MIT"
+    },
+    "node_modules/@gar/promise-retry": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/@gar/promise-retry/-/promise-retry-1.0.3.tgz",
+      "integrity": "sha512-GmzA9ckNokPypTg10pgpeHNQe7ph+iIKKmhKu3Ob9ANkswreCx7R3cKmY781K8QK3AqVL3xVh9A42JvIAbkkSA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/@grpc/grpc-js": {
+      "version": "1.9.16",
+      "resolved": "https://registry.npmjs.org/@grpc/grpc-js/-/grpc-js-1.9.16.tgz",
+      "integrity": "sha512-wE4Ut/olIzfKqp631XrG+wbF0v1vWFN4YL9FyXC2LJiG33DsV7PLzURjrCvY/6je2ntdRkeLpPDluzSRGaVltQ==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@grpc/proto-loader": "^0.7.8",
+        "@types/node": ">=12.12.47"
+      },
+      "engines": {
+        "node": "^8.13.0 || >=10.10.0"
+      }
+    },
+    "node_modules/@grpc/proto-loader": {
+      "version": "0.7.15",
+      "resolved": "https://registry.npmjs.org/@grpc/proto-loader/-/proto-loader-0.7.15.tgz",
+      "integrity": "sha512-tMXdRCfYVixjuFK+Hk0Q1s38gV9zDiDJfWL3h1rv4Qc39oILCu1TRTDt7+fGUI8K4G1Fj125Hx/ru3azECWTyQ==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "lodash.camelcase": "^4.3.0",
+        "long": "^5.0.0",
+        "protobufjs": "^7.2.5",
+        "yargs": "^17.7.2"
+      },
+      "bin": {
+        "proto-loader-gen-types": "build/bin/proto-loader-gen-types.js"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/@grpc/proto-loader/node_modules/ansi-regex": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
+      "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@grpc/proto-loader/node_modules/ansi-styles": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
+      "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
+      "license": "MIT",
+      "dependencies": {
+        "color-convert": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+      }
+    },
+    "node_modules/@grpc/proto-loader/node_modules/cliui": {
+      "version": "8.0.1",
+      "resolved": "https://registry.npmjs.org/cliui/-/cliui-8.0.1.tgz",
+      "integrity": "sha512-BSeNnyus75C4//NQ9gQt1/csTXyo/8Sb+afLAkzAptFuMsod9HFokGNudZpi/oQV73hnVK+sR+5PVRMd+Dr7YQ==",
+      "license": "ISC",
+      "dependencies": {
+        "string-width": "^4.2.0",
+        "strip-ansi": "^6.0.1",
+        "wrap-ansi": "^7.0.0"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@grpc/proto-loader/node_modules/is-fullwidth-code-point": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
+      "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@grpc/proto-loader/node_modules/string-width": {
+      "version": "4.2.3",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
+      "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
+      "license": "MIT",
+      "dependencies": {
+        "emoji-regex": "^8.0.0",
+        "is-fullwidth-code-point": "^3.0.0",
+        "strip-ansi": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@grpc/proto-loader/node_modules/strip-ansi": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
+      "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
+      "license": "MIT",
+      "dependencies": {
+        "ansi-regex": "^5.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@grpc/proto-loader/node_modules/wrap-ansi": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz",
+      "integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==",
+      "license": "MIT",
+      "dependencies": {
+        "ansi-styles": "^4.0.0",
+        "string-width": "^4.1.0",
+        "strip-ansi": "^6.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
+      }
+    },
+    "node_modules/@grpc/proto-loader/node_modules/yargs": {
+      "version": "17.7.2",
+      "resolved": "https://registry.npmjs.org/yargs/-/yargs-17.7.2.tgz",
+      "integrity": "sha512-7dSzzRQ++CKnNI/krKnYRV7JKKPUXMEh61soaHKg9mrWEhzFWhFnxPxGl+69cD1Ou63C13NUPCnmIcrvqCuM6w==",
+      "license": "MIT",
+      "dependencies": {
+        "cliui": "^8.0.1",
+        "escalade": "^3.1.1",
+        "get-caller-file": "^2.0.5",
+        "require-directory": "^2.1.1",
+        "string-width": "^4.2.3",
+        "y18n": "^5.0.5",
+        "yargs-parser": "^21.1.1"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@grpc/proto-loader/node_modules/yargs-parser": {
+      "version": "21.1.1",
+      "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-21.1.1.tgz",
+      "integrity": "sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/@harperfast/extended-iterable": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/@harperfast/extended-iterable/-/extended-iterable-1.0.3.tgz",
+      "integrity": "sha512-sSAYhQca3rDWtQUHSAPeO7axFIUJOI6hn1gjRC5APVE1a90tuyT8f5WIgRsFhhWA7htNkju2veB9eWL6YHi/Lw==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "optional": true
+    },
+    "node_modules/@hono/node-server": {
+      "version": "1.19.14",
+      "resolved": "https://registry.npmjs.org/@hono/node-server/-/node-server-1.19.14.tgz",
+      "integrity": "sha512-GwtvgtXxnWsucXvbQXkRgqksiH2Qed37H9xHZocE5sA3N8O8O8/8FA3uclQXxXVzc9XBZuEOMK7+r02FmSpHtw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18.14.1"
+      },
+      "peerDependencies": {
+        "hono": "^4"
+      }
+    },
+    "node_modules/@humanfs/core": {
+      "version": "0.19.2",
+      "resolved": "https://registry.npmjs.org/@humanfs/core/-/core-0.19.2.tgz",
+      "integrity": "sha512-UhXNm+CFMWcbChXywFwkmhqjs3PRCmcSa/hfBgLIb7oQ5HNb1wS0icWsGtSAUNgefHeI+eBrA8I1fxmbHsGdvA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@humanfs/types": "^0.15.0"
+      },
+      "engines": {
+        "node": ">=18.18.0"
+      }
+    },
+    "node_modules/@humanfs/node": {
+      "version": "0.16.8",
+      "resolved": "https://registry.npmjs.org/@humanfs/node/-/node-0.16.8.tgz",
+      "integrity": "sha512-gE1eQNZ3R++kTzFUpdGlpmy8kDZD/MLyHqDwqjkVQI0JMdI1D51sy1H958PNXYkM2rAac7e5/CnIKZrHtPh3BQ==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@humanfs/core": "^0.19.2",
+        "@humanfs/types": "^0.15.0",
+        "@humanwhocodes/retry": "^0.4.0"
+      },
+      "engines": {
+        "node": ">=18.18.0"
+      }
+    },
+    "node_modules/@humanfs/types": {
+      "version": "0.15.0",
+      "resolved": "https://registry.npmjs.org/@humanfs/types/-/types-0.15.0.tgz",
+      "integrity": "sha512-ZZ1w0aoQkwuUuC7Yf+7sdeaNfqQiiLcSRbfI08oAxqLtpXQr9AIVX7Ay7HLDuiLYAaFPu8oBYNq/QIi9URHJ3Q==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=18.18.0"
+      }
+    },
+    "node_modules/@humanwhocodes/module-importer": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/@humanwhocodes/module-importer/-/module-importer-1.0.1.tgz",
+      "integrity": "sha512-bxveV4V8v5Yb4ncFTT3rPSgZBOpCkjfK0y4oVVVJwIuDVBRMDXrPyXRL988i5ap9m9bnyEEjWfm5WkBmtffLfA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=12.22"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/nzakas"
+      }
+    },
+    "node_modules/@humanwhocodes/retry": {
+      "version": "0.4.3",
+      "resolved": "https://registry.npmjs.org/@humanwhocodes/retry/-/retry-0.4.3.tgz",
+      "integrity": "sha512-bV0Tgo9K4hfPCek+aMAn81RppFKv2ySDQeMoSZuvTASywNTnVJCArCZE2FWqpvIatKu7VMRLWlR1EazvVhDyhQ==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=18.18"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/nzakas"
+      }
+    },
+    "node_modules/@inquirer/ansi": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/@inquirer/ansi/-/ansi-1.0.2.tgz",
+      "integrity": "sha512-S8qNSZiYzFd0wAcyG5AXCvUHC5Sr7xpZ9wZ2py9XR88jUz8wooStVx5M6dRzczbBWjic9NP7+rY0Xi7qqK/aMQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@inquirer/checkbox": {
+      "version": "4.3.2",
+      "resolved": "https://registry.npmjs.org/@inquirer/checkbox/-/checkbox-4.3.2.tgz",
+      "integrity": "sha512-VXukHf0RR1doGe6Sm4F0Em7SWYLTHSsbGfJdS9Ja2bX5/D5uwVOEjr07cncLROdBvmnvCATYEWlHqYmXv2IlQA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@inquirer/ansi": "^1.0.2",
+        "@inquirer/core": "^10.3.2",
+        "@inquirer/figures": "^1.0.15",
+        "@inquirer/type": "^3.0.10",
+        "yoctocolors-cjs": "^2.1.3"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "@types/node": ">=18"
+      },
+      "peerDependenciesMeta": {
+        "@types/node": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@inquirer/confirm": {
+      "version": "5.1.21",
+      "resolved": "https://registry.npmjs.org/@inquirer/confirm/-/confirm-5.1.21.tgz",
+      "integrity": "sha512-KR8edRkIsUayMXV+o3Gv+q4jlhENF9nMYUZs9PA2HzrXeHI8M5uDag70U7RJn9yyiMZSbtF5/UexBtAVtZGSbQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@inquirer/core": "^10.3.2",
+        "@inquirer/type": "^3.0.10"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "@types/node": ">=18"
+      },
+      "peerDependenciesMeta": {
+        "@types/node": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@inquirer/core": {
+      "version": "10.3.2",
+      "resolved": "https://registry.npmjs.org/@inquirer/core/-/core-10.3.2.tgz",
+      "integrity": "sha512-43RTuEbfP8MbKzedNqBrlhhNKVwoK//vUFNW3Q3vZ88BLcrs4kYpGg+B2mm5p2K/HfygoCxuKwJJiv8PbGmE0A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@inquirer/ansi": "^1.0.2",
+        "@inquirer/figures": "^1.0.15",
+        "@inquirer/type": "^3.0.10",
+        "cli-width": "^4.1.0",
+        "mute-stream": "^2.0.0",
+        "signal-exit": "^4.1.0",
+        "wrap-ansi": "^6.2.0",
+        "yoctocolors-cjs": "^2.1.3"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "@types/node": ">=18"
+      },
+      "peerDependenciesMeta": {
+        "@types/node": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@inquirer/editor": {
+      "version": "4.2.23",
+      "resolved": "https://registry.npmjs.org/@inquirer/editor/-/editor-4.2.23.tgz",
+      "integrity": "sha512-aLSROkEwirotxZ1pBaP8tugXRFCxW94gwrQLxXfrZsKkfjOYC1aRvAZuhpJOb5cu4IBTJdsCigUlf2iCOu4ZDQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@inquirer/core": "^10.3.2",
+        "@inquirer/external-editor": "^1.0.3",
+        "@inquirer/type": "^3.0.10"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "@types/node": ">=18"
+      },
+      "peerDependenciesMeta": {
+        "@types/node": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@inquirer/expand": {
+      "version": "4.0.23",
+      "resolved": "https://registry.npmjs.org/@inquirer/expand/-/expand-4.0.23.tgz",
+      "integrity": "sha512-nRzdOyFYnpeYTTR2qFwEVmIWypzdAx/sIkCMeTNTcflFOovfqUk+HcFhQQVBftAh9gmGrpFj6QcGEqrDMDOiew==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@inquirer/core": "^10.3.2",
+        "@inquirer/type": "^3.0.10",
+        "yoctocolors-cjs": "^2.1.3"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "@types/node": ">=18"
+      },
+      "peerDependenciesMeta": {
+        "@types/node": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@inquirer/external-editor": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/@inquirer/external-editor/-/external-editor-1.0.3.tgz",
+      "integrity": "sha512-RWbSrDiYmO4LbejWY7ttpxczuwQyZLBUyygsA9Nsv95hpzUWwnNTVQmAq3xuh7vNwCp07UTmE5i11XAEExx4RA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "chardet": "^2.1.1",
+        "iconv-lite": "^0.7.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "@types/node": ">=18"
+      },
+      "peerDependenciesMeta": {
+        "@types/node": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@inquirer/figures": {
+      "version": "1.0.15",
+      "resolved": "https://registry.npmjs.org/@inquirer/figures/-/figures-1.0.15.tgz",
+      "integrity": "sha512-t2IEY+unGHOzAaVM5Xx6DEWKeXlDDcNPeDyUpsRc6CUhBfU3VQOEl+Vssh7VNp1dR8MdUJBWhuObjXCsVpjN5g==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/@inquirer/input": {
+      "version": "4.3.1",
+      "resolved": "https://registry.npmjs.org/@inquirer/input/-/input-4.3.1.tgz",
+      "integrity": "sha512-kN0pAM4yPrLjJ1XJBjDxyfDduXOuQHrBB8aLDMueuwUGn+vNpF7Gq7TvyVxx8u4SHlFFj4trmj+a2cbpG4Jn1g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@inquirer/core": "^10.3.2",
+        "@inquirer/type": "^3.0.10"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "@types/node": ">=18"
+      },
+      "peerDependenciesMeta": {
+        "@types/node": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@inquirer/number": {
+      "version": "3.0.23",
+      "resolved": "https://registry.npmjs.org/@inquirer/number/-/number-3.0.23.tgz",
+      "integrity": "sha512-5Smv0OK7K0KUzUfYUXDXQc9jrf8OHo4ktlEayFlelCjwMXz0299Y8OrI+lj7i4gCBY15UObk76q0QtxjzFcFcg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@inquirer/core": "^10.3.2",
+        "@inquirer/type": "^3.0.10"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "@types/node": ">=18"
+      },
+      "peerDependenciesMeta": {
+        "@types/node": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@inquirer/password": {
+      "version": "4.0.23",
+      "resolved": "https://registry.npmjs.org/@inquirer/password/-/password-4.0.23.tgz",
+      "integrity": "sha512-zREJHjhT5vJBMZX/IUbyI9zVtVfOLiTO66MrF/3GFZYZ7T4YILW5MSkEYHceSii/KtRk+4i3RE7E1CUXA2jHcA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@inquirer/ansi": "^1.0.2",
+        "@inquirer/core": "^10.3.2",
+        "@inquirer/type": "^3.0.10"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "@types/node": ">=18"
+      },
+      "peerDependenciesMeta": {
+        "@types/node": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@inquirer/prompts": {
+      "version": "7.10.1",
+      "resolved": "https://registry.npmjs.org/@inquirer/prompts/-/prompts-7.10.1.tgz",
+      "integrity": "sha512-Dx/y9bCQcXLI5ooQ5KyvA4FTgeo2jYj/7plWfV5Ak5wDPKQZgudKez2ixyfz7tKXzcJciTxqLeK7R9HItwiByg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@inquirer/checkbox": "^4.3.2",
+        "@inquirer/confirm": "^5.1.21",
+        "@inquirer/editor": "^4.2.23",
+        "@inquirer/expand": "^4.0.23",
+        "@inquirer/input": "^4.3.1",
+        "@inquirer/number": "^3.0.23",
+        "@inquirer/password": "^4.0.23",
+        "@inquirer/rawlist": "^4.1.11",
+        "@inquirer/search": "^3.2.2",
+        "@inquirer/select": "^4.4.2"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "@types/node": ">=18"
+      },
+      "peerDependenciesMeta": {
+        "@types/node": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@inquirer/rawlist": {
+      "version": "4.1.11",
+      "resolved": "https://registry.npmjs.org/@inquirer/rawlist/-/rawlist-4.1.11.tgz",
+      "integrity": "sha512-+LLQB8XGr3I5LZN/GuAHo+GpDJegQwuPARLChlMICNdwW7OwV2izlCSCxN6cqpL0sMXmbKbFcItJgdQq5EBXTw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@inquirer/core": "^10.3.2",
+        "@inquirer/type": "^3.0.10",
+        "yoctocolors-cjs": "^2.1.3"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "@types/node": ">=18"
+      },
+      "peerDependenciesMeta": {
+        "@types/node": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@inquirer/search": {
+      "version": "3.2.2",
+      "resolved": "https://registry.npmjs.org/@inquirer/search/-/search-3.2.2.tgz",
+      "integrity": "sha512-p2bvRfENXCZdWF/U2BXvnSI9h+tuA8iNqtUKb9UWbmLYCRQxd8WkvwWvYn+3NgYaNwdUkHytJMGG4MMLucI1kA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@inquirer/core": "^10.3.2",
+        "@inquirer/figures": "^1.0.15",
+        "@inquirer/type": "^3.0.10",
+        "yoctocolors-cjs": "^2.1.3"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "@types/node": ">=18"
+      },
+      "peerDependenciesMeta": {
+        "@types/node": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@inquirer/select": {
+      "version": "4.4.2",
+      "resolved": "https://registry.npmjs.org/@inquirer/select/-/select-4.4.2.tgz",
+      "integrity": "sha512-l4xMuJo55MAe+N7Qr4rX90vypFwCajSakx59qe/tMaC1aEHWLyw68wF4o0A4SLAY4E0nd+Vt+EyskeDIqu1M6w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@inquirer/ansi": "^1.0.2",
+        "@inquirer/core": "^10.3.2",
+        "@inquirer/figures": "^1.0.15",
+        "@inquirer/type": "^3.0.10",
+        "yoctocolors-cjs": "^2.1.3"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "@types/node": ">=18"
+      },
+      "peerDependenciesMeta": {
+        "@types/node": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@inquirer/type": {
+      "version": "3.0.10",
+      "resolved": "https://registry.npmjs.org/@inquirer/type/-/type-3.0.10.tgz",
+      "integrity": "sha512-BvziSRxfz5Ov8ch0z/n3oijRSEcEsHnhggm4xFZe93DHcUCTlutlq9Ox4SVENAfcRD22UQq7T/atg9Wr3k09eA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "@types/node": ">=18"
+      },
+      "peerDependenciesMeta": {
+        "@types/node": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@isaacs/fs-minipass": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/@isaacs/fs-minipass/-/fs-minipass-4.0.1.tgz",
+      "integrity": "sha512-wgm9Ehl2jpeqP3zw/7mo3kRHFp5MEDhqAdwy1fTGkHAwnkGOVsgpvQhL8B5n1qlb01jV3n/bI0ZfZp5lWA1k4w==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "minipass": "^7.0.4"
+      },
+      "engines": {
+        "node": ">=18.0.0"
+      }
+    },
+    "node_modules/@istanbuljs/schema": {
+      "version": "0.1.6",
+      "resolved": "https://registry.npmjs.org/@istanbuljs/schema/-/schema-0.1.6.tgz",
+      "integrity": "sha512-+Sg6GCR/wy1oSmQDFq4LQDAhm3ETKnorxN+y5nbLULOR3P0c14f2Wurzj3/xqPXtasLFfHd5iRFQ7AJt4KH2cw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/@jridgewell/gen-mapping": {
+      "version": "0.3.13",
+      "resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.13.tgz",
+      "integrity": "sha512-2kkt/7niJ6MgEPxF0bYdQ6etZaA+fQvDcLKckhy1yIQOzaoKjBBjSj63/aLVjYE3qhRt5dvM+uUyfCg6UKCBbA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@jridgewell/sourcemap-codec": "^1.5.0",
+        "@jridgewell/trace-mapping": "^0.3.24"
+      }
+    },
+    "node_modules/@jridgewell/remapping": {
+      "version": "2.3.5",
+      "resolved": "https://registry.npmjs.org/@jridgewell/remapping/-/remapping-2.3.5.tgz",
+      "integrity": "sha512-LI9u/+laYG4Ds1TDKSJW2YPrIlcVYOwi2fUC6xB43lueCjgxV4lffOCZCtYFiH6TNOX+tQKXx97T4IKHbhyHEQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@jridgewell/gen-mapping": "^0.3.5",
+        "@jridgewell/trace-mapping": "^0.3.24"
+      }
+    },
+    "node_modules/@jridgewell/resolve-uri": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/@jridgewell/resolve-uri/-/resolve-uri-3.1.2.tgz",
+      "integrity": "sha512-bRISgCIjP20/tbWSPWMEi54QVPRZExkuD9lJL+UIxUKtwVJA8wW1Trb1jMs1RFXo1CBTNZ/5hpC9QvmKWdopKw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.0.0"
+      }
+    },
+    "node_modules/@jridgewell/sourcemap-codec": {
+      "version": "1.5.5",
+      "resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.5.5.tgz",
+      "integrity": "sha512-cYQ9310grqxueWbl+WuIUIaiUaDcj7WOq5fVhEljNVgRfOUhY9fy2zTvfoqWsnebh8Sl70VScFbICvJnLKB0Og==",
+      "license": "MIT"
+    },
+    "node_modules/@jridgewell/trace-mapping": {
+      "version": "0.3.31",
+      "resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.31.tgz",
+      "integrity": "sha512-zzNR+SdQSDJzc8joaeP8QQoCQr8NuYx2dIIytl1QeBEZHJ9uW6hebsrYgbz8hJwUQao3TWCMtmfV8Nu1twOLAw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@jridgewell/resolve-uri": "^3.1.0",
+        "@jridgewell/sourcemap-codec": "^1.4.14"
+      }
+    },
+    "node_modules/@kurkle/color": {
+      "version": "0.3.4",
+      "resolved": "https://registry.npmjs.org/@kurkle/color/-/color-0.3.4.tgz",
+      "integrity": "sha512-M5UknZPHRu3DEDWoipU6sE8PdkZ6Z/S+v4dD+Ke8IaNlpdSQah50lz1KtcFBa2vsdOnwbbnxJwVM4wty6udA5w==",
+      "license": "MIT"
+    },
+    "node_modules/@listr2/prompt-adapter-inquirer": {
+      "version": "3.0.5",
+      "resolved": "https://registry.npmjs.org/@listr2/prompt-adapter-inquirer/-/prompt-adapter-inquirer-3.0.5.tgz",
+      "integrity": "sha512-WELs+hj6xcilkloBXYf9XXK8tYEnKsgLj01Xl5ONUJpKjmT5hGVUzNUS5tooUxs7pGMrw+jFD/41WpqW4V3LDA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@inquirer/type": "^3.0.8"
+      },
+      "engines": {
+        "node": ">=20.0.0"
+      },
+      "peerDependencies": {
+        "@inquirer/prompts": ">= 3 < 8",
+        "listr2": "9.0.5"
+      }
+    },
+    "node_modules/@lmdb/lmdb-darwin-arm64": {
+      "version": "3.5.1",
+      "resolved": "https://registry.npmjs.org/@lmdb/lmdb-darwin-arm64/-/lmdb-darwin-arm64-3.5.1.tgz",
+      "integrity": "sha512-tpfN4kKrrMpQ+If1l8bhmoNkECJi0iOu6AEdrTJvWVC+32sLxTARX5Rsu579mPImRP9YFWfWgeRQ5oav7zApQQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ]
+    },
+    "node_modules/@lmdb/lmdb-darwin-x64": {
+      "version": "3.5.1",
+      "resolved": "https://registry.npmjs.org/@lmdb/lmdb-darwin-x64/-/lmdb-darwin-x64-3.5.1.tgz",
+      "integrity": "sha512-+a2tTfc3rmWhLAolFUWRgJtpSuu+Fw/yjn4rF406NMxhfjbMuiOUTDRvRlMFV+DzyjkwnokisskHbCWkS3Ly5w==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ]
+    },
+    "node_modules/@lmdb/lmdb-linux-arm": {
+      "version": "3.5.1",
+      "resolved": "https://registry.npmjs.org/@lmdb/lmdb-linux-arm/-/lmdb-linux-arm-3.5.1.tgz",
+      "integrity": "sha512-0EgcE6reYr8InjD7V37EgXcYrloqpxVPINy3ig1MwDSbl6LF/vXTYRH9OE1Ti1D8YZnB35ZH9aTcdfSb5lql2A==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@lmdb/lmdb-linux-arm64": {
+      "version": "3.5.1",
+      "resolved": "https://registry.npmjs.org/@lmdb/lmdb-linux-arm64/-/lmdb-linux-arm64-3.5.1.tgz",
+      "integrity": "sha512-aoERa5B6ywXdyFeYGQ1gbQpkMkDbEo45qVoXE5QpIRavqjnyPwjOulMkmkypkmsbJ5z4Wi0TBztON8agCTG0Vg==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@lmdb/lmdb-linux-x64": {
+      "version": "3.5.1",
+      "resolved": "https://registry.npmjs.org/@lmdb/lmdb-linux-x64/-/lmdb-linux-x64-3.5.1.tgz",
+      "integrity": "sha512-SqNDY1+vpji7bh0sFH5wlWyFTOzjbDOl0/kB5RLLYDAFyd/uw3n7wyrmas3rYPpAW7z18lMOi1yKlTPv967E3g==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@lmdb/lmdb-win32-arm64": {
+      "version": "3.5.1",
+      "resolved": "https://registry.npmjs.org/@lmdb/lmdb-win32-arm64/-/lmdb-win32-arm64-3.5.1.tgz",
+      "integrity": "sha512-50v0O1Lt37cwrmR9vWZK5hRW0Aw+KEmxJJ75fge/zIYdvNKB/0bSMSVR5Uc2OV9JhosIUyklOmrEvavwNJ8D6w==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ]
+    },
+    "node_modules/@lmdb/lmdb-win32-x64": {
+      "version": "3.5.1",
+      "resolved": "https://registry.npmjs.org/@lmdb/lmdb-win32-x64/-/lmdb-win32-x64-3.5.1.tgz",
+      "integrity": "sha512-qwosvPyl+zpUlp3gRb7UcJ3H8S28XHCzkv0Y0EgQToXjQP91ZD67EHSCDmaLjtKhe+GVIW5om1KUpzVLA0l6pg==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ]
+    },
+    "node_modules/@modelcontextprotocol/sdk": {
+      "version": "1.26.0",
+      "resolved": "https://registry.npmjs.org/@modelcontextprotocol/sdk/-/sdk-1.26.0.tgz",
+      "integrity": "sha512-Y5RmPncpiDtTXDbLKswIJzTqu2hyBKxTNsgKqKclDbhIgg1wgtf1fRuvxgTnRfcnxtvvgbIEcqUOzZrJ6iSReg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@hono/node-server": "^1.19.9",
+        "ajv": "^8.17.1",
+        "ajv-formats": "^3.0.1",
+        "content-type": "^1.0.5",
+        "cors": "^2.8.5",
+        "cross-spawn": "^7.0.5",
+        "eventsource": "^3.0.2",
+        "eventsource-parser": "^3.0.0",
+        "express": "^5.2.1",
+        "express-rate-limit": "^8.2.1",
+        "hono": "^4.11.4",
+        "jose": "^6.1.3",
+        "json-schema-typed": "^8.0.2",
+        "pkce-challenge": "^5.0.0",
+        "raw-body": "^3.0.0",
+        "zod": "^3.25 || ^4.0",
+        "zod-to-json-schema": "^3.25.1"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "@cfworker/json-schema": "^4.1.1",
+        "zod": "^3.25 || ^4.0"
+      },
+      "peerDependenciesMeta": {
+        "@cfworker/json-schema": {
+          "optional": true
+        },
+        "zod": {
+          "optional": false
+        }
+      }
+    },
+    "node_modules/@msgpackr-extract/msgpackr-extract-darwin-arm64": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/@msgpackr-extract/msgpackr-extract-darwin-arm64/-/msgpackr-extract-darwin-arm64-3.0.3.tgz",
+      "integrity": "sha512-QZHtlVgbAdy2zAqNA9Gu1UpIuI8Xvsd1v8ic6B2pZmeFnFcMWiPLfWXh7TVw4eGEZ/C9TH281KwhVoeQUKbyjw==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ]
+    },
+    "node_modules/@msgpackr-extract/msgpackr-extract-darwin-x64": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/@msgpackr-extract/msgpackr-extract-darwin-x64/-/msgpackr-extract-darwin-x64-3.0.3.tgz",
+      "integrity": "sha512-mdzd3AVzYKuUmiWOQ8GNhl64/IoFGol569zNRdkLReh6LRLHOXxU4U8eq0JwaD8iFHdVGqSy4IjFL4reoWCDFw==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ]
+    },
+    "node_modules/@msgpackr-extract/msgpackr-extract-linux-arm": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/@msgpackr-extract/msgpackr-extract-linux-arm/-/msgpackr-extract-linux-arm-3.0.3.tgz",
+      "integrity": "sha512-fg0uy/dG/nZEXfYilKoRe7yALaNmHoYeIoJuJ7KJ+YyU2bvY8vPv27f7UKhGRpY6euFYqEVhxCFZgAUNQBM3nw==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@msgpackr-extract/msgpackr-extract-linux-arm64": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/@msgpackr-extract/msgpackr-extract-linux-arm64/-/msgpackr-extract-linux-arm64-3.0.3.tgz",
+      "integrity": "sha512-YxQL+ax0XqBJDZiKimS2XQaf+2wDGVa1enVRGzEvLLVFeqa5kx2bWbtcSXgsxjQB7nRqqIGFIcLteF/sHeVtQg==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@msgpackr-extract/msgpackr-extract-linux-x64": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/@msgpackr-extract/msgpackr-extract-linux-x64/-/msgpackr-extract-linux-x64-3.0.3.tgz",
+      "integrity": "sha512-cvwNfbP07pKUfq1uH+S6KJ7dT9K8WOE4ZiAcsrSes+UY55E/0jLYc+vq+DO7jlmqRb5zAggExKm0H7O/CBaesg==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@msgpackr-extract/msgpackr-extract-win32-x64": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/@msgpackr-extract/msgpackr-extract-win32-x64/-/msgpackr-extract-win32-x64-3.0.3.tgz",
+      "integrity": "sha512-x0fWaQtYp4E6sktbsdAqnehxDgEc/VwM7uLsRCYWaiGu0ykYdZPiS8zCWdnjHwyiumousxfBm4SO31eXqwEZhQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ]
+    },
+    "node_modules/@napi-rs/nice": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@napi-rs/nice/-/nice-1.1.1.tgz",
+      "integrity": "sha512-xJIPs+bYuc9ASBl+cvGsKbGrJmS6fAKaSZCnT0lhahT5rhA2VVy9/EcIgd2JhtEuFOJNx7UHNn/qiTPTY4nrQw==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "engines": {
+        "node": ">= 10"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/Brooooooklyn"
+      },
+      "optionalDependencies": {
+        "@napi-rs/nice-android-arm-eabi": "1.1.1",
+        "@napi-rs/nice-android-arm64": "1.1.1",
+        "@napi-rs/nice-darwin-arm64": "1.1.1",
+        "@napi-rs/nice-darwin-x64": "1.1.1",
+        "@napi-rs/nice-freebsd-x64": "1.1.1",
+        "@napi-rs/nice-linux-arm-gnueabihf": "1.1.1",
+        "@napi-rs/nice-linux-arm64-gnu": "1.1.1",
+        "@napi-rs/nice-linux-arm64-musl": "1.1.1",
+        "@napi-rs/nice-linux-ppc64-gnu": "1.1.1",
+        "@napi-rs/nice-linux-riscv64-gnu": "1.1.1",
+        "@napi-rs/nice-linux-s390x-gnu": "1.1.1",
+        "@napi-rs/nice-linux-x64-gnu": "1.1.1",
+        "@napi-rs/nice-linux-x64-musl": "1.1.1",
+        "@napi-rs/nice-openharmony-arm64": "1.1.1",
+        "@napi-rs/nice-win32-arm64-msvc": "1.1.1",
+        "@napi-rs/nice-win32-ia32-msvc": "1.1.1",
+        "@napi-rs/nice-win32-x64-msvc": "1.1.1"
+      }
+    },
+    "node_modules/@napi-rs/nice-android-arm-eabi": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@napi-rs/nice-android-arm-eabi/-/nice-android-arm-eabi-1.1.1.tgz",
+      "integrity": "sha512-kjirL3N6TnRPv5iuHw36wnucNqXAO46dzK9oPb0wj076R5Xm8PfUVA9nAFB5ZNMmfJQJVKACAPd/Z2KYMppthw==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@napi-rs/nice-android-arm64": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@napi-rs/nice-android-arm64/-/nice-android-arm64-1.1.1.tgz",
+      "integrity": "sha512-blG0i7dXgbInN5urONoUCNf+DUEAavRffrO7fZSeoRMJc5qD+BJeNcpr54msPF6qfDD6kzs9AQJogZvT2KD5nw==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@napi-rs/nice-darwin-arm64": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@napi-rs/nice-darwin-arm64/-/nice-darwin-arm64-1.1.1.tgz",
+      "integrity": "sha512-s/E7w45NaLqTGuOjC2p96pct4jRfo61xb9bU1unM/MJ/RFkKlJyJDx7OJI/O0ll/hrfpqKopuAFDV8yo0hfT7A==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@napi-rs/nice-darwin-x64": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@napi-rs/nice-darwin-x64/-/nice-darwin-x64-1.1.1.tgz",
+      "integrity": "sha512-dGoEBnVpsdcC+oHHmW1LRK5eiyzLwdgNQq3BmZIav+9/5WTZwBYX7r5ZkQC07Nxd3KHOCkgbHSh4wPkH1N1LiQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@napi-rs/nice-freebsd-x64": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@napi-rs/nice-freebsd-x64/-/nice-freebsd-x64-1.1.1.tgz",
+      "integrity": "sha512-kHv4kEHAylMYmlNwcQcDtXjklYp4FCf0b05E+0h6nDHsZ+F0bDe04U/tXNOqrx5CmIAth4vwfkjjUmp4c4JktQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@napi-rs/nice-linux-arm-gnueabihf": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@napi-rs/nice-linux-arm-gnueabihf/-/nice-linux-arm-gnueabihf-1.1.1.tgz",
+      "integrity": "sha512-E1t7K0efyKXZDoZg1LzCOLxgolxV58HCkaEkEvIYQx12ht2pa8hoBo+4OB3qh7e+QiBlp1SRf+voWUZFxyhyqg==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@napi-rs/nice-linux-arm64-gnu": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@napi-rs/nice-linux-arm64-gnu/-/nice-linux-arm64-gnu-1.1.1.tgz",
+      "integrity": "sha512-CIKLA12DTIZlmTaaKhQP88R3Xao+gyJxNWEn04wZwC2wmRapNnxCUZkVwggInMJvtVElA+D4ZzOU5sX4jV+SmQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@napi-rs/nice-linux-arm64-musl": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@napi-rs/nice-linux-arm64-musl/-/nice-linux-arm64-musl-1.1.1.tgz",
+      "integrity": "sha512-+2Rzdb3nTIYZ0YJF43qf2twhqOCkiSrHx2Pg6DJaCPYhhaxbLcdlV8hCRMHghQ+EtZQWGNcS2xF4KxBhSGeutg==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@napi-rs/nice-linux-ppc64-gnu": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@napi-rs/nice-linux-ppc64-gnu/-/nice-linux-ppc64-gnu-1.1.1.tgz",
+      "integrity": "sha512-4FS8oc0GeHpwvv4tKciKkw3Y4jKsL7FRhaOeiPei0X9T4Jd619wHNe4xCLmN2EMgZoeGg+Q7GY7BsvwKpL22Tg==",
+      "cpu": [
+        "ppc64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@napi-rs/nice-linux-riscv64-gnu": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@napi-rs/nice-linux-riscv64-gnu/-/nice-linux-riscv64-gnu-1.1.1.tgz",
+      "integrity": "sha512-HU0nw9uD4FO/oGCCk409tCi5IzIZpH2agE6nN4fqpwVlCn5BOq0MS1dXGjXaG17JaAvrlpV5ZeyZwSon10XOXw==",
+      "cpu": [
+        "riscv64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@napi-rs/nice-linux-s390x-gnu": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@napi-rs/nice-linux-s390x-gnu/-/nice-linux-s390x-gnu-1.1.1.tgz",
+      "integrity": "sha512-2YqKJWWl24EwrX0DzCQgPLKQBxYDdBxOHot1KWEq7aY2uYeX+Uvtv4I8xFVVygJDgf6/92h9N3Y43WPx8+PAgQ==",
+      "cpu": [
+        "s390x"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@napi-rs/nice-linux-x64-gnu": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@napi-rs/nice-linux-x64-gnu/-/nice-linux-x64-gnu-1.1.1.tgz",
+      "integrity": "sha512-/gaNz3R92t+dcrfCw/96pDopcmec7oCcAQ3l/M+Zxr82KT4DljD37CpgrnXV+pJC263JkW572pdbP3hP+KjcIg==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@napi-rs/nice-linux-x64-musl": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@napi-rs/nice-linux-x64-musl/-/nice-linux-x64-musl-1.1.1.tgz",
+      "integrity": "sha512-xScCGnyj/oppsNPMnevsBe3pvNaoK7FGvMjT35riz9YdhB2WtTG47ZlbxtOLpjeO9SqqQ2J2igCmz6IJOD5JYw==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@napi-rs/nice-openharmony-arm64": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@napi-rs/nice-openharmony-arm64/-/nice-openharmony-arm64-1.1.1.tgz",
+      "integrity": "sha512-6uJPRVwVCLDeoOaNyeiW0gp2kFIM4r7PL2MczdZQHkFi9gVlgm+Vn+V6nTWRcu856mJ2WjYJiumEajfSm7arPQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "openharmony"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@napi-rs/nice-win32-arm64-msvc": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@napi-rs/nice-win32-arm64-msvc/-/nice-win32-arm64-msvc-1.1.1.tgz",
+      "integrity": "sha512-uoTb4eAvM5B2aj/z8j+Nv8OttPf2m+HVx3UjA5jcFxASvNhQriyCQF1OB1lHL43ZhW+VwZlgvjmP5qF3+59atA==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@napi-rs/nice-win32-ia32-msvc": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@napi-rs/nice-win32-ia32-msvc/-/nice-win32-ia32-msvc-1.1.1.tgz",
+      "integrity": "sha512-CNQqlQT9MwuCsg1Vd/oKXiuH+TcsSPJmlAFc5frFyX/KkOh0UpBLEj7aoY656d5UKZQMQFP7vJNa1DNUNORvug==",
+      "cpu": [
+        "ia32"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@napi-rs/nice-win32-x64-msvc": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@napi-rs/nice-win32-x64-msvc/-/nice-win32-x64-msvc-1.1.1.tgz",
+      "integrity": "sha512-vB+4G/jBQCAh0jelMTY3+kgFy00Hlx2f2/1zjMoH821IbplbWZOkLiTYXQkygNTzQJTq5cvwBDgn2ppHD+bglQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">= 10"
+      }
+    },
+    "node_modules/@napi-rs/wasm-runtime": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/@napi-rs/wasm-runtime/-/wasm-runtime-1.1.4.tgz",
+      "integrity": "sha512-3NQNNgA1YSlJb/kMH1ildASP9HW7/7kYnRI2szWJaofaS1hWmbGI4H+d3+22aGzXXN9IJ+n+GiFVcGipJP18ow==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "@tybys/wasm-util": "^0.10.1"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/Brooooooklyn"
+      },
+      "peerDependencies": {
+        "@emnapi/core": "^1.7.1",
+        "@emnapi/runtime": "^1.7.1"
+      }
+    },
+    "node_modules/@ng-select/ng-select": {
+      "version": "21.8.2",
+      "resolved": "https://registry.npmjs.org/@ng-select/ng-select/-/ng-select-21.8.2.tgz",
+      "integrity": "sha512-Gk5xlVKLOG3WTIgOteduwlKBZTt0njkoUXheKgUSKn+h+poYQAf61uENCK08Tj0XWxes9BQUc5J+R2GC+86jgA==",
+      "license": "MIT",
+      "dependencies": {
+        "tslib": "^2.8.1"
+      },
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || ^24.0.0"
+      },
+      "peerDependencies": {
+        "@angular/common": "^21.0.0",
+        "@angular/core": "^21.0.0",
+        "@angular/forms": "^21.0.0"
+      }
+    },
+    "node_modules/@npmcli/agent": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/@npmcli/agent/-/agent-4.0.0.tgz",
+      "integrity": "sha512-kAQTcEN9E8ERLVg5AsGwLNoFb+oEG6engbqAU2P43gD4JEIkNGMHdVQ096FsOAAYpZPB0RSt0zgInKIAS1l5QA==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "agent-base": "^7.1.0",
+        "http-proxy-agent": "^7.0.0",
+        "https-proxy-agent": "^7.0.1",
+        "lru-cache": "^11.2.1",
+        "socks-proxy-agent": "^8.0.3"
+      },
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/@npmcli/agent/node_modules/lru-cache": {
+      "version": "11.5.0",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-11.5.0.tgz",
+      "integrity": "sha512-5YgH9UJd7wVb9hIouI2adWpgqrrICkt070Dnj8EUY1+B4B2P9eRLPAkAAo6NICA7CEhOIeBHl46u9zSNpNu7zA==",
+      "dev": true,
+      "license": "BlueOak-1.0.0",
+      "engines": {
+        "node": "20 || >=22"
+      }
+    },
+    "node_modules/@npmcli/fs": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/@npmcli/fs/-/fs-5.0.0.tgz",
+      "integrity": "sha512-7OsC1gNORBEawOa5+j2pXN9vsicaIOH5cPXxoR6fJOmH6/EXpJB2CajXOu1fPRFun2m1lktEFX11+P89hqO/og==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "semver": "^7.3.5"
+      },
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/@npmcli/git": {
+      "version": "7.0.2",
+      "resolved": "https://registry.npmjs.org/@npmcli/git/-/git-7.0.2.tgz",
+      "integrity": "sha512-oeolHDjExNAJAnlYP2qzNjMX/Xi9bmu78C9dIGr4xjobrSKbuMYCph8lTzn4vnW3NjIqVmw/f8BCfouqyJXlRg==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "@gar/promise-retry": "^1.0.0",
+        "@npmcli/promise-spawn": "^9.0.0",
+        "ini": "^6.0.0",
+        "lru-cache": "^11.2.1",
+        "npm-pick-manifest": "^11.0.1",
+        "proc-log": "^6.0.0",
+        "semver": "^7.3.5",
+        "which": "^6.0.0"
+      },
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/@npmcli/git/node_modules/isexe": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/isexe/-/isexe-4.0.0.tgz",
+      "integrity": "sha512-FFUtZMpoZ8RqHS3XeXEmHWLA4thH+ZxCv2lOiPIn1Xc7CxrqhWzNSDzD+/chS/zbYezmiwWLdQC09JdQKmthOw==",
+      "dev": true,
+      "license": "BlueOak-1.0.0",
+      "engines": {
+        "node": ">=20"
+      }
+    },
+    "node_modules/@npmcli/git/node_modules/lru-cache": {
+      "version": "11.5.0",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-11.5.0.tgz",
+      "integrity": "sha512-5YgH9UJd7wVb9hIouI2adWpgqrrICkt070Dnj8EUY1+B4B2P9eRLPAkAAo6NICA7CEhOIeBHl46u9zSNpNu7zA==",
+      "dev": true,
+      "license": "BlueOak-1.0.0",
+      "engines": {
+        "node": "20 || >=22"
+      }
+    },
+    "node_modules/@npmcli/git/node_modules/which": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/which/-/which-6.0.1.tgz",
+      "integrity": "sha512-oGLe46MIrCRqX7ytPUf66EAYvdeMIZYn3WaocqqKZAxrBpkqHfL/qvTyJ/bTk5+AqHCjXmrv3CEWgy368zhRUg==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "isexe": "^4.0.0"
+      },
+      "bin": {
+        "node-which": "bin/which.js"
+      },
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/@npmcli/installed-package-contents": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/@npmcli/installed-package-contents/-/installed-package-contents-4.0.0.tgz",
+      "integrity": "sha512-yNyAdkBxB72gtZ4GrwXCM0ZUedo9nIbOMKfGjt6Cu6DXf0p8y1PViZAKDC8q8kv/fufx0WTjRBdSlyrvnP7hmA==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "npm-bundled": "^5.0.0",
+        "npm-normalize-package-bin": "^5.0.0"
+      },
+      "bin": {
+        "installed-package-contents": "bin/index.js"
+      },
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/@npmcli/node-gyp": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/@npmcli/node-gyp/-/node-gyp-5.0.0.tgz",
+      "integrity": "sha512-uuG5HZFXLfyFKqg8QypsmgLQW7smiRjVc45bqD/ofZZcR/uxEjgQU8qDPv0s9TEeMUiAAU/GC5bR6++UdTirIQ==",
+      "dev": true,
+      "license": "ISC",
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/@npmcli/package-json": {
+      "version": "7.0.5",
+      "resolved": "https://registry.npmjs.org/@npmcli/package-json/-/package-json-7.0.5.tgz",
+      "integrity": "sha512-iVuTlG3ORq2iaVa1IWUxAO/jIp77tUKBhoMjuzYW2kL4MLN1bi/ofqkZ7D7OOwh8coAx1/S2ge0rMdGv8sLSOQ==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "@npmcli/git": "^7.0.0",
+        "glob": "^13.0.0",
+        "hosted-git-info": "^9.0.0",
+        "json-parse-even-better-errors": "^5.0.0",
+        "proc-log": "^6.0.0",
+        "semver": "^7.5.3",
+        "spdx-expression-parse": "^4.0.0"
+      },
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/@npmcli/promise-spawn": {
+      "version": "9.0.1",
+      "resolved": "https://registry.npmjs.org/@npmcli/promise-spawn/-/promise-spawn-9.0.1.tgz",
+      "integrity": "sha512-OLUaoqBuyxeTqUvjA3FZFiXUfYC1alp3Sa99gW3EUDz3tZ3CbXDdcZ7qWKBzicrJleIgucoWamWH1saAmH/l2Q==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "which": "^6.0.0"
+      },
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/@npmcli/promise-spawn/node_modules/isexe": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/isexe/-/isexe-4.0.0.tgz",
+      "integrity": "sha512-FFUtZMpoZ8RqHS3XeXEmHWLA4thH+ZxCv2lOiPIn1Xc7CxrqhWzNSDzD+/chS/zbYezmiwWLdQC09JdQKmthOw==",
+      "dev": true,
+      "license": "BlueOak-1.0.0",
+      "engines": {
+        "node": ">=20"
+      }
+    },
+    "node_modules/@npmcli/promise-spawn/node_modules/which": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/which/-/which-6.0.1.tgz",
+      "integrity": "sha512-oGLe46MIrCRqX7ytPUf66EAYvdeMIZYn3WaocqqKZAxrBpkqHfL/qvTyJ/bTk5+AqHCjXmrv3CEWgy368zhRUg==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "isexe": "^4.0.0"
+      },
+      "bin": {
+        "node-which": "bin/which.js"
+      },
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/@npmcli/redact": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/@npmcli/redact/-/redact-4.0.0.tgz",
+      "integrity": "sha512-gOBg5YHMfZy+TfHArfVogwgfBeQnKbbGo3pSUyK/gSI0AVu+pEiDVcKlQb0D8Mg1LNRZILZ6XG8I5dJ4KuAd9Q==",
+      "dev": true,
+      "license": "ISC",
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/@npmcli/run-script": {
+      "version": "10.0.4",
+      "resolved": "https://registry.npmjs.org/@npmcli/run-script/-/run-script-10.0.4.tgz",
+      "integrity": "sha512-mGUWr1uMnf0le2TwfOZY4SFxZGXGfm4Jtay/nwAa2FLNAKXUoUwaGwBMNH36UHPtinWfTSJ3nqFQr0091CxVGg==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "@npmcli/node-gyp": "^5.0.0",
+        "@npmcli/package-json": "^7.0.0",
+        "@npmcli/promise-spawn": "^9.0.0",
+        "node-gyp": "^12.1.0",
+        "proc-log": "^6.0.0"
+      },
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/@oxc-project/types": {
+      "version": "0.113.0",
+      "resolved": "https://registry.npmjs.org/@oxc-project/types/-/types-0.113.0.tgz",
+      "integrity": "sha512-Tp3XmgxwNQ9pEN9vxgJBAqdRamHibi76iowQ38O2I4PMpcvNRQNVsU2n1x1nv9yh0XoTrGFzf7cZSGxmixxrhA==",
+      "dev": true,
+      "license": "MIT",
+      "funding": {
+        "url": "https://github.com/sponsors/Boshen"
+      }
+    },
+    "node_modules/@parcel/watcher": {
+      "version": "2.5.6",
+      "resolved": "https://registry.npmjs.org/@parcel/watcher/-/watcher-2.5.6.tgz",
+      "integrity": "sha512-tmmZ3lQxAe/k/+rNnXQRawJ4NjxO2hqiOLTHvWchtGZULp4RyFeh6aU4XdOYBFe2KE1oShQTv4AblOs2iOrNnQ==",
+      "dev": true,
+      "hasInstallScript": true,
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "detect-libc": "^2.0.3",
+        "is-glob": "^4.0.3",
+        "node-addon-api": "^7.0.0",
+        "picomatch": "^4.0.3"
+      },
+      "engines": {
+        "node": ">= 10.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      },
+      "optionalDependencies": {
+        "@parcel/watcher-android-arm64": "2.5.6",
+        "@parcel/watcher-darwin-arm64": "2.5.6",
+        "@parcel/watcher-darwin-x64": "2.5.6",
+        "@parcel/watcher-freebsd-x64": "2.5.6",
+        "@parcel/watcher-linux-arm-glibc": "2.5.6",
+        "@parcel/watcher-linux-arm-musl": "2.5.6",
+        "@parcel/watcher-linux-arm64-glibc": "2.5.6",
+        "@parcel/watcher-linux-arm64-musl": "2.5.6",
+        "@parcel/watcher-linux-x64-glibc": "2.5.6",
+        "@parcel/watcher-linux-x64-musl": "2.5.6",
+        "@parcel/watcher-win32-arm64": "2.5.6",
+        "@parcel/watcher-win32-ia32": "2.5.6",
+        "@parcel/watcher-win32-x64": "2.5.6"
+      }
+    },
+    "node_modules/@parcel/watcher-android-arm64": {
+      "version": "2.5.6",
+      "resolved": "https://registry.npmjs.org/@parcel/watcher-android-arm64/-/watcher-android-arm64-2.5.6.tgz",
+      "integrity": "sha512-YQxSS34tPF/6ZG7r/Ih9xy+kP/WwediEUsqmtf0cuCV5TPPKw/PQHRhueUo6JdeFJaqV3pyjm0GdYjZotbRt/A==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">= 10.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/@parcel/watcher-darwin-arm64": {
+      "version": "2.5.6",
+      "resolved": "https://registry.npmjs.org/@parcel/watcher-darwin-arm64/-/watcher-darwin-arm64-2.5.6.tgz",
+      "integrity": "sha512-Z2ZdrnwyXvvvdtRHLmM4knydIdU9adO3D4n/0cVipF3rRiwP+3/sfzpAwA/qKFL6i1ModaabkU7IbpeMBgiVEA==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">= 10.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/@parcel/watcher-darwin-x64": {
+      "version": "2.5.6",
+      "resolved": "https://registry.npmjs.org/@parcel/watcher-darwin-x64/-/watcher-darwin-x64-2.5.6.tgz",
+      "integrity": "sha512-HgvOf3W9dhithcwOWX9uDZyn1lW9R+7tPZ4sug+NGrGIo4Rk1hAXLEbcH1TQSqxts0NYXXlOWqVpvS1SFS4fRg==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">= 10.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/@parcel/watcher-freebsd-x64": {
+      "version": "2.5.6",
+      "resolved": "https://registry.npmjs.org/@parcel/watcher-freebsd-x64/-/watcher-freebsd-x64-2.5.6.tgz",
+      "integrity": "sha512-vJVi8yd/qzJxEKHkeemh7w3YAn6RJCtYlE4HPMoVnCpIXEzSrxErBW5SJBgKLbXU3WdIpkjBTeUNtyBVn8TRng==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ],
+      "engines": {
+        "node": ">= 10.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/@parcel/watcher-linux-arm-glibc": {
+      "version": "2.5.6",
+      "resolved": "https://registry.npmjs.org/@parcel/watcher-linux-arm-glibc/-/watcher-linux-arm-glibc-2.5.6.tgz",
+      "integrity": "sha512-9JiYfB6h6BgV50CCfasfLf/uvOcJskMSwcdH1PHH9rvS1IrNy8zad6IUVPVUfmXr+u+Km9IxcfMLzgdOudz9EQ==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 10.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/@parcel/watcher-linux-arm-musl": {
+      "version": "2.5.6",
+      "resolved": "https://registry.npmjs.org/@parcel/watcher-linux-arm-musl/-/watcher-linux-arm-musl-2.5.6.tgz",
+      "integrity": "sha512-Ve3gUCG57nuUUSyjBq/MAM0CzArtuIOxsBdQ+ftz6ho8n7s1i9E1Nmk/xmP323r2YL0SONs1EuwqBp2u1k5fxg==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 10.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/@parcel/watcher-linux-arm64-glibc": {
+      "version": "2.5.6",
+      "resolved": "https://registry.npmjs.org/@parcel/watcher-linux-arm64-glibc/-/watcher-linux-arm64-glibc-2.5.6.tgz",
+      "integrity": "sha512-f2g/DT3NhGPdBmMWYoxixqYr3v/UXcmLOYy16Bx0TM20Tchduwr4EaCbmxh1321TABqPGDpS8D/ggOTaljijOA==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 10.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/@parcel/watcher-linux-arm64-musl": {
+      "version": "2.5.6",
+      "resolved": "https://registry.npmjs.org/@parcel/watcher-linux-arm64-musl/-/watcher-linux-arm64-musl-2.5.6.tgz",
+      "integrity": "sha512-qb6naMDGlbCwdhLj6hgoVKJl2odL34z2sqkC7Z6kzir8b5W65WYDpLB6R06KabvZdgoHI/zxke4b3zR0wAbDTA==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 10.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/@parcel/watcher-linux-x64-glibc": {
+      "version": "2.5.6",
+      "resolved": "https://registry.npmjs.org/@parcel/watcher-linux-x64-glibc/-/watcher-linux-x64-glibc-2.5.6.tgz",
+      "integrity": "sha512-kbT5wvNQlx7NaGjzPFu8nVIW1rWqV780O7ZtkjuWaPUgpv2NMFpjYERVi0UYj1msZNyCzGlaCWEtzc+exjMGbQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 10.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/@parcel/watcher-linux-x64-musl": {
+      "version": "2.5.6",
+      "resolved": "https://registry.npmjs.org/@parcel/watcher-linux-x64-musl/-/watcher-linux-x64-musl-2.5.6.tgz",
+      "integrity": "sha512-1JRFeC+h7RdXwldHzTsmdtYR/Ku8SylLgTU/reMuqdVD7CtLwf0VR1FqeprZ0eHQkO0vqsbvFLXUmYm/uNKJBg==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 10.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/@parcel/watcher-win32-arm64": {
+      "version": "2.5.6",
+      "resolved": "https://registry.npmjs.org/@parcel/watcher-win32-arm64/-/watcher-win32-arm64-2.5.6.tgz",
+      "integrity": "sha512-3ukyebjc6eGlw9yRt678DxVF7rjXatWiHvTXqphZLvo7aC5NdEgFufVwjFfY51ijYEWpXbqF5jtrK275z52D4Q==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">= 10.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/@parcel/watcher-win32-ia32": {
+      "version": "2.5.6",
+      "resolved": "https://registry.npmjs.org/@parcel/watcher-win32-ia32/-/watcher-win32-ia32-2.5.6.tgz",
+      "integrity": "sha512-k35yLp1ZMwwee3Ez/pxBi5cf4AoBKYXj00CZ80jUz5h8prpiaQsiRPKQMxoLstNuqe2vR4RNPEAEcjEFzhEz/g==",
+      "cpu": [
+        "ia32"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">= 10.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/@parcel/watcher-win32-x64": {
+      "version": "2.5.6",
+      "resolved": "https://registry.npmjs.org/@parcel/watcher-win32-x64/-/watcher-win32-x64-2.5.6.tgz",
+      "integrity": "sha512-hbQlYcCq5dlAX9Qx+kFb0FHue6vbjlf0FrNzSKdYK2APUf7tGfGxQCk2ihEREmbR6ZMc0MVAD5RIX/41gpUzTw==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">= 10.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/@parcel/watcher/node_modules/node-addon-api": {
+      "version": "7.1.1",
+      "resolved": "https://registry.npmjs.org/node-addon-api/-/node-addon-api-7.1.1.tgz",
+      "integrity": "sha512-5m3bsyrjFWE1xf7nz7YXdN4udnVtXK6/Yfgn5qnahL6bCkf2yKt4k3nuTKAtT4r3IG8JNR2ncsIMdZuAzJjHQQ==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true
+    },
+    "node_modules/@protobufjs/aspromise": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/@protobufjs/aspromise/-/aspromise-1.1.2.tgz",
+      "integrity": "sha512-j+gKExEuLmKwvz3OgROXtrJ2UG2x8Ch2YZUxahh+s1F2HZ+wAceUNLkvy6zKCPVRkU++ZWQrdxsUeQXmcg4uoQ==",
+      "license": "BSD-3-Clause"
+    },
+    "node_modules/@protobufjs/base64": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/@protobufjs/base64/-/base64-1.1.2.tgz",
+      "integrity": "sha512-AZkcAA5vnN/v4PDqKyMR5lx7hZttPDgClv83E//FMNhR2TMcLUhfRUBHCmSl0oi9zMgDDqRUJkSxO3wm85+XLg==",
+      "license": "BSD-3-Clause"
+    },
+    "node_modules/@protobufjs/codegen": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/@protobufjs/codegen/-/codegen-2.0.5.tgz",
+      "integrity": "sha512-zgXFLzW3Ap33e6d0Wlj4MGIm6Ce8O89n/apUaGNB/jx+hw+ruWEp7EwGUshdLKVRCxZW12fp9r40E1mQrf/34g==",
+      "license": "BSD-3-Clause"
+    },
+    "node_modules/@protobufjs/eventemitter": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@protobufjs/eventemitter/-/eventemitter-1.1.1.tgz",
+      "integrity": "sha512-vW1GmwMZNnL+gMRaovlh9yZX74kc+TTU3FObkkurpMaRtBfLP3ldjS9KQWlwZgraRE0+dheEEoAxdzcJQ8eXZg==",
+      "license": "BSD-3-Clause"
+    },
+    "node_modules/@protobufjs/fetch": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@protobufjs/fetch/-/fetch-1.1.1.tgz",
+      "integrity": "sha512-GpptLrs57adMSuHi3VNj0mAF8dwh36LMaYF6XyJ6JMWlVsc+t42tm1HSEDmOs3A8fC9yyeisgLhsTVQokOZ0zw==",
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "@protobufjs/aspromise": "^1.1.1"
+      }
+    },
+    "node_modules/@protobufjs/float": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/@protobufjs/float/-/float-1.0.2.tgz",
+      "integrity": "sha512-Ddb+kVXlXst9d+R9PfTIxh1EdNkgoRe5tOX6t01f1lYWOvJnSPDBlG241QLzcyPdoNTsblLUdujGSE4RzrTZGQ==",
+      "license": "BSD-3-Clause"
+    },
+    "node_modules/@protobufjs/inquire": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/@protobufjs/inquire/-/inquire-1.1.2.tgz",
+      "integrity": "sha512-pa0vFRuws4wkvaXKK1uXZMAwAX4/t8ANaJo45iw/oQHNQ9q5xUzwgFmVJGXiga2BeN+zpX7Vf9vmsiIa2J+MUw==",
+      "license": "BSD-3-Clause"
+    },
+    "node_modules/@protobufjs/path": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/@protobufjs/path/-/path-1.1.2.tgz",
+      "integrity": "sha512-6JOcJ5Tm08dOHAbdR3GrvP+yUUfkjG5ePsHYczMFLq3ZmMkAD98cDgcT2iA1lJ9NVwFd4tH/iSSoe44YWkltEA==",
+      "license": "BSD-3-Clause"
+    },
+    "node_modules/@protobufjs/pool": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/@protobufjs/pool/-/pool-1.1.0.tgz",
+      "integrity": "sha512-0kELaGSIDBKvcgS4zkjz1PeddatrjYcmMWOlAuAPwAeccUrPHdUqo/J6LiymHHEiJT5NrF1UVwxY14f+fy4WQw==",
+      "license": "BSD-3-Clause"
+    },
+    "node_modules/@protobufjs/utf8": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/@protobufjs/utf8/-/utf8-1.1.1.tgz",
+      "integrity": "sha512-oOAWABowe8EAbMyWKM0tYDKi8Yaox52D+HWZhAIJqQXbqe0xI/GV7FhLWqlEKreMkfDjshR5FKgi3mnle0h6Eg==",
+      "license": "BSD-3-Clause"
+    },
+    "node_modules/@rolldown/binding-android-arm64": {
+      "version": "1.0.0-rc.4",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-android-arm64/-/binding-android-arm64-1.0.0-rc.4.tgz",
+      "integrity": "sha512-vRq9f4NzvbdZavhQbjkJBx7rRebDKYR9zHfO/Wg486+I7bSecdUapzCm5cyXoK+LHokTxgSq7A5baAXUZkIz0w==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      }
+    },
+    "node_modules/@rolldown/binding-darwin-arm64": {
+      "version": "1.0.0-rc.4",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-darwin-arm64/-/binding-darwin-arm64-1.0.0-rc.4.tgz",
+      "integrity": "sha512-kFgEvkWLqt3YCgKB5re9RlIrx9bRsvyVUnaTakEpOPuLGzLpLapYxE9BufJNvPg8GjT6mB1alN4yN1NjzoeM8Q==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      }
+    },
+    "node_modules/@rolldown/binding-darwin-x64": {
+      "version": "1.0.0-rc.4",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-darwin-x64/-/binding-darwin-x64-1.0.0-rc.4.tgz",
+      "integrity": "sha512-JXmaOJGsL/+rsmMfutcDjxWM2fTaVgCHGoXS7nE8Z3c9NAYjGqHvXrAhMUZvMpHS/k7Mg+X7n/MVKb7NYWKKww==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      }
+    },
+    "node_modules/@rolldown/binding-freebsd-x64": {
+      "version": "1.0.0-rc.4",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-freebsd-x64/-/binding-freebsd-x64-1.0.0-rc.4.tgz",
+      "integrity": "sha512-ep3Catd6sPnHTM0P4hNEvIv5arnDvk01PfyJIJ+J3wVCG1eEaPo09tvFqdtcaTrkwQy0VWR24uz+cb4IsK53Qw==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ],
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      }
+    },
+    "node_modules/@rolldown/binding-linux-arm-gnueabihf": {
+      "version": "1.0.0-rc.4",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-arm-gnueabihf/-/binding-linux-arm-gnueabihf-1.0.0-rc.4.tgz",
+      "integrity": "sha512-LwA5ayKIpnsgXJEwWc3h8wPiS33NMIHd9BhsV92T8VetVAbGe2qXlJwNVDGHN5cOQ22R9uYvbrQir2AB+ntT2w==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      }
+    },
+    "node_modules/@rolldown/binding-linux-arm64-gnu": {
+      "version": "1.0.0-rc.4",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-arm64-gnu/-/binding-linux-arm64-gnu-1.0.0-rc.4.tgz",
+      "integrity": "sha512-AC1WsGdlV1MtGay/OQ4J9T7GRadVnpYRzTcygV1hKnypbYN20Yh4t6O1Sa2qRBMqv1etulUknqXjc3CTIsBu6A==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      }
+    },
+    "node_modules/@rolldown/binding-linux-arm64-musl": {
+      "version": "1.0.0-rc.4",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-arm64-musl/-/binding-linux-arm64-musl-1.0.0-rc.4.tgz",
+      "integrity": "sha512-lU+6rgXXViO61B4EudxtVMXSOfiZONR29Sys5VGSetUY7X8mg9FCKIIjcPPj8xNDeYzKl+H8F/qSKOBVFJChCQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      }
+    },
+    "node_modules/@rolldown/binding-linux-x64-gnu": {
+      "version": "1.0.0-rc.4",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-x64-gnu/-/binding-linux-x64-gnu-1.0.0-rc.4.tgz",
+      "integrity": "sha512-DZaN1f0PGp/bSvKhtw50pPsnln4T13ycDq1FrDWRiHmWt1JeW+UtYg9touPFf8yt993p8tS2QjybpzKNTxYEwg==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      }
+    },
+    "node_modules/@rolldown/binding-linux-x64-musl": {
+      "version": "1.0.0-rc.4",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-linux-x64-musl/-/binding-linux-x64-musl-1.0.0-rc.4.tgz",
+      "integrity": "sha512-RnGxwZLN7fhMMAItnD6dZ7lvy+TI7ba+2V54UF4dhaWa/p8I/ys1E73KO6HmPmgz92ZkfD8TXS1IMV8+uhbR9g==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      }
+    },
+    "node_modules/@rolldown/binding-openharmony-arm64": {
+      "version": "1.0.0-rc.4",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-openharmony-arm64/-/binding-openharmony-arm64-1.0.0-rc.4.tgz",
+      "integrity": "sha512-6lcI79+X8klGiGd8yHuTgQRjuuJYNggmEml+RsyN596P23l/zf9FVmJ7K0KVKkFAeYEdg0iMUKyIxiV5vebDNQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "openharmony"
+      ],
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      }
+    },
+    "node_modules/@rolldown/binding-wasm32-wasi": {
+      "version": "1.0.0-rc.4",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-wasm32-wasi/-/binding-wasm32-wasi-1.0.0-rc.4.tgz",
+      "integrity": "sha512-wz7ohsKCAIWy91blZ/1FlpPdqrsm1xpcEOQVveWoL6+aSPKL4VUcoYmmzuLTssyZxRpEwzuIxL/GDsvpjaBtOw==",
+      "cpu": [
+        "wasm32"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "@napi-rs/wasm-runtime": "^1.1.1"
+      },
+      "engines": {
+        "node": ">=14.0.0"
+      }
+    },
+    "node_modules/@rolldown/binding-win32-arm64-msvc": {
+      "version": "1.0.0-rc.4",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-win32-arm64-msvc/-/binding-win32-arm64-msvc-1.0.0-rc.4.tgz",
+      "integrity": "sha512-cfiMrfuWCIgsFmcVG0IPuO6qTRHvF7NuG3wngX1RZzc6dU8FuBFb+J3MIR5WrdTNozlumfgL4cvz+R4ozBCvsQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      }
+    },
+    "node_modules/@rolldown/binding-win32-x64-msvc": {
+      "version": "1.0.0-rc.4",
+      "resolved": "https://registry.npmjs.org/@rolldown/binding-win32-x64-msvc/-/binding-win32-x64-msvc-1.0.0-rc.4.tgz",
+      "integrity": "sha512-p6UeR9y7ht82AH57qwGuFYn69S6CZ7LLKdCKy/8T3zS9VTrJei2/CGsTUV45Da4Z9Rbhc7G4gyWQ/Ioamqn09g==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      }
+    },
+    "node_modules/@rolldown/pluginutils": {
+      "version": "1.0.0-rc.4",
+      "resolved": "https://registry.npmjs.org/@rolldown/pluginutils/-/pluginutils-1.0.0-rc.4.tgz",
+      "integrity": "sha512-1BrrmTu0TWfOP1riA8uakjFc9bpIUGzVKETsOtzY39pPga8zELGDl8eu1Dx7/gjM5CAz14UknsUMpBO8L+YntQ==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@rollup/rollup-android-arm-eabi": {
+      "version": "4.60.4",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm-eabi/-/rollup-android-arm-eabi-4.60.4.tgz",
+      "integrity": "sha512-F5QXMSiFebS9hKZj02XhWLLnRpJ3B3AROP0tWbFBSj+6kCbg5m9j5JoHKd4mmSVy5mS/IMQloYgYxCuJC0fxEQ==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ]
+    },
+    "node_modules/@rollup/rollup-android-arm64": {
+      "version": "4.60.4",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-android-arm64/-/rollup-android-arm64-4.60.4.tgz",
+      "integrity": "sha512-GxxTKApUpzRhof7poWvCJHRF51C67u1R7D6DiluBE8wKU1u5GWE8t+v81JvJYtbawoBFX1hLv5Ei4eVjkWokaw==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ]
+    },
+    "node_modules/@rollup/rollup-darwin-arm64": {
+      "version": "4.60.4",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-arm64/-/rollup-darwin-arm64-4.60.4.tgz",
+      "integrity": "sha512-tua0TaJxMOB1R0V0RS1jFZ/RpURFDJIOR2A6jWwQeawuFyS4gBW+rntLRaQd0EQ4bd6Vp44Z2rXW+YYDBsj6IA==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ]
+    },
+    "node_modules/@rollup/rollup-darwin-x64": {
+      "version": "4.60.4",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-darwin-x64/-/rollup-darwin-x64-4.60.4.tgz",
+      "integrity": "sha512-CSKq7MsP+5PFIcydhAiR1K0UhEI1A2jWXVKHPCBZ151yOutENwvnPocgVHkivu2kviURtCEB6zUQw0vs8RrhMg==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ]
+    },
+    "node_modules/@rollup/rollup-freebsd-arm64": {
+      "version": "4.60.4",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-arm64/-/rollup-freebsd-arm64-4.60.4.tgz",
+      "integrity": "sha512-+O8OkVdyvXMtJEciu2wS/pzm1IxntEEQx3z5TAVy4l32G0etZn+RsA48ARRrFm6Ri8fvqPQfgrvNxSjKAbnd3g==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ]
+    },
+    "node_modules/@rollup/rollup-freebsd-x64": {
+      "version": "4.60.4",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-freebsd-x64/-/rollup-freebsd-x64-4.60.4.tgz",
+      "integrity": "sha512-Iw3oMskH3AfNuhU0MSN7vNbdi4me/NiYo2azqPz/Le16zHSa+3RRmliCMWWQmh4lcndccU40xcJuTYJZxNo/lw==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-arm-gnueabihf": {
+      "version": "4.60.4",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-gnueabihf/-/rollup-linux-arm-gnueabihf-4.60.4.tgz",
+      "integrity": "sha512-EIPRXTVQpHyF8WOo219AD2yEltPehLTcTMz2fn6JsatLYSzQf00hj3rulF+yauOlF9/FtM2WpkT/hJh/KJFGhA==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-arm-musleabihf": {
+      "version": "4.60.4",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm-musleabihf/-/rollup-linux-arm-musleabihf-4.60.4.tgz",
+      "integrity": "sha512-J3Yh9PzzF1Ovah2At+lHiGQdsYgArxBbXv/zHfSyaiFQEqvNv7DcW98pCrmdjCZBrqBiKrKKe2V+aaSGWuBe/w==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-arm64-gnu": {
+      "version": "4.60.4",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-gnu/-/rollup-linux-arm64-gnu-4.60.4.tgz",
+      "integrity": "sha512-BFDEZMYfUvLn37ONE1yMBojPxnMlTFsdyNoqncT0qFq1mAfllL+ATMMJd8TeuVMiX84s1KbcxcZbXInmcO2mRg==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-arm64-musl": {
+      "version": "4.60.4",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-arm64-musl/-/rollup-linux-arm64-musl-4.60.4.tgz",
+      "integrity": "sha512-pc9EYOSlOgdQ2uPl1o9PF6/kLSgaUosia7gOuS8mB69IxJvlclko1MECXysjs5ryez1/5zjYqx3+xYU0TU6R1A==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-loong64-gnu": {
+      "version": "4.60.4",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-loong64-gnu/-/rollup-linux-loong64-gnu-4.60.4.tgz",
+      "integrity": "sha512-NxnomyxYerDh5n4iLrNa+sH+Z+U4BMEE46V2PgQ/hoB909i8gV1M5wPojWg9fk1jWpO3IQnOs20K4wyZuFLEFQ==",
+      "cpu": [
+        "loong64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-loong64-musl": {
+      "version": "4.60.4",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-loong64-musl/-/rollup-linux-loong64-musl-4.60.4.tgz",
+      "integrity": "sha512-nbJnQ8a3z1mtmrwImCYhc6BGpThAyYVRQxw9uKSKG4wR6aAYno9sVjJ0zaZcW9BPJX1GbrDPf+SvdWjgTuDmnw==",
+      "cpu": [
+        "loong64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-ppc64-gnu": {
+      "version": "4.60.4",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-ppc64-gnu/-/rollup-linux-ppc64-gnu-4.60.4.tgz",
+      "integrity": "sha512-2EU6acNrQLd8tYvo/LXW535wupT3m6fo7HKo6lr7ktQoItxTyOL1ZCR/GfGCuXl2vR+zmfI6eRXkSemafv+iVg==",
+      "cpu": [
+        "ppc64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-ppc64-musl": {
+      "version": "4.60.4",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-ppc64-musl/-/rollup-linux-ppc64-musl-4.60.4.tgz",
+      "integrity": "sha512-WeBtoMuaMxiiIrO2IYP3xs6GMWkJP2C0EoT8beTLkUPmzV1i/UcOSVw1d5r9KBODtHKilG5yFxsGRnBbK3wJ4A==",
+      "cpu": [
+        "ppc64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-riscv64-gnu": {
+      "version": "4.60.4",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-gnu/-/rollup-linux-riscv64-gnu-4.60.4.tgz",
+      "integrity": "sha512-FJHFfqpKUI3A10WrWKiFbBZ7yVbGT4q4B5o1qKFFojqpaYoh9LrQgqWCmmcxQzVSXYtyB5bzkXrYzlHTs21MYA==",
+      "cpu": [
+        "riscv64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-riscv64-musl": {
+      "version": "4.60.4",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-riscv64-musl/-/rollup-linux-riscv64-musl-4.60.4.tgz",
+      "integrity": "sha512-mcEl6CUT5IAUmQf1m9FYSmVqCJlpQ8r8eyftFUHG8i9OhY7BkBXSUdnLH5DOf0wCOjcP9v/QO93zpmF1SptCCw==",
+      "cpu": [
+        "riscv64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-s390x-gnu": {
+      "version": "4.60.4",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-s390x-gnu/-/rollup-linux-s390x-gnu-4.60.4.tgz",
+      "integrity": "sha512-ynt3JxVd2w2buzoKDWIyiV1pJW93xlQic1THVLXilz429oijRpSHivZAgp65KBu+cMcgf1eVVjdnTLvPxgCuoQ==",
+      "cpu": [
+        "s390x"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-x64-gnu": {
+      "version": "4.60.4",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-gnu/-/rollup-linux-x64-gnu-4.60.4.tgz",
+      "integrity": "sha512-Boiz5+MsaROEWDf+GGEwF8VMHGhlUoQMtIPjOgA5fv4osupqTVnJteQNKJwUcnUog2G55jYXH7KZFFiJe0TEzQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-linux-x64-musl": {
+      "version": "4.60.4",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-linux-x64-musl/-/rollup-linux-x64-musl-4.60.4.tgz",
+      "integrity": "sha512-+qfSY27qIrFfI/Hom04KYFw3GKZSGU4lXus51wsb5EuySfFlWRwjkKWoE9emgRw/ukoT4Udsj4W/+xxG8VbPKg==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ]
+    },
+    "node_modules/@rollup/rollup-openbsd-x64": {
+      "version": "4.60.4",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-openbsd-x64/-/rollup-openbsd-x64-4.60.4.tgz",
+      "integrity": "sha512-VpTfOPHgVXEBeeR8hZ2O0F3aSso+JDWqTWmTmzcQKted54IAdUVbxE+j/MVxUsKa8L20HJhv3vUezVPoquqWjA==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "openbsd"
+      ]
+    },
+    "node_modules/@rollup/rollup-openharmony-arm64": {
+      "version": "4.60.4",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-openharmony-arm64/-/rollup-openharmony-arm64-4.60.4.tgz",
+      "integrity": "sha512-IPOsh5aRYuLv/nkU51X10Bf75Bsf6+gZdx1X+QP5QM6lIJFHHqbHLG0uJn/hWthzo13UAc2umiUorqZy3axoZg==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "openharmony"
+      ]
+    },
+    "node_modules/@rollup/rollup-win32-arm64-msvc": {
+      "version": "4.60.4",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-arm64-msvc/-/rollup-win32-arm64-msvc-4.60.4.tgz",
+      "integrity": "sha512-4QzE9E81OohJ/HKzHhsqU+zcYYojVOXlFMs1DdyMT6qXl/niOH7AVElmmEdUNHHS/oRkc++d5k6Vy85zFs0DEw==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ]
+    },
+    "node_modules/@rollup/rollup-win32-ia32-msvc": {
+      "version": "4.60.4",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-ia32-msvc/-/rollup-win32-ia32-msvc-4.60.4.tgz",
+      "integrity": "sha512-zTPgT1YuHHcd+Tmx7h8aml0FWFVelV5N54oHow9SLj+GfoDy/huQ+UV396N/C7KpMDMiPspRktzM1/0r1usYEA==",
+      "cpu": [
+        "ia32"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ]
+    },
+    "node_modules/@rollup/rollup-win32-x64-gnu": {
+      "version": "4.60.4",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-gnu/-/rollup-win32-x64-gnu-4.60.4.tgz",
+      "integrity": "sha512-DRS4G7mi9lJxqEDezIkKCaUIKCrLUUDCUaCsTPCi/rtqaC6D/jjwslMQyiDU50Ka0JKpeXeRBFBAXwArY52vBw==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ]
+    },
+    "node_modules/@rollup/rollup-win32-x64-msvc": {
+      "version": "4.60.4",
+      "resolved": "https://registry.npmjs.org/@rollup/rollup-win32-x64-msvc/-/rollup-win32-x64-msvc-4.60.4.tgz",
+      "integrity": "sha512-QVTUovf40zgTqlFVrKA1uXMVvU2QWEFWfAH8Wdc48IxLvrJMQVMBRjuQyUpzZCDkakImib9eVazbWlC6ksWtJw==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ]
+    },
+    "node_modules/@schematics/angular": {
+      "version": "21.2.12",
+      "resolved": "https://registry.npmjs.org/@schematics/angular/-/angular-21.2.12.tgz",
+      "integrity": "sha512-eHoAbxd6Kdw9YIQeZO/6lBXTmKKi10t4WTujY8CM5v4qv1zoJu9yiwVeQp9y3e7/Sybz5Ec3m4FmQ0Tw8iVDiA==",
+      "license": "MIT",
+      "dependencies": {
+        "@angular-devkit/core": "21.2.12",
+        "@angular-devkit/schematics": "21.2.12",
+        "jsonc-parser": "3.3.1"
+      },
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0",
+        "npm": "^6.11.0 || ^7.5.6 || >=8.0.0",
+        "yarn": ">= 1.13.0"
+      }
+    },
+    "node_modules/@sigstore/bundle": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/@sigstore/bundle/-/bundle-4.0.0.tgz",
+      "integrity": "sha512-NwCl5Y0V6Di0NexvkTqdoVfmjTaQwoLM236r89KEojGmq/jMls8S+zb7yOwAPdXvbwfKDlP+lmXgAL4vKSQT+A==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@sigstore/protobuf-specs": "^0.5.0"
+      },
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/@sigstore/core": {
+      "version": "3.2.1",
+      "resolved": "https://registry.npmjs.org/@sigstore/core/-/core-3.2.1.tgz",
+      "integrity": "sha512-qRsxPnCrbC/puegGxKuynfnxgLiHqWStrSjxkoB4YKqq3Z3s4cyZyj42ZdWFAEblNP65C+rBH8EuREHIXoi83g==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/@sigstore/protobuf-specs": {
+      "version": "0.5.1",
+      "resolved": "https://registry.npmjs.org/@sigstore/protobuf-specs/-/protobuf-specs-0.5.1.tgz",
+      "integrity": "sha512-/ScWUhhoFasJsSRGTVBwId1loQjjnjAfE4djL6ZhrXRpNCmPTnUKF5Jokd58ILseOMjzET3UrMOtJPS9sYeI0g==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": "^18.17.0 || >=20.5.0"
+      }
+    },
+    "node_modules/@sigstore/sign": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/@sigstore/sign/-/sign-4.1.1.tgz",
+      "integrity": "sha512-Hf4xglukg0XXQ2RiD5vSoLjdPe8OBUPA8XeVjUObheuDcWdYWrnH/BNmxZCzkAy68MzmNCxXLeurJvs6hcP2OQ==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@gar/promise-retry": "^1.0.2",
+        "@sigstore/bundle": "^4.0.0",
+        "@sigstore/core": "^3.2.0",
+        "@sigstore/protobuf-specs": "^0.5.0",
+        "make-fetch-happen": "^15.0.4",
+        "proc-log": "^6.1.0"
+      },
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/@sigstore/tuf": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/@sigstore/tuf/-/tuf-4.0.2.tgz",
+      "integrity": "sha512-TCAzTy0xzdP79EnxSjq9KQ3eaR7+FmudLC6eRKknVKZbV7ZNlGLClAAQb/HMNJ5n2OBNk2GT1tEmU0xuPr+SLQ==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@sigstore/protobuf-specs": "^0.5.0",
+        "tuf-js": "^4.1.0"
+      },
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/@sigstore/verify": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/@sigstore/verify/-/verify-3.1.1.tgz",
+      "integrity": "sha512-qv7+G3J2cc6wwFj3yKvXOamzqhMwSk1ogPGmhpS8iXllcPrJaIIBA+4HbttlHVu1pqWTdmaCH/WE7UOC51kdoA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@sigstore/bundle": "^4.0.0",
+        "@sigstore/core": "^3.2.1",
+        "@sigstore/protobuf-specs": "^0.5.0"
+      },
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/@standard-schema/spec": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/@standard-schema/spec/-/spec-1.1.0.tgz",
+      "integrity": "sha512-l2aFy5jALhniG5HgqrD6jXLi/rUWrKvqN/qJx6yoJsgKhblVd+iqqU4RCXavm/jPityDo5TCvKMnpjKnOriy0w==",
+      "license": "MIT"
+    },
+    "node_modules/@svgdotjs/svg.draggable.js": {
+      "version": "3.0.6",
+      "resolved": "https://registry.npmjs.org/@svgdotjs/svg.draggable.js/-/svg.draggable.js-3.0.6.tgz",
+      "integrity": "sha512-7iJFm9lL3C40HQcqzEfezK2l+dW2CpoVY3b77KQGqc8GXWa6LhhmX5Ckv7alQfUXBuZbjpICZ+Dvq1czlGx7gA==",
+      "license": "MIT",
+      "peerDependencies": {
+        "@svgdotjs/svg.js": "^3.2.4"
+      }
+    },
+    "node_modules/@svgdotjs/svg.filter.js": {
+      "version": "3.0.9",
+      "resolved": "https://registry.npmjs.org/@svgdotjs/svg.filter.js/-/svg.filter.js-3.0.9.tgz",
+      "integrity": "sha512-/69XMRCDoam2HgC4ldHIaDgeQf1ViHIsa0Ld4uWgiXtZ+E24DWHe/9Ib6kbNiZ7WRIdlVokUDR1Fg0kjIpkfbw==",
+      "license": "MIT",
+      "dependencies": {
+        "@svgdotjs/svg.js": "^3.2.4"
+      },
+      "engines": {
+        "node": ">= 0.8.0"
+      }
+    },
+    "node_modules/@svgdotjs/svg.js": {
+      "version": "3.2.5",
+      "resolved": "https://registry.npmjs.org/@svgdotjs/svg.js/-/svg.js-3.2.5.tgz",
+      "integrity": "sha512-/VNHWYhNu+BS7ktbYoVGrCmsXDh+chFMaONMwGNdIBcFHrWqk2jY8fNyr3DLdtQUIalvkPfM554ZSFa3dm3nxQ==",
+      "license": "MIT",
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/Fuzzyma"
+      }
+    },
+    "node_modules/@svgdotjs/svg.resize.js": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/@svgdotjs/svg.resize.js/-/svg.resize.js-2.0.5.tgz",
+      "integrity": "sha512-4heRW4B1QrJeENfi7326lUPYBCevj78FJs8kfeDxn5st0IYPIRXoTtOSYvTzFWgaWWXd3YCDE6ao4fmv91RthA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 14.18"
+      },
+      "peerDependencies": {
+        "@svgdotjs/svg.js": "^3.2.4",
+        "@svgdotjs/svg.select.js": "^4.0.1"
+      }
+    },
+    "node_modules/@svgdotjs/svg.select.js": {
+      "version": "4.0.3",
+      "resolved": "https://registry.npmjs.org/@svgdotjs/svg.select.js/-/svg.select.js-4.0.3.tgz",
+      "integrity": "sha512-qkMgso1sd2hXKd1FZ1weO7ANq12sNmQJeGDjs46QwDVsxSRcHmvWKL2NDF7Yimpwf3sl5esOLkPqtV2bQ3v/Jg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">= 14.18"
+      },
+      "peerDependencies": {
+        "@svgdotjs/svg.js": "^3.2.4"
+      }
+    },
+    "node_modules/@swc/helpers": {
+      "version": "0.2.14",
+      "resolved": "https://registry.npmjs.org/@swc/helpers/-/helpers-0.2.14.tgz",
+      "integrity": "sha512-wpCQMhf5p5GhNg2MmGKXzUNwxe7zRiCsmqYsamez2beP7mKPCSiu+BjZcdN95yYSzO857kr0VfQewmGpS77nqA==",
+      "license": "MIT"
+    },
+    "node_modules/@tailwindcss/forms": {
+      "version": "0.5.11",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/forms/-/forms-0.5.11.tgz",
+      "integrity": "sha512-h9wegbZDPurxG22xZSoWtdzc41/OlNEUQERNqI/0fOwa2aVlWGu7C35E/x6LDyD3lgtztFSSjKZyuVM0hxhbgA==",
+      "license": "MIT",
+      "dependencies": {
+        "mini-svg-data-uri": "^1.2.3"
+      },
+      "peerDependencies": {
+        "tailwindcss": ">=3.0.0 || >= 3.0.0-alpha.1 || >= 4.0.0-alpha.20 || >= 4.0.0-beta.1"
+      }
+    },
+    "node_modules/@tailwindcss/node": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/node/-/node-4.3.0.tgz",
+      "integrity": "sha512-aFb4gUhFOgdh9AXo4IzBEOzBkkAxm9VigwDJnMIYv3lcfXCJVesNfbEaBl4BNgVRyid92AmdviqwBUBRKSeY3g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@jridgewell/remapping": "^2.3.5",
+        "enhanced-resolve": "^5.21.0",
+        "jiti": "^2.6.1",
+        "lightningcss": "1.32.0",
+        "magic-string": "^0.30.21",
+        "source-map-js": "^1.2.1",
+        "tailwindcss": "4.3.0"
+      }
+    },
+    "node_modules/@tailwindcss/oxide": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide/-/oxide-4.3.0.tgz",
+      "integrity": "sha512-F7HZGBeN9I0/AuuJS5PwcD8xayx5ri5GhjYUDBEVYUkexyA/giwbDNjRVrxSezE3T250OU2K/wp/ltWx3UOefg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 20"
+      },
+      "optionalDependencies": {
+        "@tailwindcss/oxide-android-arm64": "4.3.0",
+        "@tailwindcss/oxide-darwin-arm64": "4.3.0",
+        "@tailwindcss/oxide-darwin-x64": "4.3.0",
+        "@tailwindcss/oxide-freebsd-x64": "4.3.0",
+        "@tailwindcss/oxide-linux-arm-gnueabihf": "4.3.0",
+        "@tailwindcss/oxide-linux-arm64-gnu": "4.3.0",
+        "@tailwindcss/oxide-linux-arm64-musl": "4.3.0",
+        "@tailwindcss/oxide-linux-x64-gnu": "4.3.0",
+        "@tailwindcss/oxide-linux-x64-musl": "4.3.0",
+        "@tailwindcss/oxide-wasm32-wasi": "4.3.0",
+        "@tailwindcss/oxide-win32-arm64-msvc": "4.3.0",
+        "@tailwindcss/oxide-win32-x64-msvc": "4.3.0"
+      }
+    },
+    "node_modules/@tailwindcss/oxide-android-arm64": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-android-arm64/-/oxide-android-arm64-4.3.0.tgz",
+      "integrity": "sha512-TJPiq67tKlLuObP6RkwvVGDoxCMBVtDgKkLfa/uyj7/FyxvQwHS+UOnVrXXgbEsfUaMgiVvC4KbJnRr26ho4Ng==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">= 20"
+      }
+    },
+    "node_modules/@tailwindcss/oxide-darwin-arm64": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-darwin-arm64/-/oxide-darwin-arm64-4.3.0.tgz",
+      "integrity": "sha512-oMN/WZRb+SO37BmUElEgeEWuU8E/HXRkiODxJxLe1UTHVXLrdVSgfaJV7pSlhRGMSOiXLuxTIjfsF3wYvz8cgQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">= 20"
+      }
+    },
+    "node_modules/@tailwindcss/oxide-darwin-x64": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-darwin-x64/-/oxide-darwin-x64-4.3.0.tgz",
+      "integrity": "sha512-N6CUmu4a6bKVADfw77p+iw6Yd9Q3OBhe0veaDX+QazfuVYlQsHfDgxBrsjQ/IW+zywL8mTrNd0SdJT/zgtvMdA==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">= 20"
+      }
+    },
+    "node_modules/@tailwindcss/oxide-freebsd-x64": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-freebsd-x64/-/oxide-freebsd-x64-4.3.0.tgz",
+      "integrity": "sha512-zDL5hBkQdH5C6MpqbK3gQAgP80tsMwSI26vjOzjJtNCMUo0lFgOItzHKBIupOZNQxt3ouPH7RPhvNhiTfCe5CQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ],
+      "engines": {
+        "node": ">= 20"
+      }
+    },
+    "node_modules/@tailwindcss/oxide-linux-arm-gnueabihf": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-linux-arm-gnueabihf/-/oxide-linux-arm-gnueabihf-4.3.0.tgz",
+      "integrity": "sha512-R06HdNi7A7OEoMsf6d4tjZ71RCWnZQPHj2mnotSFURjNLdBC+cIgXQ7l81CqeoiQftjf6OOblxXMInMgN2VzMA==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 20"
+      }
+    },
+    "node_modules/@tailwindcss/oxide-linux-arm64-gnu": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-linux-arm64-gnu/-/oxide-linux-arm64-gnu-4.3.0.tgz",
+      "integrity": "sha512-qTJHELX8jetjhRQHCLilkVLmybpzNQAtaI/gaoVoidn/ufbNDbAo8KlK2J+yPoc8wQxvDxCmh/5lr8nC1+lTbg==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 20"
+      }
+    },
+    "node_modules/@tailwindcss/oxide-linux-arm64-musl": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-linux-arm64-musl/-/oxide-linux-arm64-musl-4.3.0.tgz",
+      "integrity": "sha512-Z6sukiQsngnWO+l39X4pPbiWT81IC+PLKF+PHxIlyZbGNb9MODfYlXEVlFvej5BOZInWX01kVyzeLvHsXhfczQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 20"
+      }
+    },
+    "node_modules/@tailwindcss/oxide-linux-x64-gnu": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-linux-x64-gnu/-/oxide-linux-x64-gnu-4.3.0.tgz",
+      "integrity": "sha512-DRNdQRpSGzRGfARVuVkxvM8Q12nh19l4BF/G7zGA1oe+9wcC6saFBHTISrpIcKzhiXtSrlSrluCfvMuledoCTQ==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 20"
+      }
+    },
+    "node_modules/@tailwindcss/oxide-linux-x64-musl": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-linux-x64-musl/-/oxide-linux-x64-musl-4.3.0.tgz",
+      "integrity": "sha512-Z0IADbDo8bh6I7h2IQMx601AdXBLfFpEdUotft86evd/8ZPflZe9COPO8Q1vw+pfLWIUo9zN/JGZvwuAJqduqg==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 20"
+      }
+    },
+    "node_modules/@tailwindcss/oxide-wasm32-wasi": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-wasm32-wasi/-/oxide-wasm32-wasi-4.3.0.tgz",
+      "integrity": "sha512-HNZGOUxEmElksYR7S6sC5jTeNGpobAsy9u7Gu0AskJ8/20FR9GqebUyB+HBcU/ax6BHuiuJi+Oda4B+YX6H1yA==",
+      "bundleDependencies": [
+        "@napi-rs/wasm-runtime",
+        "@emnapi/core",
+        "@emnapi/runtime",
+        "@tybys/wasm-util",
+        "@emnapi/wasi-threads",
+        "tslib"
+      ],
+      "cpu": [
+        "wasm32"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "@emnapi/core": "^1.10.0",
+        "@emnapi/runtime": "^1.10.0",
+        "@emnapi/wasi-threads": "^1.2.1",
+        "@napi-rs/wasm-runtime": "^1.1.4",
+        "@tybys/wasm-util": "^0.10.1",
+        "tslib": "^2.8.1"
+      },
+      "engines": {
+        "node": ">=14.0.0"
+      }
+    },
+    "node_modules/@tailwindcss/oxide-win32-arm64-msvc": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-win32-arm64-msvc/-/oxide-win32-arm64-msvc-4.3.0.tgz",
+      "integrity": "sha512-Pe+RPVTi1T+qymuuRpcdvwSVZjnll/f7n8gBxMMh3xLTctMDKqpdfGimbMyioqtLhUYZxdJ9wGNhV7MKHvgZsQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">= 20"
+      }
+    },
+    "node_modules/@tailwindcss/oxide-win32-x64-msvc": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/oxide-win32-x64-msvc/-/oxide-win32-x64-msvc-4.3.0.tgz",
+      "integrity": "sha512-Mvrf2kXW/yeW/OTezZlCGOirXRcUuLIBx/5Y12BaPM7wJoryG6dfS/NJL8aBPqtTEx/Vm4T4vKzFUcKDT+TKUA==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">= 20"
+      }
+    },
+    "node_modules/@tailwindcss/postcss": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/@tailwindcss/postcss/-/postcss-4.3.0.tgz",
+      "integrity": "sha512-Jm05Tjx+9yCLGv5qw1c+84Psds8MnyrEQYCB+FFk2lgGiUjlRqdxke4mVTuYrj2xnVZqKim2Apr5ySuQRYAw/w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@alloc/quick-lru": "^5.2.0",
+        "@tailwindcss/node": "4.3.0",
+        "@tailwindcss/oxide": "4.3.0",
+        "postcss": "^8.5.10",
+        "tailwindcss": "4.3.0"
+      }
+    },
+    "node_modules/@tsparticles/angular": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/@tsparticles/angular/-/angular-3.0.0.tgz",
+      "integrity": "sha512-mnPN/U4/I6A5JHvZXQWq0/mzPDVxfCmNYrIXxQv4NVUnYQT2DzN4vkZuB0BPdurN077Yqey87p6HdcnPhnOZfA==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/matteobruni"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/tsparticles"
+        },
+        {
+          "type": "buymeacoffee",
+          "url": "https://www.buymeacoffee.com/matteobruni"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "tslib": "^2.6.2"
+      },
+      "peerDependencies": {
+        "@angular/common": ">=2.0.0",
+        "@angular/core": ">=2.0.0",
+        "@tsparticles/engine": "^3.0.2",
+        "rxjs": ">=7.0.0"
+      }
+    },
+    "node_modules/@tsparticles/basic": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/basic/-/basic-3.9.1.tgz",
+      "integrity": "sha512-ijr2dHMx0IQHqhKW3qA8tfwrR2XYbbWYdaJMQuBo2CkwBVIhZ76U+H20Y492j/NXpd1FUnt2aC0l4CEVGVGdeQ==",
+      "deprecated": "tsParticles v4 is out, please upgrade for better performances and more features",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/matteobruni"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/tsparticles"
+        },
+        {
+          "type": "buymeacoffee",
+          "url": "https://www.buymeacoffee.com/matteobruni"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1",
+        "@tsparticles/move-base": "3.9.1",
+        "@tsparticles/plugin-hex-color": "3.9.1",
+        "@tsparticles/plugin-hsl-color": "3.9.1",
+        "@tsparticles/plugin-rgb-color": "3.9.1",
+        "@tsparticles/shape-circle": "3.9.1",
+        "@tsparticles/updater-color": "3.9.1",
+        "@tsparticles/updater-opacity": "3.9.1",
+        "@tsparticles/updater-out-modes": "3.9.1",
+        "@tsparticles/updater-size": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/engine": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/engine/-/engine-3.9.1.tgz",
+      "integrity": "sha512-DpdgAhWMZ3Eh2gyxik8FXS6BKZ8vyea+Eu5BC4epsahqTGY9V3JGGJcXC6lRJx6cPMAx1A0FaQAojPF3v6rkmQ==",
+      "deprecated": "tsParticles v4 is out, please upgrade for better performances and more features",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/matteobruni"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/tsparticles"
+        },
+        {
+          "type": "buymeacoffee",
+          "url": "https://www.buymeacoffee.com/matteobruni"
+        }
+      ],
+      "hasInstallScript": true,
+      "license": "MIT"
+    },
+    "node_modules/@tsparticles/interaction-external-attract": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/interaction-external-attract/-/interaction-external-attract-3.9.1.tgz",
+      "integrity": "sha512-5AJGmhzM9o4AVFV24WH5vSqMBzOXEOzIdGLIr+QJf4fRh9ZK62snsusv/ozKgs2KteRYQx+L7c5V3TqcDy2upg==",
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/interaction-external-bounce": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/interaction-external-bounce/-/interaction-external-bounce-3.9.1.tgz",
+      "integrity": "sha512-bv05+h70UIHOTWeTsTI1AeAmX6R3s8nnY74Ea6p6AbQjERzPYIa0XY19nq/hA7+Nrg+EissP5zgoYYeSphr85A==",
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/interaction-external-bubble": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/interaction-external-bubble/-/interaction-external-bubble-3.9.1.tgz",
+      "integrity": "sha512-tbd8ox/1GPl+zr+KyHQVV1bW88GE7OM6i4zql801YIlCDrl9wgTDdDFGIy9X7/cwTvTrCePhrfvdkUamXIribQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/interaction-external-connect": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/interaction-external-connect/-/interaction-external-connect-3.9.1.tgz",
+      "integrity": "sha512-sq8YfUNsIORjXHzzW7/AJQtfi/qDqLnYG2qOSE1WOsog39MD30RzmiOloejOkfNeUdcGUcfsDgpUuL3UhzFUOA==",
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/interaction-external-grab": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/interaction-external-grab/-/interaction-external-grab-3.9.1.tgz",
+      "integrity": "sha512-QwXza+sMMWDaMiFxd8y2tJwUK6c+nNw554+/9+tEZeTTk2fCbB0IJ7p/TH6ZGWDL0vo2muK54Njv2fEey191ow==",
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/interaction-external-pause": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/interaction-external-pause/-/interaction-external-pause-3.9.1.tgz",
+      "integrity": "sha512-Gzv4/FeNir0U/tVM9zQCqV1k+IAgaFjDU3T30M1AeAsNGh/rCITV2wnT7TOGFkbcla27m4Yxa+Fuab8+8pzm+g==",
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/interaction-external-push": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/interaction-external-push/-/interaction-external-push-3.9.1.tgz",
+      "integrity": "sha512-GvnWF9Qy4YkZdx+WJL2iy9IcgLvzOIu3K7aLYJFsQPaxT8d9TF8WlpoMlWKnJID6H5q4JqQuMRKRyWH8aAKyQw==",
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/interaction-external-remove": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/interaction-external-remove/-/interaction-external-remove-3.9.1.tgz",
+      "integrity": "sha512-yPThm4UDWejDOWW5Qc8KnnS2EfSo5VFcJUQDWc1+Wcj17xe7vdSoiwwOORM0PmNBzdDpSKQrte/gUnoqaUMwOA==",
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/interaction-external-repulse": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/interaction-external-repulse/-/interaction-external-repulse-3.9.1.tgz",
+      "integrity": "sha512-/LBppXkrMdvLHlEKWC7IykFhzrz+9nebT2fwSSFXK4plEBxDlIwnkDxd3FbVOAbnBvx4+L8+fbrEx+RvC8diAw==",
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/interaction-external-slow": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/interaction-external-slow/-/interaction-external-slow-3.9.1.tgz",
+      "integrity": "sha512-1ZYIR/udBwA9MdSCfgADsbDXKSFS0FMWuPWz7bm79g3sUxcYkihn+/hDhc6GXvNNR46V1ocJjrj0u6pAynS1KQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/interaction-external-trail": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/interaction-external-trail/-/interaction-external-trail-3.9.1.tgz",
+      "integrity": "sha512-Au0v2oiqfKTemI/4bzjD4dUXzIngB5Q2T4nJcMCYpP24uZfwZh5xTjUMH7gyJyyaRTdMl9IJrp8ySjyYbLfeGg==",
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/interaction-particles-attract": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/interaction-particles-attract/-/interaction-particles-attract-3.9.1.tgz",
+      "integrity": "sha512-CYYYowJuGwRLUixQcSU/48PTKM8fCUYThe0hXwQ+yRMLAn053VHzL7NNZzKqEIeEyt5oJoy9KcvubjKWbzMBLQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/interaction-particles-collisions": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/interaction-particles-collisions/-/interaction-particles-collisions-3.9.1.tgz",
+      "integrity": "sha512-ggGyjW/3v1yxvYW1IF1EMT15M6w31y5zfNNUPkqd/IXRNPYvm0Z0ayhp+FKmz70M5p0UxxPIQHTvAv9Jqnuj8w==",
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/interaction-particles-links": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/interaction-particles-links/-/interaction-particles-links-3.9.1.tgz",
+      "integrity": "sha512-MsLbMjy1vY5M5/hu/oa5OSRZAUz49H3+9EBMTIOThiX+a+vpl3sxc9AqNd9gMsPbM4WJlub8T6VBZdyvzez1Vg==",
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/move-base": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/move-base/-/move-base-3.9.1.tgz",
+      "integrity": "sha512-X4huBS27d8srpxwOxliWPUt+NtCwY+8q/cx1DvQxyqmTA8VFCGpcHNwtqiN+9JicgzOvSuaORVqUgwlsc7h4pQ==",
+      "deprecated": "this package was deprecated in tsparticles v4, replaced by @tsparticles/plugin-move",
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/move-parallax": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/move-parallax/-/move-parallax-3.9.1.tgz",
+      "integrity": "sha512-whlOR0bVeyh6J/hvxf/QM3DqvNnITMiAQ0kro6saqSDItAVqg4pYxBfEsSOKq7EhjxNvfhhqR+pFMhp06zoCVA==",
+      "deprecated": "this package was deprecated in tsparticles v4, replaced by @tsparticles/interaction-external-parallax",
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/plugin-absorbers": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/plugin-absorbers/-/plugin-absorbers-3.9.1.tgz",
+      "integrity": "sha512-q9SQllpbPPgw1+euxHPYCFawOVUazQkkwnleiIgpYSiimlCyjIdwGnFPSNe1Sypzqmr2h6oOyX2vkK5ZVNEu8A==",
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/plugin-easing-quad": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/plugin-easing-quad/-/plugin-easing-quad-3.9.1.tgz",
+      "integrity": "sha512-C2UJOca5MTDXKUTBXj30Kiqr5UyID+xrY/LxicVWWZPczQW2bBxbIbfq9ULvzGDwBTxE2rdvIB8YFKmDYO45qw==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/matteobruni"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/tsparticles"
+        },
+        {
+          "type": "buymeacoffee",
+          "url": "https://www.buymeacoffee.com/matteobruni"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/plugin-emitters": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/plugin-emitters/-/plugin-emitters-3.9.1.tgz",
+      "integrity": "sha512-h7opR8SoFWBmVHceDLJUerLENaPfkJSh2zQYvzmLj2L+V3VLS1QDgty+4QZVeZfqNROmgQw2eLFA5El1E0sqqw==",
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/plugin-emitters-shape-circle": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/plugin-emitters-shape-circle/-/plugin-emitters-shape-circle-3.9.1.tgz",
+      "integrity": "sha512-z+9MsAPWr++sNz6N6303rRDjusW0BIPhHY51E5eXGDcRdOqrESDs6y99AJ/6Kdb/PpibCIYjFY9jVi2JJADPRA==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/matteobruni"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/tsparticles"
+        },
+        {
+          "type": "buymeacoffee",
+          "url": "https://www.buymeacoffee.com/matteobruni"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1",
+        "@tsparticles/plugin-emitters": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/plugin-emitters-shape-square": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/plugin-emitters-shape-square/-/plugin-emitters-shape-square-3.9.1.tgz",
+      "integrity": "sha512-dhA1c7FKs19B8lgTf25OTA3JoptNA+rjorsqCFuY1BZDI8g9E8DNqikUge14/W7nZN96+98hY+ghxSl4K2YsgA==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/matteobruni"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/tsparticles"
+        },
+        {
+          "type": "buymeacoffee",
+          "url": "https://www.buymeacoffee.com/matteobruni"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1",
+        "@tsparticles/plugin-emitters": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/plugin-hex-color": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/plugin-hex-color/-/plugin-hex-color-3.9.1.tgz",
+      "integrity": "sha512-vZgZ12AjUicJvk7AX4K2eAmKEQX/D1VEjEPFhyjbgI7A65eX72M465vVKIgNA6QArLZ1DLs7Z787LOE6GOBWsg==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/matteobruni"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/tsparticles"
+        },
+        {
+          "type": "buymeacoffee",
+          "url": "https://www.buymeacoffee.com/matteobruni"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/plugin-hsl-color": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/plugin-hsl-color/-/plugin-hsl-color-3.9.1.tgz",
+      "integrity": "sha512-jJd1iGgRwX6eeNjc1zUXiJivaqC5UE+SC2A3/NtHwwoQrkfxGWmRHOsVyLnOBRcCPgBp/FpdDe6DIDjCMO715w==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/matteobruni"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/tsparticles"
+        },
+        {
+          "type": "buymeacoffee",
+          "url": "https://www.buymeacoffee.com/matteobruni"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/plugin-rgb-color": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/plugin-rgb-color/-/plugin-rgb-color-3.9.1.tgz",
+      "integrity": "sha512-SBxk7f1KBfXeTnnklbE2Hx4jBgh6I6HOtxb+Os1gTp0oaghZOkWcCD2dP4QbUu7fVNCMOcApPoMNC8RTFcy9wQ==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/matteobruni"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/tsparticles"
+        },
+        {
+          "type": "buymeacoffee",
+          "url": "https://www.buymeacoffee.com/matteobruni"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/shape-circle": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/shape-circle/-/shape-circle-3.9.1.tgz",
+      "integrity": "sha512-DqZFLjbuhVn99WJ+A9ajz9YON72RtCcvubzq6qfjFmtwAK7frvQeb6iDTp6Ze9FUipluxVZWVRG4vWTxi2B+/g==",
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/shape-emoji": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/shape-emoji/-/shape-emoji-3.9.1.tgz",
+      "integrity": "sha512-ifvY63usuT+hipgVHb8gelBHSeF6ryPnMxAAEC1RGHhhXfpSRWMtE6ybr+pSsYU52M3G9+TF84v91pSwNrb9ZQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/shape-image": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/shape-image/-/shape-image-3.9.1.tgz",
+      "integrity": "sha512-fCA5eme8VF3oX8yNVUA0l2SLDKuiZObkijb0z3Ky0qj1HUEVlAuEMhhNDNB9E2iELTrWEix9z7BFMePp2CC7AA==",
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/shape-line": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/shape-line/-/shape-line-3.9.1.tgz",
+      "integrity": "sha512-wT8NSp0N9HURyV05f371cHKcNTNqr0/cwUu6WhBzbshkYGy1KZUP9CpRIh5FCrBpTev34mEQfOXDycgfG0KiLQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/shape-polygon": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/shape-polygon/-/shape-polygon-3.9.1.tgz",
+      "integrity": "sha512-dA77PgZdoLwxnliH6XQM/zF0r4jhT01pw5y7XTeTqws++hg4rTLV9255k6R6eUqKq0FPSW1/WBsBIl7q/MmrqQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/shape-square": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/shape-square/-/shape-square-3.9.1.tgz",
+      "integrity": "sha512-DKGkDnRyZrAm7T2ipqNezJahSWs6xd9O5LQLe5vjrYm1qGwrFxJiQaAdlb00UNrexz1/SA7bEoIg4XKaFa7qhQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/shape-star": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/shape-star/-/shape-star-3.9.1.tgz",
+      "integrity": "sha512-kdMJpi8cdeb6vGrZVSxTG0JIjCwIenggqk0EYeKAwtOGZFBgL7eHhF2F6uu1oq8cJAbXPujEoabnLsz6mW8XaA==",
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/shape-text": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/shape-text/-/shape-text-3.9.1.tgz",
+      "integrity": "sha512-oNsLHI0lGkIXoUw3W598iwd7dtoHCDrwpwJRGnQzgfk6T5a9dCpSD5vDeQN89lr3BUbVui4lhxq+/TyC64oAqA==",
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/slim": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/slim/-/slim-3.9.1.tgz",
+      "integrity": "sha512-CL5cDmADU7sDjRli0So+hY61VMbdroqbArmR9Av+c1Fisa5ytr6QD7Jv62iwU2S6rvgicEe9OyRmSy5GIefwZw==",
+      "deprecated": "tsParticles v4 is out, please upgrade for better performances and more features",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/matteobruni"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/tsparticles"
+        },
+        {
+          "type": "buymeacoffee",
+          "url": "https://www.buymeacoffee.com/matteobruni"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/basic": "3.9.1",
+        "@tsparticles/engine": "3.9.1",
+        "@tsparticles/interaction-external-attract": "3.9.1",
+        "@tsparticles/interaction-external-bounce": "3.9.1",
+        "@tsparticles/interaction-external-bubble": "3.9.1",
+        "@tsparticles/interaction-external-connect": "3.9.1",
+        "@tsparticles/interaction-external-grab": "3.9.1",
+        "@tsparticles/interaction-external-pause": "3.9.1",
+        "@tsparticles/interaction-external-push": "3.9.1",
+        "@tsparticles/interaction-external-remove": "3.9.1",
+        "@tsparticles/interaction-external-repulse": "3.9.1",
+        "@tsparticles/interaction-external-slow": "3.9.1",
+        "@tsparticles/interaction-particles-attract": "3.9.1",
+        "@tsparticles/interaction-particles-collisions": "3.9.1",
+        "@tsparticles/interaction-particles-links": "3.9.1",
+        "@tsparticles/move-parallax": "3.9.1",
+        "@tsparticles/plugin-easing-quad": "3.9.1",
+        "@tsparticles/shape-emoji": "3.9.1",
+        "@tsparticles/shape-image": "3.9.1",
+        "@tsparticles/shape-line": "3.9.1",
+        "@tsparticles/shape-polygon": "3.9.1",
+        "@tsparticles/shape-square": "3.9.1",
+        "@tsparticles/shape-star": "3.9.1",
+        "@tsparticles/updater-life": "3.9.1",
+        "@tsparticles/updater-rotate": "3.9.1",
+        "@tsparticles/updater-stroke-color": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/updater-color": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/updater-color/-/updater-color-3.9.1.tgz",
+      "integrity": "sha512-XGWdscrgEMA8L5E7exsE0f8/2zHKIqnTrZymcyuFBw2DCB6BIV+5z6qaNStpxrhq3DbIxxhqqcybqeOo7+Alpg==",
+      "deprecated": "this package was deprecated in tsparticles v4, replaced by @tsparticles/updater-paint",
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/updater-destroy": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/updater-destroy/-/updater-destroy-3.9.1.tgz",
+      "integrity": "sha512-MjMzEhZwCQIbxO6ZRM0eXsHVwmlXuUqwC43WCPZCpjhK3AJrMu3KR4xsJieFTWIbVNguAvbgoTB10FfJOUU5VA==",
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/updater-life": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/updater-life/-/updater-life-3.9.1.tgz",
+      "integrity": "sha512-Oi8aF2RIwMMsjssUkCB6t3PRpENHjdZf6cX92WNfAuqXtQphr3OMAkYFJFWkvyPFK22AVy3p/cFt6KE5zXxwAA==",
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/updater-opacity": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/updater-opacity/-/updater-opacity-3.9.1.tgz",
+      "integrity": "sha512-w778LQuRZJ+IoWzeRdrGykPYSSaTeWfBvLZ2XwYEkh/Ss961InOxZKIpcS6i5Kp/Zfw0fS1ZAuqeHwuj///Osw==",
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/updater-out-modes": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/updater-out-modes/-/updater-out-modes-3.9.1.tgz",
+      "integrity": "sha512-cKQEkAwbru+hhKF+GTsfbOvuBbx2DSB25CxOdhtW2wRvDBoCnngNdLw91rs+0Cex4tgEeibkebrIKFDDE6kELg==",
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/updater-roll": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/updater-roll/-/updater-roll-3.9.1.tgz",
+      "integrity": "sha512-zl4JeM3gUBJ0uttmIsond3lrZ3f3AkItFeS0Lhj/7jiCKfUoRyyOMrcBk8R1AhW7lI+7ko1iBs3jhO0jnxz9vg==",
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/updater-rotate": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/updater-rotate/-/updater-rotate-3.9.1.tgz",
+      "integrity": "sha512-9BfKaGfp28JN82MF2qs6Ae/lJr9EColMfMTHqSKljblwbpVDHte4umuwKl3VjbRt87WD9MGtla66NTUYl+WxuQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/updater-size": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/updater-size/-/updater-size-3.9.1.tgz",
+      "integrity": "sha512-3NSVs0O2ApNKZXfd+y/zNhTXSFeG1Pw4peI8e6z/q5+XLbmue9oiEwoPy/tQLaark3oNj3JU7Q903ZijPyXSzw==",
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/updater-stroke-color": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/updater-stroke-color/-/updater-stroke-color-3.9.1.tgz",
+      "integrity": "sha512-3x14+C2is9pZYTg9T2TiA/aM1YMq4wLdYaZDcHm3qO30DZu5oeQq0rm/6w+QOGKYY1Z3Htg9rlSUZkhTHn7eDA==",
+      "deprecated": "this package was deprecated in tsparticles v4, replaced by @tsparticles/updater-paint",
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/updater-tilt": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/updater-tilt/-/updater-tilt-3.9.1.tgz",
+      "integrity": "sha512-PB2yaoyXRmSk4iIVgjtRrzOxXMK9mjeAQHIJGtT4faq46Z8cbIIEFgjTwqrUV8qOrNg/h4sm5NE/s0qsTYjp1Q==",
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/updater-twinkle": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/updater-twinkle/-/updater-twinkle-3.9.1.tgz",
+      "integrity": "sha512-xgTcYr6LmP44IPIBeQmEExN2Y5Nfl3ikmC08eOh5nZy/ta6ORP+JTsprrnfuv/O2DwTyoqFLkZ16hZfkdc1yOQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tsparticles/updater-wobble": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/@tsparticles/updater-wobble/-/updater-wobble-3.9.1.tgz",
+      "integrity": "sha512-c99Ogy9q4QWO+zsDXol0UnpUwZiY2UucFb8ltuDv9AlbGUeprygoub8jhgT5pEDv+GdzWOJGSgq7rfgv9cHBrg==",
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1"
+      }
+    },
+    "node_modules/@tufjs/canonical-json": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/@tufjs/canonical-json/-/canonical-json-2.0.0.tgz",
+      "integrity": "sha512-yVtV8zsdo8qFHe+/3kw81dSLyF7D576A5cCFCi4X7B39tWT7SekaEFUnvnWJHz+9qO7qJTah1JbrDjWKqFtdWA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^16.14.0 || >=18.0.0"
+      }
+    },
+    "node_modules/@tufjs/models": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/@tufjs/models/-/models-4.1.0.tgz",
+      "integrity": "sha512-Y8cK9aggNRsqJVaKUlEYs4s7CvQ1b1ta2DVPyAimb0I2qhzjNk+A+mxvll/klL0RlfuIUei8BF7YWiua4kQqww==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@tufjs/canonical-json": "2.0.0",
+        "minimatch": "^10.1.1"
+      },
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/@tybys/wasm-util": {
+      "version": "0.10.2",
+      "resolved": "https://registry.npmjs.org/@tybys/wasm-util/-/wasm-util-0.10.2.tgz",
+      "integrity": "sha512-RoBvJ2X0wuKlWFIjrwffGw1IqZHKQqzIchKaadZZfnNpsAYp2mM0h36JtPCjNDAHGgYez/15uMBpfGwchhiMgg==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "tslib": "^2.4.0"
+      }
+    },
+    "node_modules/@types/chai": {
+      "version": "5.2.3",
+      "resolved": "https://registry.npmjs.org/@types/chai/-/chai-5.2.3.tgz",
+      "integrity": "sha512-Mw558oeA9fFbv65/y4mHtXDs9bPnFMZAL/jxdPFUpOHHIXX91mcgEHbS5Lahr+pwZFR8A7GQleRWeI6cGFC2UA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@types/deep-eql": "*",
+        "assertion-error": "^2.0.1"
+      }
+    },
+    "node_modules/@types/culori": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/@types/culori/-/culori-4.0.1.tgz",
+      "integrity": "sha512-43M51r/22CjhbOXyGT361GZ9vncSVQ39u62x5eJdBQFviI8zWp2X5jzqg7k4M6PVgDQAClpy2bUe2dtwEgEDVQ==",
+      "license": "MIT"
+    },
+    "node_modules/@types/deep-eql": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/@types/deep-eql/-/deep-eql-4.0.2.tgz",
+      "integrity": "sha512-c9h9dVVMigMPc4bwTvC5dxqtqJZwQPePsWjPlpSOnojbor6pGqdk541lfA7AqFQr5pB1BRdq0juY9db81BwyFw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@types/esrecurse": {
+      "version": "4.3.1",
+      "resolved": "https://registry.npmjs.org/@types/esrecurse/-/esrecurse-4.3.1.tgz",
+      "integrity": "sha512-xJBAbDifo5hpffDBuHl0Y8ywswbiAp/Wi7Y/GtAgSlZyIABppyurxVueOPE8LUQOxdlgi6Zqce7uoEpqNTeiUw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@types/estree": {
+      "version": "1.0.8",
+      "resolved": "https://registry.npmjs.org/@types/estree/-/estree-1.0.8.tgz",
+      "integrity": "sha512-dWHzHa2WqEXI/O1E9OjrocMTKJl2mSrEolh1Iomrv6U+JuNwaHXsXx9bLu5gG7BUWFIN0skIQJQ/L1rIex4X6w==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@types/google.maps": {
+      "version": "3.64.1",
+      "resolved": "https://registry.npmjs.org/@types/google.maps/-/google.maps-3.64.1.tgz",
+      "integrity": "sha512-nEBoa6iDNipICtxJ5VlrOgPNZQ6ixIg5nuv8iryFj0Z/1NLgxyg3pQCVegPuCzGCyTQwQI/N3uZvLUysqAzaaw==",
+      "license": "MIT"
+    },
+    "node_modules/@types/json-schema": {
+      "version": "7.0.15",
+      "resolved": "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.15.tgz",
+      "integrity": "sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@types/node": {
+      "version": "25.9.1",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-25.9.1.tgz",
+      "integrity": "sha512-xfrlY7UD5rMJk3ZVJP8BNzS28J36YJg+xp+LPXV1TdWxr8uMH5A860QNxYDGQe/ylDSgjxE52Q9VnO7p75tJxg==",
+      "license": "MIT",
+      "dependencies": {
+        "undici-types": ">=7.24.0 <7.24.7"
+      }
+    },
+    "node_modules/@typescript-eslint/eslint-plugin": {
+      "version": "8.59.2",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/eslint-plugin/-/eslint-plugin-8.59.2.tgz",
+      "integrity": "sha512-j/bwmkBvHUtPNxzuWe5z6BEk3q54YRyGlBXkSsmfoih7zNrBvl5A9A98anlp/7JbyZcWIJ8KXo/3Tq/DjFLtuQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@eslint-community/regexpp": "^4.12.2",
+        "@typescript-eslint/scope-manager": "8.59.2",
+        "@typescript-eslint/type-utils": "8.59.2",
+        "@typescript-eslint/utils": "8.59.2",
+        "@typescript-eslint/visitor-keys": "8.59.2",
+        "ignore": "^7.0.5",
+        "natural-compare": "^1.4.0",
+        "ts-api-utils": "^2.5.0"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "@typescript-eslint/parser": "^8.59.2",
+        "eslint": "^8.57.0 || ^9.0.0 || ^10.0.0",
+        "typescript": ">=4.8.4 <6.1.0"
+      }
+    },
+    "node_modules/@typescript-eslint/eslint-plugin/node_modules/@typescript-eslint/project-service": {
+      "version": "8.59.2",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/project-service/-/project-service-8.59.2.tgz",
+      "integrity": "sha512-+2hqvEkeyf/0FBor67duF0Ll7Ot8jyKzDQOSrxazF/danillRq2DwR9dLptsXpoZQqxE1UisSmoZewrlPas9Vw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/tsconfig-utils": "^8.59.2",
+        "@typescript-eslint/types": "^8.59.2",
+        "debug": "^4.4.3"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <6.1.0"
+      }
+    },
+    "node_modules/@typescript-eslint/eslint-plugin/node_modules/@typescript-eslint/scope-manager": {
+      "version": "8.59.2",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.59.2.tgz",
+      "integrity": "sha512-JzfyEpEtOU89CcFSwyNS3mu4MLvLSXqnmX05+aKBDM+TdR5jzcGOEBwxwGNxrEQ7p/z6kK2WyioCGBf2zZBnvg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/types": "8.59.2",
+        "@typescript-eslint/visitor-keys": "8.59.2"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      }
+    },
+    "node_modules/@typescript-eslint/eslint-plugin/node_modules/@typescript-eslint/tsconfig-utils": {
+      "version": "8.59.2",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/tsconfig-utils/-/tsconfig-utils-8.59.2.tgz",
+      "integrity": "sha512-BKK4alN7oi4C/zv4VqHQ+uRU+lTa6JGIZ7s1juw7b3RHo9OfKB+bKX3u0iVZetdsUCBBkSbdWbarJbmN0fTeSw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <6.1.0"
+      }
+    },
+    "node_modules/@typescript-eslint/eslint-plugin/node_modules/@typescript-eslint/types": {
+      "version": "8.59.2",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.59.2.tgz",
+      "integrity": "sha512-e82GVOE8Ps3E++Egvb6Y3Dw0S10u8NkQ9KXmtRhCWJJ8kDhOJTvtMAWnFL16kB1583goCWXsr0NieKCZMs2/0Q==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      }
+    },
+    "node_modules/@typescript-eslint/eslint-plugin/node_modules/@typescript-eslint/typescript-estree": {
+      "version": "8.59.2",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.59.2.tgz",
+      "integrity": "sha512-o0XPGNwcWw+FIwStOWn+BwBuEmL6QXP0rsvAFg7ET1dey1Nr6Wb1ac8p5HEsK0ygO/6mUxlk+YWQD9xcb/nnXg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/project-service": "8.59.2",
+        "@typescript-eslint/tsconfig-utils": "8.59.2",
+        "@typescript-eslint/types": "8.59.2",
+        "@typescript-eslint/visitor-keys": "8.59.2",
+        "debug": "^4.4.3",
+        "minimatch": "^10.2.2",
+        "semver": "^7.7.3",
+        "tinyglobby": "^0.2.15",
+        "ts-api-utils": "^2.5.0"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <6.1.0"
+      }
+    },
+    "node_modules/@typescript-eslint/eslint-plugin/node_modules/@typescript-eslint/utils": {
+      "version": "8.59.2",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-8.59.2.tgz",
+      "integrity": "sha512-Juw3EinkXqjaffxz6roowvV7GZT/kET5vSKKZT6upl5TXdWkLkYmNPXwDDL2Vkt2DPn0nODIS4egC/0AGxKo/Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@eslint-community/eslint-utils": "^4.9.1",
+        "@typescript-eslint/scope-manager": "8.59.2",
+        "@typescript-eslint/types": "8.59.2",
+        "@typescript-eslint/typescript-estree": "8.59.2"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "eslint": "^8.57.0 || ^9.0.0 || ^10.0.0",
+        "typescript": ">=4.8.4 <6.1.0"
+      }
+    },
+    "node_modules/@typescript-eslint/eslint-plugin/node_modules/@typescript-eslint/visitor-keys": {
+      "version": "8.59.2",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.59.2.tgz",
+      "integrity": "sha512-NwjLUnGy8/Zfx23fl50tRC8rYaYnM52xNRYFAXvmiil9yh1+K6aRVQMnzW6gQB/1DLgWt977lYQn7C+wtgXZiA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/types": "8.59.2",
+        "eslint-visitor-keys": "^5.0.0"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      }
+    },
+    "node_modules/@typescript-eslint/eslint-plugin/node_modules/eslint-visitor-keys": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-5.0.1.tgz",
+      "integrity": "sha512-tD40eHxA35h0PEIZNeIjkHoDR4YjjJp34biM0mDvplBe//mB+IHCqHDGV7pxF+7MklTvighcCPPZC7ynWyjdTA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": "^20.19.0 || ^22.13.0 || >=24"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      }
+    },
+    "node_modules/@typescript-eslint/parser": {
+      "version": "8.59.2",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/parser/-/parser-8.59.2.tgz",
+      "integrity": "sha512-plR3pp6D+SSUn1HM7xvSkx12/DhoHInI2YF35KAcVFNZvlC0gtrWqx7Qq1oH2Ssgi0vlFRCTbP+DZc7B9+TtsQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/scope-manager": "8.59.2",
+        "@typescript-eslint/types": "8.59.2",
+        "@typescript-eslint/typescript-estree": "8.59.2",
+        "@typescript-eslint/visitor-keys": "8.59.2",
+        "debug": "^4.4.3"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "eslint": "^8.57.0 || ^9.0.0 || ^10.0.0",
+        "typescript": ">=4.8.4 <6.1.0"
+      }
+    },
+    "node_modules/@typescript-eslint/parser/node_modules/@typescript-eslint/project-service": {
+      "version": "8.59.2",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/project-service/-/project-service-8.59.2.tgz",
+      "integrity": "sha512-+2hqvEkeyf/0FBor67duF0Ll7Ot8jyKzDQOSrxazF/danillRq2DwR9dLptsXpoZQqxE1UisSmoZewrlPas9Vw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/tsconfig-utils": "^8.59.2",
+        "@typescript-eslint/types": "^8.59.2",
+        "debug": "^4.4.3"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <6.1.0"
+      }
+    },
+    "node_modules/@typescript-eslint/parser/node_modules/@typescript-eslint/scope-manager": {
+      "version": "8.59.2",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.59.2.tgz",
+      "integrity": "sha512-JzfyEpEtOU89CcFSwyNS3mu4MLvLSXqnmX05+aKBDM+TdR5jzcGOEBwxwGNxrEQ7p/z6kK2WyioCGBf2zZBnvg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/types": "8.59.2",
+        "@typescript-eslint/visitor-keys": "8.59.2"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      }
+    },
+    "node_modules/@typescript-eslint/parser/node_modules/@typescript-eslint/tsconfig-utils": {
+      "version": "8.59.2",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/tsconfig-utils/-/tsconfig-utils-8.59.2.tgz",
+      "integrity": "sha512-BKK4alN7oi4C/zv4VqHQ+uRU+lTa6JGIZ7s1juw7b3RHo9OfKB+bKX3u0iVZetdsUCBBkSbdWbarJbmN0fTeSw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <6.1.0"
+      }
+    },
+    "node_modules/@typescript-eslint/parser/node_modules/@typescript-eslint/types": {
+      "version": "8.59.2",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.59.2.tgz",
+      "integrity": "sha512-e82GVOE8Ps3E++Egvb6Y3Dw0S10u8NkQ9KXmtRhCWJJ8kDhOJTvtMAWnFL16kB1583goCWXsr0NieKCZMs2/0Q==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      }
+    },
+    "node_modules/@typescript-eslint/parser/node_modules/@typescript-eslint/typescript-estree": {
+      "version": "8.59.2",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.59.2.tgz",
+      "integrity": "sha512-o0XPGNwcWw+FIwStOWn+BwBuEmL6QXP0rsvAFg7ET1dey1Nr6Wb1ac8p5HEsK0ygO/6mUxlk+YWQD9xcb/nnXg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/project-service": "8.59.2",
+        "@typescript-eslint/tsconfig-utils": "8.59.2",
+        "@typescript-eslint/types": "8.59.2",
+        "@typescript-eslint/visitor-keys": "8.59.2",
+        "debug": "^4.4.3",
+        "minimatch": "^10.2.2",
+        "semver": "^7.7.3",
+        "tinyglobby": "^0.2.15",
+        "ts-api-utils": "^2.5.0"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <6.1.0"
+      }
+    },
+    "node_modules/@typescript-eslint/parser/node_modules/@typescript-eslint/visitor-keys": {
+      "version": "8.59.2",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.59.2.tgz",
+      "integrity": "sha512-NwjLUnGy8/Zfx23fl50tRC8rYaYnM52xNRYFAXvmiil9yh1+K6aRVQMnzW6gQB/1DLgWt977lYQn7C+wtgXZiA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/types": "8.59.2",
+        "eslint-visitor-keys": "^5.0.0"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      }
+    },
+    "node_modules/@typescript-eslint/parser/node_modules/eslint-visitor-keys": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-5.0.1.tgz",
+      "integrity": "sha512-tD40eHxA35h0PEIZNeIjkHoDR4YjjJp34biM0mDvplBe//mB+IHCqHDGV7pxF+7MklTvighcCPPZC7ynWyjdTA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": "^20.19.0 || ^22.13.0 || >=24"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      }
+    },
+    "node_modules/@typescript-eslint/project-service": {
+      "version": "8.64.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/project-service/-/project-service-8.64.0.tgz",
+      "integrity": "sha512-tk4WpOJ6IEbGrVHaNmM0YRrwAD3exZlIK3iadQNAxh4YKk6jvUQ4ecq18n+v7+meh+cJ3j+D8nbk8sRKhlwLQg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/tsconfig-utils": "^8.64.0",
+        "@typescript-eslint/types": "^8.64.0",
+        "debug": "^4.4.3"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <6.1.0"
+      }
+    },
+    "node_modules/@typescript-eslint/scope-manager": {
+      "version": "8.64.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.64.0.tgz",
+      "integrity": "sha512-CXEaFdYXjSTgKhisNkwCcJwTP8Pl+fmRrEQrri4nm3vU743bALrxzLmq7fHG/7e6a5xO0lDYeURpZmBuhHk54w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/types": "8.64.0",
+        "@typescript-eslint/visitor-keys": "8.64.0"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      }
+    },
+    "node_modules/@typescript-eslint/tsconfig-utils": {
+      "version": "8.64.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/tsconfig-utils/-/tsconfig-utils-8.64.0.tgz",
+      "integrity": "sha512-2yo8rRNKuzbVWQp5kslhANqZ2uDAeROQHBRZNPu8JDsHmeFNj/XJJhX/FhNUWmkHHvoNsKa6+tHJiig87EzsQw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <6.1.0"
+      }
+    },
+    "node_modules/@typescript-eslint/type-utils": {
+      "version": "8.59.2",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/type-utils/-/type-utils-8.59.2.tgz",
+      "integrity": "sha512-nhqaj1nmTdVVl/BP5omXNRGO38jn5iosis2vbdmupF2txCf8ylWT8lx+JlvMYYVqzGVKtjojUFoQ3JRWK+mfzQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/types": "8.59.2",
+        "@typescript-eslint/typescript-estree": "8.59.2",
+        "@typescript-eslint/utils": "8.59.2",
+        "debug": "^4.4.3",
+        "ts-api-utils": "^2.5.0"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "eslint": "^8.57.0 || ^9.0.0 || ^10.0.0",
+        "typescript": ">=4.8.4 <6.1.0"
+      }
+    },
+    "node_modules/@typescript-eslint/type-utils/node_modules/@typescript-eslint/project-service": {
+      "version": "8.59.2",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/project-service/-/project-service-8.59.2.tgz",
+      "integrity": "sha512-+2hqvEkeyf/0FBor67duF0Ll7Ot8jyKzDQOSrxazF/danillRq2DwR9dLptsXpoZQqxE1UisSmoZewrlPas9Vw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/tsconfig-utils": "^8.59.2",
+        "@typescript-eslint/types": "^8.59.2",
+        "debug": "^4.4.3"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <6.1.0"
+      }
+    },
+    "node_modules/@typescript-eslint/type-utils/node_modules/@typescript-eslint/scope-manager": {
+      "version": "8.59.2",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.59.2.tgz",
+      "integrity": "sha512-JzfyEpEtOU89CcFSwyNS3mu4MLvLSXqnmX05+aKBDM+TdR5jzcGOEBwxwGNxrEQ7p/z6kK2WyioCGBf2zZBnvg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/types": "8.59.2",
+        "@typescript-eslint/visitor-keys": "8.59.2"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      }
+    },
+    "node_modules/@typescript-eslint/type-utils/node_modules/@typescript-eslint/tsconfig-utils": {
+      "version": "8.59.2",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/tsconfig-utils/-/tsconfig-utils-8.59.2.tgz",
+      "integrity": "sha512-BKK4alN7oi4C/zv4VqHQ+uRU+lTa6JGIZ7s1juw7b3RHo9OfKB+bKX3u0iVZetdsUCBBkSbdWbarJbmN0fTeSw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <6.1.0"
+      }
+    },
+    "node_modules/@typescript-eslint/type-utils/node_modules/@typescript-eslint/types": {
+      "version": "8.59.2",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.59.2.tgz",
+      "integrity": "sha512-e82GVOE8Ps3E++Egvb6Y3Dw0S10u8NkQ9KXmtRhCWJJ8kDhOJTvtMAWnFL16kB1583goCWXsr0NieKCZMs2/0Q==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      }
+    },
+    "node_modules/@typescript-eslint/type-utils/node_modules/@typescript-eslint/typescript-estree": {
+      "version": "8.59.2",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.59.2.tgz",
+      "integrity": "sha512-o0XPGNwcWw+FIwStOWn+BwBuEmL6QXP0rsvAFg7ET1dey1Nr6Wb1ac8p5HEsK0ygO/6mUxlk+YWQD9xcb/nnXg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/project-service": "8.59.2",
+        "@typescript-eslint/tsconfig-utils": "8.59.2",
+        "@typescript-eslint/types": "8.59.2",
+        "@typescript-eslint/visitor-keys": "8.59.2",
+        "debug": "^4.4.3",
+        "minimatch": "^10.2.2",
+        "semver": "^7.7.3",
+        "tinyglobby": "^0.2.15",
+        "ts-api-utils": "^2.5.0"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <6.1.0"
+      }
+    },
+    "node_modules/@typescript-eslint/type-utils/node_modules/@typescript-eslint/utils": {
+      "version": "8.59.2",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-8.59.2.tgz",
+      "integrity": "sha512-Juw3EinkXqjaffxz6roowvV7GZT/kET5vSKKZT6upl5TXdWkLkYmNPXwDDL2Vkt2DPn0nODIS4egC/0AGxKo/Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@eslint-community/eslint-utils": "^4.9.1",
+        "@typescript-eslint/scope-manager": "8.59.2",
+        "@typescript-eslint/types": "8.59.2",
+        "@typescript-eslint/typescript-estree": "8.59.2"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "eslint": "^8.57.0 || ^9.0.0 || ^10.0.0",
+        "typescript": ">=4.8.4 <6.1.0"
+      }
+    },
+    "node_modules/@typescript-eslint/type-utils/node_modules/@typescript-eslint/visitor-keys": {
+      "version": "8.59.2",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.59.2.tgz",
+      "integrity": "sha512-NwjLUnGy8/Zfx23fl50tRC8rYaYnM52xNRYFAXvmiil9yh1+K6aRVQMnzW6gQB/1DLgWt977lYQn7C+wtgXZiA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/types": "8.59.2",
+        "eslint-visitor-keys": "^5.0.0"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      }
+    },
+    "node_modules/@typescript-eslint/type-utils/node_modules/eslint-visitor-keys": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-5.0.1.tgz",
+      "integrity": "sha512-tD40eHxA35h0PEIZNeIjkHoDR4YjjJp34biM0mDvplBe//mB+IHCqHDGV7pxF+7MklTvighcCPPZC7ynWyjdTA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": "^20.19.0 || ^22.13.0 || >=24"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      }
+    },
+    "node_modules/@typescript-eslint/types": {
+      "version": "8.64.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.64.0.tgz",
+      "integrity": "sha512-qjhfuTfLXjA4IOzXvz0rTjT01BqEiIgPoUeMwiEjnaHKJMTNo8rH5pYW1a2L/0Dnux2fPC85AeyJoWaGa8WxTA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      }
+    },
+    "node_modules/@typescript-eslint/typescript-estree": {
+      "version": "8.64.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.64.0.tgz",
+      "integrity": "sha512-Pztpsn1aCE1oWDvDEfUk31nngvvF7vUB5SwHFEaZIFpvw7WJtqUHHL4plBZDA9HfWJJjL13BdG0YrJInTUvoVA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/project-service": "8.64.0",
+        "@typescript-eslint/tsconfig-utils": "8.64.0",
+        "@typescript-eslint/types": "8.64.0",
+        "@typescript-eslint/visitor-keys": "8.64.0",
+        "debug": "^4.4.3",
+        "minimatch": "^10.2.2",
+        "semver": "^7.7.3",
+        "tinyglobby": "^0.2.15",
+        "ts-api-utils": "^2.5.0"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <6.1.0"
+      }
+    },
+    "node_modules/@typescript-eslint/utils": {
+      "version": "8.64.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-8.64.0.tgz",
+      "integrity": "sha512-aJUGVB3+U0htrrCjoA8qukw8cm8fNCGAxK/tVoS70k8aeb7DETKeFozRiVFIwEeN9WJLsjaP3ph8I60tY2XZoQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@eslint-community/eslint-utils": "^4.9.1",
+        "@typescript-eslint/scope-manager": "8.64.0",
+        "@typescript-eslint/types": "8.64.0",
+        "@typescript-eslint/typescript-estree": "8.64.0"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "eslint": "^8.57.0 || ^9.0.0 || ^10.0.0",
+        "typescript": ">=4.8.4 <6.1.0"
+      }
+    },
+    "node_modules/@typescript-eslint/visitor-keys": {
+      "version": "8.64.0",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.64.0.tgz",
+      "integrity": "sha512-mrtuL8Nsn6gi2H4mo5KMTp823M+3Q19Ew/i+Zlikq20tIMm99C3Ez0dCmkWWnxut20esQvTg8aUSEhMcAOXhEw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/types": "8.64.0",
+        "eslint-visitor-keys": "^5.0.0"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      }
+    },
+    "node_modules/@typescript-eslint/visitor-keys/node_modules/eslint-visitor-keys": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-5.0.1.tgz",
+      "integrity": "sha512-tD40eHxA35h0PEIZNeIjkHoDR4YjjJp34biM0mDvplBe//mB+IHCqHDGV7pxF+7MklTvighcCPPZC7ynWyjdTA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": "^20.19.0 || ^22.13.0 || >=24"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      }
+    },
+    "node_modules/@vitejs/plugin-basic-ssl": {
+      "version": "2.1.4",
+      "resolved": "https://registry.npmjs.org/@vitejs/plugin-basic-ssl/-/plugin-basic-ssl-2.1.4.tgz",
+      "integrity": "sha512-HXciTXN/sDBYWgeAD4V4s0DN0g72x5mlxQhHxtYu3Tt8BLa6MzcJZUyDVFCdtjNs3bfENVHVzOsmooTVuNgAAw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^18.0.0 || ^20.0.0 || >=22.0.0"
+      },
+      "peerDependencies": {
+        "vite": "^6.0.0 || ^7.0.0"
+      }
+    },
+    "node_modules/@vitest/expect": {
+      "version": "4.1.7",
+      "resolved": "https://registry.npmjs.org/@vitest/expect/-/expect-4.1.7.tgz",
+      "integrity": "sha512-1R+tw0ortHEbZDGMymm+pN7/AFQ/RkFFdtd7EN+VBpynKmLbP8A3rpEXdshBJ7+8hQ9zBJh/i1s0yKNtxAnU7w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@standard-schema/spec": "^1.1.0",
+        "@types/chai": "^5.2.2",
+        "@vitest/spy": "4.1.7",
+        "@vitest/utils": "4.1.7",
+        "chai": "^6.2.2",
+        "tinyrainbow": "^3.1.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      }
+    },
+    "node_modules/@vitest/mocker": {
+      "version": "4.1.7",
+      "resolved": "https://registry.npmjs.org/@vitest/mocker/-/mocker-4.1.7.tgz",
+      "integrity": "sha512-vY7nuamKgfvpA1Koa3oYIw/k7D6kZnpGyNMZW8loow2bsBYla1TFdqTaXncWdRn4pgwNs+90RhnXhJScDwQeJA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@vitest/spy": "4.1.7",
+        "estree-walker": "^3.0.3",
+        "magic-string": "^0.30.21"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      },
+      "peerDependencies": {
+        "msw": "^2.4.9",
+        "vite": "^6.0.0 || ^7.0.0 || ^8.0.0"
+      },
+      "peerDependenciesMeta": {
+        "msw": {
+          "optional": true
+        },
+        "vite": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@vitest/pretty-format": {
+      "version": "4.1.7",
+      "resolved": "https://registry.npmjs.org/@vitest/pretty-format/-/pretty-format-4.1.7.tgz",
+      "integrity": "sha512-umgCarTOYQWIaDMvGDRZij+6b9oVeLIyJzfN+AS88e0ZOU3QTgNNSTtjQOpcvWr3np1N0j4WgZj+sb3oYBDscw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "tinyrainbow": "^3.1.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      }
+    },
+    "node_modules/@vitest/runner": {
+      "version": "4.1.7",
+      "resolved": "https://registry.npmjs.org/@vitest/runner/-/runner-4.1.7.tgz",
+      "integrity": "sha512-BapjmAQ2aI78WdMEfeUWivnfVzB+VPGwWRQcJE0OUq7qEeEcBsCSf+0T5iREBNE5nBb4wA5Ya0W6IA+sghdEFw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@vitest/utils": "4.1.7",
+        "pathe": "^2.0.3"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      }
+    },
+    "node_modules/@vitest/snapshot": {
+      "version": "4.1.7",
+      "resolved": "https://registry.npmjs.org/@vitest/snapshot/-/snapshot-4.1.7.tgz",
+      "integrity": "sha512-ZacLzja+TmJeZ1h14xW2FB/WpeimUD3haBXQPyJqxvo8jQTmfeA8zv58mtjN2C7EHXZDYVcVYdYmAxjkWVvKCw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@vitest/pretty-format": "4.1.7",
+        "@vitest/utils": "4.1.7",
+        "magic-string": "^0.30.21",
+        "pathe": "^2.0.3"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      }
+    },
+    "node_modules/@vitest/spy": {
+      "version": "4.1.7",
+      "resolved": "https://registry.npmjs.org/@vitest/spy/-/spy-4.1.7.tgz",
+      "integrity": "sha512-kbkI5LMWakyuTIvs6fUJ5qdIVb1XVKsYJAT4OJ938cHMROYMSfmoQdZy0aaAnjbbc8F61vkoTqz/Az+/HiIu5Q==",
+      "dev": true,
+      "license": "MIT",
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      }
+    },
+    "node_modules/@vitest/utils": {
+      "version": "4.1.7",
+      "resolved": "https://registry.npmjs.org/@vitest/utils/-/utils-4.1.7.tgz",
+      "integrity": "sha512-T532WBu791cBxJlCl6SO+J14l81DQx6uQHm1bQbmCDY7nqlEIgkza/UFnSBNaUtSf41unldDFjdOBYEQC4b5Hw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@vitest/pretty-format": "4.1.7",
+        "convert-source-map": "^2.0.0",
+        "tinyrainbow": "^3.1.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      }
+    },
+    "node_modules/@vitest/utils/node_modules/convert-source-map": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-2.0.0.tgz",
+      "integrity": "sha512-Kvp459HrV2FEJ1CAsi1Ku+MY3kasH19TFykTz2xWmMeq6bk2NU3XXvfJ+Q61m0xktWwt+1HSYf3JZsTms3aRJg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/@yarnpkg/lockfile": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/@yarnpkg/lockfile/-/lockfile-1.1.0.tgz",
+      "integrity": "sha512-GpSwvyXOcOOlV70vbnzjj4fW5xW/FdUF6nQEt1ENy7m4ZCczi1+/buVUPAqmGfqznsORNFzUMjctTIp8a9tuCQ==",
+      "dev": true,
+      "license": "BSD-2-Clause"
+    },
+    "node_modules/@yr/monotone-cubic-spline": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/@yr/monotone-cubic-spline/-/monotone-cubic-spline-1.0.3.tgz",
+      "integrity": "sha512-FQXkOta0XBSUPHndIKON2Y9JeQz5ZeMqLYZVVK93FliNBFm7LNMIZmY6FrMEB9XPcDbE2bekMbZD6kzDkxwYjA==",
+      "license": "MIT"
+    },
+    "node_modules/abbrev": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/abbrev/-/abbrev-4.0.0.tgz",
+      "integrity": "sha512-a1wflyaL0tHtJSmLSOVybYhy22vRih4eduhhrkcjgrWGnRfrZtovJ2FRjxuTtkkj47O/baf0R86QU5OuYpz8fA==",
+      "dev": true,
+      "license": "ISC",
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/accepts": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/accepts/-/accepts-2.0.0.tgz",
+      "integrity": "sha512-5cvg6CtKwfgdmVqY1WIiXKc3Q1bkRqGLi+2W/6ao+6Y7gu/RCwRuAhGEzh5B4KlszSuTLgZYuqFqo5bImjNKng==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "mime-types": "^3.0.0",
+        "negotiator": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/acorn": {
+      "version": "8.17.0",
+      "resolved": "https://registry.npmjs.org/acorn/-/acorn-8.17.0.tgz",
+      "integrity": "sha512-xRQbDb9BnwDafYNn6Vwl839DYVjqXYb1XVGtWAZ1kcDc6iwAL4hg3B1dZlRiuENFeO2H53gFG3in621AdERVAg==",
+      "dev": true,
+      "license": "MIT",
+      "bin": {
+        "acorn": "bin/acorn"
+      },
+      "engines": {
+        "node": ">=0.4.0"
+      }
+    },
+    "node_modules/acorn-jsx": {
+      "version": "5.3.2",
+      "resolved": "https://registry.npmjs.org/acorn-jsx/-/acorn-jsx-5.3.2.tgz",
+      "integrity": "sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ==",
+      "dev": true,
+      "license": "MIT",
+      "peerDependencies": {
+        "acorn": "^6.0.0 || ^7.0.0 || ^8.0.0"
+      }
+    },
+    "node_modules/agent-base": {
+      "version": "7.1.4",
+      "resolved": "https://registry.npmjs.org/agent-base/-/agent-base-7.1.4.tgz",
+      "integrity": "sha512-MnA+YT8fwfJPgBx3m60MNqakm30XOkyIoH1y6huTQvC0PwZG7ki8NacLBcrPbNoo8vEZy7Jpuk7+jMO+CUovTQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 14"
+      }
+    },
+    "node_modules/ajv": {
+      "version": "8.18.0",
+      "resolved": "https://registry.npmjs.org/ajv/-/ajv-8.18.0.tgz",
+      "integrity": "sha512-PlXPeEWMXMZ7sPYOHqmDyCJzcfNrUr3fGNKtezX14ykXOEIvyK81d+qydx89KY5O71FKMPaQ2vBfBFI5NHR63A==",
+      "license": "MIT",
+      "dependencies": {
+        "fast-deep-equal": "^3.1.3",
+        "fast-uri": "^3.0.1",
+        "json-schema-traverse": "^1.0.0",
+        "require-from-string": "^2.0.2"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/epoberezkin"
+      }
+    },
+    "node_modules/ajv-formats": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/ajv-formats/-/ajv-formats-3.0.1.tgz",
+      "integrity": "sha512-8iUql50EUR+uUcdRQ3HDqa6EVyo3docL8g5WJ3FNcWmu62IbkGUue/pEyLBW8VGKKucTPgqeks4fIU1DA4yowQ==",
+      "license": "MIT",
+      "dependencies": {
+        "ajv": "^8.0.0"
+      },
+      "peerDependencies": {
+        "ajv": "^8.0.0"
+      },
+      "peerDependenciesMeta": {
+        "ajv": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/algoliasearch": {
+      "version": "5.48.1",
+      "resolved": "https://registry.npmjs.org/algoliasearch/-/algoliasearch-5.48.1.tgz",
+      "integrity": "sha512-Rf7xmeuIo7nb6S4mp4abW2faW8DauZyE2faBIKFaUfP3wnpOvNSbiI5AwVhqBNj0jPgBWEvhyCu0sLjN2q77Rg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@algolia/abtesting": "1.14.1",
+        "@algolia/client-abtesting": "5.48.1",
+        "@algolia/client-analytics": "5.48.1",
+        "@algolia/client-common": "5.48.1",
+        "@algolia/client-insights": "5.48.1",
+        "@algolia/client-personalization": "5.48.1",
+        "@algolia/client-query-suggestions": "5.48.1",
+        "@algolia/client-search": "5.48.1",
+        "@algolia/ingestion": "1.48.1",
+        "@algolia/monitoring": "1.48.1",
+        "@algolia/recommend": "5.48.1",
+        "@algolia/requester-browser-xhr": "5.48.1",
+        "@algolia/requester-fetch": "5.48.1",
+        "@algolia/requester-node-http": "5.48.1"
+      },
+      "engines": {
+        "node": ">= 14.0.0"
+      }
+    },
+    "node_modules/angular-eslint": {
+      "version": "21.4.0",
+      "resolved": "https://registry.npmjs.org/angular-eslint/-/angular-eslint-21.4.0.tgz",
+      "integrity": "sha512-LH7bWmtJvsubzwPoztnl1pWgI5X0VrfGTUITGSYcwn2J+SXuN/avzrKrxJmhUiIrNvLtfV+18GG6xZS1IGZdKg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@angular-devkit/core": ">= 21.0.0 < 22.0.0",
+        "@angular-devkit/schematics": ">= 21.0.0 < 22.0.0",
+        "@angular-eslint/builder": "21.4.0",
+        "@angular-eslint/eslint-plugin": "21.4.0",
+        "@angular-eslint/eslint-plugin-template": "21.4.0",
+        "@angular-eslint/schematics": "21.4.0",
+        "@angular-eslint/template-parser": "21.4.0",
+        "@typescript-eslint/types": "^8.0.0",
+        "@typescript-eslint/utils": "^8.0.0"
+      },
+      "peerDependencies": {
+        "@angular/cli": ">= 21.0.0 < 22.0.0",
+        "eslint": "^8.57.0 || ^9.0.0 || ^10.0.0",
+        "typescript": "*",
+        "typescript-eslint": "^8.0.0"
+      }
+    },
+    "node_modules/ansi-escapes": {
+      "version": "7.3.0",
+      "resolved": "https://registry.npmjs.org/ansi-escapes/-/ansi-escapes-7.3.0.tgz",
+      "integrity": "sha512-BvU8nYgGQBxcmMuEeUEmNTvrMVjJNSH7RgW24vXexN4Ven6qCvy4TntnvlnwnMLTVlcRQQdbRY8NKnaIoeWDNg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "environment": "^1.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/ansi-regex": {
+      "version": "6.2.2",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-6.2.2.tgz",
+      "integrity": "sha512-Bq3SmSpyFHaWjPk8If9yc6svM8c56dB5BAtW4Qbw5jHTwwXXcTLoRMkpDJp6VL0XzlWaCHTXrkFURMYmD0sLqg==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-regex?sponsor=1"
+      }
+    },
+    "node_modules/ansi-styles": {
+      "version": "6.2.3",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-6.2.3.tgz",
+      "integrity": "sha512-4Dj6M28JB+oAH8kFkTLUo+a2jwOFkuqb3yucU0CANcRRUbxS0cP0nZYCGjcc3BNXwRIsUVmDGgzawme7zvJHvg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+      }
+    },
+    "node_modules/anymatch": {
+      "version": "3.1.3",
+      "resolved": "https://registry.npmjs.org/anymatch/-/anymatch-3.1.3.tgz",
+      "integrity": "sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "normalize-path": "^3.0.0",
+        "picomatch": "^2.0.4"
+      },
+      "engines": {
+        "node": ">= 8"
+      }
+    },
+    "node_modules/anymatch/node_modules/picomatch": {
+      "version": "2.3.2",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.2.tgz",
+      "integrity": "sha512-V7+vQEJ06Z+c5tSye8S+nHUfI51xoXIXjHQ99cQtKUkQqqO1kO/KCJUfZXuB47h/YBlDhah2H3hdUGXn8ie0oA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8.6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/jonschlinkert"
+      }
+    },
+    "node_modules/apexcharts": {
+      "version": "5.13.0",
+      "resolved": "https://registry.npmjs.org/apexcharts/-/apexcharts-5.13.0.tgz",
+      "integrity": "sha512-PJuXT6zdiCbv0IkX5cqkKFVIIh+9v3kqP9zsOHEGpIWi7DfTgzvfOKc8icw6G3/ulR3V1alDDUtOVH0zWCWGEQ==",
+      "license": "SEE LICENSE IN LICENSE"
+    },
+    "node_modules/aria-query": {
+      "version": "5.3.2",
+      "resolved": "https://registry.npmjs.org/aria-query/-/aria-query-5.3.2.tgz",
+      "integrity": "sha512-COROpnaoap1E2F000S62r6A60uHZnmlvomhfyT2DlTcrY1OrBKn2UhH7qn5wTC9zMvD0AY7csdPSNwKP+7WiQw==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/assertion-error": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/assertion-error/-/assertion-error-2.0.1.tgz",
+      "integrity": "sha512-Izi8RQcffqCeNVgFigKli1ssklIbpHnCYc6AknXGYoB6grJqyeby7jv12JUQgmTAnIDnbck1uxksT4dzN3PWBA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/autoprefixer": {
+      "version": "10.5.0",
+      "resolved": "https://registry.npmjs.org/autoprefixer/-/autoprefixer-10.5.0.tgz",
+      "integrity": "sha512-FMhOoZV4+qR6aTUALKX2rEqGG+oyATvwBt9IIzVR5rMa2HRWPkxf+P+PAJLD1I/H5/II+HuZcBJYEFBpq39ong==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/postcss/"
+        },
+        {
+          "type": "tidelift",
+          "url": "https://tidelift.com/funding/github/npm/autoprefixer"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "browserslist": "^4.28.2",
+        "caniuse-lite": "^1.0.30001787",
+        "fraction.js": "^5.3.4",
+        "picocolors": "^1.1.1",
+        "postcss-value-parser": "^4.2.0"
+      },
+      "bin": {
+        "autoprefixer": "bin/autoprefixer"
+      },
+      "engines": {
+        "node": "^10 || ^12 || >=14"
+      },
+      "peerDependencies": {
+        "postcss": "^8.1.0"
+      }
+    },
+    "node_modules/axobject-query": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/axobject-query/-/axobject-query-4.1.0.tgz",
+      "integrity": "sha512-qIj0G9wZbMGNLjLmg1PT6v2mE9AH2zlnADJD/2tC6E00hgmhUOfEB6greHPAfLRSufHqROIUTkw6E+M3lH0PTQ==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/balanced-match": {
+      "version": "4.0.4",
+      "resolved": "https://registry.npmjs.org/balanced-match/-/balanced-match-4.0.4.tgz",
+      "integrity": "sha512-BLrgEcRTwX2o6gGxGOCNyMvGSp35YofuYzw9h1IMTRmKqttAZZVU67bdb9Pr2vUHA8+j3i2tJfjO6C6+4myGTA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "18 || 20 || >=22"
+      }
+    },
+    "node_modules/baseline-browser-mapping": {
+      "version": "2.10.32",
+      "resolved": "https://registry.npmjs.org/baseline-browser-mapping/-/baseline-browser-mapping-2.10.32.tgz",
+      "integrity": "sha512-wbPvpyjJPC0zdfdKXxqEL3Ea+bOMD/87X4lftiJkkaBiuG6ALQy1SLmEd7BSmVCuwCQsBrCamgBoLyfFDD1EPg==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "bin": {
+        "baseline-browser-mapping": "dist/cli.cjs"
+      },
+      "engines": {
+        "node": ">=6.0.0"
+      }
+    },
+    "node_modules/beasties": {
+      "version": "0.4.1",
+      "resolved": "https://registry.npmjs.org/beasties/-/beasties-0.4.1.tgz",
+      "integrity": "sha512-2Imdcw3LznDuxAbJM26RHniOLAzE6WgrK8OuvVXCQtNBS8rsnD9zsSEa3fHl4hHpUY7BYTlrpvtPVbvu9G6neg==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "css-select": "^6.0.0",
+        "css-what": "^7.0.0",
+        "dom-serializer": "^2.0.0",
+        "domhandler": "^5.0.3",
+        "htmlparser2": "^10.0.0",
+        "picocolors": "^1.1.1",
+        "postcss": "^8.4.49",
+        "postcss-media-query-parser": "^0.2.3",
+        "postcss-safe-parser": "^7.0.1"
+      },
+      "engines": {
+        "node": ">=18.0.0"
+      }
+    },
+    "node_modules/bidi-js": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/bidi-js/-/bidi-js-1.0.3.tgz",
+      "integrity": "sha512-RKshQI1R3YQ+n9YJz2QQ147P66ELpa1FQEg20Dk8oW9t2KgLbpDLLp9aGZ7y8WHSshDknG0bknqGw5/tyCs5tw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "require-from-string": "^2.0.2"
+      }
+    },
+    "node_modules/binary-extensions": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/binary-extensions/-/binary-extensions-2.3.0.tgz",
+      "integrity": "sha512-Ceh+7ox5qe7LJuLHoY0feh3pHuUDHAcRUeyL2VYghZwfpkNIy/+8Ocg0a3UuSoYzavmylwuLWQOf3hl0jjMMIw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/body-parser": {
+      "version": "2.2.2",
+      "resolved": "https://registry.npmjs.org/body-parser/-/body-parser-2.2.2.tgz",
+      "integrity": "sha512-oP5VkATKlNwcgvxi0vM0p/D3n2C3EReYVX+DNYs5TjZFn/oQt2j+4sVJtSMr18pdRr8wjTcBl6LoV+FUwzPmNA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "bytes": "^3.1.2",
+        "content-type": "^1.0.5",
+        "debug": "^4.4.3",
+        "http-errors": "^2.0.0",
+        "iconv-lite": "^0.7.0",
+        "on-finished": "^2.4.1",
+        "qs": "^6.14.1",
+        "raw-body": "^3.0.1",
+        "type-is": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/boolbase": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/boolbase/-/boolbase-1.0.0.tgz",
+      "integrity": "sha512-JZOSA7Mo9sNGB8+UjSgzdLtokWAky1zbztM3WRLCbZ70/3cTANmQmOdR7y2g+J0e2WXywy1yS468tY+IruqEww==",
+      "dev": true,
+      "license": "ISC"
+    },
+    "node_modules/brace-expansion": {
+      "version": "5.0.6",
+      "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-5.0.6.tgz",
+      "integrity": "sha512-kLpxurY4Z4r9sgMsyG0Z9uzsBlgiU/EFKhj/h91/8yHu0edo7XuixOIH3VcJ8kkxs6/jPzoI6U9Vj3WqbMQ94g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "balanced-match": "^4.0.2"
+      },
+      "engines": {
+        "node": "18 || 20 || >=22"
+      }
+    },
+    "node_modules/braces": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/braces/-/braces-3.0.3.tgz",
+      "integrity": "sha512-yQbXgO/OSZVD2IsiLlro+7Hf6Q18EJrKSEsdoMzKePKXct3gvD8oLcOQdIzGupr5Fj+EDe8gO/lxc1BzfMpxvA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "fill-range": "^7.1.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/browserslist": {
+      "version": "4.28.2",
+      "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-4.28.2.tgz",
+      "integrity": "sha512-48xSriZYYg+8qXna9kwqjIVzuQxi+KYWp2+5nCYnYKPTr0LvD89Jqk2Or5ogxz0NUMfIjhh2lIUX/LyX9B4oIg==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/browserslist"
+        },
+        {
+          "type": "tidelift",
+          "url": "https://tidelift.com/funding/github/npm/browserslist"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "baseline-browser-mapping": "^2.10.12",
+        "caniuse-lite": "^1.0.30001782",
+        "electron-to-chromium": "^1.5.328",
+        "node-releases": "^2.0.36",
+        "update-browserslist-db": "^1.2.3"
+      },
+      "bin": {
+        "browserslist": "cli.js"
+      },
+      "engines": {
+        "node": "^6 || ^7 || ^8 || ^9 || ^10 || ^11 || ^12 || >=13.7"
+      }
+    },
+    "node_modules/buffer-from": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/buffer-from/-/buffer-from-1.1.2.tgz",
+      "integrity": "sha512-E+XQCRwSbaaiChtv6k6Dwgc+bx+Bs6vuKJHHl5kox/BaKbhiXzqQOwK4cO22yElGp2OCmjwVhT3HmxgyPGnJfQ==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/bytes": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/bytes/-/bytes-3.1.2.tgz",
+      "integrity": "sha512-/Nf7TyzTx6S3yRJObOAV7956r8cr2+Oj8AC5dt8wSP3BQAoeX58NoHyCU8P8zGkNXStjTSi6fzO6F0pBdcYbEg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/cacache": {
+      "version": "20.0.4",
+      "resolved": "https://registry.npmjs.org/cacache/-/cacache-20.0.4.tgz",
+      "integrity": "sha512-M3Lab8NPYlZU2exsL3bMVvMrMqgwCnMWfdZbK28bn3pK6APT/Te/I8hjRPNu1uwORY9a1eEQoifXbKPQMfMTOA==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "@npmcli/fs": "^5.0.0",
+        "fs-minipass": "^3.0.0",
+        "glob": "^13.0.0",
+        "lru-cache": "^11.1.0",
+        "minipass": "^7.0.3",
+        "minipass-collect": "^2.0.1",
+        "minipass-flush": "^1.0.5",
+        "minipass-pipeline": "^1.2.4",
+        "p-map": "^7.0.2",
+        "ssri": "^13.0.0"
+      },
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/cacache/node_modules/lru-cache": {
+      "version": "11.5.0",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-11.5.0.tgz",
+      "integrity": "sha512-5YgH9UJd7wVb9hIouI2adWpgqrrICkt070Dnj8EUY1+B4B2P9eRLPAkAAo6NICA7CEhOIeBHl46u9zSNpNu7zA==",
+      "dev": true,
+      "license": "BlueOak-1.0.0",
+      "engines": {
+        "node": "20 || >=22"
+      }
+    },
+    "node_modules/call-bind-apply-helpers": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/call-bind-apply-helpers/-/call-bind-apply-helpers-1.0.2.tgz",
+      "integrity": "sha512-Sp1ablJ0ivDkSzjcaJdxEunN5/XvksFJ2sMBFfq6x0ryhQV/2b/KwFe21cMpmHtPOSij8K99/wSfoEuTObmuMQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0",
+        "function-bind": "^1.1.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/call-bound": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/call-bound/-/call-bound-1.0.4.tgz",
+      "integrity": "sha512-+ys997U96po4Kx/ABpBCqhA9EuxJaQWDQg7295H4hBphv3IZg0boBKuwYpt4YXp6MZ5AmZQnU/tyMTlRpaSejg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind-apply-helpers": "^1.0.2",
+        "get-intrinsic": "^1.3.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/caniuse-lite": {
+      "version": "1.0.30001793",
+      "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001793.tgz",
+      "integrity": "sha512-iwSsYWaCOoh26cV8NwNRViHlrfUvYsHDfRVcbtmw0Kg6PJIZZXwMkj1442FYLBGkeUf1juAsU3DTfxW579mrPA==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/browserslist"
+        },
+        {
+          "type": "tidelift",
+          "url": "https://tidelift.com/funding/github/npm/caniuse-lite"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "CC-BY-4.0"
+    },
+    "node_modules/chai": {
+      "version": "6.2.2",
+      "resolved": "https://registry.npmjs.org/chai/-/chai-6.2.2.tgz",
+      "integrity": "sha512-NUPRluOfOiTKBKvWPtSD4PhFvWCqOi0BGStNWs57X9js7XGTprSmFoz5F0tWhR4WPjNeR9jXqdC7/UpSJTnlRg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/chalk": {
+      "version": "5.6.2",
+      "resolved": "https://registry.npmjs.org/chalk/-/chalk-5.6.2.tgz",
+      "integrity": "sha512-7NzBL0rN6fMUW+f7A6Io4h40qQlG+xGmtMxfbnH/K7TAtt8JQWVQK+6g0UXKMeVJoyV5EkkNsErQ8pVD3bLHbA==",
+      "license": "MIT",
+      "engines": {
+        "node": "^12.17.0 || ^14.13 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/chalk?sponsor=1"
+      }
+    },
+    "node_modules/chardet": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/chardet/-/chardet-2.1.1.tgz",
+      "integrity": "sha512-PsezH1rqdV9VvyNhxxOW32/d75r01NY7TQCmOqomRo15ZSOKbpTFVsfjghxo6JloQUCGnH4k1LGu0R4yCLlWQQ==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/chart.js": {
+      "version": "4.5.1",
+      "resolved": "https://registry.npmjs.org/chart.js/-/chart.js-4.5.1.tgz",
+      "integrity": "sha512-GIjfiT9dbmHRiYi6Nl2yFCq7kkwdkp1W/lp2J99rX0yo9tgJGn3lKQATztIjb5tVtevcBtIdICNWqlq5+E8/Pw==",
+      "license": "MIT",
+      "dependencies": {
+        "@kurkle/color": "^0.3.0"
+      },
+      "engines": {
+        "pnpm": ">=8"
+      }
+    },
+    "node_modules/chokidar": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-5.0.0.tgz",
+      "integrity": "sha512-TQMmc3w+5AxjpL8iIiwebF73dRDF4fBIieAqGn9RGCWaEVwQ6Fb2cGe31Yns0RRIzii5goJ1Y7xbMwo1TxMplw==",
+      "devOptional": true,
+      "license": "MIT",
+      "dependencies": {
+        "readdirp": "^5.0.0"
+      },
+      "engines": {
+        "node": ">= 20.19.0"
+      },
+      "funding": {
+        "url": "https://paulmillr.com/funding/"
+      }
+    },
+    "node_modules/chownr": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/chownr/-/chownr-3.0.0.tgz",
+      "integrity": "sha512-+IxzY9BZOQd/XuYPRmrvEVjF/nqj5kgT4kEq7VofrDoM1MxoRjEWkrCC3EtLi59TVawxTAn+orJwFQcrqEN1+g==",
+      "dev": true,
+      "license": "BlueOak-1.0.0",
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/cli-cursor": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/cli-cursor/-/cli-cursor-5.0.0.tgz",
+      "integrity": "sha512-aCj4O5wKyszjMmDT4tZj93kxyydN/K5zPWSCe6/0AV/AA1pqe5ZBIw0a2ZfPQV7lL5/yb5HsUreJ6UFAF1tEQw==",
+      "license": "MIT",
+      "dependencies": {
+        "restore-cursor": "^5.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/cli-spinners": {
+      "version": "3.4.0",
+      "resolved": "https://registry.npmjs.org/cli-spinners/-/cli-spinners-3.4.0.tgz",
+      "integrity": "sha512-bXfOC4QcT1tKXGorxL3wbJm6XJPDqEnij2gQ2m7ESQuE+/z9YFIWnl/5RpTiKWbMq3EVKR4fRLJGn6DVfu0mpw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18.20"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/cli-truncate": {
+      "version": "5.2.0",
+      "resolved": "https://registry.npmjs.org/cli-truncate/-/cli-truncate-5.2.0.tgz",
+      "integrity": "sha512-xRwvIOMGrfOAnM1JYtqQImuaNtDEv9v6oIYAs4LIHwTiKee8uwvIi363igssOC0O5U04i4AlENs79LQLu9tEMw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "slice-ansi": "^8.0.0",
+        "string-width": "^8.2.0"
+      },
+      "engines": {
+        "node": ">=20"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/cli-width": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/cli-width/-/cli-width-4.1.0.tgz",
+      "integrity": "sha512-ouuZd4/dm2Sw5Gmqy6bGyNNNe1qt9RpmxveLSO7KcgsTnU7RXfsw+/bukWGo1abgBiMAic068rclZsO4IWmmxQ==",
+      "dev": true,
+      "license": "ISC",
+      "engines": {
+        "node": ">= 12"
+      }
+    },
+    "node_modules/cliui": {
+      "version": "9.0.1",
+      "resolved": "https://registry.npmjs.org/cliui/-/cliui-9.0.1.tgz",
+      "integrity": "sha512-k7ndgKhwoQveBL+/1tqGJYNz097I7WOvwbmmU2AR5+magtbjPWQTS1C5vzGkBC8Ym8UWRzfKUzUUqFLypY4Q+w==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "string-width": "^7.2.0",
+        "strip-ansi": "^7.1.0",
+        "wrap-ansi": "^9.0.0"
+      },
+      "engines": {
+        "node": ">=20"
+      }
+    },
+    "node_modules/cliui/node_modules/emoji-regex": {
+      "version": "10.6.0",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-10.6.0.tgz",
+      "integrity": "sha512-toUI84YS5YmxW219erniWD0CIVOo46xGKColeNQRgOzDorgBi1v4D71/OFzgD9GO2UGKIv1C3Sp8DAn0+j5w7A==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/cliui/node_modules/string-width": {
+      "version": "7.2.0",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-7.2.0.tgz",
+      "integrity": "sha512-tsaTIkKW9b4N+AEj+SVA+WhJzV7/zMhcSu78mLKWSk7cXMOSHsBKFWUs0fWwq8QyK3MgJBQRX6Gbi4kYbdvGkQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "emoji-regex": "^10.3.0",
+        "get-east-asian-width": "^1.0.0",
+        "strip-ansi": "^7.1.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/cliui/node_modules/wrap-ansi": {
+      "version": "9.0.2",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-9.0.2.tgz",
+      "integrity": "sha512-42AtmgqjV+X1VpdOfyTGOYRi0/zsoLqtXQckTmqTeybT+BDIbM/Guxo7x3pE2vtpr1ok6xRqM9OpBe+Jyoqyww==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-styles": "^6.2.1",
+        "string-width": "^7.0.0",
+        "strip-ansi": "^7.1.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
+      }
+    },
+    "node_modules/color-convert": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-2.0.1.tgz",
+      "integrity": "sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==",
+      "license": "MIT",
+      "dependencies": {
+        "color-name": "~1.1.4"
+      },
+      "engines": {
+        "node": ">=7.0.0"
+      }
+    },
+    "node_modules/color-name": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.4.tgz",
+      "integrity": "sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==",
+      "license": "MIT"
+    },
+    "node_modules/colorette": {
+      "version": "2.0.20",
+      "resolved": "https://registry.npmjs.org/colorette/-/colorette-2.0.20.tgz",
+      "integrity": "sha512-IfEDxwoWIjkeXL1eXcDiow4UbKjhLdq6/EuSVR9GMN7KVH3r9gQ83e73hsz1Nd1T3ijd5xv1wcWRYO+D6kCI2w==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/content-disposition": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/content-disposition/-/content-disposition-1.1.0.tgz",
+      "integrity": "sha512-5jRCH9Z/+DRP7rkvY83B+yGIGX96OYdJmzngqnw2SBSxqCFPd0w2km3s5iawpGX8krnwSGmF0FW5Nhr0Hfai3g==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/content-type": {
+      "version": "1.0.5",
+      "resolved": "https://registry.npmjs.org/content-type/-/content-type-1.0.5.tgz",
+      "integrity": "sha512-nTjqfcBFEipKdXCv4YDQWCfmcLZKm81ldF0pAopTvyrFGVbcR6P/VAAd5G7N+0tTr8QqiU0tFadD6FK4NtJwOA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/convert-source-map": {
+      "version": "1.9.0",
+      "resolved": "https://registry.npmjs.org/convert-source-map/-/convert-source-map-1.9.0.tgz",
+      "integrity": "sha512-ASFBup0Mz1uyiIjANan1jzLQami9z1PoYSZCiiYW2FczPbenXc45FZdBZLzOT+r6+iciuEModtmCti+hjaAk0A==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/cookie": {
+      "version": "0.7.2",
+      "resolved": "https://registry.npmjs.org/cookie/-/cookie-0.7.2.tgz",
+      "integrity": "sha512-yki5XnKuf750l50uGTllt6kKILY4nQ1eNIQatoXEByZ5dWgnKqbnqmTrBE5B4N7lrMJKQ2ytWMiTO2o0v6Ew/w==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/cookie-signature": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/cookie-signature/-/cookie-signature-1.2.2.tgz",
+      "integrity": "sha512-D76uU73ulSXrD1UXF4KE2TMxVVwhsnCgfAyTg9k8P6KGZjlXKrOLe4dJQKI3Bxi5wjesZoFXJWElNWBjPZMbhg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.6.0"
+      }
+    },
+    "node_modules/cors": {
+      "version": "2.8.6",
+      "resolved": "https://registry.npmjs.org/cors/-/cors-2.8.6.tgz",
+      "integrity": "sha512-tJtZBBHA6vjIAaF6EnIaq6laBBP9aq/Y3ouVJjEfoHbRBcHBAHYcMh/w8LDrk2PvIMMq8gmopa5D4V8RmbrxGw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "object-assign": "^4",
+        "vary": "^1"
+      },
+      "engines": {
+        "node": ">= 0.10"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/cross-spawn": {
+      "version": "7.0.6",
+      "resolved": "https://registry.npmjs.org/cross-spawn/-/cross-spawn-7.0.6.tgz",
+      "integrity": "sha512-uV2QOWP2nWzsy2aMp8aRibhi9dlzF5Hgh5SHaB9OiTGEyDTiJJyx0uy51QXdyWbtAHNua4XJzUKca3OzKUd3vA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "path-key": "^3.1.0",
+        "shebang-command": "^2.0.0",
+        "which": "^2.0.1"
+      },
+      "engines": {
+        "node": ">= 8"
+      }
+    },
+    "node_modules/css-select": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/css-select/-/css-select-6.0.0.tgz",
+      "integrity": "sha512-rZZVSLle8v0+EY8QAkDWrKhpgt6SA5OtHsgBnsj6ZaLb5dmDVOWUDtQitd9ydxxvEjhewNudS6eTVU7uOyzvXw==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "dependencies": {
+        "boolbase": "^1.0.0",
+        "css-what": "^7.0.0",
+        "domhandler": "^5.0.3",
+        "domutils": "^3.2.2",
+        "nth-check": "^2.1.1"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/fb55"
+      }
+    },
+    "node_modules/css-tree": {
+      "version": "3.2.1",
+      "resolved": "https://registry.npmjs.org/css-tree/-/css-tree-3.2.1.tgz",
+      "integrity": "sha512-X7sjQzceUhu1u7Y/ylrRZFU2FS6LRiFVp6rKLPg23y3x3c3DOKAwuXGDp+PAGjh6CSnCjYeAul8pcT8bAl+lSA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "mdn-data": "2.27.1",
+        "source-map-js": "^1.2.1"
+      },
+      "engines": {
+        "node": "^10 || ^12.20.0 || ^14.13.0 || >=15.0.0"
+      }
+    },
+    "node_modules/css-what": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/css-what/-/css-what-7.0.0.tgz",
+      "integrity": "sha512-wD5oz5xibMOPHzy13CyGmogB3phdvcDaB5t0W/Nr5Z2O/agcB8YwOz6e2Lsp10pNDzBoDO9nVa3RGs/2BttpHQ==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "engines": {
+        "node": ">= 6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/fb55"
+      }
+    },
+    "node_modules/cssstyle": {
+      "version": "5.3.7",
+      "resolved": "https://registry.npmjs.org/cssstyle/-/cssstyle-5.3.7.tgz",
+      "integrity": "sha512-7D2EPVltRrsTkhpQmksIu+LxeWAIEk6wRDMJ1qljlv+CKHJM+cJLlfhWIzNA44eAsHXSNe3+vO6DW1yCYx8SuQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@asamuzakjp/css-color": "^4.1.1",
+        "@csstools/css-syntax-patches-for-csstree": "^1.0.21",
+        "css-tree": "^3.1.0",
+        "lru-cache": "^11.2.4"
+      },
+      "engines": {
+        "node": ">=20"
+      }
+    },
+    "node_modules/cssstyle/node_modules/lru-cache": {
+      "version": "11.5.0",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-11.5.0.tgz",
+      "integrity": "sha512-5YgH9UJd7wVb9hIouI2adWpgqrrICkt070Dnj8EUY1+B4B2P9eRLPAkAAo6NICA7CEhOIeBHl46u9zSNpNu7zA==",
+      "dev": true,
+      "license": "BlueOak-1.0.0",
+      "engines": {
+        "node": "20 || >=22"
+      }
+    },
+    "node_modules/culori": {
+      "version": "4.0.2",
+      "resolved": "https://registry.npmjs.org/culori/-/culori-4.0.2.tgz",
+      "integrity": "sha512-1+BhOB8ahCn4O0cep0Sh2l9KCOfOdY+BXJnKMHFFzDEouSr/el18QwXEMRlOj9UY5nCeA8UN3a/82rUWRBeyBw==",
+      "license": "MIT",
+      "engines": {
+        "node": "^12.20.0 || ^14.13.1 || >=16.0.0"
+      }
+    },
+    "node_modules/data-urls": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/data-urls/-/data-urls-6.0.1.tgz",
+      "integrity": "sha512-euIQENZg6x8mj3fO6o9+fOW8MimUI4PpD/fZBhJfeioZVy9TUpM4UY7KjQNVZFlqwJ0UdzRDzkycB997HEq1BQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "whatwg-mimetype": "^5.0.0",
+        "whatwg-url": "^15.1.0"
+      },
+      "engines": {
+        "node": ">=20"
+      }
+    },
+    "node_modules/data-urls/node_modules/whatwg-mimetype": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/whatwg-mimetype/-/whatwg-mimetype-5.0.0.tgz",
+      "integrity": "sha512-sXcNcHOC51uPGF0P/D4NVtrkjSU2fNsm9iog4ZvZJsL3rjoDAzXZhkm2MWt1y+PUdggKAYVoMAIYcs78wJ51Cw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=20"
+      }
+    },
+    "node_modules/datatables.net": {
+      "version": "2.3.8",
+      "resolved": "https://registry.npmjs.org/datatables.net/-/datatables.net-2.3.8.tgz",
+      "integrity": "sha512-uhViowhlDlheAuo5a8TrkQqADsjrtGeOyvrigvr4t0+K3MyAWqClORXWAYIcN9VLX6iIX0C8O9gwJNd01hITRg==",
+      "license": "MIT",
+      "dependencies": {
+        "jquery": ">=1.7"
+      }
+    },
+    "node_modules/datatables.net-dt": {
+      "version": "2.3.8",
+      "resolved": "https://registry.npmjs.org/datatables.net-dt/-/datatables.net-dt-2.3.8.tgz",
+      "integrity": "sha512-GD4on0YvNlUS/l+mrXeA1OC2JDzF2/GGbehVv4AacwtiFaoTwqxZseiR0cED6w59u/lgpVrZRC2RwuubUX996Q==",
+      "license": "MIT",
+      "dependencies": {
+        "datatables.net": "2.3.8",
+        "jquery": ">=1.7"
+      }
+    },
+    "node_modules/debug": {
+      "version": "4.4.3",
+      "resolved": "https://registry.npmjs.org/debug/-/debug-4.4.3.tgz",
+      "integrity": "sha512-RGwwWnwQvkVfavKVt22FGLw+xYSdzARwm0ru6DhTVA3umU5hZc28V3kO4stgYryrTlLpuvgI9GiijltAjNbcqA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ms": "^2.1.3"
+      },
+      "engines": {
+        "node": ">=6.0"
+      },
+      "peerDependenciesMeta": {
+        "supports-color": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/decimal.js": {
+      "version": "10.6.0",
+      "resolved": "https://registry.npmjs.org/decimal.js/-/decimal.js-10.6.0.tgz",
+      "integrity": "sha512-YpgQiITW3JXGntzdUmyUR1V812Hn8T1YVXhCu+wO3OpS4eU9l4YdD3qjyiKdV6mvV29zapkMeD390UVEf2lkUg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/deep-is": {
+      "version": "0.1.4",
+      "resolved": "https://registry.npmjs.org/deep-is/-/deep-is-0.1.4.tgz",
+      "integrity": "sha512-oIPzksmTg4/MriiaYGO+okXDT7ztn/w3Eptv/+gSIdMdKsJo0u4CfYNFJPy+4SKMuCqGw2wxnA+URMg3t8a/bQ==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/depd": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/depd/-/depd-2.0.0.tgz",
+      "integrity": "sha512-g7nH6P6dyDioJogAAGprGpCtVImJhpPk/roCzdb3fIh61/s/nPsfR6onyMwkCAR/OlC3yBC0lESvUoQEAssIrw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/dependency-graph": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/dependency-graph/-/dependency-graph-1.0.0.tgz",
+      "integrity": "sha512-cW3gggJ28HZ/LExwxP2B++aiKxhJXMSIt9K48FOXQkm+vuG5gyatXnLsONRJdzO/7VfjDIiaOOa/bs4l464Lwg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=4"
+      }
+    },
+    "node_modules/detect-libc": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/detect-libc/-/detect-libc-2.1.2.tgz",
+      "integrity": "sha512-Btj2BOOO83o3WyH59e8MgXsxEQVcarkUOpEYrubB0urwnN10yQ364rsiByU11nZlqWYZm05i/of7io4mzihBtQ==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/dom-serializer": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/dom-serializer/-/dom-serializer-2.0.0.tgz",
+      "integrity": "sha512-wIkAryiqt/nV5EQKqQpo3SToSOV9J0DnbJqwK7Wv/Trc92zIAYZ4FlMu+JPFW1DfGFt81ZTCGgDEabffXeLyJg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "domelementtype": "^2.3.0",
+        "domhandler": "^5.0.2",
+        "entities": "^4.2.0"
+      },
+      "funding": {
+        "url": "https://github.com/cheeriojs/dom-serializer?sponsor=1"
+      }
+    },
+    "node_modules/domelementtype": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-2.3.0.tgz",
+      "integrity": "sha512-OLETBj6w0OsagBwdXnPdN0cnMfF9opN69co+7ZrbfPGrdpPVNBUj02spi6B1N7wChLQiPn4CSH/zJvXw56gmHw==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/fb55"
+        }
+      ],
+      "license": "BSD-2-Clause"
+    },
+    "node_modules/domhandler": {
+      "version": "5.0.3",
+      "resolved": "https://registry.npmjs.org/domhandler/-/domhandler-5.0.3.tgz",
+      "integrity": "sha512-cgwlv/1iFQiFnU96XXgROh8xTeetsnJiDsTc7TYCLFd9+/WNkIqPTxiM/8pSd8VIrhXGTf1Ny1q1hquVqDJB5w==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "dependencies": {
+        "domelementtype": "^2.3.0"
+      },
+      "engines": {
+        "node": ">= 4"
+      },
+      "funding": {
+        "url": "https://github.com/fb55/domhandler?sponsor=1"
+      }
+    },
+    "node_modules/domutils": {
+      "version": "3.2.2",
+      "resolved": "https://registry.npmjs.org/domutils/-/domutils-3.2.2.tgz",
+      "integrity": "sha512-6kZKyUajlDuqlHKVX1w7gyslj9MPIXzIFiz/rGu35uC1wMi+kMhQwGhl4lt9unC9Vb9INnY9Z3/ZA3+FhASLaw==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "dependencies": {
+        "dom-serializer": "^2.0.0",
+        "domelementtype": "^2.3.0",
+        "domhandler": "^5.0.3"
+      },
+      "funding": {
+        "url": "https://github.com/fb55/domutils?sponsor=1"
+      }
+    },
+    "node_modules/dropzone": {
+      "version": "6.0.0-beta.2",
+      "resolved": "https://registry.npmjs.org/dropzone/-/dropzone-6.0.0-beta.2.tgz",
+      "integrity": "sha512-k44yLuFFhRk53M8zP71FaaNzJYIzr99SKmpbO/oZKNslDjNXQsBTdfLs+iONd0U0L94zzlFzRnFdqbLcs7h9fQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@swc/helpers": "^0.2.13",
+        "just-extend": "^5.0.0"
+      }
+    },
+    "node_modules/dunder-proto": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/dunder-proto/-/dunder-proto-1.0.1.tgz",
+      "integrity": "sha512-KIN/nDJBQRcXw0MLVhZE9iQHmG68qAVIBg9CqmUYjmQIhgij9U5MFvrqkUL5FbtyyzZuOeOt0zdeRe4UY7ct+A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind-apply-helpers": "^1.0.1",
+        "es-errors": "^1.3.0",
+        "gopd": "^1.2.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/echarts": {
+      "version": "6.1.0",
+      "resolved": "https://registry.npmjs.org/echarts/-/echarts-6.1.0.tgz",
+      "integrity": "sha512-q0yaFPggC9FUdsWH4blavRWFmxdrIodbkoKNAjJudAI6CA9gNPxHtV2RcZNEepZVlk4yvBYkOkbk6HIVpIyHZA==",
+      "license": "Apache-2.0",
+      "peer": true,
+      "dependencies": {
+        "tslib": "2.3.0",
+        "zrender": "6.1.0"
+      }
+    },
+    "node_modules/echarts/node_modules/tslib": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.3.0.tgz",
+      "integrity": "sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg==",
+      "license": "0BSD",
+      "peer": true
+    },
+    "node_modules/ee-first": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/ee-first/-/ee-first-1.1.1.tgz",
+      "integrity": "sha512-WMwm9LhRUo+WUaRN+vRuETqG89IgZphVSNkdFgeb6sS/E4OrDIN7t48CAewSHXc6C8lefD8KKfr5vY61brQlow==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/electron-to-chromium": {
+      "version": "1.5.361",
+      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.5.361.tgz",
+      "integrity": "sha512-Q6Hts7N9FnJc5LeGRINFvLhCI9xZmNtTDe5ZbcVezQz7cU4a8Aua3GH1b8J2XY8Al9PF+OCwYqhgsOOheMdvkA==",
+      "dev": true,
+      "license": "ISC"
+    },
+    "node_modules/emoji-regex": {
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-8.0.0.tgz",
+      "integrity": "sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==",
+      "license": "MIT"
+    },
+    "node_modules/encodeurl": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/encodeurl/-/encodeurl-2.0.0.tgz",
+      "integrity": "sha512-Q0n9HRi4m6JuGIV1eFlmvJB7ZEVxu93IrMyiMsGC0lrMJMWzRgx6WGquyfQgZVb31vhGgXnfmPNNXmxnOkRBrg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/enhanced-resolve": {
+      "version": "5.22.0",
+      "resolved": "https://registry.npmjs.org/enhanced-resolve/-/enhanced-resolve-5.22.0.tgz",
+      "integrity": "sha512-xYcDWrpELkFzz9SpZ3PlI6Eu6eD93Yf0WLDRxikGhWJ3MAir2SNZTIVCVZqZ/NUyx8AdMc2gT9C0gPiw18kG+A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "graceful-fs": "^4.2.4",
+        "tapable": "^2.3.3"
+      },
+      "engines": {
+        "node": ">=10.13.0"
+      }
+    },
+    "node_modules/entities": {
+      "version": "4.5.0",
+      "resolved": "https://registry.npmjs.org/entities/-/entities-4.5.0.tgz",
+      "integrity": "sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "engines": {
+        "node": ">=0.12"
+      },
+      "funding": {
+        "url": "https://github.com/fb55/entities?sponsor=1"
+      }
+    },
+    "node_modules/env-paths": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/env-paths/-/env-paths-2.2.1.tgz",
+      "integrity": "sha512-+h1lkLKhZMTYjog1VEpJNG7NZJWcuc2DDk/qsqSTRRCOXiLjeQ1d1/udrUGhqMxUgAlwKNZ0cf2uqan5GLuS2A==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/environment": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/environment/-/environment-1.1.0.tgz",
+      "integrity": "sha512-xUtoPkMggbz0MPyPiIWr1Kp4aeWJjDZ6SMvURhimjdZgsRuDplF5/s9hcgGhyXMhs+6vpnuoiZ2kFiu3FMnS8Q==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/err-code": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/err-code/-/err-code-2.0.3.tgz",
+      "integrity": "sha512-2bmlRpNKBxT/CRmPOlyISQpNj+qSeYvcym/uT0Jx2bMOlKLtSy1ZmLuVxSEKKyor/N5yhvp/ZiG1oE3DEYMSFA==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/es-define-property": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/es-define-property/-/es-define-property-1.0.1.tgz",
+      "integrity": "sha512-e3nRfgfUZ4rNGL232gUgX06QNyyez04KdjFrF+LTRoOXmrOgFKDg4BCdsjW8EnT69eqdYGmRpJwiPVYNrCaW3g==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/es-errors": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/es-errors/-/es-errors-1.3.0.tgz",
+      "integrity": "sha512-Zf5H2Kxt2xjTvbJvP2ZWLEICxA6j+hAmMzIlypy4xcBg1vKVnx89Wy0GbS+kf5cwCVFFzdCFh2XSCFNULS6csw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/es-module-lexer": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/es-module-lexer/-/es-module-lexer-2.1.0.tgz",
+      "integrity": "sha512-n27zTYMjYu1aj4MjCWzSP7G9r75utsaoc8m61weK+W8JMBGGQybd43GstCXZ3WNmSFtGT9wi59qQTW6mhTR5LQ==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/es-object-atoms": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/es-object-atoms/-/es-object-atoms-1.1.2.tgz",
+      "integrity": "sha512-HWcBoN6NileqtSydK2FqHbS/LoDd2pqrnQHLyJzBj4kOp/ky2MWMN694xOfkK8/SnUsW2DH7EfyVlydKCsm1Zw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/es-toolkit": {
+      "version": "1.46.1",
+      "resolved": "https://registry.npmjs.org/es-toolkit/-/es-toolkit-1.46.1.tgz",
+      "integrity": "sha512-5eNtXOs3tbfxXOj04tjjseeWkRWaoCjdEI+96DgwzZoe6c9juL49pXlzAFTI72aWC9Y8p7168g6XIKjh7k6pyQ==",
+      "license": "MIT",
+      "workspaces": [
+        "docs",
+        "benchmarks"
+      ]
+    },
+    "node_modules/esbuild": {
+      "version": "0.27.3",
+      "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.27.3.tgz",
+      "integrity": "sha512-8VwMnyGCONIs6cWue2IdpHxHnAjzxnw2Zr7MkVxB2vjmQ2ivqGFb4LEG3SMnv0Gb2F/G/2yA8zUaiL1gywDCCg==",
+      "dev": true,
+      "hasInstallScript": true,
+      "license": "MIT",
+      "bin": {
+        "esbuild": "bin/esbuild"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "optionalDependencies": {
+        "@esbuild/aix-ppc64": "0.27.3",
+        "@esbuild/android-arm": "0.27.3",
+        "@esbuild/android-arm64": "0.27.3",
+        "@esbuild/android-x64": "0.27.3",
+        "@esbuild/darwin-arm64": "0.27.3",
+        "@esbuild/darwin-x64": "0.27.3",
+        "@esbuild/freebsd-arm64": "0.27.3",
+        "@esbuild/freebsd-x64": "0.27.3",
+        "@esbuild/linux-arm": "0.27.3",
+        "@esbuild/linux-arm64": "0.27.3",
+        "@esbuild/linux-ia32": "0.27.3",
+        "@esbuild/linux-loong64": "0.27.3",
+        "@esbuild/linux-mips64el": "0.27.3",
+        "@esbuild/linux-ppc64": "0.27.3",
+        "@esbuild/linux-riscv64": "0.27.3",
+        "@esbuild/linux-s390x": "0.27.3",
+        "@esbuild/linux-x64": "0.27.3",
+        "@esbuild/netbsd-arm64": "0.27.3",
+        "@esbuild/netbsd-x64": "0.27.3",
+        "@esbuild/openbsd-arm64": "0.27.3",
+        "@esbuild/openbsd-x64": "0.27.3",
+        "@esbuild/openharmony-arm64": "0.27.3",
+        "@esbuild/sunos-x64": "0.27.3",
+        "@esbuild/win32-arm64": "0.27.3",
+        "@esbuild/win32-ia32": "0.27.3",
+        "@esbuild/win32-x64": "0.27.3"
+      }
+    },
+    "node_modules/escalade": {
+      "version": "3.2.0",
+      "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.2.0.tgz",
+      "integrity": "sha512-WUj2qlxaQtO4g6Pq5c29GTcWGDyd8itL8zTlipgECz3JesAiiOKotd8JU6otB3PACgG6xkJUyVhboMS+bje/jA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/escape-html": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/escape-html/-/escape-html-1.0.3.tgz",
+      "integrity": "sha512-NiSupZ4OeuGwr68lGIeym/ksIZMJodUGOSCZ/FSnTxcrekbvqrgdUxlJOMpijaKZVjAJrWrGs/6Jy8OMuyj9ow==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/escape-string-regexp": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/escape-string-regexp/-/escape-string-regexp-4.0.0.tgz",
+      "integrity": "sha512-TtpcNJ3XAzx3Gq8sWRzJaVajRs0uVxA2YAkdb1jm2YkPz4G6egUFAyA3n5vtEIZefPk5Wa4UXbKuS5fKkJWdgA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/eslint": {
+      "version": "10.7.0",
+      "resolved": "https://registry.npmjs.org/eslint/-/eslint-10.7.0.tgz",
+      "integrity": "sha512-GVTD7s1vdIl6UYvAfriOPeY1Df8LIZjfofLvHwde+erDHGGuHyuM6xoxRxmHiebhYuD2p1vN4wWh0XzPARSGDQ==",
+      "dev": true,
+      "license": "MIT",
+      "workspaces": [
+        "packages/*"
+      ],
+      "dependencies": {
+        "@eslint-community/eslint-utils": "^4.8.0",
+        "@eslint-community/regexpp": "^4.12.2",
+        "@eslint/config-array": "^0.23.5",
+        "@eslint/config-helpers": "^0.6.0",
+        "@eslint/core": "^1.2.1",
+        "@eslint/plugin-kit": "^0.7.2",
+        "@humanfs/node": "^0.16.6",
+        "@humanwhocodes/module-importer": "^1.0.1",
+        "@humanwhocodes/retry": "^0.4.2",
+        "@types/estree": "^1.0.6",
+        "ajv": "^6.14.0",
+        "cross-spawn": "^7.0.6",
+        "debug": "^4.3.2",
+        "escape-string-regexp": "^4.0.0",
+        "eslint-scope": "^9.1.2",
+        "eslint-visitor-keys": "^5.0.1",
+        "espree": "^11.2.0",
+        "esquery": "^1.7.0",
+        "esutils": "^2.0.2",
+        "fast-deep-equal": "^3.1.3",
+        "file-entry-cache": "^8.0.0",
+        "find-up": "^5.0.0",
+        "glob-parent": "^6.0.2",
+        "ignore": "^5.2.0",
+        "imurmurhash": "^0.1.4",
+        "is-glob": "^4.0.0",
+        "json-stable-stringify-without-jsonify": "^1.0.1",
+        "minimatch": "^10.2.4",
+        "natural-compare": "^1.4.0",
+        "optionator": "^0.9.3"
+      },
+      "bin": {
+        "eslint": "bin/eslint.js"
+      },
+      "engines": {
+        "node": "^20.19.0 || ^22.13.0 || >=24"
+      },
+      "funding": {
+        "url": "https://eslint.org/donate"
+      },
+      "peerDependencies": {
+        "jiti": "*"
+      },
+      "peerDependenciesMeta": {
+        "jiti": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/eslint-scope": {
+      "version": "9.1.2",
+      "resolved": "https://registry.npmjs.org/eslint-scope/-/eslint-scope-9.1.2.tgz",
+      "integrity": "sha512-xS90H51cKw0jltxmvmHy2Iai1LIqrfbw57b79w/J7MfvDfkIkFZ+kj6zC3BjtUwh150HsSSdxXZcsuv72miDFQ==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "dependencies": {
+        "@types/esrecurse": "^4.3.1",
+        "@types/estree": "^1.0.8",
+        "esrecurse": "^4.3.0",
+        "estraverse": "^5.2.0"
+      },
+      "engines": {
+        "node": "^20.19.0 || ^22.13.0 || >=24"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      }
+    },
+    "node_modules/eslint-visitor-keys": {
+      "version": "3.4.3",
+      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-3.4.3.tgz",
+      "integrity": "sha512-wpc+LXeiyiisxPlEkUzU6svyS1frIO3Mgxj1fdy7Pm8Ygzguax2N3Fa/D/ag1WqbOprdI+uY6wMUl8/a2G+iag==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      }
+    },
+    "node_modules/eslint/node_modules/ajv": {
+      "version": "6.15.0",
+      "resolved": "https://registry.npmjs.org/ajv/-/ajv-6.15.0.tgz",
+      "integrity": "sha512-fgFx7Hfoq60ytK2c7DhnF8jIvzYgOMxfugjLOSMHjLIPgenqa7S7oaagATUq99mV6IYvN2tRmC0wnTYX6iPbMw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "fast-deep-equal": "^3.1.1",
+        "fast-json-stable-stringify": "^2.0.0",
+        "json-schema-traverse": "^0.4.1",
+        "uri-js": "^4.2.2"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/epoberezkin"
+      }
+    },
+    "node_modules/eslint/node_modules/eslint-visitor-keys": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-5.0.1.tgz",
+      "integrity": "sha512-tD40eHxA35h0PEIZNeIjkHoDR4YjjJp34biM0mDvplBe//mB+IHCqHDGV7pxF+7MklTvighcCPPZC7ynWyjdTA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": "^20.19.0 || ^22.13.0 || >=24"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      }
+    },
+    "node_modules/eslint/node_modules/glob-parent": {
+      "version": "6.0.2",
+      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-6.0.2.tgz",
+      "integrity": "sha512-XxwI8EOhVQgWp6iDL+3b0r86f4d6AX6zSU55HfB4ydCEuXLXc5FcYeOu+nnGftS4TEju/11rt4KJPTMgbfmv4A==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "is-glob": "^4.0.3"
+      },
+      "engines": {
+        "node": ">=10.13.0"
+      }
+    },
+    "node_modules/eslint/node_modules/ignore": {
+      "version": "5.3.2",
+      "resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.2.tgz",
+      "integrity": "sha512-hsBTNUqQTDwkWtcdYI2i06Y/nUBEsNEDJKjWdigLvegy8kDuJAS8uRlpkkcQpyEXL0Z/pjDy5HBmMjRCJ2gq+g==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 4"
+      }
+    },
+    "node_modules/eslint/node_modules/json-schema-traverse": {
+      "version": "0.4.1",
+      "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz",
+      "integrity": "sha512-xbbCH5dCYU5T8LcEhhuh7HJ88HXuW3qsI3Y0zOZFKfZEHcpWiHU/Jxzk629Brsab/mMiHQti9wMP+845RPe3Vg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/espree": {
+      "version": "11.2.0",
+      "resolved": "https://registry.npmjs.org/espree/-/espree-11.2.0.tgz",
+      "integrity": "sha512-7p3DrVEIopW1B1avAGLuCSh1jubc01H2JHc8B4qqGblmg5gI9yumBgACjWo4JlIc04ufug4xJ3SQI8HkS/Rgzw==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "dependencies": {
+        "acorn": "^8.16.0",
+        "acorn-jsx": "^5.3.2",
+        "eslint-visitor-keys": "^5.0.1"
+      },
+      "engines": {
+        "node": "^20.19.0 || ^22.13.0 || >=24"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      }
+    },
+    "node_modules/espree/node_modules/eslint-visitor-keys": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-5.0.1.tgz",
+      "integrity": "sha512-tD40eHxA35h0PEIZNeIjkHoDR4YjjJp34biM0mDvplBe//mB+IHCqHDGV7pxF+7MklTvighcCPPZC7ynWyjdTA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": "^20.19.0 || ^22.13.0 || >=24"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      }
+    },
+    "node_modules/esquery": {
+      "version": "1.7.0",
+      "resolved": "https://registry.npmjs.org/esquery/-/esquery-1.7.0.tgz",
+      "integrity": "sha512-Ap6G0WQwcU/LHsvLwON1fAQX9Zp0A2Y6Y/cJBl9r/JbW90Zyg4/zbG6zzKa2OTALELarYHmKu0GhpM5EO+7T0g==",
+      "dev": true,
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "estraverse": "^5.1.0"
+      },
+      "engines": {
+        "node": ">=0.10"
+      }
+    },
+    "node_modules/esrecurse": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/esrecurse/-/esrecurse-4.3.0.tgz",
+      "integrity": "sha512-KmfKL3b6G+RXvP8N1vr3Tq1kL/oCFgn2NYXEtqP8/L3pKapUA4G8cFVaoF3SU323CD4XypR/ffioHmkti6/Tag==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "dependencies": {
+        "estraverse": "^5.2.0"
+      },
+      "engines": {
+        "node": ">=4.0"
+      }
+    },
+    "node_modules/estraverse": {
+      "version": "5.3.0",
+      "resolved": "https://registry.npmjs.org/estraverse/-/estraverse-5.3.0.tgz",
+      "integrity": "sha512-MMdARuVEQziNTeJD8DgMqmhwR11BRQ/cBP+pLtYdSTnf3MIO8fFeiINEbX36ZdNlfU/7A9f3gUw49B3oQsvwBA==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "engines": {
+        "node": ">=4.0"
+      }
+    },
+    "node_modules/estree-walker": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/estree-walker/-/estree-walker-3.0.3.tgz",
+      "integrity": "sha512-7RUKfXgSMMkzt6ZuXmqapOurLGPPfgj6l9uRZ7lRGolvk0y2yocc35LdcxKC5PQZdn2DMqioAQ2NoWcrTKmm6g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@types/estree": "^1.0.0"
+      }
+    },
+    "node_modules/esutils": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/esutils/-/esutils-2.0.3.tgz",
+      "integrity": "sha512-kVscqXk4OCp68SZ0dkgEKVi6/8ij300KBWTJq32P/dYeWTSwK41WyTxalN1eRmA5Z9UU/LX9D7FWSmV9SAYx6g==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/etag": {
+      "version": "1.8.1",
+      "resolved": "https://registry.npmjs.org/etag/-/etag-1.8.1.tgz",
+      "integrity": "sha512-aIL5Fx7mawVa300al2BnEE4iNvo1qETxLrPI/o05L7z6go7fCw1J6EQmbK4FmJ2AS7kgVF/KEZWufBfdClMcPg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/eventemitter3": {
+      "version": "5.0.4",
+      "resolved": "https://registry.npmjs.org/eventemitter3/-/eventemitter3-5.0.4.tgz",
+      "integrity": "sha512-mlsTRyGaPBjPedk6Bvw+aqbsXDtoAyAzm5MO7JgU+yVRyMQ5O8bD4Kcci7BS85f93veegeCPkL8R4GLClnjLFw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/eventsource": {
+      "version": "3.0.7",
+      "resolved": "https://registry.npmjs.org/eventsource/-/eventsource-3.0.7.tgz",
+      "integrity": "sha512-CRT1WTyuQoD771GW56XEZFQ/ZoSfWid1alKGDYMmkt2yl8UXrVR4pspqWNEcqKvVIzg6PAltWjxcSSPrboA4iA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "eventsource-parser": "^3.0.1"
+      },
+      "engines": {
+        "node": ">=18.0.0"
+      }
+    },
+    "node_modules/eventsource-parser": {
+      "version": "3.0.8",
+      "resolved": "https://registry.npmjs.org/eventsource-parser/-/eventsource-parser-3.0.8.tgz",
+      "integrity": "sha512-70QWGkr4snxr0OXLRWsFLeRBIRPuQOvt4s8QYjmUlmlkyTZkRqS7EDVRZtzU3TiyDbXSzaOeF0XUKy8PchzukQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18.0.0"
+      }
+    },
+    "node_modules/expect-type": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/expect-type/-/expect-type-1.3.0.tgz",
+      "integrity": "sha512-knvyeauYhqjOYvQ66MznSMs83wmHrCycNEN6Ao+2AeYEfxUIkuiVxdEa1qlGEPK+We3n0THiDciYSsCcgW/DoA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=12.0.0"
+      }
+    },
+    "node_modules/exponential-backoff": {
+      "version": "3.1.3",
+      "resolved": "https://registry.npmjs.org/exponential-backoff/-/exponential-backoff-3.1.3.tgz",
+      "integrity": "sha512-ZgEeZXj30q+I0EN+CbSSpIyPaJ5HVQD18Z1m+u1FXbAeT94mr1zw50q4q6jiiC447Nl/YTcIYSAftiGqetwXCA==",
+      "dev": true,
+      "license": "Apache-2.0"
+    },
+    "node_modules/express": {
+      "version": "5.2.1",
+      "resolved": "https://registry.npmjs.org/express/-/express-5.2.1.tgz",
+      "integrity": "sha512-hIS4idWWai69NezIdRt2xFVofaF4j+6INOpJlVOLDO8zXGpUVEVzIYk12UUi2JzjEzWL3IOAxcTubgz9Po0yXw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "accepts": "^2.0.0",
+        "body-parser": "^2.2.1",
+        "content-disposition": "^1.0.0",
+        "content-type": "^1.0.5",
+        "cookie": "^0.7.1",
+        "cookie-signature": "^1.2.1",
+        "debug": "^4.4.0",
+        "depd": "^2.0.0",
+        "encodeurl": "^2.0.0",
+        "escape-html": "^1.0.3",
+        "etag": "^1.8.1",
+        "finalhandler": "^2.1.0",
+        "fresh": "^2.0.0",
+        "http-errors": "^2.0.0",
+        "merge-descriptors": "^2.0.0",
+        "mime-types": "^3.0.0",
+        "on-finished": "^2.4.1",
+        "once": "^1.4.0",
+        "parseurl": "^1.3.3",
+        "proxy-addr": "^2.0.7",
+        "qs": "^6.14.0",
+        "range-parser": "^1.2.1",
+        "router": "^2.2.0",
+        "send": "^1.1.0",
+        "serve-static": "^2.2.0",
+        "statuses": "^2.0.1",
+        "type-is": "^2.0.1",
+        "vary": "^1.1.2"
+      },
+      "engines": {
+        "node": ">= 18"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/express-rate-limit": {
+      "version": "8.5.2",
+      "resolved": "https://registry.npmjs.org/express-rate-limit/-/express-rate-limit-8.5.2.tgz",
+      "integrity": "sha512-5Kb34ipNX694DH48vN9irak1Qx30nb0PLYHXfJgw4YEjiC3ZEmZJhwOp+VfiCYwFzvFTdB9QkArYS5kXa2cx2A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ip-address": "^10.2.0"
+      },
+      "engines": {
+        "node": ">= 16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/express-rate-limit"
+      },
+      "peerDependencies": {
+        "express": ">= 4.11"
+      }
+    },
+    "node_modules/fast-deep-equal": {
+      "version": "3.1.3",
+      "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
+      "integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==",
+      "license": "MIT"
+    },
+    "node_modules/fast-json-stable-stringify": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/fast-json-stable-stringify/-/fast-json-stable-stringify-2.1.0.tgz",
+      "integrity": "sha512-lhd/wF+Lk98HZoTCtlVraHtfh5XYijIjalXck7saUtuanSDyLMxnHhSXEDJqHxD7msR8D0uCmqlkwjCV8xvwHw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/fast-levenshtein": {
+      "version": "2.0.6",
+      "resolved": "https://registry.npmjs.org/fast-levenshtein/-/fast-levenshtein-2.0.6.tgz",
+      "integrity": "sha512-DCXu6Ifhqcks7TZKY3Hxp3y6qphY5SJZmrWMDrKcERSOXWQdMhU9Ig/PYrzyw/ul9jOIyh0N4M0tbC5hodg8dw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/fast-uri": {
+      "version": "3.1.2",
+      "resolved": "https://registry.npmjs.org/fast-uri/-/fast-uri-3.1.2.tgz",
+      "integrity": "sha512-rVjf7ArG3LTk+FS6Yw81V1DLuZl1bRbNrev6Tmd/9RaroeeRRJhAt7jg/6YFxbvAQXUCavSoZhPPj6oOx+5KjQ==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/fastify"
+        },
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/fastify"
+        }
+      ],
+      "license": "BSD-3-Clause"
+    },
+    "node_modules/faye-websocket": {
+      "version": "0.11.4",
+      "resolved": "https://registry.npmjs.org/faye-websocket/-/faye-websocket-0.11.4.tgz",
+      "integrity": "sha512-CzbClwlXAuiRQAlUyfqPgvPoNKTckTPGfwZV4ZdAhVcP2lh9KUxJg2b5GkE7XbjKQ3YJnQ9z6D9ntLAlB+tP8g==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "websocket-driver": ">=0.5.1"
+      },
+      "engines": {
+        "node": ">=0.8.0"
+      }
+    },
+    "node_modules/fdir": {
+      "version": "6.5.0",
+      "resolved": "https://registry.npmjs.org/fdir/-/fdir-6.5.0.tgz",
+      "integrity": "sha512-tIbYtZbucOs0BRGqPJkshJUYdL+SDH7dVM8gjy+ERp3WAUjLEFJE+02kanyHtwjWOnwrKYBiwAmM0p4kLJAnXg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=12.0.0"
+      },
+      "peerDependencies": {
+        "picomatch": "^3 || ^4"
+      },
+      "peerDependenciesMeta": {
+        "picomatch": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/file-entry-cache": {
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/file-entry-cache/-/file-entry-cache-8.0.0.tgz",
+      "integrity": "sha512-XXTUwCvisa5oacNGRP9SfNtYBNAMi+RPwBFmblZEF7N7swHYQS6/Zfk7SRwx4D5j3CH211YNRco1DEMNVfZCnQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "flat-cache": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=16.0.0"
+      }
+    },
+    "node_modules/fill-range": {
+      "version": "7.1.1",
+      "resolved": "https://registry.npmjs.org/fill-range/-/fill-range-7.1.1.tgz",
+      "integrity": "sha512-YsGpe3WHLK8ZYi4tWDg2Jy3ebRz2rXowDxnld4bkQB00cc/1Zw9AWnC0i9ztDJitivtQvaI9KaLyKrc+hBW0yg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "to-regex-range": "^5.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/finalhandler": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/finalhandler/-/finalhandler-2.1.1.tgz",
+      "integrity": "sha512-S8KoZgRZN+a5rNwqTxlZZePjT/4cnm0ROV70LedRHZ0p8u9fRID0hJUZQpkKLzro8LfmC8sx23bY6tVNxv8pQA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "debug": "^4.4.0",
+        "encodeurl": "^2.0.0",
+        "escape-html": "^1.0.3",
+        "on-finished": "^2.4.1",
+        "parseurl": "^1.3.3",
+        "statuses": "^2.0.1"
+      },
+      "engines": {
+        "node": ">= 18.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/find-up": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/find-up/-/find-up-5.0.0.tgz",
+      "integrity": "sha512-78/PXT1wlLLDgTzDs7sjq9hzz0vXD+zn+7wypEe4fXQxCmdmqfGsEPQxmiCSQI3ajFV91bVSsvNtrJRiW6nGng==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "locate-path": "^6.0.0",
+        "path-exists": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/firebase": {
+      "version": "11.10.0",
+      "resolved": "https://registry.npmjs.org/firebase/-/firebase-11.10.0.tgz",
+      "integrity": "sha512-nKBXoDzF0DrXTBQJlZa+sbC5By99ysYU1D6PkMRYknm0nCW7rJly47q492Ht7Ndz5MeYSBuboKuhS1e6mFC03w==",
+      "license": "Apache-2.0",
+      "peer": true,
+      "dependencies": {
+        "@firebase/ai": "1.4.1",
+        "@firebase/analytics": "0.10.17",
+        "@firebase/analytics-compat": "0.2.23",
+        "@firebase/app": "0.13.2",
+        "@firebase/app-check": "0.10.1",
+        "@firebase/app-check-compat": "0.3.26",
+        "@firebase/app-compat": "0.4.2",
+        "@firebase/app-types": "0.9.3",
+        "@firebase/auth": "1.10.8",
+        "@firebase/auth-compat": "0.5.28",
+        "@firebase/data-connect": "0.3.10",
+        "@firebase/database": "1.0.20",
+        "@firebase/database-compat": "2.0.11",
+        "@firebase/firestore": "4.8.0",
+        "@firebase/firestore-compat": "0.3.53",
+        "@firebase/functions": "0.12.9",
+        "@firebase/functions-compat": "0.3.26",
+        "@firebase/installations": "0.6.18",
+        "@firebase/installations-compat": "0.2.18",
+        "@firebase/messaging": "0.12.22",
+        "@firebase/messaging-compat": "0.2.22",
+        "@firebase/performance": "0.7.7",
+        "@firebase/performance-compat": "0.2.20",
+        "@firebase/remote-config": "0.6.5",
+        "@firebase/remote-config-compat": "0.2.18",
+        "@firebase/storage": "0.13.14",
+        "@firebase/storage-compat": "0.3.24",
+        "@firebase/util": "1.12.1"
+      }
+    },
+    "node_modules/flat-cache": {
+      "version": "4.0.1",
+      "resolved": "https://registry.npmjs.org/flat-cache/-/flat-cache-4.0.1.tgz",
+      "integrity": "sha512-f7ccFPK3SXFHpx15UIGyRJ/FJQctuKZ0zVuN3frBo4HnK3cay9VEW0R6yPYFHC0AgqhukPzKjq22t5DmAyqGyw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "flatted": "^3.2.9",
+        "keyv": "^4.5.4"
+      },
+      "engines": {
+        "node": ">=16"
+      }
+    },
+    "node_modules/flatted": {
+      "version": "3.4.2",
+      "resolved": "https://registry.npmjs.org/flatted/-/flatted-3.4.2.tgz",
+      "integrity": "sha512-PjDse7RzhcPkIJwy5t7KPWQSZ9cAbzQXcafsetQoD7sOJRQlGikNbx7yZp2OotDnJyrDcbyRq3Ttb18iYOqkxA==",
+      "dev": true,
+      "license": "ISC"
+    },
+    "node_modules/forwarded": {
+      "version": "0.2.0",
+      "resolved": "https://registry.npmjs.org/forwarded/-/forwarded-0.2.0.tgz",
+      "integrity": "sha512-buRG0fpBtRHSTCOASe6hD258tEubFoRLb4ZNA6NxMVHNw2gOcwHo9wyablzMzOA5z9xA9L1KNjk/Nt6MT9aYow==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/fraction.js": {
+      "version": "5.3.4",
+      "resolved": "https://registry.npmjs.org/fraction.js/-/fraction.js-5.3.4.tgz",
+      "integrity": "sha512-1X1NTtiJphryn/uLQz3whtY6jK3fTqoE3ohKs0tT+Ujr1W59oopxmoEh7Lu5p6vBaPbgoM0bzveAW4Qi5RyWDQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "*"
+      },
+      "funding": {
+        "type": "github",
+        "url": "https://github.com/sponsors/rawify"
+      }
+    },
+    "node_modules/fresh": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/fresh/-/fresh-2.0.0.tgz",
+      "integrity": "sha512-Rx/WycZ60HOaqLKAi6cHRKKI7zxWbJ31MhntmtwMoaTeF7XFH9hhBp8vITaMidfljRQ6eYWCKkaTK+ykVJHP2A==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/fs-extra": {
+      "version": "11.3.5",
+      "resolved": "https://registry.npmjs.org/fs-extra/-/fs-extra-11.3.5.tgz",
+      "integrity": "sha512-eKpRKAovdpZtR1WopLHxlBWvAgPny3c4gX1G5Jhwmmw4XJj0ifSD5qB5TOo8hmA0wlRKDAOAhEE1yVPgs6Fgcg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "graceful-fs": "^4.2.0",
+        "jsonfile": "^6.0.1",
+        "universalify": "^2.0.0"
+      },
+      "engines": {
+        "node": ">=14.14"
+      }
+    },
+    "node_modules/fs-minipass": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/fs-minipass/-/fs-minipass-3.0.3.tgz",
+      "integrity": "sha512-XUBA9XClHbnJWSfBzjkm6RvPsyg3sryZt06BEQoXcF7EK/xpGaQYJgQKDJSUH5SGZ76Y7pFx1QBnXz09rU5Fbw==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "minipass": "^7.0.3"
+      },
+      "engines": {
+        "node": "^14.17.0 || ^16.13.0 || >=18.0.0"
+      }
+    },
+    "node_modules/fsevents": {
+      "version": "2.3.3",
+      "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.3.tgz",
+      "integrity": "sha512-5xoDfX+fL7faATnagmWPpbFtwh/R77WmMMqqHGS65C3vvB0YHrgF+B1YmZ3441tMj5n63k0212XNoJwzlhffQw==",
+      "dev": true,
+      "hasInstallScript": true,
+      "license": "MIT",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": "^8.16.0 || ^10.6.0 || >=11.0.0"
+      }
+    },
+    "node_modules/function-bind": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/function-bind/-/function-bind-1.1.2.tgz",
+      "integrity": "sha512-7XHNxH7qX9xG5mIwxkhumTox/MIRNcOgDrxWsMt2pAr23WHp6MrRlN7FBSFpCpr+oVO0F744iUgR82nJMfG2SA==",
+      "dev": true,
+      "license": "MIT",
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/gensync": {
+      "version": "1.0.0-beta.2",
+      "resolved": "https://registry.npmjs.org/gensync/-/gensync-1.0.0-beta.2.tgz",
+      "integrity": "sha512-3hN7NaskYvMDLQY55gnW3NQ+mesEAepTqlg+VEbj7zzqEMBVNhzcGYYeqFo/TlYz6eQiFcp1HcsCZO+nGgS8zg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6.9.0"
+      }
+    },
+    "node_modules/get-caller-file": {
+      "version": "2.0.5",
+      "resolved": "https://registry.npmjs.org/get-caller-file/-/get-caller-file-2.0.5.tgz",
+      "integrity": "sha512-DyFP3BM/3YHTQOCUL/w0OZHR0lpKeGrxotcHWcqNEdnltqFwXVfhEBQ94eIo34AfQpo0rGki4cyIiftY06h2Fg==",
+      "license": "ISC",
+      "engines": {
+        "node": "6.* || 8.* || >= 10.*"
+      }
+    },
+    "node_modules/get-east-asian-width": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/get-east-asian-width/-/get-east-asian-width-1.6.0.tgz",
+      "integrity": "sha512-QRbvDIbx6YklUe6RxeTeleMR0yv3cYH6PsPZHcnVn7xv7zO1BHN8r0XETu8n6Ye3Q+ahtSarc3WgtNWmehIBfA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/get-intrinsic": {
+      "version": "1.3.0",
+      "resolved": "https://registry.npmjs.org/get-intrinsic/-/get-intrinsic-1.3.0.tgz",
+      "integrity": "sha512-9fSjSaos/fRIVIp+xSJlE6lfwhES7LNtKaCBIamHsjr2na1BiABJPo0mOjjz8GJDURarmCPGqaiVg5mfjb98CQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bind-apply-helpers": "^1.0.2",
+        "es-define-property": "^1.0.1",
+        "es-errors": "^1.3.0",
+        "es-object-atoms": "^1.1.1",
+        "function-bind": "^1.1.2",
+        "get-proto": "^1.0.1",
+        "gopd": "^1.2.0",
+        "has-symbols": "^1.1.0",
+        "hasown": "^2.0.2",
+        "math-intrinsics": "^1.1.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/get-proto": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/get-proto/-/get-proto-1.0.1.tgz",
+      "integrity": "sha512-sTSfBjoXBp89JvIKIefqw7U2CCebsc74kiY6awiGogKtoSGbgjYE/G/+l9sF3MWFPNc9IcoOC4ODfKHfxFmp0g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "dunder-proto": "^1.0.1",
+        "es-object-atoms": "^1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/glob": {
+      "version": "13.0.6",
+      "resolved": "https://registry.npmjs.org/glob/-/glob-13.0.6.tgz",
+      "integrity": "sha512-Wjlyrolmm8uDpm/ogGyXZXb1Z+Ca2B8NbJwqBVg0axK9GbBeoS7yGV6vjXnYdGm6X53iehEuxxbyiKp8QmN4Vw==",
+      "dev": true,
+      "license": "BlueOak-1.0.0",
+      "dependencies": {
+        "minimatch": "^10.2.2",
+        "minipass": "^7.1.3",
+        "path-scurry": "^2.0.2"
+      },
+      "engines": {
+        "node": "18 || 20 || >=22"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
+    "node_modules/glob-parent": {
+      "version": "5.1.2",
+      "resolved": "https://registry.npmjs.org/glob-parent/-/glob-parent-5.1.2.tgz",
+      "integrity": "sha512-AOIgSQCepiJYwP3ARnGx+5VnTu2HBYdzbGP45eLw1vr3zB3vZLeyed1sC9hnbcOc9/SrMyM5RPQrkGz4aS9Zow==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "is-glob": "^4.0.1"
+      },
+      "engines": {
+        "node": ">= 6"
+      }
+    },
+    "node_modules/glob-to-regexp": {
+      "version": "0.4.1",
+      "resolved": "https://registry.npmjs.org/glob-to-regexp/-/glob-to-regexp-0.4.1.tgz",
+      "integrity": "sha512-lkX1HJXwyMcprw/5YUZc2s7DrpAiHB21/V+E1rHUrVNokkvB6bqMzT0VfV6/86ZNabt1k14YOIaT7nDvOX3Iiw==",
+      "dev": true,
+      "license": "BSD-2-Clause"
+    },
+    "node_modules/gopd": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/gopd/-/gopd-1.2.0.tgz",
+      "integrity": "sha512-ZUKRh6/kUFoAiTAtTYPZJ3hw9wNxx+BIBOijnlG9PnrJsCcSjs1wyyD6vJpaYtgnzDrKYRSqf3OO6Rfa93xsRg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/graceful-fs": {
+      "version": "4.2.11",
+      "resolved": "https://registry.npmjs.org/graceful-fs/-/graceful-fs-4.2.11.tgz",
+      "integrity": "sha512-RbJ5/jmFcNNCcDV5o9eTnBLJ/HszWV0P73bc+Ff4nS/rJj+YaS6IGyiOL0VoBYX+l1Wrl3k63h/KrH+nhJ0XvQ==",
+      "dev": true,
+      "license": "ISC"
+    },
+    "node_modules/gridjs": {
+      "version": "6.2.0",
+      "resolved": "https://registry.npmjs.org/gridjs/-/gridjs-6.2.0.tgz",
+      "integrity": "sha512-EAGGfHjyEXWh12Txs6DjTGnWTo226wbowtMrLI+yNZQaJpvs0m7yDcyM7r+D4RA7rZQVj/cfmwEaRz/rlxg8LA==",
+      "license": "MIT",
+      "dependencies": {
+        "preact": "^10.11.3"
+      }
+    },
+    "node_modules/has-symbols": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/has-symbols/-/has-symbols-1.1.0.tgz",
+      "integrity": "sha512-1cDNdwJ2Jaohmb3sg4OmKaMBwuC48sYni5HUw2DvsC8LjGTLK9h+eb1X6RyuOHe4hT0ULCW68iomhjUoKUqlPQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/hasown": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/hasown/-/hasown-2.0.3.tgz",
+      "integrity": "sha512-ej4AhfhfL2Q2zpMmLo7U1Uv9+PyhIZpgQLGT1F9miIGmiCJIoCgSmczFdrc97mWT4kVY72KA+WnnhJ5pghSvSg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "function-bind": "^1.1.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/hono": {
+      "version": "4.12.22",
+      "resolved": "https://registry.npmjs.org/hono/-/hono-4.12.22.tgz",
+      "integrity": "sha512-7fvVPbB92zNRsQke+uiRGwtTuef0tB2Dg4hWxYfFNvkQhIltWoyi0ONReM5LWA+jJWS3nfT5lTq+qbsIpX0IQw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=16.9.0"
+      }
+    },
+    "node_modules/hosted-git-info": {
+      "version": "9.0.3",
+      "resolved": "https://registry.npmjs.org/hosted-git-info/-/hosted-git-info-9.0.3.tgz",
+      "integrity": "sha512-Hc+ghLoSt6QaYZUv0WBiIvmMDZuZZ7oaDvdH8MbfOO4lOsxdXLEvuC6ePoGs9H1X9oCLyq6+NVN0MKqD+ydxyg==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "lru-cache": "^11.1.0"
+      },
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/hosted-git-info/node_modules/lru-cache": {
+      "version": "11.5.0",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-11.5.0.tgz",
+      "integrity": "sha512-5YgH9UJd7wVb9hIouI2adWpgqrrICkt070Dnj8EUY1+B4B2P9eRLPAkAAo6NICA7CEhOIeBHl46u9zSNpNu7zA==",
+      "dev": true,
+      "license": "BlueOak-1.0.0",
+      "engines": {
+        "node": "20 || >=22"
+      }
+    },
+    "node_modules/html-encoding-sniffer": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/html-encoding-sniffer/-/html-encoding-sniffer-6.0.0.tgz",
+      "integrity": "sha512-CV9TW3Y3f8/wT0BRFc1/KAVQ3TUHiXmaAb6VW9vtiMFf7SLoMd1PdAc4W3KFOFETBJUb90KatHqlsZMWV+R9Gg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@exodus/bytes": "^1.6.0"
+      },
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
+      }
+    },
+    "node_modules/htmlparser2": {
+      "version": "10.1.0",
+      "resolved": "https://registry.npmjs.org/htmlparser2/-/htmlparser2-10.1.0.tgz",
+      "integrity": "sha512-VTZkM9GWRAtEpveh7MSF6SjjrpNVNNVJfFup7xTY3UpFtm67foy9HDVXneLtFVt4pMz5kZtgNcvCniNFb1hlEQ==",
+      "dev": true,
+      "funding": [
+        "https://github.com/fb55/htmlparser2?sponsor=1",
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/fb55"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "domelementtype": "^2.3.0",
+        "domhandler": "^5.0.3",
+        "domutils": "^3.2.2",
+        "entities": "^7.0.1"
+      }
+    },
+    "node_modules/htmlparser2/node_modules/entities": {
+      "version": "7.0.1",
+      "resolved": "https://registry.npmjs.org/entities/-/entities-7.0.1.tgz",
+      "integrity": "sha512-TWrgLOFUQTH994YUyl1yT4uyavY5nNB5muff+RtWaqNVCAK408b5ZnnbNAUEWLTCpum9w6arT70i1XdQ4UeOPA==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "engines": {
+        "node": ">=0.12"
+      },
+      "funding": {
+        "url": "https://github.com/fb55/entities?sponsor=1"
+      }
+    },
+    "node_modules/http-cache-semantics": {
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/http-cache-semantics/-/http-cache-semantics-4.2.0.tgz",
+      "integrity": "sha512-dTxcvPXqPvXBQpq5dUr6mEMJX4oIEFv6bwom3FDwKRDsuIjjJGANqhBuoAn9c1RQJIdAKav33ED65E2ys+87QQ==",
+      "dev": true,
+      "license": "BSD-2-Clause"
+    },
+    "node_modules/http-errors": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/http-errors/-/http-errors-2.0.1.tgz",
+      "integrity": "sha512-4FbRdAX+bSdmo4AUFuS0WNiPz8NgFt+r8ThgNWmlrjQjt1Q7ZR9+zTlce2859x4KSXrwIsaeTqDoKQmtP8pLmQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "depd": "~2.0.0",
+        "inherits": "~2.0.4",
+        "setprototypeof": "~1.2.0",
+        "statuses": "~2.0.2",
+        "toidentifier": "~1.0.1"
+      },
+      "engines": {
+        "node": ">= 0.8"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/http-parser-js": {
+      "version": "0.5.10",
+      "resolved": "https://registry.npmjs.org/http-parser-js/-/http-parser-js-0.5.10.tgz",
+      "integrity": "sha512-Pysuw9XpUq5dVc/2SMHpuTY01RFl8fttgcyunjL7eEMhGM3cI4eOmiCycJDVCo/7O7ClfQD3SaI6ftDzqOXYMA==",
+      "license": "MIT"
+    },
+    "node_modules/http-proxy-agent": {
+      "version": "7.0.2",
+      "resolved": "https://registry.npmjs.org/http-proxy-agent/-/http-proxy-agent-7.0.2.tgz",
+      "integrity": "sha512-T1gkAiYYDWYx3V5Bmyu7HcfcvL7mUrTWiM6yOfa3PIphViJ/gFPbvidQ+veqSOHci/PxBcDabeUNCzpOODJZig==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "agent-base": "^7.1.0",
+        "debug": "^4.3.4"
+      },
+      "engines": {
+        "node": ">= 14"
+      }
+    },
+    "node_modules/https-proxy-agent": {
+      "version": "7.0.6",
+      "resolved": "https://registry.npmjs.org/https-proxy-agent/-/https-proxy-agent-7.0.6.tgz",
+      "integrity": "sha512-vK9P5/iUfdl95AI+JVyUuIcVtd4ofvtrOr3HNtM2yxC9bnMbEdp3x01OhQNnjb8IJYi38VlTE3mBXwcfvywuSw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "agent-base": "^7.1.2",
+        "debug": "4"
+      },
+      "engines": {
+        "node": ">= 14"
+      }
+    },
+    "node_modules/iconv-lite": {
+      "version": "0.7.2",
+      "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.7.2.tgz",
+      "integrity": "sha512-im9DjEDQ55s9fL4EYzOAv0yMqmMBSZp6G0VvFyTMPKWxiSBHUj9NW/qqLmXUwXrrM7AvqSlTCfvqRb0cM8yYqw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "safer-buffer": ">= 2.1.2 < 3.0.0"
+      },
+      "engines": {
+        "node": ">=0.10.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/idb": {
+      "version": "7.1.1",
+      "resolved": "https://registry.npmjs.org/idb/-/idb-7.1.1.tgz",
+      "integrity": "sha512-gchesWBzyvGHRO9W8tzUWFDycow5gwjvFKfyV9FF32Y7F50yZMp7mP+T2mJIWFx49zicqyC4uefHM17o6xKIVQ==",
+      "license": "ISC"
+    },
+    "node_modules/ignore": {
+      "version": "7.0.5",
+      "resolved": "https://registry.npmjs.org/ignore/-/ignore-7.0.5.tgz",
+      "integrity": "sha512-Hs59xBNfUIunMFgWAbGX5cq6893IbWg4KnrjbYwX3tx0ztorVgTDA6B2sxf8ejHJ4wz8BqGUMYlnzNBer5NvGg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 4"
+      }
+    },
+    "node_modules/ignore-walk": {
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/ignore-walk/-/ignore-walk-8.0.0.tgz",
+      "integrity": "sha512-FCeMZT4NiRQGh+YkeKMtWrOmBgWjHjMJ26WQWrRQyoyzqevdaGSakUaJW5xQYmjLlUVk2qUnCjYVBax9EKKg8A==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "minimatch": "^10.0.3"
+      },
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/immutable": {
+      "version": "5.1.5",
+      "resolved": "https://registry.npmjs.org/immutable/-/immutable-5.1.5.tgz",
+      "integrity": "sha512-t7xcm2siw+hlUM68I+UEOK+z84RzmN59as9DZ7P1l0994DKUWV7UXBMQZVxaoMSRQ+PBZbHCOoBt7a2wxOMt+A==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/imurmurhash": {
+      "version": "0.1.4",
+      "resolved": "https://registry.npmjs.org/imurmurhash/-/imurmurhash-0.1.4.tgz",
+      "integrity": "sha512-JmXMZ6wuvDmLiHEml9ykzqO6lwFbof0GG4IkcGaENdCRDDmMVnny7s5HsIgHCbaq0w2MyPhDqkhTUgS2LU2PHA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.8.19"
+      }
+    },
+    "node_modules/inherits": {
+      "version": "2.0.4",
+      "resolved": "https://registry.npmjs.org/inherits/-/inherits-2.0.4.tgz",
+      "integrity": "sha512-k/vGaX4/Yla3WzyMCvTQOXYeIHvqOKtnqBduzTHpzpQZzAskKMhZ2K+EnBiSM9zGSoIFeMpXKxa4dYeZIQqewQ==",
+      "dev": true,
+      "license": "ISC"
+    },
+    "node_modules/ini": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/ini/-/ini-6.0.0.tgz",
+      "integrity": "sha512-IBTdIkzZNOpqm7q3dRqJvMaldXjDHWkEDfrwGEQTs5eaQMWV+djAhR+wahyNNMAa+qpbDUhBMVt4ZKNwpPm7xQ==",
+      "dev": true,
+      "license": "ISC",
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/ip-address": {
+      "version": "10.2.0",
+      "resolved": "https://registry.npmjs.org/ip-address/-/ip-address-10.2.0.tgz",
+      "integrity": "sha512-/+S6j4E9AHvW9SWMSEY9Xfy66O5PWvVEJ08O0y5JGyEKQpojb0K0GKpz/v5HJ/G0vi3D2sjGK78119oXZeE0qA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 12"
+      }
+    },
+    "node_modules/ipaddr.js": {
+      "version": "1.9.1",
+      "resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-1.9.1.tgz",
+      "integrity": "sha512-0KI/607xoxSToH7GjN1FfSbLoU0+btTicjsQSWQlh/hZykN8KpmMf7uYwPW3R+akZ6R/w18ZlXSHBYXiYUPO3g==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.10"
+      }
+    },
+    "node_modules/is-binary-path": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/is-binary-path/-/is-binary-path-2.1.0.tgz",
+      "integrity": "sha512-ZMERYes6pDydyuGidse7OsHxtbI7WVeUEozgR/g7rd0xUimYNlvZRE/K2MgZTjWy725IfelLeVcEM97mmtRGXw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "binary-extensions": "^2.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/is-extglob": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/is-extglob/-/is-extglob-2.1.1.tgz",
+      "integrity": "sha512-SbKbANkN603Vi4jEZv49LeVJMn4yGwsbzZworEoyEiutsN3nJYdbO36zfhGJ6QEDpOZIFkDtnq5JRxmvl3jsoQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/is-fullwidth-code-point": {
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-5.1.0.tgz",
+      "integrity": "sha512-5XHYaSyiqADb4RnZ1Bdad6cPp8Toise4TzEjcOYDHZkTCbKgiUl7WTUCpNWHuxmDt91wnsZBc9xinNzopv3JMQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "get-east-asian-width": "^1.3.1"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/is-glob": {
+      "version": "4.0.3",
+      "resolved": "https://registry.npmjs.org/is-glob/-/is-glob-4.0.3.tgz",
+      "integrity": "sha512-xelSayHH36ZgE7ZWhli7pW34hNbNl8Ojv5KVmkJD4hBdD3th8Tfk9vYasLM+mXWOZhFkgZfxhLSnrwRr4elSSg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "is-extglob": "^2.1.1"
+      },
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/is-interactive": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/is-interactive/-/is-interactive-2.0.0.tgz",
+      "integrity": "sha512-qP1vozQRI+BMOPcjFzrjXuQvdak2pHNUMZoeG2eRbiSqyvbEf/wQtEOTOX1guk6E3t36RkaqiSt8A/6YElNxLQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/is-number": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/is-number/-/is-number-7.0.0.tgz",
+      "integrity": "sha512-41Cifkg6e8TylSpdtTpeLVMqvSBEVzTttHvERD741+pnZ8ANv0004MRL43QKPDlK9cGvNp6NZWZUBlbGXYxxng==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.12.0"
+      }
+    },
+    "node_modules/is-potential-custom-element-name": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/is-potential-custom-element-name/-/is-potential-custom-element-name-1.0.1.tgz",
+      "integrity": "sha512-bCYeRA2rVibKZd+s2625gGnGF/t7DSqDs4dP7CrLA1m7jKWz6pps0LpYLJN8Q64HtmPKJ1hrN3nzPNKFEKOUiQ==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/is-promise": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/is-promise/-/is-promise-4.0.0.tgz",
+      "integrity": "sha512-hvpoI6korhJMnej285dSg6nu1+e6uxs7zG3BYAm5byqDsgJNWwxzM6z6iZiAgQR4TJ30JmBTOwqZUw3WlyH3AQ==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/is-unicode-supported": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/is-unicode-supported/-/is-unicode-supported-2.1.0.tgz",
+      "integrity": "sha512-mE00Gnza5EEB3Ds0HfMyllZzbBrmLOX3vfWoj9A9PEnTfratQ/BcaJOuMhnkhjXvb2+FkY3VuHqtAGpTPmglFQ==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/isexe": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/isexe/-/isexe-2.0.0.tgz",
+      "integrity": "sha512-RHxMLp9lnKHGHRng9QFhRCMbYAcVpn69smSGcq3f36xjgVVWThj4qqLbTLlq7Ssj8B+fIQ1EuCEGI2lKsyQeIw==",
+      "dev": true,
+      "license": "ISC"
+    },
+    "node_modules/istanbul-lib-coverage": {
+      "version": "3.2.2",
+      "resolved": "https://registry.npmjs.org/istanbul-lib-coverage/-/istanbul-lib-coverage-3.2.2.tgz",
+      "integrity": "sha512-O8dpsF+r0WV/8MNRKfnmrtCWhuKjxrq2w+jpzBL5UZKTi2LeVWnWOmWRxFlesJONmc+wLAGvKQZEOanko0LFTg==",
+      "dev": true,
+      "license": "BSD-3-Clause",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/istanbul-lib-instrument": {
+      "version": "6.0.3",
+      "resolved": "https://registry.npmjs.org/istanbul-lib-instrument/-/istanbul-lib-instrument-6.0.3.tgz",
+      "integrity": "sha512-Vtgk7L/R2JHyyGW07spoFlB8/lpjiOLTjMdms6AFMraYt3BaJauod/NGrfnVG/y4Ix1JEuMRPDPEj2ua+zz1/Q==",
+      "dev": true,
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "@babel/core": "^7.23.9",
+        "@babel/parser": "^7.23.9",
+        "@istanbuljs/schema": "^0.1.3",
+        "istanbul-lib-coverage": "^3.2.0",
+        "semver": "^7.5.4"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/jiti": {
+      "version": "2.7.0",
+      "resolved": "https://registry.npmjs.org/jiti/-/jiti-2.7.0.tgz",
+      "integrity": "sha512-AC/7JofJvZGrrneWNaEnJeOLUx+JlGt7tNa0wZiRPT4MY1wmfKjt2+6O2p2uz2+skll8OZZmJMNqeke7kKbNgQ==",
+      "dev": true,
+      "license": "MIT",
+      "bin": {
+        "jiti": "lib/jiti-cli.mjs"
+      }
+    },
+    "node_modules/jose": {
+      "version": "6.2.3",
+      "resolved": "https://registry.npmjs.org/jose/-/jose-6.2.3.tgz",
+      "integrity": "sha512-YYVDInQKFJfR/xa3ojUTl8c2KoTwiL1R5Wg9YCydwH0x0B9grbzlg5HC7mMjCtUJjbQ/YnGEZIhI5tCgfTb4Hw==",
+      "dev": true,
+      "license": "MIT",
+      "funding": {
+        "url": "https://github.com/sponsors/panva"
+      }
+    },
+    "node_modules/jquery": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/jquery/-/jquery-4.0.0.tgz",
+      "integrity": "sha512-TXCHVR3Lb6TZdtw1l3RTLf8RBWVGexdxL6AC8/e0xZKEpBflBsjh9/8LXw+dkNFuOyW9B7iB3O1sP7hS0Kiacg==",
+      "license": "MIT"
+    },
+    "node_modules/js-tokens": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
+      "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/jsdom": {
+      "version": "27.4.0",
+      "resolved": "https://registry.npmjs.org/jsdom/-/jsdom-27.4.0.tgz",
+      "integrity": "sha512-mjzqwWRD9Y1J1KUi7W97Gja1bwOOM5Ug0EZ6UDK3xS7j7mndrkwozHtSblfomlzyB4NepioNt+B2sOSzczVgtQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@acemir/cssom": "^0.9.28",
+        "@asamuzakjp/dom-selector": "^6.7.6",
+        "@exodus/bytes": "^1.6.0",
+        "cssstyle": "^5.3.4",
+        "data-urls": "^6.0.0",
+        "decimal.js": "^10.6.0",
+        "html-encoding-sniffer": "^6.0.0",
+        "http-proxy-agent": "^7.0.2",
+        "https-proxy-agent": "^7.0.6",
+        "is-potential-custom-element-name": "^1.0.1",
+        "parse5": "^8.0.0",
+        "saxes": "^6.0.0",
+        "symbol-tree": "^3.2.4",
+        "tough-cookie": "^6.0.0",
+        "w3c-xmlserializer": "^5.0.0",
+        "webidl-conversions": "^8.0.0",
+        "whatwg-mimetype": "^4.0.0",
+        "whatwg-url": "^15.1.0",
+        "ws": "^8.18.3",
+        "xml-name-validator": "^5.0.0"
+      },
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=24.0.0"
+      },
+      "peerDependencies": {
+        "canvas": "^3.0.0"
+      },
+      "peerDependenciesMeta": {
+        "canvas": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/jsesc": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-3.1.0.tgz",
+      "integrity": "sha512-/sM3dO2FOzXjKQhJuo0Q173wf2KOo8t4I8vHy6lF9poUp7bKT0/NHE8fPX23PwfhnykfqnC2xRxOnVw5XuGIaA==",
+      "dev": true,
+      "license": "MIT",
+      "bin": {
+        "jsesc": "bin/jsesc"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/json-buffer": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/json-buffer/-/json-buffer-3.0.1.tgz",
+      "integrity": "sha512-4bV5BfR2mqfQTJm+V5tPPdf+ZpuhiIvTuAB5g8kcrXOZpTT/QwwVRWBywX1ozr6lEuPdbHxwaJlm9G6mI2sfSQ==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/json-parse-even-better-errors": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/json-parse-even-better-errors/-/json-parse-even-better-errors-5.0.0.tgz",
+      "integrity": "sha512-ZF1nxZ28VhQouRWhUcVlUIN3qwSgPuswK05s/HIaoetAoE/9tngVmCHjSxmSQPav1nd+lPtTL0YZ/2AFdR/iYQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/json-schema-traverse": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-1.0.0.tgz",
+      "integrity": "sha512-NM8/P9n3XjXhIZn1lLhkFaACTOURQXjWhV4BA/RnOv8xvgqtqpAX9IO4mRQxSx1Rlo4tqzeqb0sOlruaOy3dug==",
+      "license": "MIT"
+    },
+    "node_modules/json-schema-typed": {
+      "version": "8.0.2",
+      "resolved": "https://registry.npmjs.org/json-schema-typed/-/json-schema-typed-8.0.2.tgz",
+      "integrity": "sha512-fQhoXdcvc3V28x7C7BMs4P5+kNlgUURe2jmUT1T//oBRMDrqy1QPelJimwZGo7Hg9VPV3EQV5Bnq4hbFy2vetA==",
+      "dev": true,
+      "license": "BSD-2-Clause"
+    },
+    "node_modules/json-stable-stringify-without-jsonify": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/json-stable-stringify-without-jsonify/-/json-stable-stringify-without-jsonify-1.0.1.tgz",
+      "integrity": "sha512-Bdboy+l7tA3OGW6FjyFHWkP5LuByj1Tk33Ljyq0axyzdk9//JSi2u3fP1QSmd1KNwq6VOKYGlAu87CisVir6Pw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/json5": {
+      "version": "2.2.3",
+      "resolved": "https://registry.npmjs.org/json5/-/json5-2.2.3.tgz",
+      "integrity": "sha512-XmOWe7eyHYH14cLdVPoyg+GOH3rYX++KpzrylJwSW98t3Nk+U8XOl8FWKOgwtzdb8lXGf6zYwDUzeHMWfxasyg==",
+      "dev": true,
+      "license": "MIT",
+      "bin": {
+        "json5": "lib/cli.js"
+      },
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/jsonc-parser": {
+      "version": "3.3.1",
+      "resolved": "https://registry.npmjs.org/jsonc-parser/-/jsonc-parser-3.3.1.tgz",
+      "integrity": "sha512-HUgH65KyejrUFPvHFPbqOY0rsFip3Bo5wb4ngvdi1EpCYWUQDC5V+Y7mZws+DLkr4M//zQJoanu1SP+87Dv1oQ==",
+      "license": "MIT"
+    },
+    "node_modules/jsonfile": {
+      "version": "6.2.1",
+      "resolved": "https://registry.npmjs.org/jsonfile/-/jsonfile-6.2.1.tgz",
+      "integrity": "sha512-zwOTdL3rFQ/lRdBnntKVOX6k5cKJwEc1HdilT71BWEu7J41gXIB2MRp+vxduPSwZJPWBxEzv4yH1wYLJGUHX4Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "universalify": "^2.0.0"
+      },
+      "optionalDependencies": {
+        "graceful-fs": "^4.1.6"
+      }
+    },
+    "node_modules/jsonparse": {
+      "version": "1.3.1",
+      "resolved": "https://registry.npmjs.org/jsonparse/-/jsonparse-1.3.1.tgz",
+      "integrity": "sha512-POQXvpdL69+CluYsillJ7SUhKvytYjW9vG/GKpnf+xP8UWgYEM/RaMzHHofbALDiKbbP1W8UEYmgGl39WkPZsg==",
+      "dev": true,
+      "engines": [
+        "node >= 0.2.0"
+      ],
+      "license": "MIT"
+    },
+    "node_modules/just-extend": {
+      "version": "5.1.1",
+      "resolved": "https://registry.npmjs.org/just-extend/-/just-extend-5.1.1.tgz",
+      "integrity": "sha512-b+z6yF1d4EOyDgylzQo5IminlUmzSeqR1hs/bzjBNjuGras4FXq/6TrzjxfN0j+TmI0ltJzTNlqXUMCniciwKQ==",
+      "license": "MIT"
+    },
+    "node_modules/keyv": {
+      "version": "4.5.4",
+      "resolved": "https://registry.npmjs.org/keyv/-/keyv-4.5.4.tgz",
+      "integrity": "sha512-oxVHkHR/EJf2CNXnWxRLW6mg7JyCCUcG0DtEGmL2ctUo1PNTin1PUil+r/+4r5MpVgC/fn1kjsx7mjSujKqIpw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "json-buffer": "3.0.1"
+      }
+    },
+    "node_modules/levn": {
+      "version": "0.4.1",
+      "resolved": "https://registry.npmjs.org/levn/-/levn-0.4.1.tgz",
+      "integrity": "sha512-+bT2uH4E5LGE7h/n3evcS/sQlJXCpIp6ym8OWJ5eV6+67Dsql/LaaT7qJBAt2rzfoa/5QBGBhxDix1dMt2kQKQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "prelude-ls": "^1.2.1",
+        "type-check": "~0.4.0"
+      },
+      "engines": {
+        "node": ">= 0.8.0"
+      }
+    },
+    "node_modules/lightningcss": {
+      "version": "1.32.0",
+      "resolved": "https://registry.npmjs.org/lightningcss/-/lightningcss-1.32.0.tgz",
+      "integrity": "sha512-NXYBzinNrblfraPGyrbPoD19C1h9lfI/1mzgWYvXUTe414Gz/X1FD2XBZSZM7rRTrMA8JL3OtAaGifrIKhQ5yQ==",
+      "dev": true,
+      "license": "MPL-2.0",
+      "dependencies": {
+        "detect-libc": "^2.0.3"
+      },
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      },
+      "optionalDependencies": {
+        "lightningcss-android-arm64": "1.32.0",
+        "lightningcss-darwin-arm64": "1.32.0",
+        "lightningcss-darwin-x64": "1.32.0",
+        "lightningcss-freebsd-x64": "1.32.0",
+        "lightningcss-linux-arm-gnueabihf": "1.32.0",
+        "lightningcss-linux-arm64-gnu": "1.32.0",
+        "lightningcss-linux-arm64-musl": "1.32.0",
+        "lightningcss-linux-x64-gnu": "1.32.0",
+        "lightningcss-linux-x64-musl": "1.32.0",
+        "lightningcss-win32-arm64-msvc": "1.32.0",
+        "lightningcss-win32-x64-msvc": "1.32.0"
+      }
+    },
+    "node_modules/lightningcss-android-arm64": {
+      "version": "1.32.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-android-arm64/-/lightningcss-android-arm64-1.32.0.tgz",
+      "integrity": "sha512-YK7/ClTt4kAK0vo6w3X+Pnm0D2cf2vPHbhOXdoNti1Ga0al1P4TBZhwjATvjNwLEBCnKvjJc2jQgHXH0NEwlAg==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "android"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-darwin-arm64": {
+      "version": "1.32.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-darwin-arm64/-/lightningcss-darwin-arm64-1.32.0.tgz",
+      "integrity": "sha512-RzeG9Ju5bag2Bv1/lwlVJvBE3q6TtXskdZLLCyfg5pt+HLz9BqlICO7LZM7VHNTTn/5PRhHFBSjk5lc4cmscPQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-darwin-x64": {
+      "version": "1.32.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-darwin-x64/-/lightningcss-darwin-x64-1.32.0.tgz",
+      "integrity": "sha512-U+QsBp2m/s2wqpUYT/6wnlagdZbtZdndSmut/NJqlCcMLTWp5muCrID+K5UJ6jqD2BFshejCYXniPDbNh73V8w==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "darwin"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-freebsd-x64": {
+      "version": "1.32.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-freebsd-x64/-/lightningcss-freebsd-x64-1.32.0.tgz",
+      "integrity": "sha512-JCTigedEksZk3tHTTthnMdVfGf61Fky8Ji2E4YjUTEQX14xiy/lTzXnu1vwiZe3bYe0q+SpsSH/CTeDXK6WHig==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "freebsd"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-linux-arm-gnueabihf": {
+      "version": "1.32.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-linux-arm-gnueabihf/-/lightningcss-linux-arm-gnueabihf-1.32.0.tgz",
+      "integrity": "sha512-x6rnnpRa2GL0zQOkt6rts3YDPzduLpWvwAF6EMhXFVZXD4tPrBkEFqzGowzCsIWsPjqSK+tyNEODUBXeeVHSkw==",
+      "cpu": [
+        "arm"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-linux-arm64-gnu": {
+      "version": "1.32.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-linux-arm64-gnu/-/lightningcss-linux-arm64-gnu-1.32.0.tgz",
+      "integrity": "sha512-0nnMyoyOLRJXfbMOilaSRcLH3Jw5z9HDNGfT/gwCPgaDjnx0i8w7vBzFLFR1f6CMLKF8gVbebmkUN3fa/kQJpQ==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-linux-arm64-musl": {
+      "version": "1.32.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-linux-arm64-musl/-/lightningcss-linux-arm64-musl-1.32.0.tgz",
+      "integrity": "sha512-UpQkoenr4UJEzgVIYpI80lDFvRmPVg6oqboNHfoH4CQIfNA+HOrZ7Mo7KZP02dC6LjghPQJeBsvXhJod/wnIBg==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-linux-x64-gnu": {
+      "version": "1.32.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-linux-x64-gnu/-/lightningcss-linux-x64-gnu-1.32.0.tgz",
+      "integrity": "sha512-V7Qr52IhZmdKPVr+Vtw8o+WLsQJYCTd8loIfpDaMRWGUZfBOYEJeyJIkqGIDMZPwPx24pUMfwSxxI8phr/MbOA==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-linux-x64-musl": {
+      "version": "1.32.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-linux-x64-musl/-/lightningcss-linux-x64-musl-1.32.0.tgz",
+      "integrity": "sha512-bYcLp+Vb0awsiXg/80uCRezCYHNg1/l3mt0gzHnWV9XP1W5sKa5/TCdGWaR/zBM2PeF/HbsQv/j2URNOiVuxWg==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "linux"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-win32-arm64-msvc": {
+      "version": "1.32.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-win32-arm64-msvc/-/lightningcss-win32-arm64-msvc-1.32.0.tgz",
+      "integrity": "sha512-8SbC8BR40pS6baCM8sbtYDSwEVQd4JlFTOlaD3gWGHfThTcABnNDBda6eTZeqbofalIJhFx0qKzgHJmcPTnGdw==",
+      "cpu": [
+        "arm64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lightningcss-win32-x64-msvc": {
+      "version": "1.32.0",
+      "resolved": "https://registry.npmjs.org/lightningcss-win32-x64-msvc/-/lightningcss-win32-x64-msvc-1.32.0.tgz",
+      "integrity": "sha512-Amq9B/SoZYdDi1kFrojnoqPLxYhQ4Wo5XiL8EVJrVsB8ARoC1PWW6VGtT0WKCemjy8aC+louJnjS7U18x3b06Q==",
+      "cpu": [
+        "x64"
+      ],
+      "dev": true,
+      "license": "MPL-2.0",
+      "optional": true,
+      "os": [
+        "win32"
+      ],
+      "engines": {
+        "node": ">= 12.0.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/parcel"
+      }
+    },
+    "node_modules/lilconfig": {
+      "version": "3.1.3",
+      "resolved": "https://registry.npmjs.org/lilconfig/-/lilconfig-3.1.3.tgz",
+      "integrity": "sha512-/vlFKAoH5Cgt3Ie+JLhRbwOsCQePABiU3tJ1egGvyQ+33R/vcwM2Zl2QR/LzjsBeItPt3oSVXapn+m4nQDvpzw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=14"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/antonk52"
+      }
+    },
+    "node_modules/listr2": {
+      "version": "9.0.5",
+      "resolved": "https://registry.npmjs.org/listr2/-/listr2-9.0.5.tgz",
+      "integrity": "sha512-ME4Fb83LgEgwNw96RKNvKV4VTLuXfoKudAmm2lP8Kk87KaMK0/Xrx/aAkMWmT8mDb+3MlFDspfbCs7adjRxA2g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "cli-truncate": "^5.0.0",
+        "colorette": "^2.0.20",
+        "eventemitter3": "^5.0.1",
+        "log-update": "^6.1.0",
+        "rfdc": "^1.4.1",
+        "wrap-ansi": "^9.0.0"
+      },
+      "engines": {
+        "node": ">=20.0.0"
+      }
+    },
+    "node_modules/listr2/node_modules/emoji-regex": {
+      "version": "10.6.0",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-10.6.0.tgz",
+      "integrity": "sha512-toUI84YS5YmxW219erniWD0CIVOo46xGKColeNQRgOzDorgBi1v4D71/OFzgD9GO2UGKIv1C3Sp8DAn0+j5w7A==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/listr2/node_modules/string-width": {
+      "version": "7.2.0",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-7.2.0.tgz",
+      "integrity": "sha512-tsaTIkKW9b4N+AEj+SVA+WhJzV7/zMhcSu78mLKWSk7cXMOSHsBKFWUs0fWwq8QyK3MgJBQRX6Gbi4kYbdvGkQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "emoji-regex": "^10.3.0",
+        "get-east-asian-width": "^1.0.0",
+        "strip-ansi": "^7.1.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/listr2/node_modules/wrap-ansi": {
+      "version": "9.0.2",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-9.0.2.tgz",
+      "integrity": "sha512-42AtmgqjV+X1VpdOfyTGOYRi0/zsoLqtXQckTmqTeybT+BDIbM/Guxo7x3pE2vtpr1ok6xRqM9OpBe+Jyoqyww==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-styles": "^6.2.1",
+        "string-width": "^7.0.0",
+        "strip-ansi": "^7.1.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
+      }
+    },
+    "node_modules/lmdb": {
+      "version": "3.5.1",
+      "resolved": "https://registry.npmjs.org/lmdb/-/lmdb-3.5.1.tgz",
+      "integrity": "sha512-NYHA0MRPjvNX+vSw8Xxg6FLKxzAG+e7Pt8RqAQA/EehzHVXq9SxDqJIN3JL1hK0dweb884y8kIh6rkWvPyg9Wg==",
+      "dev": true,
+      "hasInstallScript": true,
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "@harperfast/extended-iterable": "^1.0.3",
+        "msgpackr": "^1.11.2",
+        "node-addon-api": "^6.1.0",
+        "node-gyp-build-optional-packages": "5.2.2",
+        "ordered-binary": "^1.5.3",
+        "weak-lru-cache": "^1.2.2"
+      },
+      "bin": {
+        "download-lmdb-prebuilds": "bin/download-prebuilds.js"
+      },
+      "optionalDependencies": {
+        "@lmdb/lmdb-darwin-arm64": "3.5.1",
+        "@lmdb/lmdb-darwin-x64": "3.5.1",
+        "@lmdb/lmdb-linux-arm": "3.5.1",
+        "@lmdb/lmdb-linux-arm64": "3.5.1",
+        "@lmdb/lmdb-linux-x64": "3.5.1",
+        "@lmdb/lmdb-win32-arm64": "3.5.1",
+        "@lmdb/lmdb-win32-x64": "3.5.1"
+      }
+    },
+    "node_modules/locate-path": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/locate-path/-/locate-path-6.0.0.tgz",
+      "integrity": "sha512-iPZK6eYjbxRu3uB4/WZ3EsEIMJFMqAoopl3R+zuq0UjcAm/MO6KCweDgPfP3elTztoKP3KtnVHxTn2NHBSDVUw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "p-locate": "^5.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/lodash": {
+      "version": "4.18.1",
+      "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.18.1.tgz",
+      "integrity": "sha512-dMInicTPVE8d1e5otfwmmjlxkZoUpiVLwyeTdUsi/Caj/gfzzblBcCE5sRHV/AsjuCmxWrte2TNGSYuCeCq+0Q==",
+      "license": "MIT"
+    },
+    "node_modules/lodash-es": {
+      "version": "4.18.1",
+      "resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.18.1.tgz",
+      "integrity": "sha512-J8xewKD/Gk22OZbhpOVSwcs60zhd95ESDwezOFuA3/099925PdHJ7OFHNTGtajL3AlZkykD32HykiMo+BIBI8A==",
+      "license": "MIT"
+    },
+    "node_modules/lodash.camelcase": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/lodash.camelcase/-/lodash.camelcase-4.3.0.tgz",
+      "integrity": "sha512-TwuEnCnxbc3rAvhf/LbG7tJUDzhqXyFnv3dtzLOPgCG/hODL7WFnsbwktkD7yUV0RrreP/l1PALq/YSg6VvjlA==",
+      "license": "MIT"
+    },
+    "node_modules/log-symbols": {
+      "version": "7.0.1",
+      "resolved": "https://registry.npmjs.org/log-symbols/-/log-symbols-7.0.1.tgz",
+      "integrity": "sha512-ja1E3yCr9i/0hmBVaM0bfwDjnGy8I/s6PP4DFp+yP+a+mrHO4Rm7DtmnqROTUkHIkqffC84YY7AeqX6oFk0WFg==",
+      "license": "MIT",
+      "dependencies": {
+        "is-unicode-supported": "^2.0.0",
+        "yoctocolors": "^2.1.1"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/log-update": {
+      "version": "6.1.0",
+      "resolved": "https://registry.npmjs.org/log-update/-/log-update-6.1.0.tgz",
+      "integrity": "sha512-9ie8ItPR6tjY5uYJh8K/Zrv/RMZ5VOlOWvtZdEHYSTFKZfIBPQa9tOAEeAWhd+AnIneLJ22w5fjOYtoutpWq5w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-escapes": "^7.0.0",
+        "cli-cursor": "^5.0.0",
+        "slice-ansi": "^7.1.0",
+        "strip-ansi": "^7.1.0",
+        "wrap-ansi": "^9.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/log-update/node_modules/emoji-regex": {
+      "version": "10.6.0",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-10.6.0.tgz",
+      "integrity": "sha512-toUI84YS5YmxW219erniWD0CIVOo46xGKColeNQRgOzDorgBi1v4D71/OFzgD9GO2UGKIv1C3Sp8DAn0+j5w7A==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/log-update/node_modules/slice-ansi": {
+      "version": "7.1.2",
+      "resolved": "https://registry.npmjs.org/slice-ansi/-/slice-ansi-7.1.2.tgz",
+      "integrity": "sha512-iOBWFgUX7caIZiuutICxVgX1SdxwAVFFKwt1EvMYYec/NWO5meOJ6K5uQxhrYBdQJne4KxiqZc+KptFOWFSI9w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-styles": "^6.2.1",
+        "is-fullwidth-code-point": "^5.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/slice-ansi?sponsor=1"
+      }
+    },
+    "node_modules/log-update/node_modules/string-width": {
+      "version": "7.2.0",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-7.2.0.tgz",
+      "integrity": "sha512-tsaTIkKW9b4N+AEj+SVA+WhJzV7/zMhcSu78mLKWSk7cXMOSHsBKFWUs0fWwq8QyK3MgJBQRX6Gbi4kYbdvGkQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "emoji-regex": "^10.3.0",
+        "get-east-asian-width": "^1.0.0",
+        "strip-ansi": "^7.1.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/log-update/node_modules/wrap-ansi": {
+      "version": "9.0.2",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-9.0.2.tgz",
+      "integrity": "sha512-42AtmgqjV+X1VpdOfyTGOYRi0/zsoLqtXQckTmqTeybT+BDIbM/Guxo7x3pE2vtpr1ok6xRqM9OpBe+Jyoqyww==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-styles": "^6.2.1",
+        "string-width": "^7.0.0",
+        "strip-ansi": "^7.1.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
+      }
+    },
+    "node_modules/long": {
+      "version": "5.3.2",
+      "resolved": "https://registry.npmjs.org/long/-/long-5.3.2.tgz",
+      "integrity": "sha512-mNAgZ1GmyNhD7AuqnTG3/VQ26o760+ZYBPKjPvugO8+nLbYfX6TVpJPseBvopbdY+qpZ/lKUnmEc1LeZYS3QAA==",
+      "license": "Apache-2.0"
+    },
+    "node_modules/lru-cache": {
+      "version": "5.1.1",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-5.1.1.tgz",
+      "integrity": "sha512-KpNARQA3Iwv+jTA0utUVVbrh+Jlrr1Fv0e56GGzAFOXN7dk/FviaDW8LHmK52DlcH4WP2n6gI8vN1aesBFgo9w==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "yallist": "^3.0.2"
+      }
+    },
+    "node_modules/magic-string": {
+      "version": "0.30.21",
+      "resolved": "https://registry.npmjs.org/magic-string/-/magic-string-0.30.21.tgz",
+      "integrity": "sha512-vd2F4YUyEXKGcLHoq+TEyCjxueSeHnFxyyjNp80yg0XV4vUhnDer/lvvlqM/arB5bXQN5K2/3oinyCRyx8T2CQ==",
+      "license": "MIT",
+      "dependencies": {
+        "@jridgewell/sourcemap-codec": "^1.5.5"
+      }
+    },
+    "node_modules/make-fetch-happen": {
+      "version": "15.0.5",
+      "resolved": "https://registry.npmjs.org/make-fetch-happen/-/make-fetch-happen-15.0.5.tgz",
+      "integrity": "sha512-uCbIa8jWWmQZt4dSnEStkVC6gdakiinAm4PiGsywIkguF0eWMdcjDz0ECYhUolFU3pFLOev9VNPCEygydXnddg==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "@gar/promise-retry": "^1.0.0",
+        "@npmcli/agent": "^4.0.0",
+        "@npmcli/redact": "^4.0.0",
+        "cacache": "^20.0.1",
+        "http-cache-semantics": "^4.1.1",
+        "minipass": "^7.0.2",
+        "minipass-fetch": "^5.0.0",
+        "minipass-flush": "^1.0.5",
+        "minipass-pipeline": "^1.2.4",
+        "negotiator": "^1.0.0",
+        "proc-log": "^6.0.0",
+        "ssri": "^13.0.0"
+      },
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/math-intrinsics": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/math-intrinsics/-/math-intrinsics-1.1.0.tgz",
+      "integrity": "sha512-/IXtbwEk5HTPyEwyKX6hGkYXxM9nbj64B+ilVJnC/R6B0pH5G4V3b0pVbL7DBj4tkhBAppbQUlf6F6Xl9LHu1g==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      }
+    },
+    "node_modules/mdn-data": {
+      "version": "2.27.1",
+      "resolved": "https://registry.npmjs.org/mdn-data/-/mdn-data-2.27.1.tgz",
+      "integrity": "sha512-9Yubnt3e8A0OKwxYSXyhLymGW4sCufcLG6VdiDdUGVkPhpqLxlvP5vl1983gQjJl3tqbrM731mjaZaP68AgosQ==",
+      "dev": true,
+      "license": "CC0-1.0"
+    },
+    "node_modules/media-typer": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/media-typer/-/media-typer-1.1.0.tgz",
+      "integrity": "sha512-aisnrDP4GNe06UcKFnV5bfMNPBUw4jsLGaWwWfnH3v02GnBuXX2MCVn5RbrWo0j3pczUilYblq7fQ7Nw2t5XKw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/merge-descriptors": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/merge-descriptors/-/merge-descriptors-2.0.0.tgz",
+      "integrity": "sha512-Snk314V5ayFLhp3fkUREub6WtjBfPdCPY1Ln8/8munuLuiYhsABgBVWsozAG+MWMbVEvcdcpbi9R7ww22l9Q3g==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/mime-db": {
+      "version": "1.54.0",
+      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.54.0.tgz",
+      "integrity": "sha512-aU5EJuIN2WDemCcAp2vFBfp/m4EAhWJnUNSSw0ixs7/kXbd6Pg64EmwJkNdFhB8aWt1sH2CTXrLxo/iAGV3oPQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/mime-types": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-3.0.2.tgz",
+      "integrity": "sha512-Lbgzdk0h4juoQ9fCKXW4by0UJqj+nOOrI9MJ1sSj4nI8aI2eo1qmvQEie4VD1glsS250n15LsWsYtCugiStS5A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "mime-db": "^1.54.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/mimic-function": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/mimic-function/-/mimic-function-5.0.1.tgz",
+      "integrity": "sha512-VP79XUPxV2CigYP3jWwAUFSku2aKqBH7uTAapFWCBqutsbmDo96KY5o8uh6U+/YSIn5OxJnXp73beVkpqMIGhA==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/mini-svg-data-uri": {
+      "version": "1.4.4",
+      "resolved": "https://registry.npmjs.org/mini-svg-data-uri/-/mini-svg-data-uri-1.4.4.tgz",
+      "integrity": "sha512-r9deDe9p5FJUPZAk3A59wGH7Ii9YrjjWw0jmw/liSbHl2CHiyXj6FcDXDu2K3TjVAXqiJdaw3xxwlZZr9E6nHg==",
+      "license": "MIT",
+      "bin": {
+        "mini-svg-data-uri": "cli.js"
+      }
+    },
+    "node_modules/minimatch": {
+      "version": "10.2.5",
+      "resolved": "https://registry.npmjs.org/minimatch/-/minimatch-10.2.5.tgz",
+      "integrity": "sha512-MULkVLfKGYDFYejP07QOurDLLQpcjk7Fw+7jXS2R2czRQzR56yHRveU5NDJEOviH+hETZKSkIk5c+T23GjFUMg==",
+      "dev": true,
+      "license": "BlueOak-1.0.0",
+      "dependencies": {
+        "brace-expansion": "^5.0.5"
+      },
+      "engines": {
+        "node": "18 || 20 || >=22"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
+    "node_modules/minipass": {
+      "version": "7.1.3",
+      "resolved": "https://registry.npmjs.org/minipass/-/minipass-7.1.3.tgz",
+      "integrity": "sha512-tEBHqDnIoM/1rXME1zgka9g6Q2lcoCkxHLuc7ODJ5BxbP5d4c2Z5cGgtXAku59200Cx7diuHTOYfSBD8n6mm8A==",
+      "dev": true,
+      "license": "BlueOak-1.0.0",
+      "engines": {
+        "node": ">=16 || 14 >=14.17"
+      }
+    },
+    "node_modules/minipass-collect": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/minipass-collect/-/minipass-collect-2.0.1.tgz",
+      "integrity": "sha512-D7V8PO9oaz7PWGLbCACuI1qEOsq7UKfLotx/C0Aet43fCUB/wfQ7DYeq2oR/svFJGYDHPr38SHATeaj/ZoKHKw==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "minipass": "^7.0.3"
+      },
+      "engines": {
+        "node": ">=16 || 14 >=14.17"
+      }
+    },
+    "node_modules/minipass-fetch": {
+      "version": "5.0.2",
+      "resolved": "https://registry.npmjs.org/minipass-fetch/-/minipass-fetch-5.0.2.tgz",
+      "integrity": "sha512-2d0q2a8eCi2IRg/IGubCNRJoYbA1+YPXAzQVRFmB45gdGZafyivnZ5YSEfo3JikbjGxOdntGFvBQGqaSMXlAFQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "minipass": "^7.0.3",
+        "minipass-sized": "^2.0.0",
+        "minizlib": "^3.0.1"
+      },
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      },
+      "optionalDependencies": {
+        "iconv-lite": "^0.7.2"
+      }
+    },
+    "node_modules/minipass-flush": {
+      "version": "1.0.7",
+      "resolved": "https://registry.npmjs.org/minipass-flush/-/minipass-flush-1.0.7.tgz",
+      "integrity": "sha512-TbqTz9cUwWyHS2Dy89P3ocAGUGxKjjLuR9z8w4WUTGAVgEj17/4nhgo2Du56i0Fm3Pm30g4iA8Lcqctc76jCzA==",
+      "dev": true,
+      "license": "BlueOak-1.0.0",
+      "dependencies": {
+        "minipass": "^3.0.0"
+      },
+      "engines": {
+        "node": ">= 8"
+      }
+    },
+    "node_modules/minipass-flush/node_modules/minipass": {
+      "version": "3.3.6",
+      "resolved": "https://registry.npmjs.org/minipass/-/minipass-3.3.6.tgz",
+      "integrity": "sha512-DxiNidxSEK+tHG6zOIklvNOwm3hvCrbUrdtzY74U6HKTJxvIDfOUL5W5P2Ghd3DTkhhKPYGqeNUIh5qcM4YBfw==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "yallist": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/minipass-flush/node_modules/yallist": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
+      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
+      "dev": true,
+      "license": "ISC"
+    },
+    "node_modules/minipass-pipeline": {
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/minipass-pipeline/-/minipass-pipeline-1.2.4.tgz",
+      "integrity": "sha512-xuIq7cIOt09RPRJ19gdi4b+RiNvDFYe5JH+ggNvBqGqpQXcru3PcRmOZuHBKWK1Txf9+cQ+HMVN4d6z46LZP7A==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "minipass": "^3.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/minipass-pipeline/node_modules/minipass": {
+      "version": "3.3.6",
+      "resolved": "https://registry.npmjs.org/minipass/-/minipass-3.3.6.tgz",
+      "integrity": "sha512-DxiNidxSEK+tHG6zOIklvNOwm3hvCrbUrdtzY74U6HKTJxvIDfOUL5W5P2Ghd3DTkhhKPYGqeNUIh5qcM4YBfw==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "yallist": "^4.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/minipass-pipeline/node_modules/yallist": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/yallist/-/yallist-4.0.0.tgz",
+      "integrity": "sha512-3wdGidZyq5PB084XLES5TpOSRA3wjXAlIWMhum2kRcv/41Sn2emQ0dycQW4uZXLejwKvg6EsvbdlVL+FYEct7A==",
+      "dev": true,
+      "license": "ISC"
+    },
+    "node_modules/minipass-sized": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/minipass-sized/-/minipass-sized-2.0.0.tgz",
+      "integrity": "sha512-zSsHhto5BcUVM2m1LurnXY6M//cGhVaegT71OfOXoprxT6o780GZd792ea6FfrQkuU4usHZIUczAQMRUE2plzA==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "minipass": "^7.1.2"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/minizlib": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/minizlib/-/minizlib-3.1.0.tgz",
+      "integrity": "sha512-KZxYo1BUkWD2TVFLr0MQoM8vUUigWD3LlD83a/75BqC+4qE0Hb1Vo5v1FgcfaNXvfXzr+5EhQ6ing/CaBijTlw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "minipass": "^7.1.2"
+      },
+      "engines": {
+        "node": ">= 18"
+      }
+    },
+    "node_modules/mrmime": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/mrmime/-/mrmime-2.0.1.tgz",
+      "integrity": "sha512-Y3wQdFg2Va6etvQ5I82yUhGdsKrcYox6p7FfL1LbK2J4V01F9TGlepTIhnK24t7koZibmg82KGglhA1XK5IsLQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/ms": {
+      "version": "2.1.3",
+      "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz",
+      "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/msgpackr": {
+      "version": "1.11.12",
+      "resolved": "https://registry.npmjs.org/msgpackr/-/msgpackr-1.11.12.tgz",
+      "integrity": "sha512-RBdJ1Un7yGlXWajrkxcSa93nvQ0w4zBf60c0yYv7YtBelP8H2FA7XsfBbMHtXKXUMUxH7zV3Zuozh+kUQWhHvg==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "optionalDependencies": {
+        "msgpackr-extract": "^3.0.2"
+      }
+    },
+    "node_modules/msgpackr-extract": {
+      "version": "3.0.3",
+      "resolved": "https://registry.npmjs.org/msgpackr-extract/-/msgpackr-extract-3.0.3.tgz",
+      "integrity": "sha512-P0efT1C9jIdVRefqjzOQ9Xml57zpOXnIuS+csaB4MdZbTdmGDLo8XhzBG1N7aO11gKDDkJvBLULeFTo46wwreA==",
+      "dev": true,
+      "hasInstallScript": true,
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "node-gyp-build-optional-packages": "5.2.2"
+      },
+      "bin": {
+        "download-msgpackr-prebuilds": "bin/download-prebuilds.js"
+      },
+      "optionalDependencies": {
+        "@msgpackr-extract/msgpackr-extract-darwin-arm64": "3.0.3",
+        "@msgpackr-extract/msgpackr-extract-darwin-x64": "3.0.3",
+        "@msgpackr-extract/msgpackr-extract-linux-arm": "3.0.3",
+        "@msgpackr-extract/msgpackr-extract-linux-arm64": "3.0.3",
+        "@msgpackr-extract/msgpackr-extract-linux-x64": "3.0.3",
+        "@msgpackr-extract/msgpackr-extract-win32-x64": "3.0.3"
+      }
+    },
+    "node_modules/mute-stream": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-2.0.0.tgz",
+      "integrity": "sha512-WWdIxpyjEn+FhQJQQv9aQAYlHoNVdzIzUySNV1gHUPDSdZJ3yZn7pAAbQcV7B56Mvu881q9FZV+0Vx2xC44VWA==",
+      "dev": true,
+      "license": "ISC",
+      "engines": {
+        "node": "^18.17.0 || >=20.5.0"
+      }
+    },
+    "node_modules/nanoid": {
+      "version": "3.3.12",
+      "resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.12.tgz",
+      "integrity": "sha512-ZB9RH/39qpq5Vu6Y+NmUaFhQR6pp+M2Xt76XBnEwDaGcVAqhlvxrl3B2bKS5D3NH3QR76v3aSrKaF/Kiy7lEtQ==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "MIT",
+      "bin": {
+        "nanoid": "bin/nanoid.cjs"
+      },
+      "engines": {
+        "node": "^10 || ^12 || ^13.7 || ^14 || >=15.0.1"
+      }
+    },
+    "node_modules/natural-compare": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/natural-compare/-/natural-compare-1.4.0.tgz",
+      "integrity": "sha512-OWND8ei3VtNC9h7V60qff3SVobHr996CTwgxubgyQYEpg290h9J0buyECNNJexkFm5sOajh5G116RYA1c8ZMSw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/negotiator": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/negotiator/-/negotiator-1.0.0.tgz",
+      "integrity": "sha512-8Ofs/AUQh8MaEcrlq5xOX0CQ9ypTF5dl78mjlMNfOK08fzpgTHQRQPBxcPlEtIw0yRpws+Zo/3r+5WRby7u3Gg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/ng-apexcharts": {
+      "version": "2.4.0",
+      "resolved": "https://registry.npmjs.org/ng-apexcharts/-/ng-apexcharts-2.4.0.tgz",
+      "integrity": "sha512-bNXIOQrux9ZXnpm4kxbW8M6AA4ENAEOpR31ZoaeBkc0SrfOMw1nxRN5ORkStOQFVQF5Wf5qivAA9KIgU7Ol26A==",
+      "dependencies": {
+        "tslib": "^2.8.1"
+      },
+      "peerDependencies": {
+        "@angular/common": ">=20.0.0",
+        "@angular/core": ">=20.0.0",
+        "apexcharts": "^5.10.3",
+        "rxjs": "^7.8.2"
+      }
+    },
+    "node_modules/ng2-charts": {
+      "version": "10.0.0",
+      "resolved": "https://registry.npmjs.org/ng2-charts/-/ng2-charts-10.0.0.tgz",
+      "integrity": "sha512-mdL75XJrk/0s0YO2ySPQpAHPja85ECDEGNWFlcElJiy/bYliTNGEpeCtctAqZuozTff/E2CwGjyfPFM1ScP2og==",
+      "license": "MIT",
+      "dependencies": {
+        "es-toolkit": "^1.39.7",
+        "tslib": "^2.3.0"
+      },
+      "peerDependencies": {
+        "@angular/cdk": ">=21.0.0",
+        "@angular/common": ">=21.0.0",
+        "@angular/core": ">=21.0.0",
+        "@angular/platform-browser": ">=21.0.0",
+        "chart.js": "^3.4.0 || ^4.0.0",
+        "rxjs": "^6.5.3 || ^7.4.0"
+      }
+    },
+    "node_modules/ngx-color-picker": {
+      "version": "20.1.1",
+      "resolved": "https://registry.npmjs.org/ngx-color-picker/-/ngx-color-picker-20.1.1.tgz",
+      "integrity": "sha512-wFk1L9F3JBd1Th+auYexN4uyynaT2dhxVRn0Dd55HrhfVcxfylExITDJ+Bhrcl0W+QHtX6gVbfZuX2hBXeVMFA==",
+      "license": "MIT",
+      "dependencies": {
+        "tslib": "^2.3.0"
+      },
+      "peerDependencies": {
+        "@angular/common": ">=19.0.0",
+        "@angular/core": ">=19.0.0",
+        "@angular/forms": ">=19.0.0"
+      }
+    },
+    "node_modules/ngx-echarts": {
+      "version": "21.0.0",
+      "resolved": "https://registry.npmjs.org/ngx-echarts/-/ngx-echarts-21.0.0.tgz",
+      "integrity": "sha512-vivBRmGYMFlnPxK/uxliY+sexGwHqnFZ2pylGbIMF2wikt9RpZpGGSitLmuUXvzYwkVFGo6dQmiUQh1+6Pbfuw==",
+      "license": "MIT",
+      "dependencies": {
+        "tslib": "^2.3.0"
+      },
+      "peerDependencies": {
+        "@angular/core": ">=21.0.0",
+        "echarts": ">=5.0.0"
+      }
+    },
+    "node_modules/ngx-toastr": {
+      "version": "20.0.5",
+      "resolved": "https://registry.npmjs.org/ngx-toastr/-/ngx-toastr-20.0.5.tgz",
+      "integrity": "sha512-JcGu1Cbl+0SovPhxma72ygGeZHtpHWWKwBCyiabb+MSWYtXu/SOwEZ2HTWtZ4wcEYOOiy9tDQZgiEKWXpibpRw==",
+      "license": "MIT",
+      "dependencies": {
+        "tslib": "^2.8.1"
+      },
+      "peerDependencies": {
+        "@angular/common": "^21.0.0",
+        "@angular/core": "^21.0.0",
+        "rxjs": "^7.8.2"
+      }
+    },
+    "node_modules/node-addon-api": {
+      "version": "6.1.0",
+      "resolved": "https://registry.npmjs.org/node-addon-api/-/node-addon-api-6.1.0.tgz",
+      "integrity": "sha512-+eawOlIgy680F0kBzPUNFhMZGtJ1YmqM6l4+Crf4IkImjYrO/mqPwRMh352g23uIaQKFItcQ64I7KMaJxHgAVA==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true
+    },
+    "node_modules/node-gyp": {
+      "version": "12.3.0",
+      "resolved": "https://registry.npmjs.org/node-gyp/-/node-gyp-12.3.0.tgz",
+      "integrity": "sha512-QNcUWM+HgJplcPzBvFBZ9VXacyGZ4+VTOb80PwWR+TlVzoHbRKULNEzpRsnaoxG3Wzr7Qh7BYxGDU3CbKib2Yg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "env-paths": "^2.2.0",
+        "exponential-backoff": "^3.1.1",
+        "graceful-fs": "^4.2.6",
+        "nopt": "^9.0.0",
+        "proc-log": "^6.0.0",
+        "semver": "^7.3.5",
+        "tar": "^7.5.4",
+        "tinyglobby": "^0.2.12",
+        "undici": "^6.25.0",
+        "which": "^6.0.0"
+      },
+      "bin": {
+        "node-gyp": "bin/node-gyp.js"
+      },
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/node-gyp-build-optional-packages": {
+      "version": "5.2.2",
+      "resolved": "https://registry.npmjs.org/node-gyp-build-optional-packages/-/node-gyp-build-optional-packages-5.2.2.tgz",
+      "integrity": "sha512-s+w+rBWnpTMwSFbaE0UXsRlg7hU4FjekKU4eyAih5T8nJuNZT1nNsskXpxmeqSK9UzkBl6UgRlnKc8hz8IEqOw==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true,
+      "dependencies": {
+        "detect-libc": "^2.0.1"
+      },
+      "bin": {
+        "node-gyp-build-optional-packages": "bin.js",
+        "node-gyp-build-optional-packages-optional": "optional.js",
+        "node-gyp-build-optional-packages-test": "build-test.js"
+      }
+    },
+    "node_modules/node-gyp/node_modules/isexe": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/isexe/-/isexe-4.0.0.tgz",
+      "integrity": "sha512-FFUtZMpoZ8RqHS3XeXEmHWLA4thH+ZxCv2lOiPIn1Xc7CxrqhWzNSDzD+/chS/zbYezmiwWLdQC09JdQKmthOw==",
+      "dev": true,
+      "license": "BlueOak-1.0.0",
+      "engines": {
+        "node": ">=20"
+      }
+    },
+    "node_modules/node-gyp/node_modules/undici": {
+      "version": "6.25.0",
+      "resolved": "https://registry.npmjs.org/undici/-/undici-6.25.0.tgz",
+      "integrity": "sha512-ZgpWDC5gmNiuY9CnLVXEH8rl50xhRCuLNA97fAUnKi8RRuV4E6KG31pDTsLVUKnohJE0I3XDrTeEydAXRw47xg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18.17"
+      }
+    },
+    "node_modules/node-gyp/node_modules/which": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/which/-/which-6.0.1.tgz",
+      "integrity": "sha512-oGLe46MIrCRqX7ytPUf66EAYvdeMIZYn3WaocqqKZAxrBpkqHfL/qvTyJ/bTk5+AqHCjXmrv3CEWgy368zhRUg==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "isexe": "^4.0.0"
+      },
+      "bin": {
+        "node-which": "bin/which.js"
+      },
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/node-releases": {
+      "version": "2.0.46",
+      "resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.46.tgz",
+      "integrity": "sha512-GYVXHE2KnrzAfsAjl4uP++evGFCrAU1jta4ubEjIG7YWt/64Gqv66a30yKwWczVjA6j3bM4nBwH7Pk1JmDHaxQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/nopt": {
+      "version": "9.0.0",
+      "resolved": "https://registry.npmjs.org/nopt/-/nopt-9.0.0.tgz",
+      "integrity": "sha512-Zhq3a+yFKrYwSBluL4H9XP3m3y5uvQkB/09CwDruCiRmR/UJYnn9W4R48ry0uGC70aeTPKLynBtscP9efFFcPw==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "abbrev": "^4.0.0"
+      },
+      "bin": {
+        "nopt": "bin/nopt.js"
+      },
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/normalize-path": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/normalize-path/-/normalize-path-3.0.0.tgz",
+      "integrity": "sha512-6eZs5Ls3WtCisHWp9S2GUy8dqkpGi4BVSz3GaqiE6ezub0512ESztXUwUB6C6IKbQkY2Pnb/mD4WYojCRwcwLA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/nouislider": {
+      "version": "15.8.1",
+      "resolved": "https://registry.npmjs.org/nouislider/-/nouislider-15.8.1.tgz",
+      "integrity": "sha512-93TweAi8kqntHJSPiSWQ1o/uZ29VWOmal9YKb6KKGGlCkugaNfAupT7o1qTHqdJvNQ7S0su5rO6qRFCjP8fxtw==",
+      "license": "MIT"
+    },
+    "node_modules/npm-bundled": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/npm-bundled/-/npm-bundled-5.0.0.tgz",
+      "integrity": "sha512-JLSpbzh6UUXIEoqPsYBvVNVmyrjVZ1fzEFbqxKkTJQkWBO3xFzFT+KDnSKQWwOQNbuWRwt5LSD6HOTLGIWzfrw==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "npm-normalize-package-bin": "^5.0.0"
+      },
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/npm-install-checks": {
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/npm-install-checks/-/npm-install-checks-8.0.0.tgz",
+      "integrity": "sha512-ScAUdMpyzkbpxoNekQ3tNRdFI8SJ86wgKZSQZdUxT+bj0wVFpsEMWnkXP0twVe1gJyNF5apBWDJhhIbgrIViRA==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "dependencies": {
+        "semver": "^7.1.1"
+      },
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/npm-normalize-package-bin": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/npm-normalize-package-bin/-/npm-normalize-package-bin-5.0.0.tgz",
+      "integrity": "sha512-CJi3OS4JLsNMmr2u07OJlhcrPxCeOeP/4xq67aWNai6TNWWbTrlNDgl8NcFKVlcBKp18GPj+EzbNIgrBfZhsag==",
+      "dev": true,
+      "license": "ISC",
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/npm-package-arg": {
+      "version": "13.0.2",
+      "resolved": "https://registry.npmjs.org/npm-package-arg/-/npm-package-arg-13.0.2.tgz",
+      "integrity": "sha512-IciCE3SY3uE84Ld8WZU23gAPPV9rIYod4F+rc+vJ7h7cwAJt9Vk6TVsK60ry7Uj3SRS3bqRRIGuTp9YVlk6WNA==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "hosted-git-info": "^9.0.0",
+        "proc-log": "^6.0.0",
+        "semver": "^7.3.5",
+        "validate-npm-package-name": "^7.0.0"
+      },
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/npm-packlist": {
+      "version": "10.0.4",
+      "resolved": "https://registry.npmjs.org/npm-packlist/-/npm-packlist-10.0.4.tgz",
+      "integrity": "sha512-uMW73iajD8hiH4ZBxEV3HC+eTnppIqwakjOYuvgddnalIw2lJguKviK1pcUJDlIWm1wSJkchpDZDSVVsZEYRng==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "ignore-walk": "^8.0.0",
+        "proc-log": "^6.0.0"
+      },
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/npm-pick-manifest": {
+      "version": "11.0.3",
+      "resolved": "https://registry.npmjs.org/npm-pick-manifest/-/npm-pick-manifest-11.0.3.tgz",
+      "integrity": "sha512-buzyCfeoGY/PxKqmBqn1IUJrZnUi1VVJTdSSRPGI60tJdUhUoSQFhs0zycJokDdOznQentgrpf8LayEHyyYlqQ==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "npm-install-checks": "^8.0.0",
+        "npm-normalize-package-bin": "^5.0.0",
+        "npm-package-arg": "^13.0.0",
+        "semver": "^7.3.5"
+      },
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/npm-registry-fetch": {
+      "version": "19.1.1",
+      "resolved": "https://registry.npmjs.org/npm-registry-fetch/-/npm-registry-fetch-19.1.1.tgz",
+      "integrity": "sha512-TakBap6OM1w0H73VZVDf44iFXsOS3h+L4wVMXmbWOQroZgFhMch0juN6XSzBNlD965yIKvWg2dfu7NSiaYLxtw==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "@npmcli/redact": "^4.0.0",
+        "jsonparse": "^1.3.1",
+        "make-fetch-happen": "^15.0.0",
+        "minipass": "^7.0.2",
+        "minipass-fetch": "^5.0.0",
+        "minizlib": "^3.0.1",
+        "npm-package-arg": "^13.0.0",
+        "proc-log": "^6.0.0"
+      },
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/nth-check": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/nth-check/-/nth-check-2.1.1.tgz",
+      "integrity": "sha512-lqjrjmaOoAnWfMmBPL+XNnynZh2+swxiX3WUE0s4yEHI6m+AwrK2UZOimIRl3X/4QctVqS8AiZjFqyOGrMXb/w==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "dependencies": {
+        "boolbase": "^1.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/fb55/nth-check?sponsor=1"
+      }
+    },
+    "node_modules/object-assign": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
+      "integrity": "sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/object-inspect": {
+      "version": "1.13.4",
+      "resolved": "https://registry.npmjs.org/object-inspect/-/object-inspect-1.13.4.tgz",
+      "integrity": "sha512-W67iLl4J2EXEGTbfeHCffrjDfitvLANg0UlX3wFUUSTx92KXRFegMHUVgSqE+wvhAbi4WqjGg9czysTV2Epbew==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/obug": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/obug/-/obug-2.1.1.tgz",
+      "integrity": "sha512-uTqF9MuPraAQ+IsnPf366RG4cP9RtUi7MLO1N3KEc+wb0a6yKpeL0lmk2IB1jY5KHPAlTc6T/JRdC/YqxHNwkQ==",
+      "dev": true,
+      "funding": [
+        "https://github.com/sponsors/sxzz",
+        "https://opencollective.com/debug"
+      ],
+      "license": "MIT"
+    },
+    "node_modules/on-finished": {
+      "version": "2.4.1",
+      "resolved": "https://registry.npmjs.org/on-finished/-/on-finished-2.4.1.tgz",
+      "integrity": "sha512-oVlzkg3ENAhCk2zdv7IJwd/QUD4z2RxRwpkcGY8psCVcCYZNq4wYnVWALHM+brtuJjePWiYF/ClmuDr8Ch5+kg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ee-first": "1.1.1"
+      },
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/once": {
+      "version": "1.4.0",
+      "resolved": "https://registry.npmjs.org/once/-/once-1.4.0.tgz",
+      "integrity": "sha512-lNaJgI+2Q5URQBkccEKHTQOPaXdUxnZZElQTZY0MFUAuaEqe1E+Nyvgdz/aIyNi6Z9MzO5dv1H8n58/GELp3+w==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "wrappy": "1"
+      }
+    },
+    "node_modules/onetime": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/onetime/-/onetime-7.0.0.tgz",
+      "integrity": "sha512-VXJjc87FScF88uafS3JllDgvAm+c/Slfz06lorj2uAY34rlUu0Nt+v8wreiImcrgAjjIHp1rXpTDlLOGw29WwQ==",
+      "license": "MIT",
+      "dependencies": {
+        "mimic-function": "^5.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/optionator": {
+      "version": "0.9.4",
+      "resolved": "https://registry.npmjs.org/optionator/-/optionator-0.9.4.tgz",
+      "integrity": "sha512-6IpQ7mKUxRcZNLIObR0hz7lxsapSSIYNZJwXPGeF0mTVqGKFIXj1DQcMoT22S3ROcLyY/rz0PWaWZ9ayWmad9g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "deep-is": "^0.1.3",
+        "fast-levenshtein": "^2.0.6",
+        "levn": "^0.4.1",
+        "prelude-ls": "^1.2.1",
+        "type-check": "^0.4.0",
+        "word-wrap": "^1.2.5"
+      },
+      "engines": {
+        "node": ">= 0.8.0"
+      }
+    },
+    "node_modules/ora": {
+      "version": "9.3.0",
+      "resolved": "https://registry.npmjs.org/ora/-/ora-9.3.0.tgz",
+      "integrity": "sha512-lBX72MWFduWEf7v7uWf5DHp9Jn5BI8bNPGuFgtXMmr2uDz2Gz2749y3am3agSDdkhHPHYmmxEGSKH85ZLGzgXw==",
+      "license": "MIT",
+      "dependencies": {
+        "chalk": "^5.6.2",
+        "cli-cursor": "^5.0.0",
+        "cli-spinners": "^3.2.0",
+        "is-interactive": "^2.0.0",
+        "is-unicode-supported": "^2.1.0",
+        "log-symbols": "^7.0.1",
+        "stdin-discarder": "^0.3.1",
+        "string-width": "^8.1.0"
+      },
+      "engines": {
+        "node": ">=20"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/ordered-binary": {
+      "version": "1.6.1",
+      "resolved": "https://registry.npmjs.org/ordered-binary/-/ordered-binary-1.6.1.tgz",
+      "integrity": "sha512-QkCdPooczexPLiXIrbVOPYkR3VO3T6v2OyKRkR1Xbhpy7/LAVXwahnRCgRp78Oe/Ehf0C/HATAxfSr6eA1oX+w==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true
+    },
+    "node_modules/p-limit": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/p-limit/-/p-limit-3.1.0.tgz",
+      "integrity": "sha512-TYOanM3wGwNGsZN2cVTYPArw454xnXj5qmWF1bEoAc4+cU/ol7GVh7odevjp1FNHduHc3KZMcFduxU5Xc6uJRQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "yocto-queue": "^0.1.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/p-locate": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/p-locate/-/p-locate-5.0.0.tgz",
+      "integrity": "sha512-LaNjtRWUBY++zB5nE/NwcaoMylSPk+S+ZHNB1TzdbMJMny6dynpAGt7X/tl/QYq3TIeE6nxHppbo2LGymrG5Pw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "p-limit": "^3.0.2"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/p-map": {
+      "version": "7.0.4",
+      "resolved": "https://registry.npmjs.org/p-map/-/p-map-7.0.4.tgz",
+      "integrity": "sha512-tkAQEw8ysMzmkhgw8k+1U/iPhWNhykKnSk4Rd5zLoPJCuJaGRPo6YposrZgaxHKzDHdDWWZvE/Sk7hsL2X/CpQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/pacote": {
+      "version": "21.3.1",
+      "resolved": "https://registry.npmjs.org/pacote/-/pacote-21.3.1.tgz",
+      "integrity": "sha512-O0EDXi85LF4AzdjG74GUwEArhdvawi/YOHcsW6IijKNj7wm8IvEWNF5GnfuxNpQ/ZpO3L37+v8hqdVh8GgWYhg==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "@npmcli/git": "^7.0.0",
+        "@npmcli/installed-package-contents": "^4.0.0",
+        "@npmcli/package-json": "^7.0.0",
+        "@npmcli/promise-spawn": "^9.0.0",
+        "@npmcli/run-script": "^10.0.0",
+        "cacache": "^20.0.0",
+        "fs-minipass": "^3.0.0",
+        "minipass": "^7.0.2",
+        "npm-package-arg": "^13.0.0",
+        "npm-packlist": "^10.0.1",
+        "npm-pick-manifest": "^11.0.1",
+        "npm-registry-fetch": "^19.0.0",
+        "proc-log": "^6.0.0",
+        "promise-retry": "^2.0.1",
+        "sigstore": "^4.0.0",
+        "ssri": "^13.0.0",
+        "tar": "^7.4.3"
+      },
+      "bin": {
+        "pacote": "bin/index.js"
+      },
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/parse5": {
+      "version": "8.0.1",
+      "resolved": "https://registry.npmjs.org/parse5/-/parse5-8.0.1.tgz",
+      "integrity": "sha512-z1e/HMG90obSGeidlli3hj7cbocou0/wa5HacvI3ASx34PecNjNQeaHNo5WIZpWofN9kgkqV1q5YvXe3F0FoPw==",
+      "license": "MIT",
+      "dependencies": {
+        "entities": "^8.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/inikulin/parse5?sponsor=1"
+      }
+    },
+    "node_modules/parse5-html-rewriting-stream": {
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/parse5-html-rewriting-stream/-/parse5-html-rewriting-stream-8.0.0.tgz",
+      "integrity": "sha512-wzh11mj8KKkno1pZEu+l2EVeWsuKDfR5KNWZOTsslfUX8lPDZx77m9T0kIoAVkFtD1nx6YF8oh4BnPHvxMtNMw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "entities": "^6.0.0",
+        "parse5": "^8.0.0",
+        "parse5-sax-parser": "^8.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/inikulin/parse5?sponsor=1"
+      }
+    },
+    "node_modules/parse5-html-rewriting-stream/node_modules/entities": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/entities/-/entities-6.0.1.tgz",
+      "integrity": "sha512-aN97NXWF6AWBTahfVOIrB/NShkzi5H7F9r1s9mD3cDj4Ko5f2qhhVoYMibXF7GlLveb/D2ioWay8lxI97Ven3g==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "engines": {
+        "node": ">=0.12"
+      },
+      "funding": {
+        "url": "https://github.com/fb55/entities?sponsor=1"
+      }
+    },
+    "node_modules/parse5-sax-parser": {
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/parse5-sax-parser/-/parse5-sax-parser-8.0.0.tgz",
+      "integrity": "sha512-/dQ8UzHZwnrzs3EvDj6IkKrD/jIZyTlB+8XrHJvcjNgRdmWruNdN9i9RK/JtxakmlUdPwKubKPTCqvbTgzGhrw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "parse5": "^8.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/inikulin/parse5?sponsor=1"
+      }
+    },
+    "node_modules/parse5/node_modules/entities": {
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/entities/-/entities-8.0.0.tgz",
+      "integrity": "sha512-zwfzJecQ/Uej6tusMqwAqU/6KL2XaB2VZ2Jg54Je6ahNBGNH6Ek6g3jjNCF0fG9EWQKGZNddNjU5F1ZQn/sBnA==",
+      "license": "BSD-2-Clause",
+      "engines": {
+        "node": ">=20.19.0"
+      },
+      "funding": {
+        "url": "https://github.com/fb55/entities?sponsor=1"
+      }
+    },
+    "node_modules/parseurl": {
+      "version": "1.3.3",
+      "resolved": "https://registry.npmjs.org/parseurl/-/parseurl-1.3.3.tgz",
+      "integrity": "sha512-CiyeOxFT/JZyN5m0z9PfXw4SCBJ6Sygz1Dpl0wqjlhDEGGBP1GnsUVEL0p63hoG1fcj3fHynXi9NYO4nWOL+qQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/path-exists": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/path-exists/-/path-exists-4.0.0.tgz",
+      "integrity": "sha512-ak9Qy5Q7jYb2Wwcey5Fpvg2KoAc/ZIhLSLOSBmRmygPsGwkVVt0fZa0qrtMz+m6tJTAHfZQ8FnmB4MG4LWy7/w==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/path-key": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/path-key/-/path-key-3.1.1.tgz",
+      "integrity": "sha512-ojmeN0qd+y0jszEtoY48r0Peq5dwMEkIlCOu6Q5f41lfkswXuKtYrhgoTpLnyIcHm24Uhqx+5Tqm2InSwLhE6Q==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/path-scurry": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/path-scurry/-/path-scurry-2.0.2.tgz",
+      "integrity": "sha512-3O/iVVsJAPsOnpwWIeD+d6z/7PmqApyQePUtCndjatj/9I5LylHvt5qluFaBT3I5h3r1ejfR056c+FCv+NnNXg==",
+      "dev": true,
+      "license": "BlueOak-1.0.0",
+      "dependencies": {
+        "lru-cache": "^11.0.0",
+        "minipass": "^7.1.2"
+      },
+      "engines": {
+        "node": "18 || 20 || >=22"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
+    "node_modules/path-scurry/node_modules/lru-cache": {
+      "version": "11.5.0",
+      "resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-11.5.0.tgz",
+      "integrity": "sha512-5YgH9UJd7wVb9hIouI2adWpgqrrICkt070Dnj8EUY1+B4B2P9eRLPAkAAo6NICA7CEhOIeBHl46u9zSNpNu7zA==",
+      "dev": true,
+      "license": "BlueOak-1.0.0",
+      "engines": {
+        "node": "20 || >=22"
+      }
+    },
+    "node_modules/path-to-regexp": {
+      "version": "8.4.2",
+      "resolved": "https://registry.npmjs.org/path-to-regexp/-/path-to-regexp-8.4.2.tgz",
+      "integrity": "sha512-qRcuIdP69NPm4qbACK+aDogI5CBDMi1jKe0ry5rSQJz8JVLsC7jV8XpiJjGRLLol3N+R5ihGYcrPLTno6pAdBA==",
+      "dev": true,
+      "license": "MIT",
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/pathe": {
+      "version": "2.0.3",
+      "resolved": "https://registry.npmjs.org/pathe/-/pathe-2.0.3.tgz",
+      "integrity": "sha512-WUjGcAqP1gQacoQe+OBJsFA7Ld4DyXuUIjZ5cc75cLHvJ7dtNsTugphxIADwspS+AraAUePCKrSVtPLFj/F88w==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/picocolors": {
+      "version": "1.1.1",
+      "resolved": "https://registry.npmjs.org/picocolors/-/picocolors-1.1.1.tgz",
+      "integrity": "sha512-xceH2snhtb5M9liqDsmEw56le376mTZkEX/jEb/RxNFyegNul7eNslCXP9FDj/Lcu0X8KEyMceP2ntpaHrDEVA==",
+      "dev": true,
+      "license": "ISC"
+    },
+    "node_modules/picomatch": {
+      "version": "4.0.4",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-4.0.4.tgz",
+      "integrity": "sha512-QP88BAKvMam/3NxH6vj2o21R6MjxZUAd6nlwAS/pnGvN9IVLocLHxGYIzFhg6fUQ+5th6P4dv4eW9jX3DSIj7A==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/jonschlinkert"
+      }
+    },
+    "node_modules/pify": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
+      "integrity": "sha512-udgsAY+fTnvv7kI7aaxbqwWNb0AHiB0qBO89PZKPkoTmGOgdbrHDKD+0B2X4uTfJ/FT1R09r9gTsjUjNJotuog==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/piscina": {
+      "version": "5.1.4",
+      "resolved": "https://registry.npmjs.org/piscina/-/piscina-5.1.4.tgz",
+      "integrity": "sha512-7uU4ZnKeQq22t9AsmHGD2w4OYQGonwFnTypDypaWi7Qr2EvQIFVtG8J5D/3bE7W123Wdc9+v4CZDu5hJXVCtBg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=20.x"
+      },
+      "optionalDependencies": {
+        "@napi-rs/nice": "^1.0.4"
+      }
+    },
+    "node_modules/pkce-challenge": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/pkce-challenge/-/pkce-challenge-5.0.1.tgz",
+      "integrity": "sha512-wQ0b/W4Fr01qtpHlqSqspcj3EhBvimsdh0KlHhH8HRZnMsEa0ea2fTULOXOS9ccQr3om+GcGRk4e+isrZWV8qQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=16.20.0"
+      }
+    },
+    "node_modules/postcss": {
+      "version": "8.5.15",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.5.15.tgz",
+      "integrity": "sha512-FfR8sjd4em2T6fb3I2MwAJU7HWVMr9zba+enmQeeWFfCbm+UOC/0X4DS8XtpUTMwWMGbjKYP7xjfNekzyGmB3A==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/postcss/"
+        },
+        {
+          "type": "tidelift",
+          "url": "https://tidelift.com/funding/github/npm/postcss"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "nanoid": "^3.3.12",
+        "picocolors": "^1.1.1",
+        "source-map-js": "^1.2.1"
+      },
+      "engines": {
+        "node": "^10 || ^12 || >=14"
+      }
+    },
+    "node_modules/postcss-cli": {
+      "version": "11.0.1",
+      "resolved": "https://registry.npmjs.org/postcss-cli/-/postcss-cli-11.0.1.tgz",
+      "integrity": "sha512-0UnkNPSayHKRe/tc2YGW6XnSqqOA9eqpiRMgRlV1S6HdGi16vwJBx7lviARzbV1HpQHqLLRH3o8vTcB0cLc+5g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "chokidar": "^3.3.0",
+        "dependency-graph": "^1.0.0",
+        "fs-extra": "^11.0.0",
+        "picocolors": "^1.0.0",
+        "postcss-load-config": "^5.0.0",
+        "postcss-reporter": "^7.0.0",
+        "pretty-hrtime": "^1.0.3",
+        "read-cache": "^1.0.0",
+        "slash": "^5.0.0",
+        "tinyglobby": "^0.2.12",
+        "yargs": "^17.0.0"
+      },
+      "bin": {
+        "postcss": "index.js"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "peerDependencies": {
+        "postcss": "^8.0.0"
+      }
+    },
+    "node_modules/postcss-cli/node_modules/ansi-regex": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
+      "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/postcss-cli/node_modules/ansi-styles": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
+      "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "color-convert": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+      }
+    },
+    "node_modules/postcss-cli/node_modules/chokidar": {
+      "version": "3.6.0",
+      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.6.0.tgz",
+      "integrity": "sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "anymatch": "~3.1.2",
+        "braces": "~3.0.2",
+        "glob-parent": "~5.1.2",
+        "is-binary-path": "~2.1.0",
+        "is-glob": "~4.0.1",
+        "normalize-path": "~3.0.0",
+        "readdirp": "~3.6.0"
+      },
+      "engines": {
+        "node": ">= 8.10.0"
+      },
+      "funding": {
+        "url": "https://paulmillr.com/funding/"
+      },
+      "optionalDependencies": {
+        "fsevents": "~2.3.2"
+      }
+    },
+    "node_modules/postcss-cli/node_modules/cliui": {
+      "version": "8.0.1",
+      "resolved": "https://registry.npmjs.org/cliui/-/cliui-8.0.1.tgz",
+      "integrity": "sha512-BSeNnyus75C4//NQ9gQt1/csTXyo/8Sb+afLAkzAptFuMsod9HFokGNudZpi/oQV73hnVK+sR+5PVRMd+Dr7YQ==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "string-width": "^4.2.0",
+        "strip-ansi": "^6.0.1",
+        "wrap-ansi": "^7.0.0"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/postcss-cli/node_modules/is-fullwidth-code-point": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
+      "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/postcss-cli/node_modules/picomatch": {
+      "version": "2.3.2",
+      "resolved": "https://registry.npmjs.org/picomatch/-/picomatch-2.3.2.tgz",
+      "integrity": "sha512-V7+vQEJ06Z+c5tSye8S+nHUfI51xoXIXjHQ99cQtKUkQqqO1kO/KCJUfZXuB47h/YBlDhah2H3hdUGXn8ie0oA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8.6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/jonschlinkert"
+      }
+    },
+    "node_modules/postcss-cli/node_modules/readdirp": {
+      "version": "3.6.0",
+      "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-3.6.0.tgz",
+      "integrity": "sha512-hOS089on8RduqdbhvQ5Z37A0ESjsqz6qnRcffsMU3495FuTdqSm+7bhJ29JvIOsBDEEnan5DPu9t3To9VRlMzA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "picomatch": "^2.2.1"
+      },
+      "engines": {
+        "node": ">=8.10.0"
+      }
+    },
+    "node_modules/postcss-cli/node_modules/string-width": {
+      "version": "4.2.3",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
+      "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "emoji-regex": "^8.0.0",
+        "is-fullwidth-code-point": "^3.0.0",
+        "strip-ansi": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/postcss-cli/node_modules/strip-ansi": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
+      "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-regex": "^5.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/postcss-cli/node_modules/wrap-ansi": {
+      "version": "7.0.0",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-7.0.0.tgz",
+      "integrity": "sha512-YVGIj2kamLSTxw6NsZjoBxfSwsn0ycdesmc4p+Q21c5zPuZ1pl+NfxVdxPtdHvmNVOQ6XSYG4AUtyt/Fi7D16Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-styles": "^4.0.0",
+        "string-width": "^4.1.0",
+        "strip-ansi": "^6.0.0"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/wrap-ansi?sponsor=1"
+      }
+    },
+    "node_modules/postcss-cli/node_modules/yargs": {
+      "version": "17.7.2",
+      "resolved": "https://registry.npmjs.org/yargs/-/yargs-17.7.2.tgz",
+      "integrity": "sha512-7dSzzRQ++CKnNI/krKnYRV7JKKPUXMEh61soaHKg9mrWEhzFWhFnxPxGl+69cD1Ou63C13NUPCnmIcrvqCuM6w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "cliui": "^8.0.1",
+        "escalade": "^3.1.1",
+        "get-caller-file": "^2.0.5",
+        "require-directory": "^2.1.1",
+        "string-width": "^4.2.3",
+        "y18n": "^5.0.5",
+        "yargs-parser": "^21.1.1"
+      },
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/postcss-cli/node_modules/yargs-parser": {
+      "version": "21.1.1",
+      "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-21.1.1.tgz",
+      "integrity": "sha512-tVpsJW7DdjecAiFpbIB1e3qxIQsE6NoPc5/eTdrbbIC4h0LVsWhnoa3g+m2HclBIujHzsxZ4VJVA+GUuc2/LBw==",
+      "dev": true,
+      "license": "ISC",
+      "engines": {
+        "node": ">=12"
+      }
+    },
+    "node_modules/postcss-load-config": {
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/postcss-load-config/-/postcss-load-config-5.1.0.tgz",
+      "integrity": "sha512-G5AJ+IX0aD0dygOE0yFZQ/huFFMSNneyfp0e3/bT05a8OfPC5FUoZRPfGijUdGOJNMewJiwzcHJXFafFzeKFVA==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/postcss/"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "lilconfig": "^3.1.1",
+        "yaml": "^2.4.2"
+      },
+      "engines": {
+        "node": ">= 18"
+      },
+      "peerDependencies": {
+        "jiti": ">=1.21.0",
+        "postcss": ">=8.0.9",
+        "tsx": "^4.8.1"
+      },
+      "peerDependenciesMeta": {
+        "jiti": {
+          "optional": true
+        },
+        "postcss": {
+          "optional": true
+        },
+        "tsx": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/postcss-media-query-parser": {
+      "version": "0.2.3",
+      "resolved": "https://registry.npmjs.org/postcss-media-query-parser/-/postcss-media-query-parser-0.2.3.tgz",
+      "integrity": "sha512-3sOlxmbKcSHMjlUXQZKQ06jOswE7oVkXPxmZdoB1r5l0q6gTFTQSHxNxOrCccElbW7dxNytifNEo8qidX2Vsig==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/postcss-reporter": {
+      "version": "7.1.0",
+      "resolved": "https://registry.npmjs.org/postcss-reporter/-/postcss-reporter-7.1.0.tgz",
+      "integrity": "sha512-/eoEylGWyy6/DOiMP5lmFRdmDKThqgn7D6hP2dXKJI/0rJSO1ADFNngZfDzxL0YAxFvws+Rtpuji1YIHj4mySA==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/postcss/"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "picocolors": "^1.0.0",
+        "thenby": "^1.3.4"
+      },
+      "engines": {
+        "node": ">=10"
+      },
+      "peerDependencies": {
+        "postcss": "^8.1.0"
+      }
+    },
+    "node_modules/postcss-safe-parser": {
+      "version": "7.0.1",
+      "resolved": "https://registry.npmjs.org/postcss-safe-parser/-/postcss-safe-parser-7.0.1.tgz",
+      "integrity": "sha512-0AioNCJZ2DPYz5ABT6bddIqlhgwhpHZ/l65YAYo0BCIn0xiDpsnTHz0gnoTGk0OXZW0JRs+cDwL8u/teRdz+8A==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/postcss/"
+        },
+        {
+          "type": "tidelift",
+          "url": "https://tidelift.com/funding/github/npm/postcss-safe-parser"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "MIT",
+      "engines": {
+        "node": ">=18.0"
+      },
+      "peerDependencies": {
+        "postcss": "^8.4.31"
+      }
+    },
+    "node_modules/postcss-value-parser": {
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/postcss-value-parser/-/postcss-value-parser-4.2.0.tgz",
+      "integrity": "sha512-1NNCs6uurfkVbeXG4S8JFT9t19m45ICnif8zWLd5oPSZ50QnwMfK+H3jv408d4jw/7Bttv5axS5IiHoLaVNHeQ==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/preact": {
+      "version": "10.29.6",
+      "resolved": "https://registry.npmjs.org/preact/-/preact-10.29.6.tgz",
+      "integrity": "sha512-/UzLXnc1jrAS2uHi89XsSECqXVHYzV1VUL1L3esxrmPRmDvKFWtmbabE2a4QQ5a3bLgBivubRCEOt4GGmncPBQ==",
+      "license": "MIT",
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/preact"
+      }
+    },
+    "node_modules/preline": {
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/preline/-/preline-4.2.0.tgz",
+      "integrity": "sha512-lDdP5VzJDwVdWFDOUHKtkvWGxnsKt1o7Q9Sla19MMX03Lzzp4Pxwxs+TndcFZaNiSchYSDgSnjCsm7olV5JV3g==",
+      "license": "Licensed under MIT and Preline UI Fair Use License",
+      "dependencies": {
+        "@floating-ui/dom": "^1.6.13",
+        "@types/culori": "^4.0.1",
+        "apexcharts": "^4.5.0",
+        "culori": "^4.0.2",
+        "datatables.net-dt": "^2.2.2",
+        "dropzone": "^6.0.0-beta.2",
+        "nouislider": "^15.8.1",
+        "vanilla-calendar-pro": "^3.0.4"
+      },
+      "bin": {
+        "preline-theme-generator": "skills/theme-generator/scripts/generate-theme.js"
+      }
+    },
+    "node_modules/preline/node_modules/apexcharts": {
+      "version": "4.7.0",
+      "resolved": "https://registry.npmjs.org/apexcharts/-/apexcharts-4.7.0.tgz",
+      "integrity": "sha512-iZSrrBGvVlL+nt2B1NpqfDuBZ9jX61X9I2+XV0hlYXHtTwhwLTHDKGXjNXAgFBDLuvSYCB/rq2nPWVPRv2DrGA==",
+      "license": "MIT",
+      "dependencies": {
+        "@svgdotjs/svg.draggable.js": "^3.0.4",
+        "@svgdotjs/svg.filter.js": "^3.0.8",
+        "@svgdotjs/svg.js": "^3.2.4",
+        "@svgdotjs/svg.resize.js": "^2.0.2",
+        "@svgdotjs/svg.select.js": "^4.0.1",
+        "@yr/monotone-cubic-spline": "^1.0.3"
+      }
+    },
+    "node_modules/prelude-ls": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/prelude-ls/-/prelude-ls-1.2.1.tgz",
+      "integrity": "sha512-vkcDPrRZo1QZLbn5RLGPpg/WmIQ65qoWWhcGKf/b5eplkkarX0m9z8ppCat4mlOqUsWpyNuYgO3VRyrYHSzX5g==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8.0"
+      }
+    },
+    "node_modules/pretty-hrtime": {
+      "version": "1.0.3",
+      "resolved": "https://registry.npmjs.org/pretty-hrtime/-/pretty-hrtime-1.0.3.tgz",
+      "integrity": "sha512-66hKPCr+72mlfiSjlEB1+45IjXSqvVAIy6mocupoww4tBFE9R9IhwwUGoI4G++Tc9Aq+2rxOt0RFU6gPcrte0A==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/proc-log": {
+      "version": "6.1.0",
+      "resolved": "https://registry.npmjs.org/proc-log/-/proc-log-6.1.0.tgz",
+      "integrity": "sha512-iG+GYldRf2BQ0UDUAd6JQ/RwzaQy6mXmsk/IzlYyal4A4SNFw54MeH4/tLkF4I5WoWG9SQwuqWzS99jaFQHBuQ==",
+      "dev": true,
+      "license": "ISC",
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/promise-retry": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/promise-retry/-/promise-retry-2.0.1.tgz",
+      "integrity": "sha512-y+WKFlBR8BGXnsNlIHFGPZmyDf3DFMoLhaflAnyZgV6rG6xu+JwesTo2Q9R6XwYmtmwAFCkAk3e35jEdoeh/3g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "err-code": "^2.0.2",
+        "retry": "^0.12.0"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/protobufjs": {
+      "version": "7.6.1",
+      "resolved": "https://registry.npmjs.org/protobufjs/-/protobufjs-7.6.1.tgz",
+      "integrity": "sha512-4K0myLaWL5EteuSAro91EGFgcfVgxb64Jx+7oDAY6GOkXD4M69yuSEljNcInGVCA5sOPxmZ/EqDLj2x0Q0+Ygg==",
+      "hasInstallScript": true,
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "@protobufjs/aspromise": "^1.1.2",
+        "@protobufjs/base64": "^1.1.2",
+        "@protobufjs/codegen": "^2.0.5",
+        "@protobufjs/eventemitter": "^1.1.1",
+        "@protobufjs/fetch": "^1.1.1",
+        "@protobufjs/float": "^1.0.2",
+        "@protobufjs/inquire": "^1.1.2",
+        "@protobufjs/path": "^1.1.2",
+        "@protobufjs/pool": "^1.1.0",
+        "@protobufjs/utf8": "^1.1.1",
+        "@types/node": ">=13.7.0",
+        "long": "^5.3.2"
+      },
+      "engines": {
+        "node": ">=12.0.0"
+      }
+    },
+    "node_modules/proxy-addr": {
+      "version": "2.0.7",
+      "resolved": "https://registry.npmjs.org/proxy-addr/-/proxy-addr-2.0.7.tgz",
+      "integrity": "sha512-llQsMLSUDUPT44jdrU/O37qlnifitDP+ZwrmmZcoSKyLKvtZxpyV0n2/bD/N4tBAAZ/gJEdZU7KMraoK1+XYAg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "forwarded": "0.2.0",
+        "ipaddr.js": "1.9.1"
+      },
+      "engines": {
+        "node": ">= 0.10"
+      }
+    },
+    "node_modules/punycode": {
+      "version": "2.3.1",
+      "resolved": "https://registry.npmjs.org/punycode/-/punycode-2.3.1.tgz",
+      "integrity": "sha512-vYt7UD1U9Wg6138shLtLOvdAu+8DsC/ilFtEVHcH+wydcSpNE20AfSOduf6MkRFahL5FY7X1oU7nKVZFtfq8Fg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      }
+    },
+    "node_modules/qs": {
+      "version": "6.15.2",
+      "resolved": "https://registry.npmjs.org/qs/-/qs-6.15.2.tgz",
+      "integrity": "sha512-Rzq0KEyX/w/tEybncDgdkZrJgVUsUMk3xjh3t5bv3S1HTAtg+uOYt72+ZfwiQwKdysThkTBdL/rTi6HDmX9Ddw==",
+      "dev": true,
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "side-channel": "^1.1.0"
+      },
+      "engines": {
+        "node": ">=0.6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/range-parser": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/range-parser/-/range-parser-1.2.1.tgz",
+      "integrity": "sha512-Hrgsx+orqoygnmhFbKaHE6c296J+HTAQXoxEF6gNupROmmGJRoyzfG3ccAveqCBrwr/2yxQ5BVd/GTl5agOwSg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.6"
+      }
+    },
+    "node_modules/raw-body": {
+      "version": "3.0.2",
+      "resolved": "https://registry.npmjs.org/raw-body/-/raw-body-3.0.2.tgz",
+      "integrity": "sha512-K5zQjDllxWkf7Z5xJdV0/B0WTNqx6vxG70zJE4N0kBs4LovmEYWJzQGxC9bS9RAKu3bgM40lrd5zoLJ12MQ5BA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "bytes": "~3.1.2",
+        "http-errors": "~2.0.1",
+        "iconv-lite": "~0.7.0",
+        "unpipe": "~1.0.0"
+      },
+      "engines": {
+        "node": ">= 0.10"
+      }
+    },
+    "node_modules/read-cache": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz",
+      "integrity": "sha512-Owdv/Ft7IjOgm/i0xvNDZ1LrRANRfew4b2prF3OWMQLxLfu3bS8FVhCsrSCMK4lR56Y9ya+AThoTpDCTxCmpRA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "pify": "^2.3.0"
+      }
+    },
+    "node_modules/readdirp": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-5.0.0.tgz",
+      "integrity": "sha512-9u/XQ1pvrQtYyMpZe7DXKv2p5CNvyVwzUB6uhLAnQwHMSgKMBR62lc7AHljaeteeHXn11XTAaLLUVZYVZyuRBQ==",
+      "devOptional": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 20.19.0"
+      },
+      "funding": {
+        "type": "individual",
+        "url": "https://paulmillr.com/funding/"
+      }
+    },
+    "node_modules/reflect-metadata": {
+      "version": "0.2.2",
+      "resolved": "https://registry.npmjs.org/reflect-metadata/-/reflect-metadata-0.2.2.tgz",
+      "integrity": "sha512-urBwgfrvVP/eAyXx4hluJivBKzuEbSQs9rKWCrCkbSxNv8mxPcUZKeuoF3Uy4mJl3Lwprp6yy5/39VWigZ4K6Q==",
+      "dev": true,
+      "license": "Apache-2.0"
+    },
+    "node_modules/require-directory": {
+      "version": "2.1.1",
+      "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
+      "integrity": "sha512-fGxEI7+wsG9xrvdjsrlmL22OMTTiHRwAMroiEeMgq8gzoLC/PQr7RsRDSTLUg/bZAZtF+TVIkHc6/4RIKrui+Q==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/require-from-string": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/require-from-string/-/require-from-string-2.0.2.tgz",
+      "integrity": "sha512-Xf0nWe6RseziFMu+Ap9biiUbmplq6S9/p+7w7YXP/JBHhrUDDUhwa+vANyubuqfZWTveU//DYVGsDG7RKL/vEw==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/restore-cursor": {
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/restore-cursor/-/restore-cursor-5.1.0.tgz",
+      "integrity": "sha512-oMA2dcrw6u0YfxJQXm342bFKX/E4sG9rbTzO9ptUcR/e8A33cHuvStiYOwH7fszkZlZ1z/ta9AAoPk2F4qIOHA==",
+      "license": "MIT",
+      "dependencies": {
+        "onetime": "^7.0.0",
+        "signal-exit": "^4.1.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/retry": {
+      "version": "0.12.0",
+      "resolved": "https://registry.npmjs.org/retry/-/retry-0.12.0.tgz",
+      "integrity": "sha512-9LkiTwjUh6rT555DtE9rTX+BKByPfrMzEAtnlEtdEwr3Nkffwiihqe2bWADg+OQRjt9gl6ICdmB/ZFDCGAtSow==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 4"
+      }
+    },
+    "node_modules/rfdc": {
+      "version": "1.4.1",
+      "resolved": "https://registry.npmjs.org/rfdc/-/rfdc-1.4.1.tgz",
+      "integrity": "sha512-q1b3N5QkRUWUl7iyylaaj3kOpIT0N2i9MqIEQXP73GVsN9cw3fdx8X63cEmWhJGi2PPCF23Ijp7ktmd39rawIA==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/rolldown": {
+      "version": "1.0.0-rc.4",
+      "resolved": "https://registry.npmjs.org/rolldown/-/rolldown-1.0.0-rc.4.tgz",
+      "integrity": "sha512-V2tPDUrY3WSevrvU2E41ijZlpF+5PbZu4giH+VpNraaadsJGHa4fR6IFwsocVwEXDoAdIv5qgPPxgrvKAOIPtA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@oxc-project/types": "=0.113.0",
+        "@rolldown/pluginutils": "1.0.0-rc.4"
+      },
+      "bin": {
+        "rolldown": "bin/cli.mjs"
+      },
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      },
+      "optionalDependencies": {
+        "@rolldown/binding-android-arm64": "1.0.0-rc.4",
+        "@rolldown/binding-darwin-arm64": "1.0.0-rc.4",
+        "@rolldown/binding-darwin-x64": "1.0.0-rc.4",
+        "@rolldown/binding-freebsd-x64": "1.0.0-rc.4",
+        "@rolldown/binding-linux-arm-gnueabihf": "1.0.0-rc.4",
+        "@rolldown/binding-linux-arm64-gnu": "1.0.0-rc.4",
+        "@rolldown/binding-linux-arm64-musl": "1.0.0-rc.4",
+        "@rolldown/binding-linux-x64-gnu": "1.0.0-rc.4",
+        "@rolldown/binding-linux-x64-musl": "1.0.0-rc.4",
+        "@rolldown/binding-openharmony-arm64": "1.0.0-rc.4",
+        "@rolldown/binding-wasm32-wasi": "1.0.0-rc.4",
+        "@rolldown/binding-win32-arm64-msvc": "1.0.0-rc.4",
+        "@rolldown/binding-win32-x64-msvc": "1.0.0-rc.4"
+      }
+    },
+    "node_modules/rollup": {
+      "version": "4.60.4",
+      "resolved": "https://registry.npmjs.org/rollup/-/rollup-4.60.4.tgz",
+      "integrity": "sha512-WHeFSbZYsPu3+bLoNRUuAO+wavNlocOPf3wSHTP7hcFKVnJeWsYlCDbr3mTS14FCizf9ccIxXA8sGL8zKeQN3g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@types/estree": "1.0.8"
+      },
+      "bin": {
+        "rollup": "dist/bin/rollup"
+      },
+      "engines": {
+        "node": ">=18.0.0",
+        "npm": ">=8.0.0"
+      },
+      "optionalDependencies": {
+        "@rollup/rollup-android-arm-eabi": "4.60.4",
+        "@rollup/rollup-android-arm64": "4.60.4",
+        "@rollup/rollup-darwin-arm64": "4.60.4",
+        "@rollup/rollup-darwin-x64": "4.60.4",
+        "@rollup/rollup-freebsd-arm64": "4.60.4",
+        "@rollup/rollup-freebsd-x64": "4.60.4",
+        "@rollup/rollup-linux-arm-gnueabihf": "4.60.4",
+        "@rollup/rollup-linux-arm-musleabihf": "4.60.4",
+        "@rollup/rollup-linux-arm64-gnu": "4.60.4",
+        "@rollup/rollup-linux-arm64-musl": "4.60.4",
+        "@rollup/rollup-linux-loong64-gnu": "4.60.4",
+        "@rollup/rollup-linux-loong64-musl": "4.60.4",
+        "@rollup/rollup-linux-ppc64-gnu": "4.60.4",
+        "@rollup/rollup-linux-ppc64-musl": "4.60.4",
+        "@rollup/rollup-linux-riscv64-gnu": "4.60.4",
+        "@rollup/rollup-linux-riscv64-musl": "4.60.4",
+        "@rollup/rollup-linux-s390x-gnu": "4.60.4",
+        "@rollup/rollup-linux-x64-gnu": "4.60.4",
+        "@rollup/rollup-linux-x64-musl": "4.60.4",
+        "@rollup/rollup-openbsd-x64": "4.60.4",
+        "@rollup/rollup-openharmony-arm64": "4.60.4",
+        "@rollup/rollup-win32-arm64-msvc": "4.60.4",
+        "@rollup/rollup-win32-ia32-msvc": "4.60.4",
+        "@rollup/rollup-win32-x64-gnu": "4.60.4",
+        "@rollup/rollup-win32-x64-msvc": "4.60.4",
+        "fsevents": "~2.3.2"
+      }
+    },
+    "node_modules/router": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/router/-/router-2.2.0.tgz",
+      "integrity": "sha512-nLTrUKm2UyiL7rlhapu/Zl45FwNgkZGaCpZbIHajDYgwlJCOzLSk+cIPAnsEqV955GjILJnKbdQC1nVPz+gAYQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "debug": "^4.4.0",
+        "depd": "^2.0.0",
+        "is-promise": "^4.0.0",
+        "parseurl": "^1.3.3",
+        "path-to-regexp": "^8.0.0"
+      },
+      "engines": {
+        "node": ">= 18"
+      }
+    },
+    "node_modules/rxfire": {
+      "version": "6.1.0",
+      "resolved": "https://registry.npmjs.org/rxfire/-/rxfire-6.1.0.tgz",
+      "integrity": "sha512-NezdjeY32VZcCuGO0bbb8H8seBsJSCaWdUwGsHNzUcAOHR0VGpzgPtzjuuLXr8R/iemkqSzbx/ioS7VwV43ynA==",
+      "license": "Apache-2.0",
+      "peerDependencies": {
+        "firebase": "^9.0.0 || ^10.0.0 || ^11.0.0",
+        "rxjs": "^6.0.0 || ^7.0.0"
+      }
+    },
+    "node_modules/rxjs": {
+      "version": "7.8.2",
+      "resolved": "https://registry.npmjs.org/rxjs/-/rxjs-7.8.2.tgz",
+      "integrity": "sha512-dhKf903U/PQZY6boNNtAGdWbG85WAbjT/1xYoZIC7FAY0yWapOBQVsVrDl58W86//e1VpMNBtRV4MaXfdMySFA==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "tslib": "^2.1.0"
+      }
+    },
+    "node_modules/safe-buffer": {
+      "version": "5.2.1",
+      "resolved": "https://registry.npmjs.org/safe-buffer/-/safe-buffer-5.2.1.tgz",
+      "integrity": "sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ==",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/feross"
+        },
+        {
+          "type": "patreon",
+          "url": "https://www.patreon.com/feross"
+        },
+        {
+          "type": "consulting",
+          "url": "https://feross.org/support"
+        }
+      ],
+      "license": "MIT"
+    },
+    "node_modules/safer-buffer": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/safer-buffer/-/safer-buffer-2.1.2.tgz",
+      "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/sass": {
+      "version": "1.97.3",
+      "resolved": "https://registry.npmjs.org/sass/-/sass-1.97.3.tgz",
+      "integrity": "sha512-fDz1zJpd5GycprAbu4Q2PV/RprsRtKC/0z82z0JLgdytmcq0+ujJbJ/09bPGDxCLkKY3Np5cRAOcWiVkLXJURg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "chokidar": "^4.0.0",
+        "immutable": "^5.0.2",
+        "source-map-js": ">=0.6.2 <2.0.0"
+      },
+      "bin": {
+        "sass": "sass.js"
+      },
+      "engines": {
+        "node": ">=14.0.0"
+      },
+      "optionalDependencies": {
+        "@parcel/watcher": "^2.4.1"
+      }
+    },
+    "node_modules/sass/node_modules/chokidar": {
+      "version": "4.0.3",
+      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-4.0.3.tgz",
+      "integrity": "sha512-Qgzu8kfBvo+cA4962jnP1KkS6Dop5NS6g7R5LFYJr4b8Ub94PPQXUksCw9PvXoeXPRRddRNC5C1JQUR2SMGtnA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "readdirp": "^4.0.1"
+      },
+      "engines": {
+        "node": ">= 14.16.0"
+      },
+      "funding": {
+        "url": "https://paulmillr.com/funding/"
+      }
+    },
+    "node_modules/sass/node_modules/readdirp": {
+      "version": "4.1.2",
+      "resolved": "https://registry.npmjs.org/readdirp/-/readdirp-4.1.2.tgz",
+      "integrity": "sha512-GDhwkLfywWL2s6vEjyhri+eXmfH6j1L7JE27WhqLeYzoh/A3DBaYGEj2H/HFZCn/kMfim73FXxEJTw06WtxQwg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 14.18.0"
+      },
+      "funding": {
+        "type": "individual",
+        "url": "https://paulmillr.com/funding/"
+      }
+    },
+    "node_modules/saxes": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/saxes/-/saxes-6.0.0.tgz",
+      "integrity": "sha512-xAg7SOnEhrm5zI3puOOKyy1OMcMlIJZYNJY7xLBwSze0UjhPLnWfj2GF2EpT0jmzaJKIWKHLsaSSajf35bcYnA==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "xmlchars": "^2.2.0"
+      },
+      "engines": {
+        "node": ">=v12.22.7"
+      }
+    },
+    "node_modules/semver": {
+      "version": "7.7.4",
+      "resolved": "https://registry.npmjs.org/semver/-/semver-7.7.4.tgz",
+      "integrity": "sha512-vFKC2IEtQnVhpT78h1Yp8wzwrf8CM+MzKMHGJZfBtzhZNycRFnXsHk6E5TxIkkMsgNS7mdX3AGB7x2QM2di4lA==",
+      "dev": true,
+      "license": "ISC",
+      "bin": {
+        "semver": "bin/semver.js"
+      },
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/send": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/send/-/send-1.2.1.tgz",
+      "integrity": "sha512-1gnZf7DFcoIcajTjTwjwuDjzuz4PPcY2StKPlsGAQ1+YH20IRVrBaXSWmdjowTJ6u8Rc01PoYOGHXfP1mYcZNQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "debug": "^4.4.3",
+        "encodeurl": "^2.0.0",
+        "escape-html": "^1.0.3",
+        "etag": "^1.8.1",
+        "fresh": "^2.0.0",
+        "http-errors": "^2.0.1",
+        "mime-types": "^3.0.2",
+        "ms": "^2.1.3",
+        "on-finished": "^2.4.1",
+        "range-parser": "^1.2.1",
+        "statuses": "^2.0.2"
+      },
+      "engines": {
+        "node": ">= 18"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/serve-static": {
+      "version": "2.2.1",
+      "resolved": "https://registry.npmjs.org/serve-static/-/serve-static-2.2.1.tgz",
+      "integrity": "sha512-xRXBn0pPqQTVQiC8wyQrKs2MOlX24zQ0POGaj0kultvoOCstBQM5yvOhAVSUwOMjQtTvsPWoNCHfPGwaaQJhTw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "encodeurl": "^2.0.0",
+        "escape-html": "^1.0.3",
+        "parseurl": "^1.3.3",
+        "send": "^1.2.0"
+      },
+      "engines": {
+        "node": ">= 18"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/setprototypeof": {
+      "version": "1.2.0",
+      "resolved": "https://registry.npmjs.org/setprototypeof/-/setprototypeof-1.2.0.tgz",
+      "integrity": "sha512-E5LDX7Wrp85Kil5bhZv46j8jOeboKq5JMmYM3gVGdGH8xFpPWXUMsNrlODCrkoxMEeNi/XZIwuRvY4XNwYMJpw==",
+      "dev": true,
+      "license": "ISC"
+    },
+    "node_modules/shebang-command": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-2.0.0.tgz",
+      "integrity": "sha512-kHxr2zZpYtdmrN1qDjrrX/Z1rR1kG8Dx+gkpK1G4eXmvXswmcE1hTWBWYUzlraYw1/yZp6YuDY77YtvbN0dmDA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "shebang-regex": "^3.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/shebang-regex": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/shebang-regex/-/shebang-regex-3.0.0.tgz",
+      "integrity": "sha512-7++dFhtcx3353uBaq8DDR4NuxBetBzC7ZQOhmTQInHEd6bSrXdiEyzCvG07Z44UYdLShWUyXt5M/yhz8ekcb1A==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/side-channel": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/side-channel/-/side-channel-1.1.0.tgz",
+      "integrity": "sha512-ZX99e6tRweoUXqR+VBrslhda51Nh5MTQwou5tnUDgbtyM0dBgmhEDtWGP/xbKn6hqfPRHujUNwz5fy/wbbhnpw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0",
+        "object-inspect": "^1.13.3",
+        "side-channel-list": "^1.0.0",
+        "side-channel-map": "^1.0.1",
+        "side-channel-weakmap": "^1.0.2"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/side-channel-list": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/side-channel-list/-/side-channel-list-1.0.1.tgz",
+      "integrity": "sha512-mjn/0bi/oUURjc5Xl7IaWi/OJJJumuoJFQJfDDyO46+hBWsfaVM65TBHq2eoZBhzl9EchxOijpkbRC8SVBQU0w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "es-errors": "^1.3.0",
+        "object-inspect": "^1.13.4"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/side-channel-map": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/side-channel-map/-/side-channel-map-1.0.1.tgz",
+      "integrity": "sha512-VCjCNfgMsby3tTdo02nbjtM/ewra6jPHmpThenkTYh8pG9ucZ/1P8So4u4FGBek/BjpOVsDCMoLA/iuBKIFXRA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.2",
+        "es-errors": "^1.3.0",
+        "get-intrinsic": "^1.2.5",
+        "object-inspect": "^1.13.3"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/side-channel-weakmap": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/side-channel-weakmap/-/side-channel-weakmap-1.0.2.tgz",
+      "integrity": "sha512-WPS/HvHQTYnHisLo9McqBHOJk2FkHO/tlpvldyrnem4aeQp4hai3gythswg6p01oSoTl58rcpiFAjF2br2Ak2A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "call-bound": "^1.0.2",
+        "es-errors": "^1.3.0",
+        "get-intrinsic": "^1.2.5",
+        "object-inspect": "^1.13.3",
+        "side-channel-map": "^1.0.1"
+      },
+      "engines": {
+        "node": ">= 0.4"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ljharb"
+      }
+    },
+    "node_modules/siginfo": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/siginfo/-/siginfo-2.0.0.tgz",
+      "integrity": "sha512-ybx0WO1/8bSBLEWXZvEd7gMW3Sn3JFlW3TvX1nREbDLRNQNaeNN8WK0meBwPdAaOI7TtRRRJn/Es1zhrrCHu7g==",
+      "dev": true,
+      "license": "ISC"
+    },
+    "node_modules/signal-exit": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-4.1.0.tgz",
+      "integrity": "sha512-bzyZ1e88w9O1iNJbKnOlvYTrWPDl46O1bG0D3XInv+9tkPrxrN8jUUTiFlDkkmKWgn1M6CfIA13SuGqOa9Korw==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=14"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/isaacs"
+      }
+    },
+    "node_modules/sigstore": {
+      "version": "4.1.1",
+      "resolved": "https://registry.npmjs.org/sigstore/-/sigstore-4.1.1.tgz",
+      "integrity": "sha512-endqECJkfhozrXMK5ngu/UAA0xVcVEFdnHJCElGaExypjW+HK5i6zu3NteLoaX/iFbRUbC3+DjttQs0GARr+5w==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "dependencies": {
+        "@sigstore/bundle": "^4.0.0",
+        "@sigstore/core": "^3.2.1",
+        "@sigstore/protobuf-specs": "^0.5.0",
+        "@sigstore/sign": "^4.1.1",
+        "@sigstore/tuf": "^4.0.2",
+        "@sigstore/verify": "^3.1.1"
+      },
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/simplebar-angular": {
+      "version": "3.3.2",
+      "resolved": "https://registry.npmjs.org/simplebar-angular/-/simplebar-angular-3.3.2.tgz",
+      "integrity": "sha512-3AsJUVUlqE/L4w91FLgLhTXYY3IgunFE14ZXCtKVbnnxiUbu3WRst98NqtHtj8ydrDWNt3ZUa0RS4Xii3ZGIGw==",
+      "license": "MIT",
+      "dependencies": {
+        "simplebar-core": "^1.3.2",
+        "tslib": "^2.3.0"
+      },
+      "peerDependencies": {
+        "@angular/common": ">=12.0.0",
+        "@angular/core": ">=12.0.0"
+      }
+    },
+    "node_modules/simplebar-core": {
+      "version": "1.3.2",
+      "resolved": "https://registry.npmjs.org/simplebar-core/-/simplebar-core-1.3.2.tgz",
+      "integrity": "sha512-qKgTTuTqapjsFGkNhCjyPhysnbZGpQqNmjk0nOYjFN5ordC/Wjvg+RbYCyMSnW60l/Z0ZS82GbNltly6PMUH1w==",
+      "license": "MIT",
+      "dependencies": {
+        "lodash": "^4.17.21",
+        "lodash-es": "^4.17.21"
+      }
+    },
+    "node_modules/slash": {
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/slash/-/slash-5.1.0.tgz",
+      "integrity": "sha512-ZA6oR3T/pEyuqwMgAKT0/hAv8oAXckzbkmR0UkUosQ+Mc4RxGoJkRmwHgHufaenlyAgE1Mxgpdcrf75y6XcnDg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=14.16"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/slice-ansi": {
+      "version": "8.0.0",
+      "resolved": "https://registry.npmjs.org/slice-ansi/-/slice-ansi-8.0.0.tgz",
+      "integrity": "sha512-stxByr12oeeOyY2BlviTNQlYV5xOj47GirPr4yA1hE9JCtxfQN0+tVbkxwCtYDQWhEKWFHsEK48ORg5jrouCAg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-styles": "^6.2.3",
+        "is-fullwidth-code-point": "^5.1.0"
+      },
+      "engines": {
+        "node": ">=20"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/slice-ansi?sponsor=1"
+      }
+    },
+    "node_modules/smart-buffer": {
+      "version": "4.2.0",
+      "resolved": "https://registry.npmjs.org/smart-buffer/-/smart-buffer-4.2.0.tgz",
+      "integrity": "sha512-94hK0Hh8rPqQl2xXc3HsaBoOXKV20MToPkcXvwbISWLEs+64sBq5kFgn2kJDHb1Pry9yrP0dxrCI9RRci7RXKg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 6.0.0",
+        "npm": ">= 3.0.0"
+      }
+    },
+    "node_modules/socks": {
+      "version": "2.8.9",
+      "resolved": "https://registry.npmjs.org/socks/-/socks-2.8.9.tgz",
+      "integrity": "sha512-LJhUYUvItdQ0LkJTmPeaEObWXAqFyfmP85x0tch/ez9cahmhlBBLbIqDFnvBnUJGagb0JbIQrkBs1wJ+yRYpEw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ip-address": "^10.1.1",
+        "smart-buffer": "^4.2.0"
+      },
+      "engines": {
+        "node": ">= 10.0.0",
+        "npm": ">= 3.0.0"
+      }
+    },
+    "node_modules/socks-proxy-agent": {
+      "version": "8.0.5",
+      "resolved": "https://registry.npmjs.org/socks-proxy-agent/-/socks-proxy-agent-8.0.5.tgz",
+      "integrity": "sha512-HehCEsotFqbPW9sJ8WVYB6UbmIMv7kUUORIF2Nncq4VQvBfNBLibW9YZR5dlYCSUhwcD628pRllm7n+E+YTzJw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "agent-base": "^7.1.2",
+        "debug": "^4.3.4",
+        "socks": "^2.8.3"
+      },
+      "engines": {
+        "node": ">= 14"
+      }
+    },
+    "node_modules/source-map": {
+      "version": "0.7.6",
+      "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.7.6.tgz",
+      "integrity": "sha512-i5uvt8C3ikiWeNZSVZNWcfZPItFQOsYTUAOkcUPGd8DqDy1uOUikjt5dG+uRlwyvR108Fb9DOd4GvXfT0N2/uQ==",
+      "license": "BSD-3-Clause",
+      "engines": {
+        "node": ">= 12"
+      }
+    },
+    "node_modules/source-map-js": {
+      "version": "1.2.1",
+      "resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.1.tgz",
+      "integrity": "sha512-UXWMKhLOwVKb728IUtQPXxfYU+usdybtUrK/8uGE8CQMvrhOpwvzDBwj0QhSL7MQc7vIsISBG8VQ8+IDQxpfQA==",
+      "dev": true,
+      "license": "BSD-3-Clause",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/source-map-support": {
+      "version": "0.5.21",
+      "resolved": "https://registry.npmjs.org/source-map-support/-/source-map-support-0.5.21.tgz",
+      "integrity": "sha512-uBHU3L3czsIyYXKX88fdrGovxdSCoTGDRZ6SYXtSRxLZUzHg5P/66Ht6uoUlHu9EZod+inXhKo3qQgwXUT/y1w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "buffer-from": "^1.0.0",
+        "source-map": "^0.6.0"
+      }
+    },
+    "node_modules/source-map-support/node_modules/source-map": {
+      "version": "0.6.1",
+      "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.6.1.tgz",
+      "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
+      "dev": true,
+      "license": "BSD-3-Clause",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/spdx-exceptions": {
+      "version": "2.5.0",
+      "resolved": "https://registry.npmjs.org/spdx-exceptions/-/spdx-exceptions-2.5.0.tgz",
+      "integrity": "sha512-PiU42r+xO4UbUS1buo3LPJkjlO7430Xn5SVAhdpzzsPHsjbYVflnnFdATgabnLude+Cqu25p6N+g2lw/PFsa4w==",
+      "dev": true,
+      "license": "CC-BY-3.0"
+    },
+    "node_modules/spdx-expression-parse": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/spdx-expression-parse/-/spdx-expression-parse-4.0.0.tgz",
+      "integrity": "sha512-Clya5JIij/7C6bRR22+tnGXbc4VKlibKSVj2iHvVeX5iMW7s1SIQlqu699JkODJJIhh/pUu8L0/VLh8xflD+LQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "spdx-exceptions": "^2.1.0",
+        "spdx-license-ids": "^3.0.0"
+      }
+    },
+    "node_modules/spdx-license-ids": {
+      "version": "3.0.23",
+      "resolved": "https://registry.npmjs.org/spdx-license-ids/-/spdx-license-ids-3.0.23.tgz",
+      "integrity": "sha512-CWLcCCH7VLu13TgOH+r8p1O/Znwhqv/dbb6lqWy67G+pT1kHmeD/+V36AVb/vq8QMIQwVShJ6Ssl5FPh0fuSdw==",
+      "dev": true,
+      "license": "CC0-1.0"
+    },
+    "node_modules/ssri": {
+      "version": "13.0.1",
+      "resolved": "https://registry.npmjs.org/ssri/-/ssri-13.0.1.tgz",
+      "integrity": "sha512-QUiRf1+u9wPTL/76GTYlKttDEBWV1ga9ZXW8BG6kfdeyyM8LGPix9gROyg9V2+P0xNyF3X2Go526xKFdMZrHSQ==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "minipass": "^7.0.3"
+      },
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/stackback": {
+      "version": "0.0.2",
+      "resolved": "https://registry.npmjs.org/stackback/-/stackback-0.0.2.tgz",
+      "integrity": "sha512-1XMJE5fQo1jGH6Y/7ebnwPOBEkIEnT4QF32d5R1+VXdXveM0IBMJt8zfaxX1P3QhVwrYe+576+jkANtSS2mBbw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/statuses": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/statuses/-/statuses-2.0.2.tgz",
+      "integrity": "sha512-DvEy55V3DB7uknRo+4iOGT5fP1slR8wQohVdknigZPMpMstaKJQWhwiYBACJE3Ul2pTnATihhBYnRhZQHGBiRw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/std-env": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/std-env/-/std-env-4.1.0.tgz",
+      "integrity": "sha512-Rq7ybcX2RuC55r9oaPVEW7/xu3tj8u4GeBYHBWCychFtzMIr86A7e3PPEBPT37sHStKX3+TiX/Fr/ACmJLVlLQ==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/stdin-discarder": {
+      "version": "0.3.2",
+      "resolved": "https://registry.npmjs.org/stdin-discarder/-/stdin-discarder-0.3.2.tgz",
+      "integrity": "sha512-eCPu1qRxPVkl5605OTWF8Wz40b4Mf45NY5LQmVPQ599knfs5QhASUm9GbJ5BDMDOXgrnh0wyEdvzmL//YMlw0A==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/string-width": {
+      "version": "8.2.1",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-8.2.1.tgz",
+      "integrity": "sha512-IIaP0g3iy9Cyy18w3M9YcaDudujEAVHKt3a3QJg1+sr/oX96TbaGUubG0hJyCjCBThFH+tFpcIyoUHUn1ogaLA==",
+      "license": "MIT",
+      "dependencies": {
+        "get-east-asian-width": "^1.5.0",
+        "strip-ansi": "^7.1.2"
+      },
+      "engines": {
+        "node": ">=20"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/strip-ansi": {
+      "version": "7.2.0",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-7.2.0.tgz",
+      "integrity": "sha512-yDPMNjp4WyfYBkHnjIRLfca1i6KMyGCtsVgoKe/z1+6vukgaENdgGBZt+ZmKPc4gavvEZ5OgHfHdrazhgNyG7w==",
+      "license": "MIT",
+      "dependencies": {
+        "ansi-regex": "^6.2.2"
+      },
+      "engines": {
+        "node": ">=12"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/strip-ansi?sponsor=1"
+      }
+    },
+    "node_modules/strip-json-comments": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/strip-json-comments/-/strip-json-comments-3.1.1.tgz",
+      "integrity": "sha512-6fPc+R4ihwqP6N/aIv2f1gMH8lOVtWQHoqC4yK6oSDVVocumAsfCqjkXnqiYMhmMwS/mEHLp7Vehlt3ql6lEig==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/sweetalert2": {
+      "version": "11.26.25",
+      "resolved": "https://registry.npmjs.org/sweetalert2/-/sweetalert2-11.26.25.tgz",
+      "integrity": "sha512-+hunCOJdJ6FLj04T9YSLvvZXRjsvIkTeTKP2e4VF8CaBias961BTnWiSFAy7F/CM5eq3QK2Rraoc5Gzftslvkg==",
+      "license": "MIT",
+      "funding": {
+        "type": "individual",
+        "url": "https://github.com/sponsors/limonte"
+      }
+    },
+    "node_modules/symbol-tree": {
+      "version": "3.2.4",
+      "resolved": "https://registry.npmjs.org/symbol-tree/-/symbol-tree-3.2.4.tgz",
+      "integrity": "sha512-9QNk5KwDF+Bvz+PyObkmSYjI5ksVUYtjW7AU22r2NKcfLJcXp96hkDWU3+XndOsUb+AQ9QhfzfCT2O+CNWT5Tw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/tailwindcss": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-4.3.0.tgz",
+      "integrity": "sha512-y6nxMGB1nMW9R6k96e5gdIFzcfL/gTJRNaqGes1YvkLnPVXzWgbqFF2yLC0T8G774n24cx3Pe8XrKoniCOAH+Q==",
+      "license": "MIT"
+    },
+    "node_modules/tapable": {
+      "version": "2.3.3",
+      "resolved": "https://registry.npmjs.org/tapable/-/tapable-2.3.3.tgz",
+      "integrity": "sha512-uxc/zpqFg6x7C8vOE7lh6Lbda8eEL9zmVm/PLeTPBRhh1xCgdWaQ+J1CUieGpIfm2HdtsUpRv+HshiasBMcc6A==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=6"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/webpack"
+      }
+    },
+    "node_modules/tar": {
+      "version": "7.5.15",
+      "resolved": "https://registry.npmjs.org/tar/-/tar-7.5.15.tgz",
+      "integrity": "sha512-dzGK0boVlC4W5QFuQN1EFSl3bIDYsk7Tj40U6eIBnK2k/8ml7TZ5agbI5j5+qnoVcAA+rNtBml8SEiLxZpNqRQ==",
+      "dev": true,
+      "license": "BlueOak-1.0.0",
+      "dependencies": {
+        "@isaacs/fs-minipass": "^4.0.0",
+        "chownr": "^3.0.0",
+        "minipass": "^7.1.2",
+        "minizlib": "^3.1.0",
+        "yallist": "^5.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/tar/node_modules/yallist": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/yallist/-/yallist-5.0.0.tgz",
+      "integrity": "sha512-YgvUTfwqyc7UXVMrB+SImsVYSmTS8X/tSrtdNZMImM+n7+QTriRXyXim0mBrTXNeqzVF0KWGgHPeiyViFFrNDw==",
+      "dev": true,
+      "license": "BlueOak-1.0.0",
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/thenby": {
+      "version": "1.4.1",
+      "resolved": "https://registry.npmjs.org/thenby/-/thenby-1.4.1.tgz",
+      "integrity": "sha512-D5a/bO0KdalOE3q8MlrRmSxjbKZHT3MQmXkJP+r97Vw8MMwOZKOwUSEyTtK7eSMj2y0kyAjpYMRMZmmLw1FtNQ==",
+      "dev": true,
+      "license": "Apache-2.0"
+    },
+    "node_modules/tinybench": {
+      "version": "2.9.0",
+      "resolved": "https://registry.npmjs.org/tinybench/-/tinybench-2.9.0.tgz",
+      "integrity": "sha512-0+DUvqWMValLmha6lr4kD8iAMK1HzV0/aKnCtWb9v9641TnP/MFb7Pc2bxoxQjTXAErryXVgUOfv2YqNllqGeg==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/tinyexec": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/tinyexec/-/tinyexec-1.1.2.tgz",
+      "integrity": "sha512-dAqSqE/RabpBKI8+h26GfLq6Vb3JVXs30XYQjdMjaj/c2tS8IYYMbIzP599KtRj7c57/wYApb3QjgRgXmrCukA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/tinyglobby": {
+      "version": "0.2.15",
+      "resolved": "https://registry.npmjs.org/tinyglobby/-/tinyglobby-0.2.15.tgz",
+      "integrity": "sha512-j2Zq4NyQYG5XMST4cbs02Ak8iJUdxRM0XI5QyxXuZOzKOINmWurp3smXu3y5wDcJrptwpSjgXHzIQxR0omXljQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "fdir": "^6.5.0",
+        "picomatch": "^4.0.3"
+      },
+      "engines": {
+        "node": ">=12.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/SuperchupuDev"
+      }
+    },
+    "node_modules/tinyrainbow": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/tinyrainbow/-/tinyrainbow-3.1.0.tgz",
+      "integrity": "sha512-Bf+ILmBgretUrdJxzXM0SgXLZ3XfiaUuOj/IKQHuTXip+05Xn+uyEYdVg0kYDipTBcLrCVyUzAPz7QmArb0mmw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=14.0.0"
+      }
+    },
+    "node_modules/tldts": {
+      "version": "7.0.30",
+      "resolved": "https://registry.npmjs.org/tldts/-/tldts-7.0.30.tgz",
+      "integrity": "sha512-ELrFxuqsDdHUwoh0XxDbxuLD3Wnz49Z57IFvTtvWy1hJdcMZjXLIuonjilCiWHlT2GbE4Wlv1wKVTzDFnXH1aw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "tldts-core": "^7.0.30"
+      },
+      "bin": {
+        "tldts": "bin/cli.js"
+      }
+    },
+    "node_modules/tldts-core": {
+      "version": "7.0.30",
+      "resolved": "https://registry.npmjs.org/tldts-core/-/tldts-core-7.0.30.tgz",
+      "integrity": "sha512-uiHN8PIB1VmWyS98eZYja4xzlYqeFZVjb4OuYlJQnZAuJhMw4PbKQOKgHKhBdJR3FE/t5mUQ1Kd80++B+qhD1Q==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/to-regex-range": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/to-regex-range/-/to-regex-range-5.0.1.tgz",
+      "integrity": "sha512-65P7iz6X5yEr1cwcgvQxbbIw7Uk3gOy5dIdtZ4rDveLqhrdJP+Li/Hx6tyK0NEb+2GCyneCMJiGqrADCSNk8sQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "is-number": "^7.0.0"
+      },
+      "engines": {
+        "node": ">=8.0"
+      }
+    },
+    "node_modules/toidentifier": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/toidentifier/-/toidentifier-1.0.1.tgz",
+      "integrity": "sha512-o5sSPKEkg/DIQNmH43V0/uerLrpzVedkUh8tGNvaeXpfpuwjKenlSox/2O/BTlZUtEe+JG7s5YhEz608PlAHRA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.6"
+      }
+    },
+    "node_modules/tough-cookie": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-6.0.1.tgz",
+      "integrity": "sha512-LktZQb3IeoUWB9lqR5EWTHgW/VTITCXg4D21M+lvybRVdylLrRMnqaIONLVb5mav8vM19m44HIcGq4qASeu2Qw==",
+      "dev": true,
+      "license": "BSD-3-Clause",
+      "dependencies": {
+        "tldts": "^7.0.5"
+      },
+      "engines": {
+        "node": ">=16"
+      }
+    },
+    "node_modules/tr46": {
+      "version": "6.0.0",
+      "resolved": "https://registry.npmjs.org/tr46/-/tr46-6.0.0.tgz",
+      "integrity": "sha512-bLVMLPtstlZ4iMQHpFHTR7GAGj2jxi8Dg0s2h2MafAE4uSWF98FC/3MomU51iQAMf8/qDUbKWf5GxuvvVcXEhw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "punycode": "^2.3.1"
+      },
+      "engines": {
+        "node": ">=20"
+      }
+    },
+    "node_modules/ts-api-utils": {
+      "version": "2.5.0",
+      "resolved": "https://registry.npmjs.org/ts-api-utils/-/ts-api-utils-2.5.0.tgz",
+      "integrity": "sha512-OJ/ibxhPlqrMM0UiNHJ/0CKQkoKF243/AEmplt3qpRgkW8VG7IfOS41h7V8TjITqdByHzrjcS/2si+y4lIh8NA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18.12"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4"
+      }
+    },
+    "node_modules/tslib": {
+      "version": "2.8.1",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz",
+      "integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==",
+      "license": "0BSD"
+    },
+    "node_modules/tsparticles": {
+      "version": "3.9.1",
+      "resolved": "https://registry.npmjs.org/tsparticles/-/tsparticles-3.9.1.tgz",
+      "integrity": "sha512-Y780IGSL4qjkZj7+fI92PV/cziHqLR/s6nnYri4K6vH3NQRmDK5D6pfskDO8T4Y96ChCWHY3uxPtOb/hKQ83Qg==",
+      "deprecated": "tsParticles v4 is out, please upgrade for better performances and more features",
+      "funding": [
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/matteobruni"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/tsparticles"
+        },
+        {
+          "type": "buymeacoffee",
+          "url": "https://www.buymeacoffee.com/matteobruni"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "@tsparticles/engine": "3.9.1",
+        "@tsparticles/interaction-external-trail": "3.9.1",
+        "@tsparticles/plugin-absorbers": "3.9.1",
+        "@tsparticles/plugin-emitters": "3.9.1",
+        "@tsparticles/plugin-emitters-shape-circle": "3.9.1",
+        "@tsparticles/plugin-emitters-shape-square": "3.9.1",
+        "@tsparticles/shape-text": "3.9.1",
+        "@tsparticles/slim": "3.9.1",
+        "@tsparticles/updater-destroy": "3.9.1",
+        "@tsparticles/updater-roll": "3.9.1",
+        "@tsparticles/updater-tilt": "3.9.1",
+        "@tsparticles/updater-twinkle": "3.9.1",
+        "@tsparticles/updater-wobble": "3.9.1"
+      }
+    },
+    "node_modules/tuf-js": {
+      "version": "4.1.0",
+      "resolved": "https://registry.npmjs.org/tuf-js/-/tuf-js-4.1.0.tgz",
+      "integrity": "sha512-50QV99kCKH5P/Vs4E2Gzp7BopNV+KzTXqWeaxrfu5IQJBOULRsTIS9seSsOVT8ZnGXzCyx55nYWAi4qJzpZKEQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@tufjs/models": "4.1.0",
+        "debug": "^4.4.3",
+        "make-fetch-happen": "^15.0.1"
+      },
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/type-check": {
+      "version": "0.4.0",
+      "resolved": "https://registry.npmjs.org/type-check/-/type-check-0.4.0.tgz",
+      "integrity": "sha512-XleUoc9uwGXqjWwXaUTZAmzMcFZ5858QA2vvx1Ur5xIcixXIP+8LnFDgRplU30us6teqdlskFfu+ae4K79Ooew==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "prelude-ls": "^1.2.1"
+      },
+      "engines": {
+        "node": ">= 0.8.0"
+      }
+    },
+    "node_modules/type-is": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/type-is/-/type-is-2.1.0.tgz",
+      "integrity": "sha512-faYHw0anBbc/kWF3zFTEnxSFOAGUX9GFbOBthvDdLsIlEoWOFOtS0zgCiQYwIskL9iGXZL3kAXD8OoZ4GmMATA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "content-type": "^2.0.0",
+        "media-typer": "^1.1.0",
+        "mime-types": "^3.0.0"
+      },
+      "engines": {
+        "node": ">= 18"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/type-is/node_modules/content-type": {
+      "version": "2.0.0",
+      "resolved": "https://registry.npmjs.org/content-type/-/content-type-2.0.0.tgz",
+      "integrity": "sha512-j/O/d7GcZCyNl7/hwZAb606rzqkyvaDctLmckbxLzHvFBzTJHuGEdodATcP3yIRoDrLHkIATJuvzbFlp/ki2cQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/express"
+      }
+    },
+    "node_modules/typescript": {
+      "version": "5.9.3",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.9.3.tgz",
+      "integrity": "sha512-jl1vZzPDinLr9eUt3J/t7V6FgNEw9QjvBPdysz9KfQDD41fQrC2Y4vKQdiaUpFT4bXlb1RHhLpp8wtm6M5TgSw==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "bin": {
+        "tsc": "bin/tsc",
+        "tsserver": "bin/tsserver"
+      },
+      "engines": {
+        "node": ">=14.17"
+      }
+    },
+    "node_modules/typescript-eslint": {
+      "version": "8.59.2",
+      "resolved": "https://registry.npmjs.org/typescript-eslint/-/typescript-eslint-8.59.2.tgz",
+      "integrity": "sha512-pJw051uomb3ZeCzGTpRb8RbEqB5Y4WWet8gl/GcTlU35BSx0PVdZ86/bqkQCyKKuraVQEK7r6kBHQXF+fBhkoQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/eslint-plugin": "8.59.2",
+        "@typescript-eslint/parser": "8.59.2",
+        "@typescript-eslint/typescript-estree": "8.59.2",
+        "@typescript-eslint/utils": "8.59.2"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "eslint": "^8.57.0 || ^9.0.0 || ^10.0.0",
+        "typescript": ">=4.8.4 <6.1.0"
+      }
+    },
+    "node_modules/typescript-eslint/node_modules/@typescript-eslint/project-service": {
+      "version": "8.59.2",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/project-service/-/project-service-8.59.2.tgz",
+      "integrity": "sha512-+2hqvEkeyf/0FBor67duF0Ll7Ot8jyKzDQOSrxazF/danillRq2DwR9dLptsXpoZQqxE1UisSmoZewrlPas9Vw==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/tsconfig-utils": "^8.59.2",
+        "@typescript-eslint/types": "^8.59.2",
+        "debug": "^4.4.3"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <6.1.0"
+      }
+    },
+    "node_modules/typescript-eslint/node_modules/@typescript-eslint/scope-manager": {
+      "version": "8.59.2",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/scope-manager/-/scope-manager-8.59.2.tgz",
+      "integrity": "sha512-JzfyEpEtOU89CcFSwyNS3mu4MLvLSXqnmX05+aKBDM+TdR5jzcGOEBwxwGNxrEQ7p/z6kK2WyioCGBf2zZBnvg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/types": "8.59.2",
+        "@typescript-eslint/visitor-keys": "8.59.2"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      }
+    },
+    "node_modules/typescript-eslint/node_modules/@typescript-eslint/tsconfig-utils": {
+      "version": "8.59.2",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/tsconfig-utils/-/tsconfig-utils-8.59.2.tgz",
+      "integrity": "sha512-BKK4alN7oi4C/zv4VqHQ+uRU+lTa6JGIZ7s1juw7b3RHo9OfKB+bKX3u0iVZetdsUCBBkSbdWbarJbmN0fTeSw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <6.1.0"
+      }
+    },
+    "node_modules/typescript-eslint/node_modules/@typescript-eslint/types": {
+      "version": "8.59.2",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/types/-/types-8.59.2.tgz",
+      "integrity": "sha512-e82GVOE8Ps3E++Egvb6Y3Dw0S10u8NkQ9KXmtRhCWJJ8kDhOJTvtMAWnFL16kB1583goCWXsr0NieKCZMs2/0Q==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      }
+    },
+    "node_modules/typescript-eslint/node_modules/@typescript-eslint/typescript-estree": {
+      "version": "8.59.2",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/typescript-estree/-/typescript-estree-8.59.2.tgz",
+      "integrity": "sha512-o0XPGNwcWw+FIwStOWn+BwBuEmL6QXP0rsvAFg7ET1dey1Nr6Wb1ac8p5HEsK0ygO/6mUxlk+YWQD9xcb/nnXg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/project-service": "8.59.2",
+        "@typescript-eslint/tsconfig-utils": "8.59.2",
+        "@typescript-eslint/types": "8.59.2",
+        "@typescript-eslint/visitor-keys": "8.59.2",
+        "debug": "^4.4.3",
+        "minimatch": "^10.2.2",
+        "semver": "^7.7.3",
+        "tinyglobby": "^0.2.15",
+        "ts-api-utils": "^2.5.0"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "typescript": ">=4.8.4 <6.1.0"
+      }
+    },
+    "node_modules/typescript-eslint/node_modules/@typescript-eslint/utils": {
+      "version": "8.59.2",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/utils/-/utils-8.59.2.tgz",
+      "integrity": "sha512-Juw3EinkXqjaffxz6roowvV7GZT/kET5vSKKZT6upl5TXdWkLkYmNPXwDDL2Vkt2DPn0nODIS4egC/0AGxKo/Q==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@eslint-community/eslint-utils": "^4.9.1",
+        "@typescript-eslint/scope-manager": "8.59.2",
+        "@typescript-eslint/types": "8.59.2",
+        "@typescript-eslint/typescript-estree": "8.59.2"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      },
+      "peerDependencies": {
+        "eslint": "^8.57.0 || ^9.0.0 || ^10.0.0",
+        "typescript": ">=4.8.4 <6.1.0"
+      }
+    },
+    "node_modules/typescript-eslint/node_modules/@typescript-eslint/visitor-keys": {
+      "version": "8.59.2",
+      "resolved": "https://registry.npmjs.org/@typescript-eslint/visitor-keys/-/visitor-keys-8.59.2.tgz",
+      "integrity": "sha512-NwjLUnGy8/Zfx23fl50tRC8rYaYnM52xNRYFAXvmiil9yh1+K6aRVQMnzW6gQB/1DLgWt977lYQn7C+wtgXZiA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@typescript-eslint/types": "8.59.2",
+        "eslint-visitor-keys": "^5.0.0"
+      },
+      "engines": {
+        "node": "^18.18.0 || ^20.9.0 || >=21.1.0"
+      },
+      "funding": {
+        "type": "opencollective",
+        "url": "https://opencollective.com/typescript-eslint"
+      }
+    },
+    "node_modules/typescript-eslint/node_modules/eslint-visitor-keys": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/eslint-visitor-keys/-/eslint-visitor-keys-5.0.1.tgz",
+      "integrity": "sha512-tD40eHxA35h0PEIZNeIjkHoDR4YjjJp34biM0mDvplBe//mB+IHCqHDGV7pxF+7MklTvighcCPPZC7ynWyjdTA==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": "^20.19.0 || ^22.13.0 || >=24"
+      },
+      "funding": {
+        "url": "https://opencollective.com/eslint"
+      }
+    },
+    "node_modules/undici": {
+      "version": "7.24.4",
+      "resolved": "https://registry.npmjs.org/undici/-/undici-7.24.4.tgz",
+      "integrity": "sha512-BM/JzwwaRXxrLdElV2Uo6cTLEjhSb3WXboncJamZ15NgUURmvlXvxa6xkwIOILIjPNo9i8ku136ZvWV0Uly8+w==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=20.18.1"
+      }
+    },
+    "node_modules/undici-types": {
+      "version": "7.24.6",
+      "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-7.24.6.tgz",
+      "integrity": "sha512-WRNW+sJgj5OBN4/0JpHFqtqzhpbnV0GuB+OozA9gCL7a993SmU+1JBZCzLNxYsbMfIeDL+lTsphD5jN5N+n0zg==",
+      "license": "MIT"
+    },
+    "node_modules/universalify": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/universalify/-/universalify-2.0.1.tgz",
+      "integrity": "sha512-gptHNQghINnc/vTGIk0SOFGFNXw7JVrlRUtConJRlvaw6DuX0wO5Jeko9sWrMBhh+PsYAZ7oXAiOnf/UKogyiw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 10.0.0"
+      }
+    },
+    "node_modules/unpipe": {
+      "version": "1.0.0",
+      "resolved": "https://registry.npmjs.org/unpipe/-/unpipe-1.0.0.tgz",
+      "integrity": "sha512-pjy2bYhSsufwWlKwPc+l3cN7+wuJlK6uz0YdJEOlQDbl6jo/YlPi4mb8agUkVC8BF7V8NuzeyPNqRksA3hztKQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/update-browserslist-db": {
+      "version": "1.2.3",
+      "resolved": "https://registry.npmjs.org/update-browserslist-db/-/update-browserslist-db-1.2.3.tgz",
+      "integrity": "sha512-Js0m9cx+qOgDxo0eMiFGEueWztz+d4+M3rGlmKPT+T4IS/jP4ylw3Nwpu6cpTTP8R1MAC1kF4VbdLt3ARf209w==",
+      "dev": true,
+      "funding": [
+        {
+          "type": "opencollective",
+          "url": "https://opencollective.com/browserslist"
+        },
+        {
+          "type": "tidelift",
+          "url": "https://tidelift.com/funding/github/npm/browserslist"
+        },
+        {
+          "type": "github",
+          "url": "https://github.com/sponsors/ai"
+        }
+      ],
+      "license": "MIT",
+      "dependencies": {
+        "escalade": "^3.2.0",
+        "picocolors": "^1.1.1"
+      },
+      "bin": {
+        "update-browserslist-db": "cli.js"
+      },
+      "peerDependencies": {
+        "browserslist": ">= 4.21.0"
+      }
+    },
+    "node_modules/uri-js": {
+      "version": "4.4.1",
+      "resolved": "https://registry.npmjs.org/uri-js/-/uri-js-4.4.1.tgz",
+      "integrity": "sha512-7rKUyy33Q1yc98pQ1DAmLtwX109F7TIfWlW1Ydo8Wl1ii1SeHieeh0HHfPeL2fMXK6z0s8ecKs9frCuLJvndBg==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "dependencies": {
+        "punycode": "^2.1.0"
+      }
+    },
+    "node_modules/validate-npm-package-name": {
+      "version": "7.0.2",
+      "resolved": "https://registry.npmjs.org/validate-npm-package-name/-/validate-npm-package-name-7.0.2.tgz",
+      "integrity": "sha512-hVDIBwsRruT73PbK7uP5ebUt+ezEtCmzZz3F59BSr2F6OVFnJ/6h8liuvdLrQ88Xmnk6/+xGGuq+pG9WwTuy3A==",
+      "dev": true,
+      "license": "ISC",
+      "engines": {
+        "node": "^20.17.0 || >=22.9.0"
+      }
+    },
+    "node_modules/vanilla-calendar-pro": {
+      "version": "3.1.0",
+      "resolved": "https://registry.npmjs.org/vanilla-calendar-pro/-/vanilla-calendar-pro-3.1.0.tgz",
+      "integrity": "sha512-yXDtCaedcKz6i5OOdWGwui0C8MAmjXjj7JzKZyjDlkczSRqnhI8BDGFygqT2K+qL1uY7R2fLYlTlxA6oyFs2yg==",
+      "license": "MIT",
+      "funding": {
+        "type": "individual",
+        "url": "https://buymeacoffee.com/uvarov"
+      }
+    },
+    "node_modules/vary": {
+      "version": "1.1.2",
+      "resolved": "https://registry.npmjs.org/vary/-/vary-1.1.2.tgz",
+      "integrity": "sha512-BNGbWLfd0eUPabhkXUVm0j8uuvREyTh5ovRa/dyow/BqAbZJyC+5fU+IzQOzmAKzYqYRAISoRhdQr3eIZ/PXqg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">= 0.8"
+      }
+    },
+    "node_modules/vite": {
+      "version": "7.3.2",
+      "resolved": "https://registry.npmjs.org/vite/-/vite-7.3.2.tgz",
+      "integrity": "sha512-Bby3NOsna2jsjfLVOHKes8sGwgl4TT0E6vvpYgnAYDIF/tie7MRaFthmKuHx1NSXjiTueXH3do80FMQgvEktRg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "esbuild": "^0.27.0",
+        "fdir": "^6.5.0",
+        "picomatch": "^4.0.3",
+        "postcss": "^8.5.6",
+        "rollup": "^4.43.0",
+        "tinyglobby": "^0.2.15"
+      },
+      "bin": {
+        "vite": "bin/vite.js"
+      },
+      "engines": {
+        "node": "^20.19.0 || >=22.12.0"
+      },
+      "funding": {
+        "url": "https://github.com/vitejs/vite?sponsor=1"
+      },
+      "optionalDependencies": {
+        "fsevents": "~2.3.3"
+      },
+      "peerDependencies": {
+        "@types/node": "^20.19.0 || >=22.12.0",
+        "jiti": ">=1.21.0",
+        "less": "^4.0.0",
+        "lightningcss": "^1.21.0",
+        "sass": "^1.70.0",
+        "sass-embedded": "^1.70.0",
+        "stylus": ">=0.54.8",
+        "sugarss": "^5.0.0",
+        "terser": "^5.16.0",
+        "tsx": "^4.8.1",
+        "yaml": "^2.4.2"
+      },
+      "peerDependenciesMeta": {
+        "@types/node": {
+          "optional": true
+        },
+        "jiti": {
+          "optional": true
+        },
+        "less": {
+          "optional": true
+        },
+        "lightningcss": {
+          "optional": true
+        },
+        "sass": {
+          "optional": true
+        },
+        "sass-embedded": {
+          "optional": true
+        },
+        "stylus": {
+          "optional": true
+        },
+        "sugarss": {
+          "optional": true
+        },
+        "terser": {
+          "optional": true
+        },
+        "tsx": {
+          "optional": true
+        },
+        "yaml": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/vitest": {
+      "version": "4.1.7",
+      "resolved": "https://registry.npmjs.org/vitest/-/vitest-4.1.7.tgz",
+      "integrity": "sha512-flYyaFd2CgoCoU+0UKt3pxksgC+S02iTDN0n3LtqaMeXsI9SBcdNujc2k0DeFLzUn/0k538yNjOSdwgCqcrwJA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "@vitest/expect": "4.1.7",
+        "@vitest/mocker": "4.1.7",
+        "@vitest/pretty-format": "4.1.7",
+        "@vitest/runner": "4.1.7",
+        "@vitest/snapshot": "4.1.7",
+        "@vitest/spy": "4.1.7",
+        "@vitest/utils": "4.1.7",
+        "es-module-lexer": "^2.0.0",
+        "expect-type": "^1.3.0",
+        "magic-string": "^0.30.21",
+        "obug": "^2.1.1",
+        "pathe": "^2.0.3",
+        "picomatch": "^4.0.3",
+        "std-env": "^4.0.0-rc.1",
+        "tinybench": "^2.9.0",
+        "tinyexec": "^1.0.2",
+        "tinyglobby": "^0.2.15",
+        "tinyrainbow": "^3.1.0",
+        "vite": "^6.0.0 || ^7.0.0 || ^8.0.0",
+        "why-is-node-running": "^2.3.0"
+      },
+      "bin": {
+        "vitest": "vitest.mjs"
+      },
+      "engines": {
+        "node": "^20.0.0 || ^22.0.0 || >=24.0.0"
+      },
+      "funding": {
+        "url": "https://opencollective.com/vitest"
+      },
+      "peerDependencies": {
+        "@edge-runtime/vm": "*",
+        "@opentelemetry/api": "^1.9.0",
+        "@types/node": "^20.0.0 || ^22.0.0 || >=24.0.0",
+        "@vitest/browser-playwright": "4.1.7",
+        "@vitest/browser-preview": "4.1.7",
+        "@vitest/browser-webdriverio": "4.1.7",
+        "@vitest/coverage-istanbul": "4.1.7",
+        "@vitest/coverage-v8": "4.1.7",
+        "@vitest/ui": "4.1.7",
+        "happy-dom": "*",
+        "jsdom": "*",
+        "vite": "^6.0.0 || ^7.0.0 || ^8.0.0"
+      },
+      "peerDependenciesMeta": {
+        "@edge-runtime/vm": {
+          "optional": true
+        },
+        "@opentelemetry/api": {
+          "optional": true
+        },
+        "@types/node": {
+          "optional": true
+        },
+        "@vitest/browser-playwright": {
+          "optional": true
+        },
+        "@vitest/browser-preview": {
+          "optional": true
+        },
+        "@vitest/browser-webdriverio": {
+          "optional": true
+        },
+        "@vitest/coverage-istanbul": {
+          "optional": true
+        },
+        "@vitest/coverage-v8": {
+          "optional": true
+        },
+        "@vitest/ui": {
+          "optional": true
+        },
+        "happy-dom": {
+          "optional": true
+        },
+        "jsdom": {
+          "optional": true
+        },
+        "vite": {
+          "optional": false
+        }
+      }
+    },
+    "node_modules/w3c-xmlserializer": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/w3c-xmlserializer/-/w3c-xmlserializer-5.0.0.tgz",
+      "integrity": "sha512-o8qghlI8NZHU1lLPrpi2+Uq7abh4GGPpYANlalzWxyWteJOCsr/P+oPBA49TOLu5FTZO4d3F9MnWJfiMo4BkmA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "xml-name-validator": "^5.0.0"
+      },
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/watchpack": {
+      "version": "2.5.1",
+      "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-2.5.1.tgz",
+      "integrity": "sha512-Zn5uXdcFNIA1+1Ei5McRd+iRzfhENPCe7LeABkJtNulSxjma+l7ltNx55BWZkRlwRnpOgHqxnjyaDgJnNXnqzg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "glob-to-regexp": "^0.4.1",
+        "graceful-fs": "^4.1.2"
+      },
+      "engines": {
+        "node": ">=10.13.0"
+      }
+    },
+    "node_modules/weak-lru-cache": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/weak-lru-cache/-/weak-lru-cache-1.2.2.tgz",
+      "integrity": "sha512-DEAoo25RfSYMuTGc9vPJzZcZullwIqRDSI9LOy+fkCJPi6hykCnfKaXTuPBDuXAUcqHXyOgFtHNp/kB2FjYHbw==",
+      "dev": true,
+      "license": "MIT",
+      "optional": true
+    },
+    "node_modules/web-vitals": {
+      "version": "4.2.4",
+      "resolved": "https://registry.npmjs.org/web-vitals/-/web-vitals-4.2.4.tgz",
+      "integrity": "sha512-r4DIlprAGwJ7YM11VZp4R884m0Vmgr6EAKe3P+kO0PPj3Unqyvv59rczf6UiGcb9Z8QxZVcqKNwv/g0WNdWwsw==",
+      "license": "Apache-2.0"
+    },
+    "node_modules/webidl-conversions": {
+      "version": "8.0.1",
+      "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-8.0.1.tgz",
+      "integrity": "sha512-BMhLD/Sw+GbJC21C/UgyaZX41nPt8bUTg+jWyDeg7e7YN4xOM05YPSIXceACnXVtqyEw/LMClUQMtMZ+PGGpqQ==",
+      "dev": true,
+      "license": "BSD-2-Clause",
+      "engines": {
+        "node": ">=20"
+      }
+    },
+    "node_modules/websocket-driver": {
+      "version": "0.7.4",
+      "resolved": "https://registry.npmjs.org/websocket-driver/-/websocket-driver-0.7.4.tgz",
+      "integrity": "sha512-b17KeDIQVjvb0ssuSDF2cYXSg2iztliJ4B9WdsuB6J952qCPKmnVq4DyW5motImXHDC1cBT/1UezrJVsKw5zjg==",
+      "license": "Apache-2.0",
+      "dependencies": {
+        "http-parser-js": ">=0.5.1",
+        "safe-buffer": ">=5.1.0",
+        "websocket-extensions": ">=0.1.1"
+      },
+      "engines": {
+        "node": ">=0.8.0"
+      }
+    },
+    "node_modules/websocket-extensions": {
+      "version": "0.1.4",
+      "resolved": "https://registry.npmjs.org/websocket-extensions/-/websocket-extensions-0.1.4.tgz",
+      "integrity": "sha512-OqedPIGOfsDlo31UNwYbCFMSaO9m9G/0faIHj5/dZFDMFqPTcx6UwqyOy3COEaEOg/9VsGIpdqn62W5KhoKSpg==",
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=0.8.0"
+      }
+    },
+    "node_modules/whatwg-mimetype": {
+      "version": "4.0.0",
+      "resolved": "https://registry.npmjs.org/whatwg-mimetype/-/whatwg-mimetype-4.0.0.tgz",
+      "integrity": "sha512-QaKxh0eNIi2mE9p2vEdzfagOKHCcj1pJ56EEHGQOVxp8r9/iszLUUV7v89x9O1p/T+NlTM5W7jW6+cz4Fq1YVg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/whatwg-url": {
+      "version": "15.1.0",
+      "resolved": "https://registry.npmjs.org/whatwg-url/-/whatwg-url-15.1.0.tgz",
+      "integrity": "sha512-2ytDk0kiEj/yu90JOAp44PVPUkO9+jVhyf+SybKlRHSDlvOOZhdPIrr7xTH64l4WixO2cP+wQIcgujkGBPPz6g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "tr46": "^6.0.0",
+        "webidl-conversions": "^8.0.0"
+      },
+      "engines": {
+        "node": ">=20"
+      }
+    },
+    "node_modules/which": {
+      "version": "2.0.2",
+      "resolved": "https://registry.npmjs.org/which/-/which-2.0.2.tgz",
+      "integrity": "sha512-BLI3Tl1TW3Pvl70l3yq3Y64i+awpwXqsGBYWkkqMtnbXgrMD+yj7rhW0kuEDxzJaYXGjEW5ogapKNMEKNMjibA==",
+      "dev": true,
+      "license": "ISC",
+      "dependencies": {
+        "isexe": "^2.0.0"
+      },
+      "bin": {
+        "node-which": "bin/node-which"
+      },
+      "engines": {
+        "node": ">= 8"
+      }
+    },
+    "node_modules/why-is-node-running": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/why-is-node-running/-/why-is-node-running-2.3.0.tgz",
+      "integrity": "sha512-hUrmaWBdVDcxvYqnyh09zunKzROWjbZTiNy8dBEjkS7ehEDQibXJ7XvlmtbwuTclUiIyN+CyXQD4Vmko8fNm8w==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "siginfo": "^2.0.0",
+        "stackback": "0.0.2"
+      },
+      "bin": {
+        "why-is-node-running": "cli.js"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/word-wrap": {
+      "version": "1.2.5",
+      "resolved": "https://registry.npmjs.org/word-wrap/-/word-wrap-1.2.5.tgz",
+      "integrity": "sha512-BN22B5eaMMI9UMtjrGd5g5eCYPpCPDUy0FJXbYsaT5zYxjFOckS53SQDE3pWkVoWpHXVb3BrYcEN4Twa55B5cA==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=0.10.0"
+      }
+    },
+    "node_modules/wrap-ansi": {
+      "version": "6.2.0",
+      "resolved": "https://registry.npmjs.org/wrap-ansi/-/wrap-ansi-6.2.0.tgz",
+      "integrity": "sha512-r6lPcBGxZXlIcymEu7InxDMhdW0KDxpLgoFLcguasxCaJ/SOIZwINatK9KY/tf+ZrlywOKU0UDj3ATXUBfxJXA==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-styles": "^4.0.0",
+        "string-width": "^4.1.0",
+        "strip-ansi": "^6.0.0"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/wrap-ansi/node_modules/ansi-regex": {
+      "version": "5.0.1",
+      "resolved": "https://registry.npmjs.org/ansi-regex/-/ansi-regex-5.0.1.tgz",
+      "integrity": "sha512-quJQXlTSUGL2LH9SUXo8VwsY4soanhgo6LNSm84E1LBcE8s3O0wpdiRzyR9z/ZZJMlMWv37qOOb9pdJlMUEKFQ==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/wrap-ansi/node_modules/ansi-styles": {
+      "version": "4.3.0",
+      "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-4.3.0.tgz",
+      "integrity": "sha512-zbB9rCJAT1rbjiVDb2hqKFHNYLxgtk8NURxZ3IZwD3F6NtxbXZQCnnSi1Lkx+IDohdPlFp222wVALIheZJQSEg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "color-convert": "^2.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      },
+      "funding": {
+        "url": "https://github.com/chalk/ansi-styles?sponsor=1"
+      }
+    },
+    "node_modules/wrap-ansi/node_modules/is-fullwidth-code-point": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/is-fullwidth-code-point/-/is-fullwidth-code-point-3.0.0.tgz",
+      "integrity": "sha512-zymm5+u+sCsSWyD9qNaejV3DFvhCKclKdizYaJUuHA83RLjb7nSuGnddCHGv0hk+KY7BMAlsWeK4Ueg6EV6XQg==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/wrap-ansi/node_modules/string-width": {
+      "version": "4.2.3",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-4.2.3.tgz",
+      "integrity": "sha512-wKyQRQpjJ0sIp62ErSZdGsjMJWsap5oRNihHhu6G7JVO/9jIB6UyevL+tXuOqrng8j/cxKTWyWUwvSTriiZz/g==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "emoji-regex": "^8.0.0",
+        "is-fullwidth-code-point": "^3.0.0",
+        "strip-ansi": "^6.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/wrap-ansi/node_modules/strip-ansi": {
+      "version": "6.0.1",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-6.0.1.tgz",
+      "integrity": "sha512-Y38VPSHcqkFrCpFnQ9vuSXmquuv5oXOKpGeT6aGrr3o3Gc9AlVa6JBfUSOCnbxGGZF+/0ooI7KrPuUSztUdU5A==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "ansi-regex": "^5.0.1"
+      },
+      "engines": {
+        "node": ">=8"
+      }
+    },
+    "node_modules/wrappy": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/wrappy/-/wrappy-1.0.2.tgz",
+      "integrity": "sha512-l4Sp/DRseor9wL6EvV2+TuQn63dMkPjZ/sp9XkghTEbV9KlPS1xUsZ3u7/IQO4wxtcFB4bgpQPRcR3QCvezPcQ==",
+      "dev": true,
+      "license": "ISC"
+    },
+    "node_modules/ws": {
+      "version": "8.21.0",
+      "resolved": "https://registry.npmjs.org/ws/-/ws-8.21.0.tgz",
+      "integrity": "sha512-Vsp28b7DRcimFQvrqu2Wek3z1iYxDCWqHYB8Qsnk/S4RfaCQzPGPyBNuVjJV3cd6UiKtUtp6sNM77gWvzcCH+g==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=10.0.0"
+      },
+      "peerDependencies": {
+        "bufferutil": "^4.0.1",
+        "utf-8-validate": ">=5.0.2"
+      },
+      "peerDependenciesMeta": {
+        "bufferutil": {
+          "optional": true
+        },
+        "utf-8-validate": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/xml-name-validator": {
+      "version": "5.0.0",
+      "resolved": "https://registry.npmjs.org/xml-name-validator/-/xml-name-validator-5.0.0.tgz",
+      "integrity": "sha512-EvGK8EJ3DhaHfbRlETOWAS5pO9MZITeauHKJyb8wyajUfQUenkIg2MvLDTZ4T/TgIcm3HU0TFBgWWboAZ30UHg==",
+      "dev": true,
+      "license": "Apache-2.0",
+      "engines": {
+        "node": ">=18"
+      }
+    },
+    "node_modules/xmlchars": {
+      "version": "2.2.0",
+      "resolved": "https://registry.npmjs.org/xmlchars/-/xmlchars-2.2.0.tgz",
+      "integrity": "sha512-JZnDKK8B0RCDw84FNdDAIpZK+JuJw+s7Lz8nksI7SIuU3UXJJslUthsi+uWBUYOwPFwW7W7PRLRfUKpxjtjFCw==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/y18n": {
+      "version": "5.0.8",
+      "resolved": "https://registry.npmjs.org/y18n/-/y18n-5.0.8.tgz",
+      "integrity": "sha512-0pfFzegeDWJHJIAmTLRP2DwHjdF5s7jo9tuztdQxAhINCdvS+3nGINqPd00AphqJR/0LhANUS6/+7SCb98YOfA==",
+      "license": "ISC",
+      "engines": {
+        "node": ">=10"
+      }
+    },
+    "node_modules/yallist": {
+      "version": "3.1.1",
+      "resolved": "https://registry.npmjs.org/yallist/-/yallist-3.1.1.tgz",
+      "integrity": "sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g==",
+      "dev": true,
+      "license": "ISC"
+    },
+    "node_modules/yaml": {
+      "version": "2.9.0",
+      "resolved": "https://registry.npmjs.org/yaml/-/yaml-2.9.0.tgz",
+      "integrity": "sha512-2AvhNX3mb8zd6Zy7INTtSpl1F15HW6Wnqj0srWlkKLcpYl/gMIMJiyuGq2KeI2YFxUPjdlB+3Lc10seMLtL4cA==",
+      "dev": true,
+      "license": "ISC",
+      "bin": {
+        "yaml": "bin.mjs"
+      },
+      "engines": {
+        "node": ">= 14.6"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/eemeli"
+      }
+    },
+    "node_modules/yargs": {
+      "version": "18.0.0",
+      "resolved": "https://registry.npmjs.org/yargs/-/yargs-18.0.0.tgz",
+      "integrity": "sha512-4UEqdc2RYGHZc7Doyqkrqiln3p9X2DZVxaGbwhn2pi7MrRagKaOcIKe8L3OxYcbhXLgLFUS3zAYuQjKBQgmuNg==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "cliui": "^9.0.1",
+        "escalade": "^3.1.1",
+        "get-caller-file": "^2.0.5",
+        "string-width": "^7.2.0",
+        "y18n": "^5.0.5",
+        "yargs-parser": "^22.0.0"
+      },
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=23"
+      }
+    },
+    "node_modules/yargs-parser": {
+      "version": "22.0.0",
+      "resolved": "https://registry.npmjs.org/yargs-parser/-/yargs-parser-22.0.0.tgz",
+      "integrity": "sha512-rwu/ClNdSMpkSrUb+d6BRsSkLUq1fmfsY6TOpYzTwvwkg1/NRG85KBy3kq++A8LKQwX6lsu+aWad+2khvuXrqw==",
+      "dev": true,
+      "license": "ISC",
+      "engines": {
+        "node": "^20.19.0 || ^22.12.0 || >=23"
+      }
+    },
+    "node_modules/yargs/node_modules/emoji-regex": {
+      "version": "10.6.0",
+      "resolved": "https://registry.npmjs.org/emoji-regex/-/emoji-regex-10.6.0.tgz",
+      "integrity": "sha512-toUI84YS5YmxW219erniWD0CIVOo46xGKColeNQRgOzDorgBi1v4D71/OFzgD9GO2UGKIv1C3Sp8DAn0+j5w7A==",
+      "dev": true,
+      "license": "MIT"
+    },
+    "node_modules/yargs/node_modules/string-width": {
+      "version": "7.2.0",
+      "resolved": "https://registry.npmjs.org/string-width/-/string-width-7.2.0.tgz",
+      "integrity": "sha512-tsaTIkKW9b4N+AEj+SVA+WhJzV7/zMhcSu78mLKWSk7cXMOSHsBKFWUs0fWwq8QyK3MgJBQRX6Gbi4kYbdvGkQ==",
+      "dev": true,
+      "license": "MIT",
+      "dependencies": {
+        "emoji-regex": "^10.3.0",
+        "get-east-asian-width": "^1.0.0",
+        "strip-ansi": "^7.1.0"
+      },
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/yocto-queue": {
+      "version": "0.1.0",
+      "resolved": "https://registry.npmjs.org/yocto-queue/-/yocto-queue-0.1.0.tgz",
+      "integrity": "sha512-rVksvsnNCdJ/ohGc6xgPwyN8eheCxsiLM8mxuE/t/mOVqJewPuO1miLpTHQiRgTKCLexL4MeAFVagts7HmNZ2Q==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=10"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/yoctocolors": {
+      "version": "2.1.2",
+      "resolved": "https://registry.npmjs.org/yoctocolors/-/yoctocolors-2.1.2.tgz",
+      "integrity": "sha512-CzhO+pFNo8ajLM2d2IW/R93ipy99LWjtwblvC1RsoSUMZgyLbYFr221TnSNT7GjGdYui6P459mw9JH/g/zW2ug==",
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/yoctocolors-cjs": {
+      "version": "2.1.3",
+      "resolved": "https://registry.npmjs.org/yoctocolors-cjs/-/yoctocolors-cjs-2.1.3.tgz",
+      "integrity": "sha512-U/PBtDf35ff0D8X8D0jfdzHYEPFxAI7jJlxZXwCSez5M3190m+QobIfh+sWDWSHMCWWJN2AWamkegn6vr6YBTw==",
+      "dev": true,
+      "license": "MIT",
+      "engines": {
+        "node": ">=18"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/sindresorhus"
+      }
+    },
+    "node_modules/zod": {
+      "version": "4.3.6",
+      "resolved": "https://registry.npmjs.org/zod/-/zod-4.3.6.tgz",
+      "integrity": "sha512-rftlrkhHZOcjDwkGlnUtZZkvaPHCsDATp4pGpuOOMDaTdDDXF91wuVDJoWoPsKX/3YPQ5fHuF3STjcYyKr+Qhg==",
+      "dev": true,
+      "license": "MIT",
+      "funding": {
+        "url": "https://github.com/sponsors/colinhacks"
+      }
+    },
+    "node_modules/zod-to-json-schema": {
+      "version": "3.25.2",
+      "resolved": "https://registry.npmjs.org/zod-to-json-schema/-/zod-to-json-schema-3.25.2.tgz",
+      "integrity": "sha512-O/PgfnpT1xKSDeQYSCfRI5Gy3hPf91mKVDuYLUHZJMiDFptvP41MSnWofm8dnCm0256ZNfZIM7DSzuSMAFnjHA==",
+      "dev": true,
+      "license": "ISC",
+      "peerDependencies": {
+        "zod": "^3.25.28 || ^4"
+      }
+    },
+    "node_modules/zrender": {
+      "version": "6.1.0",
+      "resolved": "https://registry.npmjs.org/zrender/-/zrender-6.1.0.tgz",
+      "integrity": "sha512-oEGMDB6pOP2S6OwRR4PdVv610zrjnA3Bh+JnSG12fYJlBKjtNAoEb5fSUoCOOINlH96I2fU38/A2UpRKs67xYQ==",
+      "license": "BSD-3-Clause",
+      "peer": true,
+      "dependencies": {
+        "tslib": "2.3.0"
+      }
+    },
+    "node_modules/zrender/node_modules/tslib": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.3.0.tgz",
+      "integrity": "sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg==",
+      "license": "0BSD",
+      "peer": true
+    }
+  }
+}
diff --git a/src/app/package.json b/src/app/package.json
new file mode 100644
index 00000000..40272561
--- /dev/null
+++ b/src/app/package.json
@@ -0,0 +1,77 @@
+{
+  "name": "ynex-tailwind",
+  "version": "1.0.0",
+  "scripts": {
+    "ng": "ng",
+    "start": "ng serve",
+    "build": "ng build",
+    "watch": "ng build --watch --configuration development",
+    "test": "ng test",
+    "sass": "sass ./public/assets/scss:./public/assets/css/",
+    "sass-min": "sass ./public/assets/scss:./public/assets/css/ --style compressed",
+    "postcss": "sass ./public/assets/scss:./public/assets/css && postcss ./public/assets/css/*.css --dir ./public/assets/css",
+    "lint": "ng lint"
+  },
+  "prettier": {
+    "printWidth": 100,
+    "singleQuote": true,
+    "overrides": [
+      {
+        "files": "*.html",
+        "options": {
+          "parser": "angular"
+        }
+      }
+    ]
+  },
+  "private": true,
+  "packageManager": "npm@11.9.0",
+  "dependencies": {
+    "@angular/animations": "^21.2.14",
+    "@angular/cdk": "^21.2.8",
+    "@angular/common": "^21.2.10",
+    "@angular/compiler": "^21.2.10",
+    "@angular/core": "^21.2.10",
+    "@angular/fire": "^21.0.0-rc.0",
+    "@angular/forms": "^21.2.10",
+    "@angular/google-maps": "^21.2.8",
+    "@angular/material": "^21.2.14",
+    "@angular/platform-browser": "^21.2.10",
+    "@angular/platform-browser-dynamic": "^21.2.10",
+    "@angular/router": "^21.2.10",
+    "@ng-select/ng-select": "^21.8.2",
+    "@tailwindcss/forms": "^0.5.11",
+    "@tsparticles/angular": "^3.0.0",
+    "apexcharts": "^5.10.5",
+    "chart.js": "^4.5.1",
+    "gridjs": "^6.2.0",
+    "ng-apexcharts": "^2.3.0",
+    "ng2-charts": "^10.0.0",
+    "ngx-color-picker": "^20.1.1",
+    "ngx-echarts": "^21.0.0",
+    "ngx-toastr": "^20.0.5",
+    "preline": "^4.1.2",
+    "rxjs": "~7.8.0",
+    "simplebar-angular": "^3.3.2",
+    "sweetalert2": "^11.26.25",
+    "tslib": "^2.3.0",
+    "tsparticles": "^3.9.1"
+  },
+  "devDependencies": {
+    "@angular/build": "^21.0.5",
+    "@angular/cli": "^21.0.5",
+    "@angular/compiler-cli": "^21.2.10",
+    "@eslint/js": "^10.0.1",
+    "@tailwindcss/postcss": "^4.2.2",
+    "angular-eslint": "21.4.0",
+    "autoprefixer": "^10.4.27",
+    "eslint": "^10.3.0",
+    "jsdom": "^27.1.0",
+    "postcss": "^8.5.8",
+    "postcss-cli": "^11.0.1",
+    "tailwindcss": "^4.2.2",
+    "typescript": "~5.9.2",
+    "typescript-eslint": "8.59.2",
+    "vitest": "^4.0.8"
+  }
+}
\ No newline at end of file
diff --git a/src/app/shared/components/button/button.html b/src/app/shared/components/button/button.html
new file mode 100644
index 00000000..2adfdee1
--- /dev/null
+++ b/src/app/shared/components/button/button.html
@@ -0,0 +1,56 @@
+<button
+  [type]="resolvedType()"
+  [class]="buttonClass()"
+  [disabled]="isDisabled()"
+  [attr.aria-label]="
+    ariaLabel() ||
+    resolvedLabel() ||
+    title() ||
+    'Button'
+  "
+  [attr.aria-busy]="loading() ? true : null"
+  (click)="onClick($event)"
+>
+  <span class="inline-flex items-center justify-center gap-1">
+    @if (loading()) {
+      <span
+        class="inline-block size-4 animate-spin rounded-full border-2 border-current border-t-transparent"
+        aria-hidden="true"
+      ></span>
+    }
+
+    @if (
+      !loading() &&
+      showIcon() &&
+      resolvedIcon() &&
+      iconPosition() === 'left'
+    ) {
+      <i
+        [class]="resolvedIconClass()"
+        aria-hidden="true"
+      ></i>
+    }
+
+    @if (!iconOnly()) {
+      <span>
+        @if (loading() && loadingLabel()) {
+          {{ loadingLabel() }}
+        } @else {
+          {{ resolvedLabel() }}
+        }
+      </span>
+    }
+
+    @if (
+      !loading() &&
+      showIcon() &&
+      resolvedIcon() &&
+      iconPosition() === 'right'
+    ) {
+      <i
+        [class]="resolvedIconClass()"
+        aria-hidden="true"
+      ></i>
+    }
+  </span>
+</button>
\ No newline at end of file
diff --git a/src/app/shared/components/button/button.scss b/src/app/shared/components/button/button.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/src/app/shared/components/button/button.ts b/src/app/shared/components/button/button.ts
new file mode 100644
index 00000000..bdea5aa5
--- /dev/null
+++ b/src/app/shared/components/button/button.ts
@@ -0,0 +1,349 @@
+import {
+  ChangeDetectionStrategy,
+  Component,
+  computed,
+  input,
+  output
+} from '@angular/core';
+
+export type ButtonType = 'button' | 'submit' | 'reset';
+
+export type ButtonSize = 'xs' | 'sm' | 'md' | 'lg';
+
+export type IconPosition = 'left' | 'right';
+
+export type ButtonVariant =
+  | 'primary'
+  | 'primary-full'
+  | 'secondary'
+  | 'secondary-full'
+  | 'success'
+  | 'success-full'
+  | 'danger'
+  | 'danger-full'
+  | 'warning'
+  | 'warning-full'
+  | 'info'
+  | 'info-full'
+  | 'light'
+  | 'dark'
+  | 'transparent'
+  | 'custom';
+
+export type ButtonAction =
+  | 'add'
+  | 'save'
+  | 'submit'
+  | 'update'
+  | 'edit'
+  | 'delete'
+  | 'cancel'
+  | 'close'
+  | 'upload'
+  | 'download'
+  | 'import'
+  | 'export'
+  | 'view'
+  | 'search'
+  | 'refresh'
+  | 'reset'
+  | 'approve'
+  | 'reject'
+  | 'login'
+  | 'next'
+  | 'previous'
+  | 'custom';
+
+interface ButtonActionConfig {
+  label: string;
+  icon: string | null;
+  variant: ButtonVariant;
+  type: ButtonType;
+}
+
+const BUTTON_ACTION_CONFIG: Record<ButtonAction, ButtonActionConfig> = {
+  add: {
+    label: 'Add',
+    icon: 'ri-add-line',
+    variant: 'primary-full',
+    type: 'button'
+  },
+  save: {
+    label: 'Save',
+    icon: 'ri-save-line',
+    variant: 'primary-full',
+    type: 'submit'
+  },
+  submit: {
+    label: 'Submit',
+    icon: 'ri-send-plane-line',
+    variant: 'primary-full',
+    type: 'submit'
+  },
+  update: {
+    label: 'Update',
+    icon: 'ri-save-3-line',
+    variant: 'primary-full',
+    type: 'submit'
+  },
+  edit: {
+    label: 'Edit',
+    icon: 'ri-edit-line',
+    variant: 'primary-full',
+    type: 'button'
+  },
+  delete: {
+    label: 'Delete',
+    icon: 'ri-delete-bin-line',
+    variant: 'danger-full',
+    type: 'button'
+  },
+  cancel: {
+    label: 'Cancel',
+    icon: 'ri-close-line',
+    variant: 'light',
+    type: 'button'
+  },
+  close: {
+    label: 'Close',
+    icon: 'ri-close-line',
+    variant: 'light',
+    type: 'button'
+  },
+  upload: {
+    label: 'Upload',
+    icon: 'ri-upload-cloud-2-line',
+    variant: 'primary-full',
+    type: 'button'
+  },
+  download: {
+    label: 'Download',
+    icon: 'ri-download-cloud-2-line',
+    variant: 'success-full',
+    type: 'button'
+  },
+  import: {
+    label: 'Import',
+    icon: 'ri-file-upload-line',
+    variant: 'info-full',
+    type: 'button'
+  },
+  export: {
+    label: 'Export',
+    icon: 'ri-file-download-line',
+    variant: 'success-full',
+    type: 'button'
+  },
+  view: {
+    label: 'View',
+    icon: 'ri-eye-line',
+    variant: 'info-full',
+    type: 'button'
+  },
+  search: {
+    label: 'Search',
+    icon: 'ri-search-line',
+    variant: 'primary-full',
+    type: 'button'
+  },
+  refresh: {
+    label: 'Refresh',
+    icon: 'ri-refresh-line',
+    variant: 'light',
+    type: 'button'
+  },
+  reset: {
+    label: 'Reset',
+    icon: 'ri-restart-line',
+    variant: 'light',
+    type: 'reset'
+  },
+  approve: {
+    label: 'Approve',
+    icon: 'ri-check-line',
+    variant: 'success-full',
+    type: 'button'
+  },
+  reject: {
+    label: 'Reject',
+    icon: 'ri-close-circle-line',
+    variant: 'danger-full',
+    type: 'button'
+  },
+  login: {
+    label: 'Login',
+    icon: 'ri-login-box-line',
+    variant: 'primary-full',
+    type: 'submit'
+  },
+  next: {
+    label: 'Next',
+    icon: 'ri-arrow-right-line',
+    variant: 'primary-full',
+    type: 'button'
+  },
+  previous: {
+    label: 'Previous',
+    icon: 'ri-arrow-left-line',
+    variant: 'light',
+    type: 'button'
+  },
+  custom: {
+    label: '',
+    icon: null,
+    variant: 'custom',
+    type: 'button'
+  }
+};
+
+@Component({
+  selector: 'app-button',
+  standalone: true,
+  templateUrl: './button.html',
+  changeDetection: ChangeDetectionStrategy.OnPush
+})
+export class Button {
+  /*
+   * Action provides sensible defaults.
+   * Explicit inputs below override action configuration.
+   */
+  readonly action = input<ButtonAction | null>(null);
+
+  readonly label = input<string | null>(null);
+  readonly icon = input<string | null>(null);
+
+  readonly type = input<ButtonType | null>(null);
+  readonly variant = input<ButtonVariant | null>(null);
+  readonly size = input<ButtonSize>('md');
+
+  readonly iconPosition = input<IconPosition>('left');
+  readonly showIcon = input(true);
+  readonly iconOnly = input(false);
+
+  readonly loading = input(false);
+  readonly loadingLabel = input<string | null>(null);
+  readonly disabled = input(false);
+
+  readonly fullWidth = input(false);
+  readonly rounded = input(false);
+
+  readonly className = input('');
+  readonly iconClass = input('');
+
+  readonly ariaLabel = input<string | null>(null);
+  readonly title = input<string | null>(null);
+
+  readonly buttonClicked = output<MouseEvent>();
+
+  private readonly actionConfig = computed<ButtonActionConfig>(() => {
+    const action = this.action();
+
+    return action
+      ? BUTTON_ACTION_CONFIG[action]
+      : BUTTON_ACTION_CONFIG.custom;
+  });
+
+  readonly resolvedLabel = computed(() => {
+    return this.label() ?? this.actionConfig().label;
+  });
+
+  readonly resolvedIcon = computed(() => {
+    // Explicit icon overrides the action icon.
+    return this.icon() ?? this.actionConfig().icon;
+  });
+
+  readonly resolvedType = computed<ButtonType>(() => {
+    return this.type() ?? this.actionConfig().type ?? 'button';
+  });
+
+  readonly resolvedVariant = computed<ButtonVariant>(() => {
+    const explicitVariant = this.variant();
+
+    if (explicitVariant) {
+      return explicitVariant;
+    }
+
+    const action = this.action();
+
+    if (action) {
+      return BUTTON_ACTION_CONFIG[action].variant;
+    }
+
+    return 'primary-full';
+  });
+
+  readonly isDisabled = computed(() => {
+    return this.disabled() || this.loading();
+  });
+
+  readonly resolvedIconClass = computed(() => {
+    return [
+      this.resolvedIcon(),
+      'align-middle leading-none',
+      this.iconClass()
+    ]
+      .filter(Boolean)
+      .join(' ');
+  });
+
+  readonly buttonClass = computed(() => {
+    const variants: Record<ButtonVariant, string> = {
+      primary: 'ti-btn-primary',
+      'primary-full': 'ti-btn-primary-full',
+
+      secondary: 'ti-btn-secondary',
+      'secondary-full': 'ti-btn-secondary-full',
+
+      success: 'ti-btn-success',
+      'success-full': 'ti-btn-success-full',
+
+      danger: 'ti-btn-danger',
+      'danger-full': 'ti-btn-danger-full',
+
+      warning: 'ti-btn-warning',
+      'warning-full': 'ti-btn-warning-full',
+
+      info: 'ti-btn-info',
+      'info-full': 'ti-btn-info-full',
+
+      light: 'ti-btn-light',
+      dark: 'ti-btn-dark',
+      transparent: 'bg-transparent',
+      custom: ''
+    };
+
+    const sizes: Record<ButtonSize, string> = {
+      xs: '!px-2 !py-1 !text-[0.6875rem]',
+      sm: '!px-3 !py-1.5 !text-[0.75rem]',
+      md: '',
+      lg: 'ti-btn-lg'
+    };
+
+    return [
+      'ti-btn',
+      'inline-flex items-center justify-center',
+      'cursor-pointer',
+      variants[this.resolvedVariant()],
+      sizes[this.size()],
+      this.fullWidth() ? 'w-full' : '',
+      this.iconOnly() ? '!p-0' : '',
+      this.rounded() ? '!rounded-full' : '',
+      this.isDisabled()
+        ? 'cursor-not-allowed opacity-60'
+        : 'cursor-pointer',
+      this.className()
+    ]
+      .filter(Boolean)
+      .join(' ');
+  });
+
+  onClick(event: MouseEvent): void {
+    if (this.isDisabled()) {
+      event.preventDefault();
+      event.stopPropagation();
+      return;
+    }
+
+    this.buttonClicked.emit(event);
+  }
+}
\ No newline at end of file
diff --git a/src/app/shared/components/confirm-dialog/confirm-dialog.html b/src/app/shared/components/confirm-dialog/confirm-dialog.html
new file mode 100644
index 00000000..cc1df3b6
--- /dev/null
+++ b/src/app/shared/components/confirm-dialog/confirm-dialog.html
@@ -0,0 +1,10 @@
+<span
+  class="inline-flex"
+  [class.pointer-events-none]="disabled()"
+  [class.opacity-60]="disabled()"
+  [attr.aria-disabled]="disabled() ? 'true' : null"
+  [attr.aria-label]="ariaLabel()"
+  (click)="open($event)"
+>
+  <ng-content />
+</span>
diff --git a/src/app/shared/components/confirm-dialog/confirm-dialog.scss b/src/app/shared/components/confirm-dialog/confirm-dialog.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/src/app/shared/components/confirm-dialog/confirm-dialog.ts b/src/app/shared/components/confirm-dialog/confirm-dialog.ts
new file mode 100644
index 00000000..0bd791bb
--- /dev/null
+++ b/src/app/shared/components/confirm-dialog/confirm-dialog.ts
@@ -0,0 +1,62 @@
+import {
+  ChangeDetectionStrategy,
+  Component,
+  input,
+  output
+} from '@angular/core';
+import Swal, { SweetAlertIcon } from 'sweetalert2';
+
+@Component({
+  selector: 'app-confirm-dialog',
+  standalone: true,
+  templateUrl: './confirm-dialog.html',
+  styleUrl: './confirm-dialog.scss',
+  changeDetection: ChangeDetectionStrategy.OnPush
+})
+export class ConfirmDialog {
+  readonly title = input('Are you sure?');
+  readonly text = input("You won't be able to revert this!");
+  readonly icon = input<SweetAlertIcon>('warning');
+  readonly confirmButtonText = input('Yes, delete it!');
+  readonly cancelButtonText = input('No, cancel!');
+  readonly confirmButtonColor = input('#1f3f81');
+  readonly cancelButtonColor = input('#ff007f');
+  readonly disabled = input(false);
+  readonly ariaLabel = input('Confirmation dialog trigger');
+
+  readonly confirmed = output<void>();
+  readonly cancelled = output<void>();
+
+  async open(event?: Event): Promise<void> {
+    event?.preventDefault();
+
+    if (this.disabled()) {
+      return;
+    }
+
+    const result = await Swal.fire({
+      title: this.title(),
+      text: this.text(),
+      icon: this.icon(),
+      showCancelButton: false,
+      showDenyButton: true,
+      confirmButtonText: this.confirmButtonText(),
+      denyButtonText: this.cancelButtonText(),
+      confirmButtonColor: this.confirmButtonColor(),
+      denyButtonColor: this.cancelButtonColor(),
+      customClass: {
+        confirmButton: 'app-confirm-dialog-btn',
+        denyButton: 'app-confirm-dialog-btn'
+      }
+    });
+
+    if (result.isConfirmed) {
+      this.confirmed.emit();
+      return;
+    }
+
+    if (result.isDenied) {
+      this.cancelled.emit();
+    }
+  }
+}
diff --git a/src/app/shared/components/data-list/data-list.html b/src/app/shared/components/data-list/data-list.html
new file mode 100644
index 00000000..e4185bb1
--- /dev/null
+++ b/src/app/shared/components/data-list/data-list.html
@@ -0,0 +1,66 @@
+<section class="space-y-4">
+  <div class="box custom-box !mb-0">
+    <div class="box-header !items-start !gap-4 flex-col xl:flex-row xl:!items-center">
+      <div class="min-w-0 me-auto">
+        <h1 class="box-title !text-lg">{{ title() }}</h1>
+        @if (subtitle()) { <p class="mt-1 text-sm text-textmuted dark:text-textmuted/80">{{ subtitle() }}</p> }
+      </div>
+      <div class="flex w-full flex-wrap items-center gap-2 xl:w-auto">
+        <label class="relative min-w-[14rem] flex-1 xl:flex-none">
+          <span class="sr-only">Search</span>
+          <input #searchInput type="search" class="form-control !pe-9 xl:w-64" [placeholder]="searchPlaceholder()"
+            (input)="onSearch(searchInput.value)" />
+          <i class="ri-search-line absolute end-3 top-1/2 -translate-y-1/2 text-textmuted"></i>
+        </label>
+        @if (showFilters()) {
+          <button type="button" class="ti-btn ti-btn-light !mb-0" [class.!border-primary]="filtersOpen()"
+            [attr.aria-expanded]="filtersOpen()" (click)="filtersOpen.set(!filtersOpen())">
+            <i class="ri-filter-3-line"></i><span>Filters</span>
+          </button>
+        }
+        <div class="inline-flex rounded-md shadow-sm" role="group" aria-label="View">
+          <button type="button" class="ti-btn !mb-0 !rounded-e-none" [class.ti-btn-primary-full]="view() === 'table'" [class.ti-btn-light]="view() !== 'table'" (click)="setView('table')" title="Table view"><i class="ri-list-check-2"></i><span class="hidden sm:inline">Table</span></button>
+          <button type="button" class="ti-btn !mb-0 !rounded-none" [class.ti-btn-primary-full]="view() === 'tile'" [class.ti-btn-light]="view() !== 'tile'" (click)="setView('tile')" title="Tile view"><i class="ri-layout-grid-line"></i><span class="hidden sm:inline">Tile</span></button>
+          <button type="button" class="ti-btn !mb-0 !rounded-s-none" [class.ti-btn-primary-full]="view() === 'detail'" [class.ti-btn-light]="view() !== 'detail'" (click)="setView('detail')" title="Detail view"><i class="ri-layout-row-line"></i><span class="hidden sm:inline">Detail</span></button>
+        </div>
+        <label class="flex items-center gap-2 text-sm"><span class="hidden sm:inline">Density</span>
+          <select class="ti-form-select form-select-sm !w-auto" [value]="density()" (change)="setDensity($event)">
+            <option value="compact">Compact</option><option value="comfortable">Comfortable</option><option value="spacious">Spacious</option>
+          </select>
+        </label>
+        <button type="button" class="ti-btn ti-btn-primary-full !mb-0" (click)="addClicked.emit()"><i class="ri-add-line"></i>{{ addLabel() }}</button>
+      </div>
+    </div>
+    @if (filtersOpen()) {
+      <div class="box-body border-t border-defaultborder">
+        <ng-content select="[dataListFilters]" />
+        <div class="mt-4 flex justify-end gap-2">
+          <button type="button" class="ti-btn ti-btn-light !mb-0" (click)="filtersCleared.emit()">Clear All</button>
+          <button type="button" class="ti-btn ti-btn-primary-full !mb-0" (click)="filtersApplied.emit()">Apply Filters</button>
+        </div>
+      </div>
+    }
+  </div>
+
+  <div class="box custom-box !mb-0">
+    @if (loading()) {
+      <div class="box-body flex min-h-48 flex-col items-center justify-center gap-3"><i class="ti ti-loader-2 animate-spin text-2xl"></i><span>Loading data...</span></div>
+    } @else if (totalRecords() === 0) {
+      <div class="box-body flex min-h-48 flex-col items-center justify-center text-center"><i class="ri-inbox-2-line mb-3 text-4xl text-textmuted"></i><h2 class="font-semibold">{{ emptyMessage() }}</h2><p class="mt-1 text-sm text-textmuted">{{ emptyDescription() }}</p></div>
+    } @else {
+      <div [class.hidden]="view() !== 'table'"><ng-content select="[dataListTable]" /></div>
+      <div [class.hidden]="view() !== 'tile'" class="box-body"><div class="grid grid-cols-1 sm:grid-cols-2 xl:grid-cols-3 2xl:grid-cols-4" [class]="'grid grid-cols-1 sm:grid-cols-2 xl:grid-cols-3 2xl:grid-cols-4 ' + contentSpacingClass()"><ng-content select="[dataListTile]" /></div></div>
+      <div [class.hidden]="view() !== 'detail'" class="box-body"><div class="grid grid-cols-1 lg:grid-cols-2 2xl:grid-cols-3" [class]="'grid grid-cols-1 lg:grid-cols-2 2xl:grid-cols-3 ' + contentSpacingClass()"><ng-content select="[dataListDetail]" /></div></div>
+    }
+    <div class="box-footer flex flex-col items-start justify-between gap-3 sm:flex-row sm:items-center">
+      <div class="flex flex-wrap items-center gap-3 text-sm"><span>Showing <b>{{ startRecord() }}</b> to <b>{{ endRecord() }}</b> of <b>{{ totalRecords() }}</b> entries</span>
+        <label class="flex items-center gap-2">Show <select class="ti-form-select form-select-sm !w-[4.75rem]" [value]="pageSize()" (change)="onPageSizeChange($event)">@for (size of pageSizeOptions(); track size) { <option [value]="size">{{ size }}</option> }</select></label>
+      </div>
+      <nav aria-label="Pagination" class="pagination-style-4"><ul class="ti-pagination mb-0">
+        <li class="page-item" [class.disabled]="pageIndex() <= 1"><button type="button" class="page-link" [disabled]="pageIndex() <= 1" (click)="goToPage(pageIndex() - 1)"><i class="ri-arrow-left-s-line"></i></button></li>
+        @for (page of visiblePages(); track page) { <li class="page-item"><button type="button" class="page-link" [class.active]="page === pageIndex()" (click)="goToPage(page)">{{ page }}</button></li> }
+        <li class="page-item" [class.disabled]="pageIndex() >= totalPages()"><button type="button" class="page-link" [disabled]="pageIndex() >= totalPages()" (click)="goToPage(pageIndex() + 1)"><i class="ri-arrow-right-s-line"></i></button></li>
+      </ul></nav>
+    </div>
+  </div>
+</section>
diff --git a/src/app/shared/components/data-list/data-list.ts b/src/app/shared/components/data-list/data-list.ts
new file mode 100644
index 00000000..5a9f57d3
--- /dev/null
+++ b/src/app/shared/components/data-list/data-list.ts
@@ -0,0 +1,75 @@
+import { Component, DestroyRef, computed, inject, input, output, signal } from '@angular/core';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { Subject, debounceTime, distinctUntilChanged } from 'rxjs';
+
+export type DataListView = 'table' | 'tile' | 'detail';
+export type DataListDensity = 'compact' | 'comfortable' | 'spacious';
+
+@Component({
+  selector: 'app-data-list',
+  standalone: true,
+  templateUrl: './data-list.html'
+})
+export class DataList {
+  private readonly destroyRef = inject(DestroyRef);
+  private readonly searchTerms$ = new Subject<string>();
+
+  readonly title = input.required<string>();
+  readonly subtitle = input('');
+  readonly addLabel = input('Add');
+  readonly searchPlaceholder = input('Search...');
+  readonly totalRecords = input(0);
+  readonly pageIndex = input(1);
+  readonly pageSize = input(10);
+  readonly pageSizeOptions = input<readonly number[]>([5, 10, 20, 50]);
+  readonly loading = input(false);
+  readonly emptyMessage = input('No records found.');
+  readonly emptyDescription = input('Try changing your search or filters.');
+  readonly showFilters = input(true);
+
+  readonly searchChanged = output<string>();
+  readonly addClicked = output<void>();
+  readonly pageChanged = output<{ pageIndex: number; pageSize: number }>();
+  readonly filtersCleared = output<void>();
+  readonly filtersApplied = output<void>();
+
+  readonly view = signal<DataListView>('table');
+  readonly density = signal<DataListDensity>('comfortable');
+  readonly filtersOpen = signal(false);
+  readonly totalPages = computed(() => Math.max(1, Math.ceil(this.totalRecords() / this.pageSize())));
+  readonly startRecord = computed(() => this.totalRecords() ? (this.pageIndex() - 1) * this.pageSize() + 1 : 0);
+  readonly endRecord = computed(() => Math.min(this.pageIndex() * this.pageSize(), this.totalRecords()));
+  readonly visiblePages = computed(() => {
+    const total = this.totalPages();
+    const current = this.pageIndex();
+    const start = Math.max(1, Math.min(current - 2, total - 4));
+    return Array.from({ length: Math.min(5, total) }, (_, index) => start + index);
+  });
+  readonly contentSpacingClass = computed(() => ({
+    compact: 'gap-3', comfortable: 'gap-4', spacious: 'gap-6'
+  })[this.density()]);
+  readonly cardPaddingClass = computed(() => ({
+    compact: 'p-3', comfortable: 'p-4', spacious: 'p-6'
+  })[this.density()]);
+
+  constructor() {
+    this.searchTerms$.pipe(
+      debounceTime(300),
+      distinctUntilChanged(),
+      takeUntilDestroyed(this.destroyRef)
+    ).subscribe(value => this.searchChanged.emit(value));
+  }
+
+  setView(view: DataListView): void { this.view.set(view); }
+  setDensity(event: Event): void { this.density.set((event.target as HTMLSelectElement).value as DataListDensity); }
+  onSearch(value: string): void { this.searchTerms$.next(value.trim()); }
+  goToPage(page: number): void {
+    if (page >= 1 && page <= this.totalPages() && page !== this.pageIndex()) {
+      this.pageChanged.emit({ pageIndex: page - 1, pageSize: this.pageSize() });
+    }
+  }
+  onPageSizeChange(event: Event): void {
+    const pageSize = Number((event.target as HTMLSelectElement).value);
+    if (pageSize && pageSize !== this.pageSize()) this.pageChanged.emit({ pageIndex: 0, pageSize });
+  }
+}
diff --git a/src/app/shared/components/data-table/data-table-cell.directive.ts b/src/app/shared/components/data-table/data-table-cell.directive.ts
new file mode 100644
index 00000000..a078ec6d
--- /dev/null
+++ b/src/app/shared/components/data-table/data-table-cell.directive.ts
@@ -0,0 +1,12 @@
+import { Directive, TemplateRef, input } from '@angular/core';
+import { DataTableCellContext, DataTableRecord } from './data-table.types';
+
+@Directive({
+  selector: 'ng-template[appDataTableCell]',
+  standalone: true
+})
+export class DataTableCellDirective<T extends DataTableRecord = DataTableRecord> {
+  appDataTableCell = input.required<string>();
+
+  constructor(readonly templateRef: TemplateRef<DataTableCellContext<T>>) {}
+}
\ No newline at end of file
diff --git a/src/app/shared/components/data-table/data-table-query.state.ts b/src/app/shared/components/data-table/data-table-query.state.ts
new file mode 100644
index 00000000..b692c89e
--- /dev/null
+++ b/src/app/shared/components/data-table/data-table-query.state.ts
@@ -0,0 +1,60 @@
+import { signal } from '@angular/core';
+import {
+    DataTablePageEvent,
+    DataTableSortEvent
+} from './data-table.types';
+import { DataTableQuery } from './data-table.types';
+
+export class DataTableQueryState {
+    pageIndex = signal(1);
+    pageSize = signal(15);
+    searchText = signal('');
+    sortColumn = signal('');
+    sortDirection = signal<'asc' | 'desc'>('asc');
+    private readonly draw = signal(1);
+
+    getQuery(): DataTableQuery {
+        return {
+            draw: this.draw(),
+            page: this.pageIndex(),
+            pageSize: this.pageSize(),
+            search: this.searchText(),
+            sortBy: this.sortColumn(),
+            sortDir: this.sortDirection(),
+            isActive: null
+        };
+    }
+
+    setSearch(value: string): DataTableQuery {
+        this.searchText.set(value);
+        this.pageIndex.set(1);
+        this.draw.update(v => v + 1);
+        return this.getQuery();
+    }
+
+    setPage(event: DataTablePageEvent): DataTableQuery {
+        this.pageIndex.set(event.pageIndex);
+        this.pageSize.set(event.pageSize);
+        this.draw.update(v => v + 1);
+        return this.getQuery();
+    }
+
+    setSort(event: DataTableSortEvent): DataTableQuery {
+        this.sortColumn.set(event.column);
+        this.sortDirection.set(event.direction);
+        this.pageIndex.set(1);
+        this.draw.update(v => v + 1);
+
+        return this.getQuery();
+    }
+
+    reset(): DataTableQuery {
+        this.pageIndex.set(1);
+        this.pageSize.set(15);
+        this.searchText.set('');
+        this.sortColumn.set('');
+        this.sortDirection.set('asc');
+        this.draw.set(1);
+        return this.getQuery();
+    }
+}
diff --git a/src/app/shared/components/data-table/data-table-query.types.ts b/src/app/shared/components/data-table/data-table-query.types.ts
new file mode 100644
index 00000000..88d07642
--- /dev/null
+++ b/src/app/shared/components/data-table/data-table-query.types.ts
@@ -0,0 +1,17 @@
+// export interface DataTableQuery {
+//   pageIndex: number;
+//   pageSize: number;
+//   searchText: string;
+//   sortColumn: string;
+//   sortDirection: 'asc' | 'desc';
+// }
+
+export interface DataTableQuery {
+  draw: number;
+  page: number;
+  pageSize: number;
+  sortBy?: string | null;
+  sortDir: 'asc' | 'desc';
+  search?: string | null;
+  isActive?: boolean | null;
+}
diff --git a/src/app/shared/components/data-table/data-table.html b/src/app/shared/components/data-table/data-table.html
index 857c37d6..1a65ea66 100644
--- a/src/app/shared/components/data-table/data-table.html
+++ b/src/app/shared/components/data-table/data-table.html
@@ -1,129 +1,252 @@
-<div class="box custom-box">
-  <div class="box-header flex items-center justify-between">
-    <div class="box-title">{{ title() }}</div>
+<!-- Start::row-1 -->
+<div class="grid grid-cols-12 data-table-modern">
+  <div class="xl:col-span-12 col-span-12">
+    <div class="box overflow-visible">
+      <div class="box-header justify-between items-center gap-3">
+        <h5 class="box-title">
+          {{ tableTitle () }}
+        </h5>
+        <div class="flex flex-wrap items-center gap-3">
+          @if(showAddButton()){
+          <div>
+            <app-button action="add" [label]="buttonTitle()" size="sm" iconClass="!text-[1rem]"
+              className="!rounded-full shadow-sm" (buttonClicked)="onAddClick($event)" />
 
-    @if (showSearch()) {
-      <div class="w-64">
-        <input type="text" class="form-control form-control-sm" [placeholder]="searchPlaceholder()"
-          (input)="onSearch($any($event.target).value)" />
+          </div>
+          }
+          <!-- @if (toolbarTemplate(); as toolbar) {
+          <div>
+            <ng-container [ngTemplateOutlet]="toolbar.templateRef" />
+          </div>
+          } -->
+          @if (showSearch()) {
+          <div class="search-wrapper">
+            <i class="ri-search-line search-icon"></i>
+            <input #searchInput class="form-control form-control-sm brdr-clr" type="text"
+              [placeholder]="searchPlaceholder()" aria-label="table search" (input)="onSearch(searchInput.value)">
+          </div>
+          }
+
+        </div>
       </div>
-    }
-  </div>
 
-  <div class="box-body !p-0">
-    <div class="table-responsive">
-      <table [class]="tableClass()">
-        <thead [class]="tableHeadClass()">
-          <tr [class]="trHeadClass()">
-            @for (column of columns(); track column.key) {
-              <th
-                [class]="column.headerClass || defaultThClass()"
-                [style.width]="column.width || null"
-                (click)="onSort(column)"
-              >
-                <span
-                  class="inline-flex items-center gap-1"
-                  [class.cursor-pointer]="column.sortable"
-                >
-                  {{ column.label }}
-
-                  @if (column.sortable) {
-                    <i class="ri-arrow-up-down-line text-xs"></i>
-                  }
-                </span>
-              </th>
-            }
-
-            @if (actions().length > 0) {
-              <th [class]="actionHeaderClass()">Actions</th>
-            }
-          </tr>
-        </thead>
-
-        <tbody [class]="tableBodyClass()">
-          @if (loading()) {
-            <tr>
-              <td [attr.colspan]="columns().length + (actions().length ? 1 : 0)" class="text-center py-6">
-                Loading...
-              </td>
-            </tr>
-          } @else if (rows().length === 0) {
-            <tr>
-              <td
-                [attr.colspan]="columns().length + (actions().length ? 1 : 0)"
-                class="text-center py-6 text-muted"
-              >
-                No records found
-              </td>
-            </tr>
-          } @else {
-            @for (row of rows(); track $index) {
-              <tr
-                [class]="trBodyClass()"
-                (click)="onRowClick(row)"
-              >
+      <div class="box-body !p-0 modern-table-body">
+        <div class="table-responsive overflow-x-auto overflow-y-visible modern-table-wrapper">
+          <table [class]="tableClass()">
+            <thead>
+              <tr [class]="trHeadClass()">
                 @for (column of columns(); track column.key) {
-                  <td [class]="column.cellClass || defaultTdClass()">
-                    {{ getCellValue(row, column.key.toString()) }}
-                  </td>
+                <th scope="col" [class]="getHeaderClass(column)" [style.width]="column.width || null"
+                  (click)="onSort(column)">
+                  <span class="inline-flex items-center gap-1" [class.cursor-pointer]="column.sortable">
+                    {{ column.label }}
+
+                    @if (column.sortable) {
+                    <i [class]="getSortIconClass(column) + ' text-xs align-middle'"></i>
+                    }
+                  </span>
+                </th>
                 }
 
                 @if (actions().length > 0) {
-                  <td [class]="actionCellClass()">
-                    <div class="flex justify-center gap-2">
-                      @for (action of actions(); track action.type) {
-                        @if (isActionVisible(action, row)) {
-                          <button
-                            type="button"
-                            class="btn btn-sm"
-                            [class]="action.className || 'btn-light'"
-                            [title]="action.label"
-                            (click)="onActionClick($event, action, row)"
-                          >
-                            @if (action.icon) {
-                              <i [class]="action.icon"></i>
-                            } @else {
-                              {{ action.label }}
-                            }
-                          </button>
-                        }
-                      }
-                    </div>
-                  </td>
+                <th scope="col" [class]="composeClass(actionHeaderClass(), 'relative overflow-visible')">Action</th>
                 }
               </tr>
+            </thead>
+
+            <tbody>
+              @if (loading()) {
+              <tr class="border-b border-defaultborder">
+                <td [attr.colspan]="totalVisibleColumns()" class="py-10">
+                  <div class="flex flex-col items-center justify-center gap-3 text-center">
+                    <i class="ti ti-loader-2 animate-spin text-[1.5rem]"></i>
+                    <span class="text-[0.875rem]">Loading data...</span>
+                  </div>
+                </td>
+              </tr>
+              } @else if (rows().length === 0) {
+              <tr class="border-b border-defaultborder bg-light/30 dark:bg-black/10">
+                <td [attr.colspan]="totalVisibleColumns()" class="p-0">
+                  <div class="flex min-h-[140px] flex-col items-center justify-center px-4 py-8 text-center">
+                    <div
+                      class="mb-3 inline-flex h-11 w-11 items-center justify-center rounded-full bg-primary/10 text-primary dark:bg-primary/15">
+                      <i class="ti ti-database-off text-[1.25rem]" aria-hidden="true"></i>
+                    </div>
+
+                    <p class="text-sm font-semibold text-defaulttextcolor dark:text-white/80">
+                      {{ emptyMessage() }}
+                    </p>
+
+                    @if (emptyDescription()) {
+                    <p class="mt-1 max-w-md text-sm text-textmuted">
+                      {{ emptyDescription() }}
+                    </p>
+                    }
+                  </div>
+                </td>
+              </tr>
+              } @else
+              {
+              @for (row of rows(); track row['id']; let rowIndex = $index) {
+              <tr [class]="getRowClass(row, $index)" (click)="onRowClick(row)">
+                @for (column of columns(); track column.key) {
+                <td [class]="getCellClass(column)">
+                  @if (getCellTemplate(column); as customTemplate) {
+                  <ng-container [ngTemplateOutlet]="customTemplate.templateRef"
+                    [ngTemplateOutletContext]="getCellTemplateContext(column, row)" />
+                  } @else if (column.badge) {
+                  <span [class]="getBadgeClass(column, row)">
+                    {{ getDisplayValue(column, row) }}
+                  </span>
+                  } @else {
+                  {{ getDisplayValue(column, row) }}
+                  }
+                </td>
+                }
+
+                @if (actions().length > 0) {
+                <td [class]="composeClass(actionCellClass(), 'overflow-visible')" (click)="$event.stopPropagation()">
+                  <div class="inline-flex w-full justify-center">
+
+                    <button type="button" cdkOverlayOrigin #actionMenuOrigin="cdkOverlayOrigin" data-action-menu-trigger
+                      class="
+          ti-btn ti-btn-icon ti-btn-sm ti-btn-primary
+          !m-0 !h-6 !w-6 !p-0
+        " aria-label="Open row actions" aria-haspopup="menu" [attr.aria-controls]="getActionMenuId(row)"
+                      [attr.aria-expanded]="isActionMenuOpen(row)" (click)="toggleActionMenu($event, row)">
+                      <i class="ri-more-2-fill text-sm"></i>
+                    </button>
+
+                    <ng-template cdkConnectedOverlay [cdkConnectedOverlayOrigin]="actionMenuOrigin"
+                      [cdkConnectedOverlayOpen]="isActionMenuOpen(row)"
+                      [cdkConnectedOverlayPositions]="actionMenuPositions" [cdkConnectedOverlayViewportMargin]="8"
+                      [cdkConnectedOverlayPush]="true" [cdkConnectedOverlayHasBackdrop]="false"
+                      (overlayOutsideClick)="onActionMenuOutsideClick($event)">
+                      <div [id]="getActionMenuId(row)" role="menu" class="
+      w-[170px]
+      max-w-[calc(100vw-16px)]
+      overflow-hidden
+      rounded-lg
+      border border-defaultborder
+      bg-white
+      p-1.5
+      shadow-xl
+      dark:border-defaultborder/10
+      dark:bg-bodybg
+    " (click)="$event.stopPropagation()">
+                        @for (action of actions(); track $index) {
+                        @if (isActionVisible(action, row)) {
+                        <button type="button" role="menuitem" class="
+            flex w-full items-center gap-2
+            rounded-md px-3 py-2
+            text-start text-sm
+            transition-colors
+            hover:bg-light
+            dark:hover:bg-white/10
+          " [disabled]="isActionDisabled(action, row)" [class.opacity-50]="isActionDisabled(action, row)"
+                          [class.cursor-not-allowed]="isActionDisabled(action, row)"
+                          [class.!text-danger]="action.type === 'delete'" [attr.aria-label]="getActionLabel(action)"
+                          (click)="onDropdownActionClick($event, action, row)">
+                          @if (action.icon) {
+                          <i [class]="action.icon"></i>
+                          }
+
+                          <span>{{ action.label }}</span>
+                        </button>
+                        }
+                        }
+                      </div>
+                    </ng-template>
+
+                  </div>
+                </td>
+                }
+              </tr>
+              }
+              }
+            </tbody>
+          </table>
+        </div>
+      </div>
+      @if (showPaginator()) {
+      <div class="box-footer border-t-0 modern-table-footer">
+        <div class="flex items-center justify-between flex-wrap gap-3">
+
+          <!-- Record details and page-size selection -->
+          <div class="flex items-center flex-wrap gap-3">
+
+            <div class="text-sm text-defaulttextcolor">
+              Showing
+              <b>{{ startRecord() }}</b>
+              to
+              <b>{{ endRecord() }}</b>
+              of
+              <b>{{ totalRecords() }}</b>
+              entries
+            </div>
+
+            @if (pageSizeOptions().length > 0) {
+            <div class="flex items-center gap-2">
+              <label for="dataTablePageSize" class="text-sm whitespace-nowrap">
+                Show
+              </label>
+
+              <select id="dataTablePageSize" class="ti-form-select form-select-sm !w-[75px] !py-1"
+                (change)="onPageSizeChange($event)">
+                @for (size of pageSizeOptions(); track size) {
+                <option [value]="size" [selected]="size === pageSize()">
+                  {{ size }}
+                </option>
+                }
+              </select>
+
+              <span class="text-sm whitespace-nowrap">
+                entries
+              </span>
+            </div>
             }
-          }
-        </tbody>
-      </table>
+
+          </div>
+
+          <!-- Pagination -->
+          <nav aria-label="Table page navigation">
+            <ul class="ti-pagination mb-0">
+
+              <!-- Previous -->
+              <li class="page-item" [class.disabled]="pageIndex() <= 1">
+                <button type="button" class="page-link px-3 py-[0.375rem]" [disabled]="pageIndex() <= 1"
+                  (click)="goToPage(pageIndex() - 1)">
+                  Previous
+                </button>
+              </li>
+
+              <!-- Page numbers -->
+              @for (page of visiblePages(); track page) {
+              <li class="page-item">
+                <button type="button" class="page-link px-3 py-[0.375rem]" [class.active]="page === pageIndex()"
+                  [attr.aria-current]="
+                  page === pageIndex() ? 'page' : null
+                " (click)="goToPage(page)">
+                  {{ page }}
+                </button>
+              </li>
+              }
+
+              <!-- Next -->
+              <li class="page-item" [class.disabled]="pageIndex() >= totalPages()">
+                <button type="button" class="page-link px-3 py-[0.375rem]" [disabled]="pageIndex() >= totalPages()"
+                  (click)="goToPage(pageIndex() + 1)">
+                  Next
+                </button>
+              </li>
+
+            </ul>
+          </nav>
+
+        </div>
+      </div>
+      }
     </div>
   </div>
-
-  <div class="box-footer flex items-center justify-between">
-    <div class="text-sm text-muted">
-      Showing {{ startRecord() }} to {{ endRecord() }} of {{ totalRecords() }} entries
-    </div>
-
-    <div class="flex items-center gap-2">
-      <button
-        type="button"
-        class="btn btn-sm btn-light"
-        [disabled]="pageIndex() === 1"
-        (click)="onPageChange(pageIndex() - 1)"
-      >
-        Previous
-      </button>
-
-      <span class="text-sm">Page {{ pageIndex() }} of {{ totalPages() }}</span>
-
-      <button
-        type="button"
-        class="btn btn-sm btn-light"
-        [disabled]="pageIndex() === totalPages()"
-        (click)="onPageChange(pageIndex() + 1)"
-      >
-        Next
-      </button>
-    </div>
-  </div>
-</div>
\ No newline at end of file
+</div>
+<!--End::row-1 -->
\ No newline at end of file
diff --git a/src/app/shared/components/data-table/data-table.scss b/src/app/shared/components/data-table/data-table.scss
index e69de29b..305cef3f 100644
--- a/src/app/shared/components/data-table/data-table.scss
+++ b/src/app/shared/components/data-table/data-table.scss
@@ -0,0 +1,256 @@
+:host {
+  display: block;
+}
+
+/* Modern card wrapper */
+.data-table-modern .box {
+  border-radius: 1rem;
+  border: 1px solid var(--color-defaultborder);
+  background-color: var(--color-white);
+  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.04);
+  overflow: hidden;
+}
+
+:host-context(.dark) .data-table-modern .box {
+  border-color: color-mix(in srgb, #fff 10%, transparent);
+  background-color: var(--color-bodybg);
+}
+
+.data-table-modern .box-header {
+  // padding: 1rem 1.25rem;
+  padding: 7px 20px;
+  border-bottom: 1px solid var(--color-defaultborder);
+}
+
+:host-context(.dark) .data-table-modern .box-header {
+  border-color: color-mix(in srgb, #fff 10%, transparent);
+}
+
+.data-table-modern .box-title {
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+  font-size: 1rem;
+  font-weight: 600;
+  color: var(--color-defaulttextcolor);
+}
+
+/* Search input */
+.search-wrapper {
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+}
+
+.brdr-clr {
+  border: 1.5px solid #7c3deb !important;
+
+}
+
+
+.search-icon {
+  position: absolute;
+  left: 0.75rem;
+  top: 50%;
+  transform: translateY(-50%);
+  color: var(--color-textmuted, #8c9097);
+  font-size: 0.8125rem;
+  pointer-events: none;
+}
+
+.data-table-modern .search-wrapper .form-control-sm {
+  min-width: 180px;
+  padding-left: 2.25rem !important;
+  border-radius: 9999px;
+  border-color: var(--color-defaultborder);
+  background-color: var(--color-white);
+  font-size: 0.8125rem;
+  transition: border-color 0.2s ease, box-shadow 0.2s ease;
+}
+
+.data-table-modern .search-wrapper .form-control-sm:focus {
+  border-color: var(--color-primary);
+  box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-primary) 15%, transparent);
+  outline: none;
+}
+
+:host-context(.dark) .data-table-modern .search-wrapper .form-control-sm {
+  background-color: var(--color-bodybg);
+  border-color: color-mix(in srgb, #fff 10%, transparent);
+  color: var(--color-defaulttextcolor);
+}
+
+/* Table body / wrapper */
+.modern-table-body {
+  padding: 0 !important;
+}
+
+.modern-table-wrapper {
+  border-radius: 0 0 0.75rem 0.75rem;
+}
+
+/* Table */
+.data-table-modern .table {
+  width: 100%;
+  margin-bottom: 0;
+  border-collapse: separate;
+  border-spacing: 0;
+  font-size: 0.8125rem;
+}
+
+.data-table-modern .table.table-bordered,
+.data-table-modern .table.table-bordered thead th,
+.data-table-modern .table.table-bordered tbody td {
+  border: none;
+}
+
+.data-table-modern .table thead {
+  // background: linear-gradient(
+  //   135deg,
+  //   #020617 0%,
+  //   #172554 40%,
+  //   #4338CA 75%,
+  //   #7C3AED 100%
+  // );
+  background: #7C3AED;
+  color: var(--color-white);
+}
+
+.data-table-modern .table thead th {
+  padding: 0.5rem 0.75rem;
+  font-weight: 600;
+  font-size: 0.6875rem;
+  letter-spacing: 0.04em;
+  text-transform: uppercase;
+  white-space: nowrap;
+  vertical-align: middle;
+  color: var(--color-white);
+  background: transparent;
+  border: none;
+}
+
+.data-table-modern .table tbody td {
+  padding: 0.2rem 0.75rem;
+  vertical-align: middle;
+  color: var(--color-defaulttextcolor);
+  border: none;
+  font-size: 0.8125rem;
+}
+
+.data-table-modern .table tbody tr:hover {
+  // background-color: var(--color-light);
+
+  background-color: #e1d0ff;
+}
+
+:host-context(.dark) .data-table-modern .table tbody tr:hover {
+  background-color: color-mix(in srgb, #fff 6%, transparent);
+}
+
+/* Inactive row action buttons border */
+.data-table-modern .inactive-actions button {
+  border: 1.5px solid #7c3deb !important;
+}
+
+/* Footer */
+.data-table-modern .box-footer {
+  padding: 0.625rem 1rem;
+  border-top: 1px solid var(--color-defaultborder);
+  background-color: color-mix(in srgb, var(--color-primary) 3%, transparent);
+}
+
+:host-context(.dark) .data-table-modern .box-footer {
+  border-color: color-mix(in srgb, #fff 10%, transparent);
+  background-color: color-mix(in srgb, var(--color-primary) 6%, transparent);
+}
+
+/* Pagination */
+.data-table-modern .ti-pagination {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.25rem;
+  padding: 0;
+  margin: 0;
+}
+
+.data-table-modern .ti-pagination li.page-item {
+  display: inline-flex;
+  border: 1px solid var(--color-primary);
+  border-radius: 9999px;
+}
+
+.data-table-modern .ti-pagination li.page-item.disabled {
+  opacity: 0.4;
+}
+
+.data-table-modern .ti-pagination li .page-link {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  min-width: 1.5rem;
+  height: 1.5rem;
+  padding: 0 0.5rem;
+  border-radius: 9999px;
+  border: none;
+  background-color: transparent;
+  color: var(--color-defaulttextcolor);
+  font-size: 0.75rem;
+  font-weight: 500;
+  line-height: 1;
+  transition: all 0.15s ease;
+}
+
+.data-table-modern .ti-pagination li .page-link:hover:not(:disabled) {
+  background-color: color-mix(in srgb, var(--color-primary) 10%, transparent);
+  color: var(--color-primary);
+}
+
+.data-table-modern .ti-pagination li.active .page-link,
+.data-table-modern .ti-pagination li .page-link.active {
+  background-color: var(--color-primary);
+  color: var(--color-white);
+  box-shadow: 0 2px 6px color-mix(in srgb, var(--color-primary) 30%, transparent);
+}
+
+.data-table-modern .ti-pagination li.disabled .page-link {
+  cursor: not-allowed;
+  background-color: transparent;
+}
+
+:host-context(.dark) .data-table-modern .ti-pagination li .page-link {
+  background-color: transparent;
+  color: color-mix(in srgb, var(--color-defaulttextcolor) 80%, #fff);
+}
+
+:host-context(.dark) .data-table-modern .ti-pagination li .page-link:hover:not(:disabled) {
+  background-color: color-mix(in srgb, var(--color-primary) 15%, transparent);
+  color: var(--color-primary);
+}
+
+:host-context(.dark) .data-table-modern .ti-pagination li.active .page-link {
+  color: var(--color-white);
+  background-color: var(--color-primary);
+}
+
+/* Responsive scroll */
+.table-responsive {
+  width: 100%;
+  overflow-x: auto;
+  overflow-y: visible;
+}
+
+.table th,
+.table td {
+  vertical-align: middle;
+}
+
+/* Remove number spinner buttons for cleaner look (kept from original) */
+.data-table-modern .custom-floating-input[type='number']::-webkit-inner-spin-button,
+.data-table-modern .custom-floating-input[type='number']::-webkit-outer-spin-button {
+  appearance: none;
+  margin: 0;
+}
+
+.data-table-modern .custom-floating-input[type='number'] {
+  -moz-appearance: textfield;
+}
\ No newline at end of file
diff --git a/src/app/shared/components/data-table/data-table.ts b/src/app/shared/components/data-table/data-table.ts
index ca3d3ba5..dd96df3b 100644
--- a/src/app/shared/components/data-table/data-table.ts
+++ b/src/app/shared/components/data-table/data-table.ts
@@ -1,27 +1,122 @@
-import { Component, computed, input, output, signal } from '@angular/core';
-import { DataTableAction, DataTableActionEvent, DataTableColumn, DataTablePageEvent, DataTableSortEvent } from './data-table.types';
+import { NgTemplateOutlet } from '@angular/common';
+import { Component, DestroyRef, HostListener, computed, contentChildren, effect, inject, input, output, signal } from '@angular/core';
+import { MatPaginatorModule, PageEvent } from '@angular/material/paginator';
+import { Subject } from 'rxjs';
+import { debounceTime, distinctUntilChanged } from 'rxjs/operators';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { DataTableCellDirective } from '../../directives/data-table-cell.directive';
+import { CdkConnectedOverlay, CdkOverlayOrigin, ConnectedPosition } from '@angular/cdk/overlay';
+
+import { DataTableAction, DataTableActionEvent, DataTableCellContext, DataTableColumn, DataTablePageEvent, DataTableRecord, DataTableSortEvent } from './data-table.types';
+
+import { Button } from '../button/button';
+import { contentChild } from '@angular/core';
+
+import { DataTableToolbarDirective } from '../../directives/data-table-toolbar/data-table-toolbar.directive';
 
 @Component({
-  selector: 'data-table',
-  imports: [],
+  selector: 'app-data-table',
+  imports: [NgTemplateOutlet,
+    MatPaginatorModule,
+    CdkOverlayOrigin,
+    CdkConnectedOverlay,
+    Button],
   templateUrl: './data-table.html',
   styleUrl: './data-table.scss',
   standalone: true
 })
-export class DataTable<T extends Record<string, any> = any> {
+export class DataTable<T extends DataTableRecord = DataTableRecord> {
 
+  private readonly destroyRef = inject(DestroyRef);
+
+  private readonly searchTerms$ = new Subject<string>();
+
+  readonly cellTemplates = contentChildren(DataTableCellDirective);
+  readonly toolbarTemplate = contentChild(DataTableToolbarDirective);
+
+  private readonly defaultRowClasses = [
+    'table-primary',
+    'table-secondary',
+    'table-success',
+    'table-danger',
+    'table-warning',
+    'table-info',
+    'table-light'
+  ];
+
+  readonly actionMenuPositions: ConnectedPosition[] = [
+    // Open below and align right
+    {
+      originX: 'end',
+      originY: 'bottom',
+      overlayX: 'end',
+      overlayY: 'top',
+      offsetY: 4
+    },
+
+    // Open above and align right
+    {
+      originX: 'end',
+      originY: 'top',
+      overlayX: 'end',
+      overlayY: 'bottom',
+      offsetY: -4
+    },
+
+    // Mobile fallback: open below towards the right
+    {
+      originX: 'start',
+      originY: 'bottom',
+      overlayX: 'start',
+      overlayY: 'top',
+      offsetY: 4
+    },
+
+    // Mobile fallback: open above towards the right
+    {
+      originX: 'start',
+      originY: 'top',
+      overlayX: 'start',
+      overlayY: 'bottom',
+      offsetY: -4
+    }
+  ];
+
+  openActionMenuUpward = signal(false);
   columns = input<DataTableColumn<T>[]>([]);
   rows = input<T[]>([]);
   actions = input<DataTableAction<T>[]>([]);
-
-  
   loading = input(false);
+
+  /* --------- pagination inputs ---- */
+
   totalRecords = input(0);
   pageIndex = input(1);
-  pageSize = input(10);
-  title = input<string>('');
+  pageSize = input(15);
+  pageSizeOptions = input<number[]>([10, 15, 20, 50]);
+  showPaginator = input(true);
+
+  /*---------------------------*/
+
+  tableTitle = input<string>('');
+  toolTip = input<string>('');
+  buttonTitle = input<string>('');
+
+  /* --------- Search inputs ---- */
   showSearch = input<boolean>(false);
+  showformSelect = input<boolean>(false);
+  showAddButton = input<boolean>(false);
   searchPlaceholder = input('Search...');
+  searchDebounceTime = input(300);
+  emptyMessage = input('No records found');
+  emptyDescription = input('There is currently no data to display.');
+  /*---------------------------*/
+
+  /* --------- Permission inputs ---- */
+
+  allowedPermissions = input<string[]>([]);
+
+  /*------------outputs ---------------*/
 
   searchChanged = output<string>();
   pageChanged = output<DataTablePageEvent>();
@@ -31,17 +126,35 @@ export class DataTable<T extends Record<string, any> = any> {
 
   sortColumn = signal('');
   sortDirection = signal<'asc' | 'desc'>('asc');
+  openActionRowId = signal<string | number | null>(null);
 
-  tableClass = input<string>('table whitespace-nowrap min-w-full');
+  tableClass = input<string>('table table-bordered whitespace-nowrap min-w-full');
   tableHeadClass = input<string>('');
   tableBodyClass = input<string>('');
-  trHeadClass = input<string>('border-b border-defaultborder');
+  trHeadClass = input<string>('border-b border-defaultborder bg-primary/10 dark:bg-primary/15 dark:border-defaultborder/10');
   trBodyClass = input<string>('border-b border-defaultborder hover:bg-light cursor-pointer');
+  rowClass = input<string | ((row: T, index: number) => string)>('');
+  rowColorMode = input<'none' | 'status' | 'cycle'>('status');
 
-  defaultThClass = input<string>('text-start');
+  defaultThClass = input<string>('text-defaulttextcolor dark:text-white font-semibold text-start');
   defaultTdClass = input<string>('');
-  actionHeaderClass = input<string>('text-center');
-  actionCellClass = input<string>('text-center');
+  actionHeaderClass = input<string>('!text-center');
+  actionCellClass = input<string>('!text-center');
+  addClicked = output<void>();
+
+  totalVisibleColumns = computed(() => this.columns().length + (this.actions().length > 0 ? 1 : 0));
+
+  allowedPermissionSet = computed(() => new Set(this.allowedPermissions()));
+
+  cellTemplateMap = computed(() => {
+    const templateMap = new Map<string, DataTableCellDirective>();
+
+    for (const template of this.cellTemplates() as DataTableCellDirective[]) {
+      templateMap.set(template.appDataTableCell(), template);
+    }
+
+    return templateMap;
+  });
 
   totalPages = computed(() => {
     return Math.ceil(this.totalRecords() / this.pageSize()) || 1;
@@ -56,12 +169,84 @@ export class DataTable<T extends Record<string, any> = any> {
     return Math.min(this.pageIndex() * this.pageSize(), this.totalRecords());
   });
 
+  visiblePages = computed(() => {
+    const currentPage = this.pageIndex();
+    const total = this.totalPages();
+    const maxVisiblePages = 5;
+
+    let startPage = Math.max(
+      1,
+      currentPage - Math.floor(maxVisiblePages / 2)
+    );
+
+    let endPage = Math.min(
+      total,
+      startPage + maxVisiblePages - 1
+    );
+
+    if (endPage - startPage + 1 < maxVisiblePages) {
+      startPage = Math.max(
+        1,
+        endPage - maxVisiblePages + 1
+      );
+    }
+
+    return Array.from(
+      { length: endPage - startPage + 1 },
+      (_, index) => startPage + index
+    );
+  });
+  goToPage(page: number): void {
+    if (
+      page < 1 ||
+      page > this.totalPages() ||
+      page === this.pageIndex()
+    ) {
+      return;
+    }
+
+    this.onPageChange({
+      pageIndex: page - 1,
+      pageSize: this.pageSize(),
+      length: this.totalRecords()
+    });
+  }
+
+  onPageSizeChange(event: Event): void {
+    const pageSize = Number(
+      (event.target as HTMLSelectElement).value
+    );
+
+    if (!pageSize || pageSize === this.pageSize()) {
+      return;
+    }
+
+    this.onPageChange({
+      pageIndex: 0,
+      pageSize,
+      length: this.totalRecords()
+    });
+  }
+
+  constructor() {
+    effect((onCleanup) => {
+      const debounce = this.searchDebounceTime();
+      const subscription = this.searchTerms$
+        .pipe(debounceTime(debounce), distinctUntilChanged(), takeUntilDestroyed(this.destroyRef))
+        .subscribe((value) => {
+          this.searchChanged.emit(value);
+        });
+
+      onCleanup(() => subscription.unsubscribe());
+    });
+  }
+
   getCellValue(row: T, key: string): unknown {
-    return row[key] ?? '-';
+    return row[key] ?? null;
   }
 
   onSearch(value: string): void {
-    this.searchChanged.emit(value);
+    this.searchTerms$.next(value.trim());
   }
 
   onSort(column: DataTableColumn<T>): void {
@@ -80,31 +265,299 @@ export class DataTable<T extends Record<string, any> = any> {
       column: this.sortColumn(),
       direction: this.sortDirection()
     });
+
+    this.closeActionMenu();
   }
 
-  onPageChange(pageIndex: number): void {
-    if (pageIndex < 1 || pageIndex > this.totalPages()) return;
-
+  onPageChange(event: PageEvent): void {
     this.pageChanged.emit({
-      pageIndex,
-      pageSize: this.pageSize()
+      pageIndex: event.pageIndex + 1,
+      pageSize: event.pageSize
     });
+
+    this.closeActionMenu();
   }
 
   onActionClick(event: MouseEvent, action: DataTableAction<T>, row: T): void {
     event.stopPropagation();
 
+    if (this.isActionDisabled(action, row)) {
+      return;
+    }
+
     this.actionClicked.emit({
       action,
       row
     });
   }
 
+  onAddClick(event: MouseEvent): void {
+    event.preventDefault();
+    event.stopPropagation();
+
+    this.closeActionMenu();
+    this.addClicked.emit();
+  }
+
+  toggleActionMenu(event: MouseEvent, row: T): void {
+    event.stopPropagation();
+
+    const rowId = this.getRowId(row);
+
+    if (rowId === null) {
+      return;
+    }
+
+    this.openActionRowId.update(currentRowId =>
+      currentRowId === rowId ? null : rowId
+    );
+  }
+
+  closeActionMenu(): void {
+    this.openActionRowId.set(null);
+  }
+  onDropdownActionClick(
+    event: MouseEvent,
+    action: DataTableAction<T>,
+    row: T
+  ): void {
+    event.stopPropagation();
+
+    this.onActionClick(event, action, row);
+    this.closeActionMenu();
+  }
+
+  isActionMenuOpen(row: T): boolean {
+    const rowId = row['id'];
+
+    return (
+      (typeof rowId === 'string' ||
+        typeof rowId === 'number') &&
+      this.openActionRowId() === rowId
+    );
+  }
+
+  getActionMenuId(row: T): string {
+    const rowId = this.getRowId(row);
+    return rowId === null ? 'row-actions-menu' : `row-actions-menu-${String(rowId)}`;
+  }
+
+  onActionMenuOutsideClick(event: MouseEvent): void {
+    const target = event.target;
+
+    if (!(target instanceof HTMLElement)) {
+      this.closeActionMenu();
+      return;
+    }
+
+    if (target.closest('[data-action-menu-trigger]')) {
+      return;
+    }
+
+    this.closeActionMenu();
+  }
+
   isActionVisible(action: DataTableAction<T>, row: T): boolean {
+    if (action.permission && !this.allowedPermissionSet().has(action.permission)) {
+      return false;
+    }
+
     return action.visible ? action.visible(row) : true;
   }
 
+  isActionDisabled(action: DataTableAction<T>, row: T): boolean {
+    return action.disabled ? action.disabled(row) : false;
+  }
+
+  getActionLabel(action: DataTableAction<T>): string {
+    return action.tooltip || action.label;
+  }
+
+  getColumnKey(column: DataTableColumn<T>): string {
+    return String(column.key);
+  }
+
+  getSortIconClass(column: DataTableColumn<T>): string {
+    if (!column.sortable) {
+      return '';
+    }
+
+    const key = this.getColumnKey(column);
+
+    if (this.sortColumn() !== key) {
+      return 'ri-arrow-up-down-line';
+    }
+
+    return this.sortDirection() === 'asc' ? 'ri-sort-asc' : 'ri-sort-desc';
+  }
+
+  getHeaderClass(column: DataTableColumn<T>): string {
+    return this.composeClass(this.defaultThClass(), this.getAlignClass(column.headerAlign), column.headerClass);
+  }
+
+  getCellClass(column: DataTableColumn<T>): string {
+    return this.composeClass(this.defaultTdClass(), this.getAlignClass(column.align), column.cellClass);
+  }
+
+  getBadgeClass(column: DataTableColumn<T>, row: T): string {
+    const value = this.getCellValue(row, this.getColumnKey(column));
+    return this.composeClass(column.badgeClass ? column.badgeClass(value, row) : this.getDefaultBadgeClass(value));
+  }
+
+  getDisplayValue(column: DataTableColumn<T>, row: T): string | number {
+    const value = this.getCellValue(row, this.getColumnKey(column));
+
+    if (column.formatter) {
+      return column.formatter(value, row);
+    }
+
+    if (value === null || value === undefined) {
+      return '-';
+    }
+
+    return typeof value === 'string' || typeof value === 'number' ? value : String(value);
+  }
+
+  getCellTemplate(column: DataTableColumn<T>): DataTableCellDirective | undefined {
+    return this.cellTemplateMap().get(this.getColumnKey(column));
+  }
+
+  getCellTemplateContext(column: DataTableColumn<T>, row: T): DataTableCellContext<T> {
+    return {
+      $implicit: row,
+      row,
+      value: this.getCellValue(row, this.getColumnKey(column))
+    };
+  }
+
+  getActionButtonClass(action: DataTableAction<T>): string {
+    return this.composeClass(
+      'ti-btn ti-btn-icon ti-btn-sm',
+      action.className || this.getDefaultActionClass(action.type)
+    );
+  }
+
   onRowClick(row: T): void {
     this.rowClicked.emit(row);
   }
+
+  @HostListener('document:click')
+  onDocumentClick(): void {
+    this.closeActionMenu();
+  }
+
+  @HostListener('document:keydown.escape')
+  onEscapeKey(): void {
+    this.closeActionMenu();
+  }
+
+  private getAlignClass(align?: DataTableColumn<T>['align']): string {
+    switch (align) {
+      case 'left':
+        return 'text-start';
+      case 'right':
+        return 'text-end';
+      default:
+        return '!text-center';
+    }
+  }
+
+  composeClass(...classes: Array<string | undefined>): string {
+    return classes.filter(Boolean).join(' ');
+  }
+
+  private getRowId(row: T): string | number | null {
+    const rowId = row['id'];
+
+    return typeof rowId === 'string' || typeof rowId === 'number'
+      ? rowId
+      : null;
+  }
+
+  private getDefaultActionClass(actionType: string): string {
+    switch (actionType) {
+      case 'view':
+        return 'ti-btn-info-full';
+      case 'edit':
+        return 'ti-btn-primary-full';
+      case 'delete':
+        return 'ti-btn-danger-full';
+      default:
+        return 'ti-btn-light';
+    }
+  }
+
+  private getDefaultBadgeClass(value: unknown): string {
+    if (typeof value === 'string') {
+      if (value.toLowerCase() === 'active') {
+        return 'badge bg-success/10 text-success';
+      }
+
+      if (value.toLowerCase() === 'inactive') {
+        return 'badge bg-danger/10 text-danger';
+      }
+    }
+
+    return 'badge bg-light text-defaulttextcolor';
+  }
+
+  getRowClass(row: T, index: number): string {
+    const baseClass = this.trBodyClass();
+
+    // 1. Parent override
+    const rowClassValue = this.rowClass();
+
+    if (rowClassValue) {
+      const customClass =
+        typeof rowClassValue === 'function'
+          ? rowClassValue(row, index)
+          : rowClassValue;
+
+      return this.composeClass(baseClass, customClass);
+    }
+
+    // 2. Automatic status detection
+    const status =
+      row['status'] ??
+      row['state'] ??
+      row['approvalStatus'] ??
+      row['workflowStatus'];
+
+    if (typeof status === 'string') {
+      switch (status.toLowerCase()) {
+        case 'active':
+        case 'approved':
+        case 'success':
+          return this.composeClass(baseClass, 'table-success');
+
+        case 'inactive':
+        case 'rejected':
+        case 'failed':
+          return this.composeClass(baseClass, 'table-danger');
+
+        case 'pending':
+          return this.composeClass(baseClass, 'table-warning');
+
+        case 'draft':
+          return this.composeClass(baseClass, 'table-info');
+      }
+    }
+
+    // 3. Boolean status
+    if (typeof row['isActive'] === 'boolean') {
+      return this.composeClass(
+        baseClass,
+        row['isActive'] ? '' : 'table-danger'
+      );
+    }
+
+    // 4. Cycle through Ynex colors
+    const colorClass =
+      this.defaultRowClasses[index % this.defaultRowClasses.length];
+
+    return this.composeClass(baseClass, '');
+  }
+
 }
+
+export { DataTableCellDirective } from '../../directives/data-table-cell.directive';
diff --git a/src/app/shared/components/data-table/data-table.types.ts b/src/app/shared/components/data-table/data-table.types.ts
index 06b9e284..61895424 100644
--- a/src/app/shared/components/data-table/data-table.types.ts
+++ b/src/app/shared/components/data-table/data-table.types.ts
@@ -1,21 +1,35 @@
+export type DataTableRecord = Record<string, unknown> & {
+  readonly id?: string | number;
+  readonly status?: unknown;
+  readonly isActive?: boolean;
+};  /* table row is an object with string keys */
+
 export type DataTableActionType = 'view' | 'edit' | 'delete' | string;
 
-export interface DataTableColumn<T = any> {
-  key: keyof T | string;
+export interface DataTableColumn<T extends DataTableRecord = DataTableRecord> {
+  key: Extract<keyof T, string> | string;
   label: string;
+  header: string;
   sortable?: boolean;
   width?: string;
   align?: 'left' | 'center' | 'right';
+  headerAlign?: 'left' | 'center' | 'right';
+  formatter?: (value: unknown, row: T) => string | number; /* for change the value of custom cell like date format */
+  badge?: boolean;
+  badgeClass?: (value: unknown, row: T) => string; /* this is to show the badge according to status of record */
 
   headerClass?: string;
   cellClass?: string;
 }
 
-export interface DataTableAction<T = any> {
+export interface DataTableAction<T extends DataTableRecord = DataTableRecord> {
   type: DataTableActionType;
   label: string;
   icon?: string;
   className?: string;
+  tooltip?: string;
+  permission?: string;
+  disabled?: (row: T) => boolean;
   visible?: (row: T) => boolean;
 }
 
@@ -29,7 +43,31 @@ export interface DataTableSortEvent {
   direction: 'asc' | 'desc';
 }
 
-export interface DataTableActionEvent<T = any> {
+export interface DataTableActionEvent<T extends DataTableRecord = DataTableRecord> {
   action: DataTableAction<T>;
   row: T;
-}
\ No newline at end of file
+}
+
+/* for custom cell templates */
+export interface DataTableCellContext<T extends DataTableRecord = DataTableRecord> {
+  $implicit: T;
+  row: T;
+  value: unknown;
+}
+
+export interface DataTableQuery {
+  draw: number;
+  page: number;
+  pageSize: number;
+  sortBy?: string | null;
+  sortDir: 'asc' | 'desc';
+  search?: string | null;
+  isActive?: boolean | null;
+}
+
+export interface DataTableResult<T> {
+  draw: number;
+  total: number;
+  filtered: number;
+  rows: T[];
+}
diff --git a/src/app/shared/components/filter-card/filter-card.html b/src/app/shared/components/filter-card/filter-card.html
new file mode 100644
index 00000000..2c5355ef
--- /dev/null
+++ b/src/app/shared/components/filter-card/filter-card.html
@@ -0,0 +1,46 @@
+<div class="box custom-box" [class]="'box custom-box ' + cardClass()">
+  <div class="box-header justify-between" [class]="'box-header justify-between ' + headerClass()">
+    <div class="box-title flex items-center gap-2">
+      @if (titleIcon()) {
+        <i [class]="titleIcon()" aria-hidden="true"></i>
+      }
+      <span>{{ title() }}</span>
+    </div>
+
+    <div class="flex items-center gap-2">
+      <ng-content select="[filterCardActions]" />
+
+      <button
+        type="button"
+        class="ti-btn ti-btn-sm ti-btn-light"
+        [class]="'ti-btn ti-btn-sm ti-btn-light ' + toggleButtonClass()"
+        [class.hidden]="!showToggleButton()"
+        [disabled]="!collapsible()"
+        [attr.aria-expanded]="!collapsed()"
+        [attr.aria-controls]="resolvedContentId()"
+        [attr.aria-label]="currentTooltip()"
+        [appTooltip]="currentTooltip()"
+        (click)="toggleCollapse()"
+      >
+        <i [class]="currentIcon()" aria-hidden="true"></i>
+      </button>
+    </div>
+  </div>
+
+  <div
+    class="filter-card-body-grid"
+    [class.is-collapsed]="collapsed()"
+    [attr.aria-hidden]="collapsed()"
+    [attr.inert]="collapsed() ? '' : null"
+  >
+    <div class="filter-card-body-content">
+      <div
+        class="box-body"
+        [class]="'box-body ' + bodyClass()"
+        [id]="resolvedContentId()"
+      >
+        <ng-content />
+      </div>
+    </div>
+  </div>
+</div>
diff --git a/src/app/shared/components/filter-card/filter-card.spec.ts b/src/app/shared/components/filter-card/filter-card.spec.ts
new file mode 100644
index 00000000..e54b2147
--- /dev/null
+++ b/src/app/shared/components/filter-card/filter-card.spec.ts
@@ -0,0 +1,142 @@
+import { OverlayContainer } from '@angular/cdk/overlay';
+import { Component, signal } from '@angular/core';
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { FilterCard } from './filter-card';
+
+@Component({
+  standalone: true,
+  imports: [FilterCard],
+  template: `
+    <app-filter-card
+      title="Country Selection"
+      [defaultCollapsed]="defaultCollapsed()"
+      [collapsible]="collapsible()"
+      [collapsedIcon]="collapsedIcon"
+      [expandedIcon]="expandedIcon"
+      [contentId]="contentId()"
+      (collapseChanged)="changes.push($event)"
+    >
+      <button filterCardActions type="button">Reset</button>
+      <input data-testid="projected-input" value="preserved" />
+    </app-filter-card>
+  `
+})
+class HostComponent {
+  readonly defaultCollapsed = signal(false);
+  readonly collapsible = signal(true);
+  readonly contentId = signal('');
+  readonly changes: boolean[] = [];
+  collapsedIcon = 'custom-collapsed';
+  expandedIcon = 'custom-expanded';
+}
+
+describe('FilterCard', () => {
+  let fixture: ComponentFixture<HostComponent>;
+  let host: HostComponent;
+  let overlayContainer: OverlayContainer;
+
+  const card = (): FilterCard => fixture.debugElement.children[0].componentInstance;
+  const toggle = (): HTMLButtonElement => fixture.nativeElement.querySelector('button[aria-controls]');
+  const icon = (): HTMLElement => toggle().querySelector('i') as HTMLElement;
+  const bodyGrid = (): HTMLElement => fixture.nativeElement.querySelector('.filter-card-body-grid');
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({ imports: [HostComponent] }).compileComponents();
+    fixture = TestBed.createComponent(HostComponent);
+    host = fixture.componentInstance;
+    overlayContainer = TestBed.inject(OverlayContainer);
+    fixture.detectChanges();
+  });
+
+  afterEach(() => {
+    vi.useRealTimers();
+    overlayContainer.ngOnDestroy();
+  });
+
+  it('starts expanded by default', () => {
+    expect(card().collapsed()).toBe(false);
+    expect(bodyGrid().classList.contains('is-collapsed')).toBe(false);
+  });
+
+  it('reacts to a collapsed default state', () => {
+    host.defaultCollapsed.set(true);
+    fixture.detectChanges();
+    expect(card().collapsed()).toBe(true);
+    expect(bodyGrid().classList.contains('is-collapsed')).toBe(true);
+  });
+
+  it('switches icons and tooltips when toggled', () => {
+    expect(icon().className).toBe('custom-expanded');
+    expect(toggle().getAttribute('aria-label')).toBe('Hide Filters');
+    toggle().click();
+    fixture.detectChanges();
+    expect(icon().className).toBe('custom-collapsed');
+    expect(toggle().getAttribute('aria-label')).toBe('Show Filters');
+  });
+
+  it('updates an open tooltip when toggled without requiring another hover', () => {
+    vi.useFakeTimers();
+    toggle().dispatchEvent(new MouseEvent('mouseenter'));
+    vi.advanceTimersByTime(200);
+    fixture.detectChanges();
+    expect(overlayContainer.getContainerElement().textContent).toContain('Hide Filters');
+
+    toggle().click();
+    fixture.detectChanges();
+
+    expect(overlayContainer.getContainerElement().textContent).toContain('Show Filters');
+    expect(overlayContainer.getContainerElement().textContent).not.toContain('Hide Filters');
+  });
+
+  it('emits the new collapsed state', () => {
+    toggle().click();
+    toggle().click();
+    expect(host.changes).toEqual([true, false]);
+  });
+
+  it('sets accessible expanded and controls attributes', () => {
+    const id = card().resolvedContentId();
+    expect(toggle().getAttribute('aria-expanded')).toBe('true');
+    expect(toggle().getAttribute('aria-controls')).toBe(id);
+    expect(fixture.nativeElement.querySelector(`#${id}`)).not.toBeNull();
+  });
+
+  it('keeps projected content mounted while collapsed', () => {
+    const input = fixture.nativeElement.querySelector('[data-testid="projected-input"]');
+    toggle().click();
+    fixture.detectChanges();
+    expect(fixture.nativeElement.querySelector('[data-testid="projected-input"]')).toBe(input);
+    expect(fixture.nativeElement.textContent).toContain('Reset');
+  });
+
+  it('uses custom icons', () => {
+    expect(icon().classList.contains('custom-expanded')).toBe(true);
+    toggle().click();
+    fixture.detectChanges();
+    expect(icon().classList.contains('custom-collapsed')).toBe(true);
+  });
+
+  it('uses a custom content id', () => {
+    host.contentId.set('state-filter-content');
+    fixture.detectChanges();
+    expect(toggle().getAttribute('aria-controls')).toBe('state-filter-content');
+    expect(fixture.nativeElement.querySelector('#state-filter-content')).not.toBeNull();
+  });
+
+  it('generates a stable content id', () => {
+    const generatedId = card().resolvedContentId();
+    fixture.detectChanges();
+    expect(generatedId).toMatch(/^filter-card-content-\d+$/);
+    expect(card().resolvedContentId()).toBe(generatedId);
+  });
+
+  it('does not collapse or emit when non-collapsible', () => {
+    host.collapsible.set(false);
+    fixture.detectChanges();
+    toggle().click();
+    expect(card().collapsed()).toBe(false);
+    expect(host.changes).toEqual([]);
+    expect(toggle().disabled).toBe(true);
+  });
+});
diff --git a/src/app/shared/components/filter-card/filter-card.ts b/src/app/shared/components/filter-card/filter-card.ts
new file mode 100644
index 00000000..3745e260
--- /dev/null
+++ b/src/app/shared/components/filter-card/filter-card.ts
@@ -0,0 +1,72 @@
+import { Component, computed, effect, input, output, signal } from '@angular/core';
+
+import { TooltipDirective } from '../../directives/tooltip/tooltip.directive';
+
+let nextFilterCardId = 0;
+
+@Component({
+  selector: 'app-filter-card',
+  standalone: true,
+  imports: [TooltipDirective],
+  templateUrl: './filter-card.html',
+  styles: `
+    :host { display: block; }
+    .filter-card-body-grid {
+      display: grid;
+      grid-template-rows: 1fr;
+      transition: grid-template-rows 200ms ease, visibility 200ms ease;
+      visibility: visible;
+    }
+    .filter-card-body-grid.is-collapsed {
+      grid-template-rows: 0fr;
+      visibility: hidden;
+    }
+    .filter-card-body-content { min-height: 0; overflow: hidden; }
+    @media (prefers-reduced-motion: reduce) {
+      .filter-card-body-grid { transition: none; }
+    }
+  `
+})
+export class FilterCard {
+  readonly title = input<string>('Filters');
+  readonly titleIcon = input<string | null>(null);
+  readonly defaultCollapsed = input<boolean>(false);
+  readonly collapsible = input<boolean>(true);
+  readonly showToggleButton = input<boolean>(true);
+  readonly collapsedIcon = input<string>('ri-filter-3-line');
+  readonly expandedIcon = input<string>('ri-arrow-up-s-line');
+  readonly collapsedTooltip = input<string>('Show Filters');
+  readonly expandedTooltip = input<string>('Hide Filters');
+  readonly cardClass = input<string>('');
+  readonly headerClass = input<string>('');
+  readonly bodyClass = input<string>('');
+  readonly toggleButtonClass = input<string>('');
+  readonly contentId = input<string>('');
+
+  readonly collapseChanged = output<boolean>();
+  readonly collapsed = signal(false);
+
+  private readonly generatedContentId = `filter-card-content-${++nextFilterCardId}`;
+
+  readonly resolvedContentId = computed(() => this.contentId().trim() || this.generatedContentId);
+  readonly currentIcon = computed(() =>
+    this.collapsed() ? this.collapsedIcon() : this.expandedIcon()
+  );
+  readonly currentTooltip = computed(() =>
+    this.collapsed() ? this.collapsedTooltip() : this.expandedTooltip()
+  );
+
+  constructor() {
+    effect(() => this.collapsed.set(this.defaultCollapsed()));
+  }
+
+  toggleCollapse(): void {
+    if (!this.collapsible()) {
+      return;
+    }
+
+    const collapsed = !this.collapsed();
+    this.collapsed.set(collapsed);
+    this.collapseChanged.emit(collapsed);
+  }
+}
diff --git a/src/app/shared/components/form/autocomplete/autocomplete.html b/src/app/shared/components/form/autocomplete/autocomplete.html
new file mode 100644
index 00000000..68dc79a1
--- /dev/null
+++ b/src/app/shared/components/form/autocomplete/autocomplete.html
@@ -0,0 +1,129 @@
+<app-form-field
+  [label]="label()"
+  [inputId]="resolvedInputId()"
+  [control]="control()"
+  [required]="required()"
+  [disabled]="isDisabled()"
+  [description]="description()"
+  [hint]="hint()"
+  [help]="help()"
+  [floating]="isFloating()"
+  [forceFloat]="shouldFloat()"
+  [labelPosition]="labelPosition()"
+  [hideLabel]="hideLabel()"
+  [hideValidation]="hideValidation()"
+  [submitAttempted]="submitAttempted()"
+  [validationMessages]="validationMessages()"
+  [wrapperClass]="(isFloating() ? 'autocomplete-floating ' : '') + wrapperClass()"
+>
+  <div cdkOverlayOrigin #origin="cdkOverlayOrigin" class="relative w-full autocomplete-control"
+    [class.autocomplete-control--floating]="isFloating()"
+    [class.autocomplete-control--sm]="size() === 'sm'"
+    [class.is-focused]="focused()" [class.is-open]="isOpen()" [class.has-value]="shouldFloat()"
+    [class.has-error]="showError()" [class.is-disabled]="isDisabled()" (click)="onControlClick($event)">
+    <input
+      #textInput
+      data-form-control
+      type="text"
+      role="combobox"
+      aria-autocomplete="list"
+      [id]="resolvedInputId()"
+      [class]="resolvedInputClass()"
+      [value]="searchText()"
+      [placeholder]="isFloating() ? ' ' : placeholder()"
+      [autocomplete]="autocomplete()"
+      [disabled]="isDisabled()"
+      [readOnly]="readonly()"
+      [attr.aria-label]="ariaLabel() || label() || placeholder()"
+      [attr.aria-expanded]="isOpen()"
+      [attr.aria-controls]="panelId()"
+      [attr.aria-activedescendant]="activeDescendant()"
+      [attr.aria-describedby]="describedBy()"
+      [attr.aria-required]="required()"
+      [attr.aria-readonly]="readonly()"
+      [attr.aria-invalid]="showError() ? 'true' : null"
+      (input)="onInput($event)"
+      (focus)="onFocus()"
+      (click)="onClick()"
+      (blur)="onBlur()"
+      (keydown)="onKeydown($event)"
+    />
+
+    @if (loading()) {
+      <span class="pointer-events-none absolute end-3 top-1/2 -translate-y-1/2 text-primary" aria-hidden="true">
+        <span class="ti-spinner block h-4 w-4 animate-spin rounded-full border-2 border-current border-t-transparent"></span>
+      </span>
+    } @else if (clearable() && (hasSelectedItem() || searchText())) {
+      <button
+        type="button"
+        class="absolute top-1/2 inline-flex -translate-y-1/2 items-center justify-center rounded-sm text-textmuted transition-colors hover:bg-light hover:text-danger focus:outline-none focus:ring-1 focus:ring-primary dark:hover:bg-black/20"
+        [class.end-8]="isFloating()"
+        [class.end-3]="!isFloating()"
+        aria-label="Clear selection"
+        [disabled]="isDisabled() || readonly()"
+        (mousedown)="$event.preventDefault()"
+        (click)="clear($event)"
+      >
+        <i class="ri-close-line" aria-hidden="true"></i>
+      </button>
+    }
+    @if (isFloating() && !loading()) {
+      <span class="autocomplete-dropdown-indicator" aria-hidden="true">
+        <i class="ri-arrow-down-s-line"></i>
+      </span>
+    }
+  </div>
+
+  <span [id]="statusId()" class="sr-only" aria-live="polite">{{ message() }}</span>
+
+  <ng-template
+    cdkConnectedOverlay
+    [cdkConnectedOverlayOrigin]="origin"
+    [cdkConnectedOverlayOpen]="isOpen()"
+    [cdkConnectedOverlayPositions]="overlayPositions"
+    [cdkConnectedOverlayWidth]="panelWidth()"
+    [cdkConnectedOverlayViewportMargin]="8"
+    [cdkConnectedOverlayPush]="true"
+    [cdkConnectedOverlayHasBackdrop]="true"
+    cdkConnectedOverlayBackdropClass="cdk-overlay-transparent-backdrop"
+    (backdropClick)="close()"
+    (detach)="close()"
+  >
+    <div
+      [id]="panelId()"
+      role="listbox"
+      class="w-full max-h-64 overflow-y-auto rounded-lg border border-defaultborder bg-white py-1 text-defaulttextcolor shadow-lg dark:border-defaultborder/10 dark:bg-bodybg dark:text-white/70"
+      [class]="panelClass()"
+    >
+      @if (message()) {
+        <div class="bg-white px-3 py-2 text-[0.8125rem] text-textmuted dark:bg-bodybg dark:text-white/50" [class.text-danger]="error()">
+          {{ message() }}
+        </div>
+      } @else {
+        @for (item of options(); track optionKey(item, $index); let index = $index) {
+          <button
+            type="button"
+            role="option"
+            [id]="optionId(index)"
+            [class]="optionClass(item, index)"
+            [attr.aria-selected]="isOptionSelected(item)"
+            (mousedown)="$event.preventDefault()"
+            (mouseenter)="activeIndex.set(index)"
+            (click)="select(item)"
+          >
+            {{ displayWith()(item) }}
+          </button>
+        }
+        @if (showingPreview()) {
+          <div
+            role="option"
+            aria-disabled="true"
+            class="cursor-default border-t border-defaultborder bg-light/50 px-3 py-2 text-[0.8125rem] italic text-textmuted dark:border-defaultborder/10 dark:bg-black/10 dark:text-white/50"
+          >
+            {{ previewText() }}
+          </div>
+        }
+      }
+    </div>
+  </ng-template>
+</app-form-field>
diff --git a/src/app/shared/components/form/autocomplete/autocomplete.scss b/src/app/shared/components/form/autocomplete/autocomplete.scss
new file mode 100644
index 00000000..7c8b0606
--- /dev/null
+++ b/src/app/shared/components/form/autocomplete/autocomplete.scss
@@ -0,0 +1,120 @@
+:host {
+  display: block;
+  width: 100%;
+  min-width: 0;
+}
+
+:host ::ng-deep .autocomplete-floating,
+:host ::ng-deep .autocomplete-floating > div,
+:host ::ng-deep .autocomplete-floating .floating-label {
+  display: block;
+  width: 100%;
+  min-width: 0;
+}
+
+.autocomplete-control--floating {
+  position: relative;
+  display: flex;
+  align-items: center;
+  width: 100%;
+  min-width: 0;
+  min-height: 2.5rem;
+  border: 1px solid var(--color-inputborder);
+  border-radius: 0.5rem;
+  background-color: var(--color-white);
+  color: var(--color-defaulttextcolor);
+  box-shadow: none;
+  transition: border-color 0.2s ease;
+}
+
+.autocomplete-input--floating {
+  display: block;
+  flex: 1 1 auto;
+  width: 100%;
+  min-width: 0;
+  min-height: calc(2.5rem - 2px);
+  padding-block: 0.75rem 0.5rem;
+  padding-inline: 0.75rem 4.25rem;
+  border: 0;
+  border-radius: inherit;
+  outline: none;
+  background: transparent;
+  color: var(--color-defaulttextcolor);
+  font-size: 0.8125rem;
+  line-height: 1.25;
+  box-shadow: none;
+}
+
+.autocomplete-input--floating::placeholder {
+  color: transparent;
+}
+
+.autocomplete-control--floating.is-focused,
+.autocomplete-control--floating.is-open,
+.autocomplete-control--floating.has-value {
+  border-color: var(--color-primary);
+}
+
+.autocomplete-control--floating.has-error {
+  border-color: var(--color-danger);
+}
+
+.autocomplete-control--floating.is-disabled {
+  cursor: not-allowed;
+  opacity: 0.7;
+}
+
+.autocomplete-control--floating.is-disabled .autocomplete-input--floating {
+  cursor: not-allowed;
+}
+
+.autocomplete-control--floating.autocomplete-control--sm {
+  min-height: 2.25rem;
+}
+
+.autocomplete-control--sm .autocomplete-input--floating {
+  min-height: calc(2.25rem - 2px);
+  padding-block: 0.625rem 0.375rem;
+}
+
+.autocomplete-dropdown-indicator {
+  position: absolute;
+  inset-inline-end: 0.75rem;
+  top: 50%;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  transform: translateY(-50%);
+  color: var(--color-textmuted);
+  pointer-events: none;
+}
+
+:host ::ng-deep .autocomplete-floating .floating-label > label {
+  padding-inline: 0.25rem;
+  background-color: var(--color-white) !important;
+  font-size: 0.75rem !important;
+  font-family: inherit;
+  font-weight: 400 !important;
+  line-height: 1 !important;
+}
+
+:host ::ng-deep .autocomplete-floating app-form-validation-message p {
+  font-family: inherit;
+  font-size: 0.75rem;
+  font-weight: 400;
+  line-height: 1.25;
+}
+
+:host ::ng-deep .autocomplete-floating app-form-validation-message i {
+  font-size: inherit;
+  font-weight: 400;
+}
+
+:host-context(.dark) .autocomplete-control--floating,
+:host-context(.dark) ::ng-deep .autocomplete-floating .floating-label > label {
+  background-color: var(--color-bodybg) !important;
+}
+
+:host-context(.dark) .autocomplete-input--floating {
+  color: var(--color-defaulttextcolor);
+}
diff --git a/src/app/shared/components/form/autocomplete/autocomplete.spec.ts b/src/app/shared/components/form/autocomplete/autocomplete.spec.ts
new file mode 100644
index 00000000..7773a44c
--- /dev/null
+++ b/src/app/shared/components/form/autocomplete/autocomplete.spec.ts
@@ -0,0 +1,393 @@
+import { OverlayContainer } from '@angular/cdk/overlay';
+import { Component, signal } from '@angular/core';
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { FormControl, ReactiveFormsModule, Validators } from '@angular/forms';
+import { Observable, Subject, of, throwError } from 'rxjs';
+
+import { Autocomplete } from './autocomplete';
+import { AutocompleteResolveValueFn, AutocompleteSearchFn } from './autocomplete.types';
+
+interface LookupItem {
+  readonly code: string;
+  readonly title: string;
+}
+
+const INDIA: LookupItem = { code: 'IN', title: 'India' };
+const INDONESIA: LookupItem = { code: 'ID', title: 'Indonesia' };
+
+@Component({
+  standalone: true,
+  imports: [ReactiveFormsModule, Autocomplete],
+  template: `
+    <app-autocomplete
+      inputId="country"
+      label="Country"
+      [formControl]="control"
+      [searchFn]="searchFn"
+      [displayWith]="displayWith"
+      [valueWith]="valueWith"
+      placeholder="e.g.: USD"
+      [selectedItem]="selectedItem()"
+      [resolveValueFn]="resolveValueFn()"
+      [minSearchLength]="minLength"
+      [debounceTime]="delay()"
+      [readonly]="readonly()"
+      [showDropdownOnFocus]="openOnFocus()"
+      [submitAttempted]="submitAttempted()"
+    />
+  `
+})
+class HostComponent {
+  readonly control = new FormControl<string | null>(null);
+  readonly selectedItem = signal<LookupItem | null>(null);
+  readonly resolveValueFn = signal<AutocompleteResolveValueFn<LookupItem, string> | null>(null);
+  searchFn: AutocompleteSearchFn<LookupItem> = () => of([INDIA, INDONESIA]);
+  readonly displayWith = (item: LookupItem): string => item.title;
+  readonly valueWith = (item: LookupItem): string => item.code;
+  minLength = 2;
+  readonly delay = signal(300);
+  readonly readonly = signal(false);
+  readonly openOnFocus = signal(false);
+  readonly submitAttempted = signal(false);
+}
+
+describe('Autocomplete', () => {
+  let fixture: ComponentFixture<HostComponent>;
+  let host: HostComponent;
+  let component: Autocomplete<LookupItem, string>;
+  let overlayContainer: OverlayContainer;
+
+  const input = (): HTMLInputElement => fixture.nativeElement.querySelector('input');
+  const type = (value: string): void => {
+    input().value = value;
+    input().dispatchEvent(new Event('input'));
+    fixture.detectChanges();
+  };
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({ imports: [HostComponent] }).compileComponents();
+    fixture = TestBed.createComponent(HostComponent);
+    host = fixture.componentInstance;
+    overlayContainer = TestBed.inject(OverlayContainer);
+    fixture.detectChanges();
+    component = fixture.debugElement.children[0].componentInstance;
+  });
+
+  afterEach(() => overlayContainer.ngOnDestroy());
+
+  it('initializes with an empty selection', () => {
+    expect(component.searchText()).toBe('');
+    expect(component.options()).toEqual([]);
+    expect(input().value).toBe('');
+    expect(input().placeholder).toBe('e.g.: USD');
+    expect(input().className).not.toContain('ti-form-control');
+    expect(input().className).toContain('placeholder:text-textmuted');
+    expect(input().className).toContain('dark:placeholder:text-white/50');
+  });
+
+  it('integrates with a reactive form control', () => {
+    component.select(INDIA);
+    expect(host.control.value).toBe('IN');
+  });
+
+  it('treats edited selected text as search text rather than a selected item', () => {
+    component.select(INDIA);
+    expect(component.activeItem()).toEqual(INDIA);
+    type('Ind');
+    expect(component.searchText()).toBe('Ind');
+    expect(component.activeItem()).toBeNull();
+  });
+
+  it('does not emit onChange from writeValue', () => {
+    const change = vi.fn();
+    component.registerOnChange(change);
+    component.writeValue('IN');
+    expect(change).not.toHaveBeenCalled();
+  });
+
+  it('does not show invalid styling after touch before submit', () => {
+    host.control.setValidators(Validators.required);
+    host.control.updateValueAndValidity();
+    host.control.markAsTouched();
+    fixture.detectChanges();
+    expect(input().classList.contains('is-invalid')).toBe(false);
+  });
+
+  it('shows invalid styling after submit and removes it when valid', () => {
+    host.control.setValidators(Validators.required);
+    host.control.updateValueAndValidity();
+    host.submitAttempted.set(true);
+    fixture.detectChanges();
+    expect(input().classList.contains('is-invalid')).toBe(true);
+    expect(fixture.nativeElement.textContent).toContain('Country is required.');
+
+    host.control.setValue('IN');
+    fixture.detectChanges();
+    expect(input().classList.contains('is-invalid')).toBe(false);
+    expect(fixture.nativeElement.textContent).not.toContain('Country is required.');
+  });
+
+  it('applies a disabled form state', () => {
+    host.control.disable();
+    fixture.detectChanges();
+    expect(input().disabled).toBe(true);
+  });
+
+  it('waits for the configured debounce', () => {
+    vi.useFakeTimers();
+    const search = vi.fn(() => of([INDIA]));
+    host.searchFn = search;
+    fixture.detectChanges();
+    type('in');
+    vi.advanceTimersByTime(299);
+    expect(search).not.toHaveBeenCalled();
+    vi.advanceTimersByTime(1);
+    expect(search).toHaveBeenCalledWith('in', 10);
+    vi.useRealTimers();
+  });
+
+  it('does not search below the minimum length', () => {
+    vi.useFakeTimers();
+    const search = vi.fn(() => of([INDIA]));
+    host.searchFn = search;
+    fixture.detectChanges();
+    type('i');
+    vi.advanceTimersByTime(300);
+    expect(search).not.toHaveBeenCalled();
+    vi.useRealTimers();
+  });
+
+  it('loads five preview records on focus before the user types', () => {
+    vi.useFakeTimers();
+    const search = vi.fn(() => of([INDIA, INDONESIA]));
+    host.openOnFocus.set(true);
+    host.searchFn = search;
+    fixture.detectChanges();
+    input().focus();
+    vi.advanceTimersByTime(0);
+    fixture.detectChanges();
+    expect(search).toHaveBeenCalledWith('', 5);
+    expect(component.options()).toEqual([INDIA, INDONESIA]);
+    expect(component.showingPreview()).toBe(true);
+    expect(overlayContainer.getContainerElement().textContent).toContain('Type to search more...');
+    vi.useRealTimers();
+  });
+
+  it('replaces preview records with typed search results', () => {
+    vi.useFakeTimers();
+    host.openOnFocus.set(true);
+    host.delay.set(0);
+    host.searchFn = (term, _limit) => of(term ? [INDONESIA] : [INDIA]);
+    fixture.detectChanges();
+    input().focus();
+    vi.advanceTimersByTime(0);
+    expect(component.options()).toEqual([INDIA]);
+    type('in');
+    vi.advanceTimersByTime(0);
+    fixture.detectChanges();
+    expect(component.options()).toEqual([INDONESIA]);
+    expect(component.showingPreview()).toBe(false);
+    expect(overlayContainer.getContainerElement().textContent).not.toContain('Type to search more...');
+    vi.useRealTimers();
+  });
+
+  it('cancels stale search requests', () => {
+    vi.useFakeTimers();
+    const first = new Subject<readonly LookupItem[]>();
+    const second = new Subject<readonly LookupItem[]>();
+    host.delay.set(0);
+    host.searchFn = term => term === 'in' ? first : second;
+    fixture.detectChanges();
+    type('in'); vi.advanceTimersByTime(0);
+    type('ind'); vi.advanceTimersByTime(0);
+    first.next([INDONESIA]);
+    second.next([INDIA]);
+    expect(component.options()).toEqual([INDIA]);
+    vi.useRealTimers();
+  });
+
+  it('resets loading after a successful search', () => {
+    vi.useFakeTimers();
+    host.delay.set(0);
+    fixture.detectChanges();
+    type('in'); vi.advanceTimersByTime(0);
+    expect(component.loading()).toBe(false);
+    vi.useRealTimers();
+  });
+
+  it('resets loading after an error', () => {
+    vi.useFakeTimers();
+    host.delay.set(0);
+    host.searchFn = () => throwError(() => new Error('server'));
+    fixture.detectChanges();
+    type('in'); vi.advanceTimersByTime(0);
+    expect(component.loading()).toBe(false);
+    expect(component.error()).toBe('Unable to load results');
+    vi.useRealTimers();
+  });
+
+  it('recovers on a later search after an error', () => {
+    vi.useFakeTimers();
+    let attempts = 0;
+    host.delay.set(0);
+    host.searchFn = (): Observable<readonly LookupItem[]> =>
+      ++attempts === 1 ? throwError(() => new Error('server')) : of([INDIA]);
+    fixture.detectChanges();
+    type('in'); vi.advanceTimersByTime(0);
+    type('ind'); vi.advanceTimersByTime(0);
+    expect(component.options()).toEqual([INDIA]);
+    expect(component.error()).toBeNull();
+    vi.useRealTimers();
+  });
+
+  it('renders returned options', () => {
+    vi.useFakeTimers();
+    host.delay.set(0);
+    fixture.detectChanges();
+    type('in'); vi.advanceTimersByTime(0); fixture.detectChanges();
+    expect(overlayContainer.getContainerElement().textContent).toContain('India');
+    vi.useRealTimers();
+  });
+
+  it('selects an option with the mouse', () => {
+    vi.useFakeTimers();
+    host.delay.set(0);
+    fixture.detectChanges();
+    type('in'); vi.advanceTimersByTime(0); fixture.detectChanges();
+    overlayContainer.getContainerElement().querySelector<HTMLButtonElement>('[role="option"]')?.click();
+    expect(host.control.value).toBe('IN');
+    vi.useRealTimers();
+  });
+
+  it('selects the highlighted option with Enter', () => {
+    component.options.set([INDIA]);
+    component.open();
+    input().dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowDown' }));
+    input().dispatchEvent(new KeyboardEvent('keydown', { key: 'Enter' }));
+    expect(host.control.value).toBe('IN');
+  });
+
+  it('only highlights on arrow navigation', () => {
+    component.options.set([INDIA]);
+    input().dispatchEvent(new KeyboardEvent('keydown', { key: 'ArrowDown' }));
+    expect(component.activeIndex()).toBe(0);
+    expect(host.control.value).toBeNull();
+  });
+
+  it('closes on Escape', () => {
+    component.open();
+    input().dispatchEvent(new KeyboardEvent('keydown', { key: 'Escape' }));
+    expect(component.isOpen()).toBe(false);
+  });
+
+  it('clears the form value to null', () => {
+    component.select(INDIA);
+    component.clear();
+    expect(host.control.value).toBeNull();
+  });
+
+  it('clears visible state when the form resets', () => {
+    component.select(INDIA);
+    host.control.reset();
+    fixture.detectChanges();
+    expect(component.searchText()).toBe('');
+    expect(component.activeItem()).toBeNull();
+  });
+
+  it('displays an existing selected item', () => {
+    host.selectedItem.set(INDIA);
+    host.control.setValue('IN');
+    fixture.detectChanges();
+    expect(component.searchText()).toBe('India');
+  });
+
+  it('does not resolve an empty string form value', () => {
+    const resolve = vi.fn(() => of(INDIA));
+    host.resolveValueFn.set(resolve);
+    fixture.detectChanges();
+    host.control.setValue('');
+    fixture.detectChanges();
+    expect(resolve).not.toHaveBeenCalled();
+  });
+
+  it('uses the matching selected item without resolving it again', () => {
+    const resolve = vi.fn(() => of(INDIA));
+    host.resolveValueFn.set(resolve);
+    host.selectedItem.set(INDIA);
+    fixture.detectChanges();
+    host.control.setValue('IN');
+    fixture.detectChanges();
+    expect(component.searchText()).toBe('India');
+    expect(resolve).not.toHaveBeenCalled();
+  });
+
+  it('resolves a non-empty value when no matching selected item is supplied', () => {
+    const resolve = vi.fn(() => of(INDIA));
+    host.resolveValueFn.set(resolve);
+    fixture.detectChanges();
+    host.control.setValue('IN');
+    fixture.detectChanges();
+    expect(resolve).toHaveBeenCalledWith('IN');
+    expect(component.searchText()).toBe('India');
+  });
+
+  it('does not retain a stale label when edit values change', () => {
+    host.selectedItem.set(INDIA);
+    host.control.setValue('IN');
+    fixture.detectChanges();
+    host.control.setValue('ID');
+    fixture.detectChanges();
+    expect(component.searchText()).toBe('');
+  });
+
+  it('closes when the overlay backdrop is clicked', () => {
+    component.open();
+    fixture.detectChanges();
+    overlayContainer.getContainerElement().querySelector<HTMLElement>('.cdk-overlay-backdrop')?.click();
+    expect(component.isOpen()).toBe(false);
+  });
+
+  it('prevents modification in read-only mode', () => {
+    host.readonly.set(true);
+    fixture.detectChanges();
+    component.select(INDIA);
+    expect(host.control.value).toBeNull();
+  });
+
+  it('prevents interaction while disabled', () => {
+    host.control.disable();
+    fixture.detectChanges();
+    component.open();
+    expect(component.isOpen()).toBe(false);
+  });
+
+  it('updates combobox ARIA state', () => {
+    component.open();
+    fixture.detectChanges();
+    expect(input().getAttribute('role')).toBe('combobox');
+    expect(input().getAttribute('aria-expanded')).toBe('true');
+    expect(input().getAttribute('aria-controls')).toBe('country-listbox');
+  });
+
+  it('renders the empty state', () => {
+    vi.useFakeTimers();
+    host.delay.set(0);
+    host.searchFn = () => of([]);
+    fixture.detectChanges();
+    type('zz'); vi.advanceTimersByTime(0); fixture.detectChanges();
+    expect(overlayContainer.getContainerElement().textContent).toContain('No results found');
+    vi.useRealTimers();
+  });
+
+  it('renders the friendly error state', () => {
+    vi.useFakeTimers();
+    host.delay.set(0);
+    host.searchFn = () => throwError(() => new Error('raw error'));
+    fixture.detectChanges();
+    type('zz'); vi.advanceTimersByTime(0); fixture.detectChanges();
+    const text = overlayContainer.getContainerElement().textContent ?? '';
+    expect(text).toContain('Unable to load results');
+    expect(text).not.toContain('raw error');
+    vi.useRealTimers();
+  });
+});
diff --git a/src/app/shared/components/form/autocomplete/autocomplete.ts b/src/app/shared/components/form/autocomplete/autocomplete.ts
new file mode 100644
index 00000000..d5524218
--- /dev/null
+++ b/src/app/shared/components/form/autocomplete/autocomplete.ts
@@ -0,0 +1,434 @@
+import { CdkConnectedOverlay, CdkOverlayOrigin, ConnectedPosition } from '@angular/cdk/overlay';
+import {
+  ChangeDetectionStrategy,
+  Component,
+  ElementRef,
+  Injector,
+  ViewChild,
+  computed,
+  effect,
+  forwardRef,
+  inject,
+  input,
+  output,
+  signal
+} from '@angular/core';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { AbstractControl, ControlValueAccessor, NG_VALUE_ACCESSOR, NgControl } from '@angular/forms';
+import {
+  Subject,
+  catchError,
+  debounce,
+  distinctUntilChanged,
+  map,
+  of,
+  switchMap,
+  timer
+} from 'rxjs';
+
+import { FormField, FormLabelPosition } from '../form-field/form-field';
+import { ValidationMessageMap } from '../form-validation-message/form-validation-message';
+import {
+  AutocompleteDisplayFn,
+  AutocompleteResolveValueFn,
+  AutocompleteSearchFn,
+  AutocompleteTrackFn,
+  AutocompleteValueFn
+} from './autocomplete.types';
+
+interface SearchResult<TItem> {
+  readonly term: string;
+  readonly options: readonly TItem[];
+  readonly failed: boolean;
+  readonly preview: boolean;
+}
+
+interface SearchRequest {
+  readonly term: string;
+  readonly preview: boolean;
+}
+
+@Component({
+  selector: 'app-autocomplete',
+  standalone: true,
+  imports: [CdkConnectedOverlay, CdkOverlayOrigin, FormField],
+  templateUrl: './autocomplete.html',
+  styleUrl: './autocomplete.scss',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  providers: [{
+    provide: NG_VALUE_ACCESSOR,
+    useExisting: forwardRef(() => Autocomplete),
+    multi: true
+  }]
+})
+export class Autocomplete<TItem, TValue> implements ControlValueAccessor {
+  private static nextId = 0;
+
+  private readonly injector = inject(Injector);
+  private readonly generatedId = `autocomplete-${Autocomplete.nextId++}`;
+  private readonly searchRequests$ = new Subject<SearchRequest>();
+  private readonly valuesToResolve$ = new Subject<TValue>();
+  private formValue: TValue | null = null;
+  private readonly controlStateVersion = signal(0);
+  private labelEdited = false;
+  private onChange: (value: TValue | null) => void = () => {};
+  private onTouched: () => void = () => {};
+
+  @ViewChild('textInput') private textInput?: ElementRef<HTMLInputElement>;
+  @ViewChild(CdkOverlayOrigin, { read: ElementRef }) private origin?: ElementRef<HTMLElement>;
+
+  readonly searchFn = input.required<AutocompleteSearchFn<TItem>>();
+  readonly displayWith = input.required<AutocompleteDisplayFn<TItem>>();
+  readonly valueWith = input.required<AutocompleteValueFn<TItem, TValue>>();
+  readonly trackBy = input<AutocompleteTrackFn<TItem> | null>(null);
+  readonly selectedItem = input<TItem | null>(null);
+  readonly resolveValueFn = input<AutocompleteResolveValueFn<TItem, TValue> | null>(null);
+  readonly label = input('');
+  readonly inputId = input<string | null>(null);
+  readonly placeholder = input('Search...');
+  readonly minSearchLength = input(1);
+  readonly debounceTime = input(300);
+  readonly limit = input(10);
+  readonly previewLimit = input(5);
+  readonly previewText = input('Type to search more...');
+  readonly disabled = input(false);
+  readonly readonly = input(false);
+  readonly clearable = input(true);
+  readonly required = input(false);
+  readonly loadingText = input('Loading...');
+  readonly emptyText = input('No results found');
+  readonly typeToSearchText = input('Type to search');
+  readonly errorText = input('Unable to load results');
+  readonly showDropdownOnFocus = input(true);
+  readonly closeOnSelect = input(true);
+  readonly autocomplete = input('off');
+  readonly ariaLabel = input<string | null>(null);
+  readonly panelClass = input('');
+  readonly inputClass = input('');
+  readonly wrapperClass = input('');
+  readonly hideLabel = input(false);
+  readonly hideValidation = input(false);
+  readonly submitAttempted = input(false);
+  readonly validationMessages = input<ValidationMessageMap>({});
+  readonly description = input<string | null>(null);
+  readonly hint = input<string | null>(null);
+   readonly help = input<string | null>(null);
+  readonly labelPosition = input<FormLabelPosition>('top');
+  readonly variant = input<'default' | 'floating'>('default');
+  readonly size = input<'default' | 'sm'>('default');
+
+  readonly itemSelected = output<TItem>();
+  readonly cleared = output<void>();
+  readonly searchChanged = output<string>();
+  readonly opened = output<void>();
+  readonly closed = output<void>();
+  readonly loadError = output<void>();
+
+  readonly isOpen = signal(false);
+  readonly loading = signal(false);
+  readonly options = signal<readonly TItem[]>([]);
+  readonly activeIndex = signal(-1);
+  readonly activeItem = signal<TItem | null>(null);
+  readonly searchText = signal('');
+  readonly error = signal<string | null>(null);
+  readonly showingPreview = signal(false);
+  readonly formDisabled = signal(false);
+  readonly panelWidth = signal(0);
+  readonly focused = signal(false);
+
+  readonly resolvedInputId = computed(() => this.inputId()?.trim() || this.generatedId);
+  readonly panelId = computed(() => `${this.resolvedInputId()}-listbox`);
+  readonly statusId = computed(() => `${this.resolvedInputId()}-status`);
+  readonly describedBy = computed(() =>
+    this.showError()
+      ? `${this.statusId()} ${this.resolvedInputId()}-validation`
+      : this.statusId()
+  );
+  readonly control = computed<AbstractControl | null>(() =>
+    this.injector.get(NgControl, null, { self: true, optional: true })?.control ?? null
+  );
+  readonly isDisabled = computed(() => this.disabled() || this.formDisabled());
+  readonly isFloating = computed(() => this.variant() === 'floating');
+  readonly shouldFloat = computed(() =>
+    this.focused() || this.isOpen() || this.hasSelectedItem() || this.searchText().length > 0
+  );
+  readonly showError = computed(() => {
+    this.controlStateVersion();
+    return !!this.control()?.invalid && this.submitAttempted();
+  });
+  readonly hasSelectedItem = computed(() => this.activeItem() !== null);
+  readonly activeDescendant = computed(() => {
+    const index = this.activeIndex();
+    return this.isOpen() && index >= 0 ? `${this.resolvedInputId()}-option-${index}` : null;
+  });
+  readonly message = computed(() => {
+    if (this.loading()) return this.loadingText();
+    if (this.error()) return this.errorText();
+    if (this.showingPreview()) return '';
+    if (this.searchText().trim().length < this.minSearchLength()) {
+      return `${this.typeToSearchText()} (at least ${this.minSearchLength()} ${this.minSearchLength() === 1 ? 'character' : 'characters'})`;
+    }
+    return this.options().length ? '' : this.emptyText();
+  });
+  readonly resolvedInputClass = computed(() => {
+    this.controlStateVersion();
+    const control = this.control();
+    const invalid = !!(control?.invalid && this.submitAttempted());
+    return [
+      this.isFloating()
+        ? 'autocomplete-input autocomplete-input--floating'
+        : 'ti-form-select w-full rounded-sm border border-defaultborder bg-white text-defaulttextcolor',
+      this.isFloating() ? '' : 'dark:border-defaultborder/10 dark:bg-bodybg dark:text-white/70',
+      'placeholder:text-textmuted placeholder:opacity-100 dark:placeholder:text-white/50',
+      'focus:border-primary focus:ring-1 focus:ring-primary focus:outline-none',
+      'pe-10 transition-colors',
+      invalid ? 'is-invalid border-danger' : '',
+      this.isDisabled() ? 'cursor-not-allowed bg-light opacity-60 dark:bg-black/20' : '',
+      this.inputClass()
+    ].filter(Boolean).join(' ');
+  });
+
+  readonly overlayPositions: ConnectedPosition[] = [
+    { originX: 'start', originY: 'bottom', overlayX: 'start', overlayY: 'top', offsetY: 4 },
+    { originX: 'start', originY: 'top', overlayX: 'start', overlayY: 'bottom', offsetY: -4 }
+  ];
+
+  constructor() {
+    effect((onCleanup) => {
+      const control = this.control();
+      if (!control) return;
+
+      const statusSubscription = control.statusChanges.subscribe(() => {
+        this.controlStateVersion.update(value => value + 1);
+      });
+      const valueSubscription = control.valueChanges.subscribe(() => {
+        this.controlStateVersion.update(value => value + 1);
+      });
+      const eventsSubscription = control.events?.subscribe(() => {
+        this.controlStateVersion.update(value => value + 1);
+      });
+
+      onCleanup(() => {
+        statusSubscription.unsubscribe();
+        valueSubscription.unsubscribe();
+        eventsSubscription?.unsubscribe();
+      });
+    });
+
+    this.searchRequests$.pipe(
+      map(request => ({ ...request, term: request.term.trim() })),
+      debounce(request => timer(request.preview ? 0 : Math.max(0, this.debounceTime()))),
+      distinctUntilChanged((previous, current) =>
+        previous.term === current.term && previous.preview === current.preview
+      ),
+      switchMap(request => {
+        if (!request.preview && request.term.length < this.minSearchLength()) {
+          return of<SearchResult<TItem>>({ ...request, options: [], failed: false });
+        }
+        this.loading.set(true);
+        this.error.set(null);
+        const limit = request.preview ? this.previewLimit() : this.limit();
+        return this.searchFn()(request.term, limit).pipe(
+          map(options => ({ ...request, options, failed: false })),
+          catchError(() => of<SearchResult<TItem>>({ ...request, options: [], failed: true }))
+        );
+      }),
+      takeUntilDestroyed()
+    ).subscribe(result => {
+      this.loading.set(false);
+      this.showingPreview.set(result.preview && !result.failed);
+      this.options.set(result.options);
+      this.activeIndex.set(-1);
+      this.error.set(result.failed ? this.errorText() : null);
+      if (result.failed) this.loadError.emit();
+    });
+
+    this.valuesToResolve$.pipe(
+      switchMap(value => this.resolveValueFn()?.(value) ?? of(null)),
+      takeUntilDestroyed()
+    ).subscribe(item => this.applyResolvedItem(item));
+
+    effect(() => {
+      const item = this.selectedItem();
+      if (item === null) {
+        if (this.formValue === null) this.applyResolvedItem(null);
+        return;
+      }
+      if (this.valuesEqual(this.valueWith()(item), this.formValue)) this.applyResolvedItem(item);
+    });
+  }
+
+  writeValue(value: TValue | null): void {
+    this.formValue = value ?? null;
+    this.labelEdited = false;
+    if (!this.hasResolvableValue(this.formValue)) {
+      this.applyResolvedItem(null);
+      return;
+    }
+    const supplied = this.selectedItem();
+    if (supplied !== null && this.valuesEqual(this.valueWith()(supplied), this.formValue)) {
+      this.applyResolvedItem(supplied);
+    } else {
+      this.applyResolvedItem(null);
+      if (this.resolveValueFn()) this.valuesToResolve$.next(this.formValue);
+    }
+  }
+
+  registerOnChange(fn: (value: TValue | null) => void): void { this.onChange = fn; }
+  registerOnTouched(fn: () => void): void { this.onTouched = fn; }
+  setDisabledState(disabled: boolean): void {
+    this.formDisabled.set(disabled);
+    if (disabled) this.close();
+  }
+
+  onInput(event: Event): void {
+    if (!(event.target instanceof HTMLInputElement) || this.isDisabled() || this.readonly()) return;
+    const text = event.target.value;
+    const previousText = this.searchText();
+    this.searchText.set(text);
+    this.activeItem.set(null);
+    this.showingPreview.set(false);
+    this.options.set([]);
+    this.labelEdited = this.formValue !== null && text !== previousText;
+    this.searchChanged.emit(text.trim());
+    this.open();
+    this.searchRequests$.next({ term: text, preview: false });
+  }
+
+  onFocus(): void {
+    this.focused.set(true);
+    if (this.showDropdownOnFocus()) this.openPreview();
+  }
+
+  onClick(): void {
+    if (this.showDropdownOnFocus()) this.openPreview();
+  }
+
+  onControlClick(event: MouseEvent): void {
+    if (event.target instanceof HTMLButtonElement || this.isDisabled() || this.readonly()) return;
+    this.textInput?.nativeElement.focus();
+    this.onClick();
+  }
+
+  onBlur(): void {
+    this.focused.set(false);
+    queueMicrotask(() => {
+      this.onTouched();
+      if (this.labelEdited) this.clearValue(false, false);
+    });
+  }
+
+  onKeydown(event: KeyboardEvent): void {
+    if (this.isDisabled() || this.readonly()) return;
+    const options = this.options();
+    switch (event.key) {
+      case 'ArrowDown':
+        event.preventDefault(); this.open(); this.setActive(Math.min(this.activeIndex() + 1, options.length - 1)); break;
+      case 'ArrowUp':
+        event.preventDefault(); this.open(); this.setActive(Math.max(this.activeIndex() - 1, 0)); break;
+      case 'Home':
+        if (this.isOpen() && options.length) { event.preventDefault(); this.setActive(0); } break;
+      case 'End':
+        if (this.isOpen() && options.length) { event.preventDefault(); this.setActive(options.length - 1); } break;
+      case 'Enter': {
+        const item = options[this.activeIndex()];
+        if (this.isOpen() && item !== undefined) { event.preventDefault(); this.select(item); }
+        break;
+      }
+      case 'Escape':
+        if (this.isOpen()) { event.preventDefault(); this.close(); } break;
+    }
+  }
+
+  select(item: TItem): void {
+    if (this.isDisabled() || this.readonly()) return;
+    this.activeItem.set(item);
+    this.formValue = this.valueWith()(item);
+    this.searchText.set(this.displayWith()(item));
+    this.labelEdited = false;
+    this.onChange(this.formValue);
+    this.onTouched();
+    this.itemSelected.emit(item);
+    if (this.closeOnSelect()) this.close();
+  }
+
+  clear(event?: MouseEvent): void {
+    event?.preventDefault();
+    event?.stopPropagation();
+    if (this.isDisabled() || this.readonly()) return;
+    this.clearValue(true, true);
+  }
+
+  open(): void {
+    if (this.isDisabled() || this.readonly() || this.isOpen()) return;
+    this.panelWidth.set(this.origin?.nativeElement.getBoundingClientRect().width ?? 0);
+    this.isOpen.set(true);
+    this.opened.emit();
+  }
+
+  close(): void {
+    if (!this.isOpen()) return;
+    this.isOpen.set(false);
+    this.activeIndex.set(-1);
+    this.closed.emit();
+  }
+
+  optionId(index: number): string { return `${this.resolvedInputId()}-option-${index}`; }
+  optionKey(item: TItem, index: number): string | number { return this.trackBy()?.(item) ?? index; }
+  isOptionSelected(item: TItem): boolean {
+    return this.formValue !== null && this.valuesEqual(this.valueWith()(item), this.formValue);
+  }
+  optionClass(item: TItem, index: number): string {
+    const highlighted = this.activeIndex() === index;
+    const selected = this.isOptionSelected(item);
+    return [
+      'block w-full px-3 py-2 text-start text-[0.8125rem] transition-colors',
+      highlighted || selected
+        ? 'bg-primary text-white'
+        : 'bg-white text-defaulttextcolor hover:bg-primary hover:text-white dark:bg-bodybg dark:text-white/70 dark:hover:bg-primary dark:hover:text-white'
+    ].join(' ');
+  }
+
+  private setActive(index: number): void {
+    if (index < 0 || index >= this.options().length) return;
+    this.activeIndex.set(index);
+    queueMicrotask(() => document.getElementById(this.optionId(index))?.scrollIntoView({ block: 'nearest' }));
+  }
+
+  private clearValue(emitCleared: boolean, restoreFocus: boolean): void {
+    this.formValue = null;
+    this.activeItem.set(null);
+    this.searchText.set('');
+    this.options.set([]);
+    this.error.set(null);
+    this.loading.set(false);
+    this.showingPreview.set(false);
+    this.labelEdited = false;
+    this.onChange(null);
+    this.onTouched();
+    if (emitCleared) this.cleared.emit();
+    this.close();
+    if (restoreFocus) queueMicrotask(() => this.textInput?.nativeElement.focus());
+  }
+
+  private applyResolvedItem(item: TItem | null, clearText = true): void {
+    this.activeItem.set(item);
+    if (item !== null) this.searchText.set(this.displayWith()(item));
+    else if (clearText) this.searchText.set('');
+    this.labelEdited = false;
+  }
+
+  private valuesEqual(left: TValue, right: TValue | null): boolean { return Object.is(left, right); }
+
+  private hasResolvableValue(value: TValue | null): value is TValue {
+    return value !== null && (typeof value !== 'string' || value.trim().length > 0);
+  }
+
+  private openPreview(): void {
+    if (this.isDisabled() || this.readonly() || this.isOpen()) return;
+    this.open();
+    if (!this.searchText().trim()) {
+      this.searchRequests$.next({ term: '', preview: true });
+    }
+  }
+}
diff --git a/src/app/shared/components/form/autocomplete/autocomplete.types.ts b/src/app/shared/components/form/autocomplete/autocomplete.types.ts
new file mode 100644
index 00000000..cdad47ad
--- /dev/null
+++ b/src/app/shared/components/form/autocomplete/autocomplete.types.ts
@@ -0,0 +1,16 @@
+import { Observable } from 'rxjs';
+
+export type AutocompleteSearchFn<TItem> = (
+  term: string,
+  limit: number
+) => Observable<readonly TItem[]>;
+
+export type AutocompleteDisplayFn<TItem> = (item: TItem) => string;
+
+export type AutocompleteValueFn<TItem, TValue> = (item: TItem) => TValue;
+
+export type AutocompleteTrackFn<TItem> = (item: TItem) => string | number;
+
+export type AutocompleteResolveValueFn<TItem, TValue> = (
+  value: TValue
+) => Observable<TItem | null>;
diff --git a/src/app/shared/components/form/form-action/form-action.html b/src/app/shared/components/form/form-action/form-action.html
new file mode 100644
index 00000000..50f16151
--- /dev/null
+++ b/src/app/shared/components/form/form-action/form-action.html
@@ -0,0 +1 @@
+<p>form-action works!</p>
diff --git a/src/app/shared/components/form/form-action/form-action.scss b/src/app/shared/components/form/form-action/form-action.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/src/app/shared/components/form/form-action/form-action.ts b/src/app/shared/components/form/form-action/form-action.ts
new file mode 100644
index 00000000..8080a810
--- /dev/null
+++ b/src/app/shared/components/form/form-action/form-action.ts
@@ -0,0 +1,11 @@
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'form-action',
+  imports: [],
+  templateUrl: './form-action.html',
+  styleUrl: './form-action.scss',
+})
+export class FormAction {
+
+}
diff --git a/src/app/shared/components/form/form-checkbox/form-checkbox.html b/src/app/shared/components/form/form-checkbox/form-checkbox.html
new file mode 100644
index 00000000..6c7c593d
--- /dev/null
+++ b/src/app/shared/components/form/form-checkbox/form-checkbox.html
@@ -0,0 +1 @@
+<p>form-checkbox works!</p>
diff --git a/src/app/shared/components/form/form-checkbox/form-checkbox.scss b/src/app/shared/components/form/form-checkbox/form-checkbox.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/src/app/shared/components/form/form-checkbox/form-checkbox.ts b/src/app/shared/components/form/form-checkbox/form-checkbox.ts
new file mode 100644
index 00000000..0ce45d05
--- /dev/null
+++ b/src/app/shared/components/form/form-checkbox/form-checkbox.ts
@@ -0,0 +1,11 @@
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'form-checkbox',
+  imports: [],
+  templateUrl: './form-checkbox.html',
+  styleUrl: './form-checkbox.scss',
+})
+export class FormCheckbox {
+
+}
diff --git a/src/app/shared/components/form/form-date-picker/form-date-picker.html b/src/app/shared/components/form/form-date-picker/form-date-picker.html
new file mode 100644
index 00000000..407ab591
--- /dev/null
+++ b/src/app/shared/components/form/form-date-picker/form-date-picker.html
@@ -0,0 +1,39 @@
+<app-form-field
+	[label]="label()"
+	[inputId]="inputId()"
+	[control]="control()"
+	[required]="required()"
+	[disabled]="isDisabled()"
+	[description]="description()"
+	[hint]="hint()"
+	[help]="help()"
+	[floating]="isFloating()"
+	[forceFloat]="shouldFloat()"
+	[hideValidation]="hideValidation()"
+	[showValidationWhenDirty]="showValidationWhenDirty()"
+	[submitAttempted]="submitAttempted()"
+	[validationMessages]="validationMessages()"
+	[wrapperClass]="wrapperClass()"
+	[labelClass]="labelClass()"
+	[contentClass]="fieldContentClass()"
+>
+	<input
+		data-form-control
+		[id]="inputId()"
+		type="date"
+		[class]="inputClass()"
+		[value]="value() ?? ''"
+		[placeholder]="isFloating() ? ' ' : placeholder()"
+		[required]="required()"
+		[readOnly]="readonly()"
+		[disabled]="isDisabled()"
+		[attr.min]="min()"
+		[attr.max]="max()"
+		[attr.aria-label]="label()"
+		[attr.aria-invalid]="showError() ? 'true' : null"
+		[attr.aria-required]="required() ? 'true' : null"
+		(focus)="onFocus()"
+		(input)="onInput($event)"
+		(blur)="onBlur()"
+	/>
+</app-form-field>
diff --git a/src/app/shared/components/form/form-date-picker/form-date-picker.scss b/src/app/shared/components/form/form-date-picker/form-date-picker.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/src/app/shared/components/form/form-date-picker/form-date-picker.ts b/src/app/shared/components/form/form-date-picker/form-date-picker.ts
new file mode 100644
index 00000000..98d0d243
--- /dev/null
+++ b/src/app/shared/components/form/form-date-picker/form-date-picker.ts
@@ -0,0 +1,147 @@
+import {
+  ChangeDetectionStrategy,
+  Component,
+  Injector,
+  computed,
+  effect,
+  forwardRef,
+  inject,
+  input,
+  signal,
+} from '@angular/core';
+import {
+  AbstractControl,
+  ControlValueAccessor,
+  NG_VALUE_ACCESSOR,
+  NgControl,
+} from '@angular/forms';
+
+import { FormField } from '../form-field/form-field';
+import { ValidationMessageMap } from '../form-validation-message/form-validation-message';
+
+@Component({
+  selector: 'app-form-date-picker',
+  standalone: true,
+  imports: [FormField],
+  templateUrl: './form-date-picker.html',
+  styleUrl: './form-date-picker.scss',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  providers: [
+    {
+      provide: NG_VALUE_ACCESSOR,
+      useExisting: forwardRef(() => FormDatePicker),
+      multi: true,
+    },
+  ],
+})
+export class FormDatePicker implements ControlValueAccessor {
+  private readonly injector = inject(Injector);
+
+  readonly inputId = input.required<string>();
+  readonly label = input.required<string>();
+  readonly placeholder = input('');
+  readonly required = input(false);
+  readonly readonly = input(false);
+  readonly disabled = input(false);
+  readonly min = input<string | null>(null);
+  readonly max = input<string | null>(null);
+  readonly hint = input<string | null>(null);
+  readonly help = input<string | null>(null);
+  readonly description = input<string | null>(null);
+  readonly hideValidation = input(false);
+  readonly showValidationWhenDirty = input(false);
+  readonly submitAttempted = input(false);
+  readonly validationMessages = input<ValidationMessageMap>({});
+  readonly variant = input<'default' | 'floating'>('default');
+  readonly wrapperClass = input('');
+  readonly labelClass = input('');
+  readonly fieldContentClass = input('');
+
+  readonly value = signal<string | null>(null);
+  readonly formDisabled = signal(false);
+  readonly focused = signal(false);
+  private readonly controlStateVersion = signal(0);
+
+  private onChange: (value: string | null) => void = () => {};
+  private onTouched: () => void = () => {};
+
+  readonly control = computed<AbstractControl | null>(() =>
+    this.injector.get(NgControl, null, { self: true, optional: true })?.control ?? null
+  );
+
+  readonly isFloating = computed(() => this.variant() === 'floating');
+  readonly isDisabled = computed(() => this.disabled() || this.formDisabled());
+  readonly hasValue = computed(() => !!this.value());
+  readonly shouldFloat = computed(() => this.focused() || this.hasValue());
+  readonly showError = computed(() => {
+    this.controlStateVersion();
+    const control = this.control();
+    return !!control?.invalid && (this.submitAttempted() || (this.showValidationWhenDirty() && control.dirty));
+  });
+
+  readonly inputClass = computed(() => [
+    'form-control',
+    this.showError() ? 'is-invalid' : '',
+  ].filter(Boolean).join(' '));
+
+  constructor() {
+    effect((onCleanup) => {
+      const control = this.control();
+
+      if (!control) {
+        return;
+      }
+
+      const statusSubscription = control.statusChanges.subscribe(() => {
+        this.controlStateVersion.update(value => value + 1);
+      });
+
+      const valueSubscription = control.valueChanges.subscribe(() => {
+        this.controlStateVersion.update(value => value + 1);
+      });
+
+      const eventsSubscription = control.events?.subscribe(() => {
+        this.controlStateVersion.update(value => value + 1);
+      });
+
+      onCleanup(() => {
+        statusSubscription.unsubscribe();
+        valueSubscription.unsubscribe();
+        eventsSubscription?.unsubscribe();
+      });
+    });
+  }
+
+  writeValue(value: string | null): void {
+    this.value.set(value ?? null);
+  }
+
+  registerOnChange(fn: (value: string | null) => void): void {
+    this.onChange = fn;
+  }
+
+  registerOnTouched(fn: () => void): void {
+    this.onTouched = fn;
+  }
+
+  setDisabledState(isDisabled: boolean): void {
+    this.formDisabled.set(isDisabled);
+  }
+
+  onInput(event: Event): void {
+    const target = event.target as HTMLInputElement;
+    const nextValue = target.value.trim() || null;
+    this.value.set(nextValue);
+    this.onChange(nextValue);
+  }
+
+  onFocus(): void {
+    this.focused.set(true);
+  }
+
+  onBlur(): void {
+    this.focused.set(false);
+    this.onTouched();
+  }
+
+}
diff --git a/src/app/shared/components/form/form-field/form-field.html b/src/app/shared/components/form/form-field/form-field.html
new file mode 100644
index 00000000..2dd53ec5
--- /dev/null
+++ b/src/app/shared/components/form/form-field/form-field.html
@@ -0,0 +1,65 @@
+<div [class]="resolvedWrapperClass()">
+  @if (showLabel() && !floating()) {
+  <label [for]="inputId()" [class]="resolvedLabelClass()">
+    {{ label() }}
+    @if (required()) {
+    <span [class]="requiredClass()" aria-hidden="true">
+      *
+    </span>
+
+    <span class="sr-only">
+      Required
+    </span>
+    }
+
+    @if (showHelpIcon()) {
+
+    <button type="button" class="text-muted hover:text-primary" [attr.aria-label]="help()" tooltipVariant="info" [appTooltip]="resolvedHelp()"
+       aria-label="Field help">
+
+      <i class="ti ti-info-circle"></i>
+
+    </button>
+
+    }
+  </label>
+  }
+
+  <div [class]="resolvedContentClass()">
+    @if (description()) {
+    <p [id]="descriptionId()" [class]="descriptionClass()">
+      {{ description() }}
+    </p>
+    }
+
+    <div [class.floating-label]="floating()" [class.floating-label--float]="floating() && (hasValue() || forceFloat())" [class.floating-label--invalid]="floating() && hasVisibleError()">
+      <ng-content />
+      @if (floating()) {
+      <label [for]="inputId()" [class]="resolvedLabelClass()">
+        {{ label() }}
+        @if (required()) {
+        <span [class]="requiredClass()" aria-hidden="true">
+          *
+        </span>
+
+        <span class="sr-only">
+          Required
+        </span>
+        }
+      </label>
+      }
+    </div>
+
+    @if (showHint()) {
+    <p [id]="hintId()" [class]="hintClass()">
+      {{ hint() }}
+    </p>
+    }
+
+    @if (!hideValidation()) {
+    <app-form-validation-message [id]="validationId()" [fieldName]="label()" [control]="control()"
+      [messages]="validationMessages()" [showWhenDirty]="showValidationWhenDirty()"
+      [submitAttempted]="submitAttempted()" />
+    }
+  </div>
+</div>
diff --git a/src/app/shared/components/form/form-field/form-field.scss b/src/app/shared/components/form/form-field/form-field.scss
new file mode 100644
index 00000000..c04a0d6d
--- /dev/null
+++ b/src/app/shared/components/form/form-field/form-field.scss
@@ -0,0 +1,65 @@
+:host {
+  display: block;
+}
+
+.floating-label {
+  position: relative;
+  display: block;
+
+  ::ng-deep .form-control {
+    padding-block: 1.125rem 0.375rem;
+    min-height: 3.25rem;
+    border-radius: 0.5rem;
+    transition: border-color 0.2s ease, box-shadow 0.2s ease;
+
+    &::placeholder {
+      color: transparent;
+    }
+  }
+
+  ::ng-deep .form-control:focus {
+    border-color: var(--color-primary);
+    box-shadow: 0 0 0 0.2rem color-mix(in srgb, var(--color-primary) 20%, transparent);
+  }
+
+  > label {
+    position: absolute;
+    inset-inline-start: 0.75rem;
+    top: 50%;
+    transform: translateY(-50%);
+    transform-origin: left top;
+    z-index: 10;
+    padding-inline: 0.25rem;
+    background: var(--color-white) !important;
+    color: #8c9097 !important;
+    font-size: 0.875rem !important;
+    line-height: 1;
+    transition: all 0.2s ease-out;
+    pointer-events: none;
+    max-width: calc(100% - 1.75rem);
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  &:focus-within > label,
+  &.floating-label--float > label {
+    top: 0;
+    transform: translateY(-50%) scale(0.85);
+    color: var(--color-primary) !important;
+  }
+
+  &.floating-label--invalid > label {
+    color: var(--color-danger) !important;
+  }
+}
+
+:host-context(.dark) .floating-label > label,
+:host-context(.dark) .floating-label:focus-within > label,
+:host-context(.dark) .floating-label.floating-label--float > label {
+  background: var(--color-bodybg) !important;
+}
+
+:host-context(.dark) .floating-label ::ng-deep .form-control:focus {
+  box-shadow: 0 0 0 0.2rem color-mix(in srgb, var(--color-primary) 25%, transparent);
+}
diff --git a/src/app/shared/components/form/form-field/form-field.ts b/src/app/shared/components/form/form-field/form-field.ts
new file mode 100644
index 00000000..acf1a4c9
--- /dev/null
+++ b/src/app/shared/components/form/form-field/form-field.ts
@@ -0,0 +1,205 @@
+import {
+  ChangeDetectionStrategy,
+  Component,
+  computed,
+  effect,
+  input,
+  signal
+} from '@angular/core';
+import { AbstractControl } from '@angular/forms';
+
+import {
+  FormValidationMessage,
+  ValidationMessageMap
+} from '../form-validation-message/form-validation-message';
+import { TooltipDirective } from '../../../directives/tooltip/tooltip.directive';
+
+export type FormLabelPosition = 'top' | 'left' | 'hidden';
+
+@Component({
+  selector: 'app-form-field',
+  standalone: true,
+  imports: [FormValidationMessage, TooltipDirective],
+  templateUrl: './form-field.html',
+  styleUrl: './form-field.scss',
+  changeDetection: ChangeDetectionStrategy.OnPush
+})
+export class FormField {
+  readonly label = input.required<string>();
+
+  readonly inputId = input.required<string>();
+
+  readonly control = input<AbstractControl | null>(null);
+
+  readonly required = input(false);
+
+  readonly disabled = input(false);
+
+  readonly description = input<string | null>(null);
+
+  readonly hint = input<string | null>(null);
+  readonly help = input<string | null>(null);
+
+  readonly showHelpIcon = computed(() => {
+    return !!this.help()?.trim();
+  });
+
+  readonly resolvedHelp = computed(() => {
+    return this.help()?.trim() ?? '';
+  });
+
+  readonly labelPosition = input<FormLabelPosition>('top');
+
+  readonly hideLabel = input(false);
+
+  readonly floating = input(false);
+
+  readonly forceFloat = input(false);
+
+  readonly hideValidation = input(false);
+
+  readonly showValidationWhenDirty = input(false);
+
+  readonly submitAttempted = input(false);
+
+  readonly validationMessages =
+    input<ValidationMessageMap>({});
+
+  readonly wrapperClass = input('');
+
+  readonly labelClass = input('');
+
+  readonly contentClass = input('');
+
+  readonly descriptionClass = input(
+    'mb-2 text-[0.75rem] leading-4 text-textmuted'
+  );
+
+  readonly hintClass = input(
+    'mt-1 text-[0.75rem] leading-4 text-textmuted'
+  );
+
+  readonly requiredClass = input(
+    'ms-0.5 text-danger'
+  );
+
+  private readonly controlStateVersion = signal(0);
+
+  constructor() {
+    effect((onCleanup) => {
+      const control = this.control();
+
+      if (!control) {
+        return;
+      }
+
+      const statusSubscription = control.statusChanges.subscribe(() => {
+        this.controlStateVersion.update(value => value + 1);
+      });
+
+      const valueSubscription = control.valueChanges.subscribe(() => {
+        this.controlStateVersion.update(value => value + 1);
+      });
+
+      const eventsSubscription = control.events?.subscribe(() => {
+        this.controlStateVersion.update(value => value + 1);
+      });
+
+      onCleanup(() => {
+        statusSubscription.unsubscribe();
+        valueSubscription.unsubscribe();
+        eventsSubscription?.unsubscribe();
+      });
+    });
+  }
+
+  readonly validationId = computed(
+    () => `${this.inputId()}-validation`
+  );
+
+  readonly hintId = computed(
+    () => `${this.inputId()}-hint`
+  );
+
+  readonly descriptionId = computed(
+    () => `${this.inputId()}-description`
+  );
+
+  readonly hasVisibleError = computed(() => {
+    this.controlStateVersion();
+
+    const control = this.control();
+
+    if (!control?.invalid) {
+      return false;
+    }
+
+    return (
+      this.submitAttempted() ||
+      (this.showValidationWhenDirty() && control.dirty)
+    );
+  });
+
+  readonly hasValue = computed(() => {
+    this.controlStateVersion();
+
+    const control = this.control();
+
+    if (!control) {
+      return false;
+    }
+
+    const value = control.value;
+
+    return value !== null && value !== undefined && value !== '';
+  });
+
+  readonly resolvedWrapperClass = computed(() => {
+    return [
+      this.labelPosition() === 'left'
+        ? 'grid grid-cols-12 items-start gap-x-4 gap-y-2'
+        : '',
+      this.wrapperClass()
+    ]
+      .filter(Boolean)
+      .join(' ');
+  });
+
+  readonly resolvedLabelClass = computed(() => {
+    return [
+      'form-label',
+      'mb-1.5 block',
+      this.labelPosition() === 'left'
+        ? 'col-span-12 md:col-span-4 md:mb-0 md:pt-2'
+        : '',
+      this.disabled()
+        ? 'cursor-not-allowed opacity-60'
+        : '',
+      this.labelClass()
+    ]
+      .filter(Boolean)
+      .join(' ');
+  });
+
+  readonly resolvedContentClass = computed(() => {
+    return [
+      this.labelPosition() === 'left'
+        ? 'col-span-12 md:col-span-8'
+        : '',
+      this.contentClass()
+    ]
+      .filter(Boolean)
+      .join(' ');
+  });
+
+  readonly showLabel = computed(() => {
+    return (
+      !this.hideLabel() &&
+      this.labelPosition() !== 'hidden'
+    );
+  });
+
+  readonly showHint = computed(() => {
+    return !!this.hint() && !this.hasVisibleError();
+  });
+}
diff --git a/src/app/shared/components/form/form-file-upload/form-file-upload.html b/src/app/shared/components/form/form-file-upload/form-file-upload.html
new file mode 100644
index 00000000..97a1488c
--- /dev/null
+++ b/src/app/shared/components/form/form-file-upload/form-file-upload.html
@@ -0,0 +1 @@
+<p>form-file-upload works!</p>
diff --git a/src/app/shared/components/form/form-file-upload/form-file-upload.scss b/src/app/shared/components/form/form-file-upload/form-file-upload.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/src/app/shared/components/form/form-file-upload/form-file-upload.ts b/src/app/shared/components/form/form-file-upload/form-file-upload.ts
new file mode 100644
index 00000000..126952fb
--- /dev/null
+++ b/src/app/shared/components/form/form-file-upload/form-file-upload.ts
@@ -0,0 +1,11 @@
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'form-file-upload',
+  imports: [],
+  templateUrl: './form-file-upload.html',
+  styleUrl: './form-file-upload.scss',
+})
+export class FormFileUpload {
+
+}
diff --git a/src/app/shared/components/form/form-input/form-input.html b/src/app/shared/components/form/form-input/form-input.html
new file mode 100644
index 00000000..0c035dbe
--- /dev/null
+++ b/src/app/shared/components/form/form-input/form-input.html
@@ -0,0 +1,158 @@
+@if (isFloating()) {
+  <div class="shared-form-field">
+    <div
+      class="shared-form-control"
+      [class.is-focused]="focused()"
+      [class.has-value]="hasValue()"
+      [class.has-error]="showError()"
+      [class.is-disabled]="isDisabled()"
+    >
+      @if (prefixIcon()) {
+        <span class="shared-form-prefix" aria-hidden="true">
+          <i [class]="prefixIcon() + ' text-[1rem] leading-none ' + prefixIconClass()"></i>
+        </span>
+      }
+
+      <input
+        data-form-control
+        class="shared-form-input"
+        [class.has-prefix]="hasPrefixIcon()"
+        [class.has-suffix]="hasSuffixContent()"
+        [id]="inputId()"
+        [name]="name()"
+        [type]="resolvedType()"
+        [value]="value() ?? ''"
+        placeholder=" "
+        [required]="required()"
+        [readOnly]="readonly()"
+        [disabled]="isDisabled()"
+        [attr.autocomplete]="autocomplete()"
+        [attr.inputmode]="inputMode()"
+        [attr.spellcheck]="spellcheck()"
+        [attr.minlength]="minLength()"
+        [attr.maxlength]="maxLength()"
+        [attr.pattern]="pattern()"
+        [attr.min]="min()"
+        [attr.max]="max()"
+        [attr.step]="step()"
+        [attr.aria-label]="ariaLabel() || label()"
+        [attr.aria-description]="ariaDescription()"
+        [attr.aria-describedby]="describedBy()"
+        [attr.aria-invalid]="showError() ? 'true' : null"
+        [attr.aria-required]="required() ? 'true' : null"
+        [attr.aria-busy]="loading() ? 'true' : null"
+        (focus)="onFocus()"
+        (input)="onInput($event)"
+        (blur)="onBlur()"
+      />
+
+      <label class="shared-floating-label" [for]="inputId()">
+        {{ label() }}
+        @if (required()) {
+          <span class="ms-0.5 text-danger" aria-hidden="true">*</span>
+          <span class="sr-only">Required</span>
+        }
+      </label>
+
+      @if (loading()) {
+        <span class="shared-form-suffix" aria-hidden="true">
+          <span class="inline-block size-4 animate-spin rounded-full border-2 border-current border-t-transparent text-primary"></span>
+        </span>
+      } @else if (type() === 'password' && showPasswordToggle()) {
+        <button
+          type="button"
+          class="shared-form-suffix shared-form-action"
+          [disabled]="isDisabled()"
+          [attr.aria-label]="passwordVisible() ? 'Hide ' + label() : 'Show ' + label()"
+          (click)="togglePasswordVisibility()"
+        >
+          <i [class]="passwordVisible() ? 'ri-eye-off-line' : 'ri-eye-line'" aria-hidden="true"></i>
+        </button>
+      } @else if (suffixIcon()) {
+        <span class="shared-form-suffix" aria-hidden="true">
+          <i [class]="suffixIcon() + ' text-[1rem] leading-none ' + suffixIconClass()"></i>
+        </span>
+      }
+    </div>
+
+    @if (!hideValidation()) {
+      <app-form-validation-message
+        [id]="inputId() + '-validation'"
+        [fieldName]="label()"
+        [control]="control()"
+        [messages]="validationMessages()"
+        [showWhenDirty]="showValidationWhenDirty()"
+        [submitAttempted]="submitAttempted()"
+      />
+    }
+  </div>
+} @else {
+  <app-form-field
+    [label]="label()"
+    [inputId]="inputId()"
+    [control]="control()"
+    [required]="required()"
+    [disabled]="isDisabled()"
+    [description]="description()"
+    [hint]="hint()"
+    [help]="help()"
+    [hideValidation]="hideValidation()"
+    [showValidationWhenDirty]="showValidationWhenDirty()"
+    [submitAttempted]="submitAttempted()"
+    [validationMessages]="validationMessages()"
+    [wrapperClass]="wrapperClass()"
+    [labelClass]="labelClass()"
+    [contentClass]="fieldContentClass()"
+  >
+    <div class="relative">
+      @if (prefixIcon()) {
+        <span class="pointer-events-none absolute inset-y-0 start-0 z-[1] flex w-10 items-center justify-center text-textmuted" aria-hidden="true">
+          <i [class]="prefixIcon() + ' text-[1rem] leading-none ' + prefixIconClass()"></i>
+        </span>
+      }
+      <input
+        data-form-control
+        [id]="inputId()"
+        [name]="name()"
+        [type]="resolvedType()"
+        [class]="resolvedInputClass()"
+        [value]="value() ?? ''"
+        [placeholder]="resolvedPlaceholder()"
+        [required]="required()"
+        [readOnly]="readonly()"
+        [disabled]="isDisabled()"
+        [attr.autocomplete]="autocomplete()"
+        [attr.inputmode]="inputMode()"
+        [attr.spellcheck]="spellcheck()"
+        [attr.minlength]="minLength()"
+        [attr.maxlength]="maxLength()"
+        [attr.pattern]="pattern()"
+        [attr.min]="min()"
+        [attr.max]="max()"
+        [attr.step]="step()"
+        [attr.aria-label]="ariaLabel() || label()"
+        [attr.aria-description]="ariaDescription()"
+        [attr.aria-describedby]="describedBy()"
+        [attr.aria-invalid]="showError() ? 'true' : null"
+        [attr.aria-required]="required() ? 'true' : null"
+        [attr.aria-busy]="loading() ? 'true' : null"
+        (focus)="onFocus()"
+        (input)="onInput($event)"
+        (blur)="onBlur()"
+      />
+      @if (loading()) {
+        <span class="pointer-events-none absolute inset-y-0 end-0 flex w-10 items-center justify-center" aria-hidden="true">
+          <span class="inline-block size-4 animate-spin rounded-full border-2 border-current border-t-transparent text-primary"></span>
+        </span>
+      } @else if (type() === 'password' && showPasswordToggle()) {
+        <button type="button" class="absolute inset-y-0 end-0 flex w-10 cursor-pointer items-center justify-center text-textmuted" [disabled]="isDisabled()" [attr.aria-label]="passwordVisible() ? 'Hide ' + label() : 'Show ' + label()" (click)="togglePasswordVisibility()">
+          <i [class]="passwordVisible() ? 'ri-eye-off-line' : 'ri-eye-line'" aria-hidden="true"></i>
+        </button>
+      } @else if (suffixIcon()) {
+        <span class="pointer-events-none absolute inset-y-0 end-0 flex w-10 items-center justify-center text-textmuted" aria-hidden="true">
+          <i [class]="suffixIcon() + ' text-[1rem] leading-none ' + suffixIconClass()"></i>
+        </span>
+      }
+    </div>
+  </app-form-field>
+}
diff --git a/src/app/shared/components/form/form-input/form-input.scss b/src/app/shared/components/form/form-input/form-input.scss
new file mode 100644
index 00000000..25f2e9da
--- /dev/null
+++ b/src/app/shared/components/form/form-input/form-input.scss
@@ -0,0 +1,98 @@
+:host {
+  display: block;
+  width: 100%;
+  min-width: 0;
+}
+
+.shared-form-field,
+.shared-form-control {
+  display: block;
+  width: 100%;
+  min-width: 0;
+}
+
+.shared-form-control {
+  position: relative;
+}
+
+.shared-form-input {
+  display: block;
+  width: 100%;
+  min-height: 2.5rem;
+  padding: 0.75rem 0.75rem 0.5rem;
+  border: 1px solid var(--color-inputborder);
+  border-radius: 0.5rem;
+  background-color: var(--color-white);
+  color: var(--color-defaulttextcolor);
+  font-size: 0.8125rem;
+  line-height: 1.25;
+  outline: none;
+  box-shadow: none;
+  transition: border-color 0.2s ease;
+}
+
+.shared-form-input.has-prefix { padding-inline-start: 2.5rem; }
+.shared-form-input.has-suffix { padding-inline-end: 2.5rem; }
+.shared-form-input::placeholder { color: transparent; }
+
+.shared-form-control.is-focused .shared-form-input,
+.shared-form-control.has-value .shared-form-input {
+  border-color: var(--color-primary);
+}
+
+.shared-floating-label {
+  position: absolute;
+  inset-inline-start: 0.75rem;
+  top: 50%;
+  z-index: 2;
+  max-width: calc(100% - 1.75rem);
+  padding-inline: 0.25rem;
+  overflow: hidden;
+  transform: translateY(-50%);
+  transform-origin: left top;
+  background-color: var(--color-white);
+  color: #8c9097;
+  font-size: 0.75rem;
+  line-height: 1;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  pointer-events: none;
+  transition: top 0.2s ease-out, transform 0.2s ease-out, color 0.2s ease-out;
+}
+
+.shared-form-control.is-focused .shared-floating-label,
+.shared-form-control.has-value .shared-floating-label {
+  top: 0;
+  transform: translateY(-50%) scale(0.9);
+  color: var(--color-primary);
+}
+
+.shared-form-control.has-error .shared-form-input { border-color: var(--color-danger); }
+.shared-form-control.has-error .shared-floating-label { color: var(--color-danger); }
+.shared-form-control.is-disabled { opacity: 0.7; }
+.shared-form-control.is-disabled .shared-form-input { cursor: not-allowed; }
+
+.shared-form-prefix,
+.shared-form-suffix {
+  position: absolute;
+  top: 50%;
+  z-index: 3;
+  display: flex;
+  width: 2.5rem;
+  align-items: center;
+  justify-content: center;
+  transform: translateY(-50%);
+  color: var(--color-textmuted);
+}
+.shared-form-prefix { inset-inline-start: 0; }
+.shared-form-suffix { inset-inline-end: 0; }
+.shared-form-action { border: 0; background: transparent; cursor: pointer; }
+
+.shared-form-input[type='number']::-webkit-inner-spin-button,
+.shared-form-input[type='number']::-webkit-outer-spin-button { appearance: none; margin: 0; }
+.shared-form-input[type='number'] { -moz-appearance: textfield; }
+
+:host-context(.dark) .shared-form-input,
+:host-context(.dark) .shared-floating-label {
+  background-color: var(--color-bodybg);
+}
diff --git a/src/app/shared/components/form/form-input/form-input.ts b/src/app/shared/components/form/form-input/form-input.ts
new file mode 100644
index 00000000..b7d2dc26
--- /dev/null
+++ b/src/app/shared/components/form/form-input/form-input.ts
@@ -0,0 +1,328 @@
+import { ChangeDetectionStrategy, Component, Injector, computed, effect, forwardRef, inject, input, signal } from '@angular/core';
+
+import { AbstractControl, ControlValueAccessor, NG_VALUE_ACCESSOR, NgControl } from '@angular/forms';
+
+import { FormField } from '../form-field/form-field';
+import { FormValidationMessage } from '../form-validation-message/form-validation-message';
+import { ValidationMessageMap } from '../form-validation-message/form-validation-message';
+
+export type FormInputType = | 'text' | 'email' | 'password' | 'number' | 'tel' | 'url' | 'search';
+
+export type FormInputMode = | 'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url';
+
+export type FormInputIconPosition = 'left' | 'right';
+export type FormInputVariant = 'default' | 'floating';
+
+@Component({
+  selector: 'app-form-input',
+  standalone: true,
+  imports: [FormField, FormValidationMessage],
+  templateUrl: './form-input.html',
+  styleUrl: './form-input.scss',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  providers: [
+    {
+      provide: NG_VALUE_ACCESSOR,
+      useExisting: forwardRef(() => FormInput),
+      multi: true
+    }
+  ]
+})
+export class FormInput implements ControlValueAccessor {
+  private readonly injector = inject(Injector);
+
+
+  readonly inputId = input.required<string>();
+  readonly label = input.required<string>();
+
+  readonly name = input<string | null>(null);
+
+  readonly type = input<FormInputType>('text');
+
+  readonly placeholder = input('');
+  readonly showPlaceholder = input(true);
+  readonly useLabelAsPlaceholder = input(true);
+
+  readonly required = input(false);
+  readonly readonly = input(false);
+  readonly disabled = input(false);
+
+  readonly autocomplete = input<string | null>(null);
+  readonly inputMode = input<FormInputMode | null>(null);
+
+  readonly spellcheck = input<boolean | null>(null);
+
+  readonly minLength = input<number | null>(null);
+  readonly maxLength = input<number | null>(null);
+
+  readonly pattern = input<string | null>(null);
+
+
+  readonly min = input<number | null>(null);
+  readonly max = input<number | null>(null);
+  readonly step = input<number | string | null>(null);
+
+
+  readonly description = input<string | null>(null);
+  readonly hint = input<string | null>(null);
+  readonly help = input<string | null>(null);
+
+  readonly hideValidation = input(false);
+  readonly showValidationWhenDirty = input(false);
+  readonly submitAttempted = input(false);
+
+  readonly validationMessages = input<ValidationMessageMap>({});
+
+  readonly prefixIcon = input<string | null>(null);
+  readonly suffixIcon = input<string | null>(null);
+
+  readonly prefixIconClass = input('');
+  readonly suffixIconClass = input('');
+
+  readonly showPasswordToggle = input(true);
+  readonly loading = input(false);
+
+  readonly floating = input(false);
+  readonly variant = input<FormInputVariant>('default');
+
+  readonly wrapperClass = input('');
+  readonly fieldContentClass = input('');
+  readonly labelClass = input('');
+  readonly inputClass = input('');
+
+
+  readonly ariaLabel = input<string | null>(null);
+  readonly ariaDescription = input<string | null>(null);
+
+
+  readonly value = signal<string | number | null>(null);
+  readonly formDisabled = signal(false);
+  readonly passwordVisible = signal(false);
+  readonly focused = signal(false);
+  private readonly controlStateVersion = signal(0);
+
+  private onChange: (value: string | number | null) => void = () => { };
+
+  private onTouched: () => void = () => { };
+
+  constructor() {
+    effect(() => {
+      if (this.type() !== 'password') {
+        this.passwordVisible.set(false);
+      }
+    });
+
+    effect((onCleanup) => {
+      const control = this.control();
+
+      if (!control) {
+        return;
+      }
+
+      const statusSubscription = control.statusChanges.subscribe(() => {
+        this.controlStateVersion.update(value => value + 1);
+      });
+
+      const valueSubscription = control.valueChanges.subscribe(() => {
+        this.controlStateVersion.update(value => value + 1);
+      });
+
+      const eventsSubscription = control.events?.subscribe(() => {
+        this.controlStateVersion.update(value => value + 1);
+      });
+
+      onCleanup(() => {
+        statusSubscription.unsubscribe();
+        valueSubscription.unsubscribe();
+        eventsSubscription?.unsubscribe();
+      });
+    });
+  }
+
+  readonly control = computed<AbstractControl | null>(() => {
+    return this.injector.get(NgControl, null, {
+      self: true,
+      optional: true
+    })?.control ?? null;
+  });
+
+  readonly isDisabled = computed(() => {
+    return this.disabled() || this.formDisabled() || this.loading();
+  });
+
+  readonly isFloating = computed(() => this.variant() === 'floating' || this.floating());
+
+  readonly hasValue = computed(() => {
+    const currentValue = this.value();
+    return currentValue !== '' && currentValue !== null && currentValue !== undefined;
+  });
+
+  readonly showError = computed(() => {
+    this.controlStateVersion();
+    const control = this.control();
+    return !!control?.invalid && (this.submitAttempted() || (this.showValidationWhenDirty() && control.dirty));
+  });
+
+  readonly resolvedPlaceholder = computed(() => {
+    if (!this.showPlaceholder()) {
+      return '';
+    }
+
+    const configuredPlaceholder = this.placeholder().trim();
+
+    if (configuredPlaceholder && !this.isFloating()) {
+      return configuredPlaceholder;
+    }
+
+    if (this.isFloating()) {
+      return ' ';
+    }
+
+    return this.useLabelAsPlaceholder()
+      ? this.label()
+      : null;
+  });
+
+  readonly resolvedType = computed<FormInputType>(() => {
+    if (
+      this.type() === 'password' &&
+      this.passwordVisible()
+    ) {
+      return 'text';
+    }
+
+    return this.type();
+  });
+
+  readonly hasPrefixIcon = computed(() => {
+    return !!this.prefixIcon();
+  });
+
+  readonly hasSuffixContent = computed(() => {
+    return (
+      !!this.suffixIcon() ||
+      this.loading() ||
+      (
+        this.type() === 'password' &&
+        this.showPasswordToggle()
+      )
+    );
+  });
+
+  readonly resolvedInputClass = computed(() => {
+    this.controlStateVersion();
+
+    const control = this.control();
+    const showInvalidState = !!(
+      control?.invalid &&
+      (
+        this.submitAttempted() ||
+        (this.showValidationWhenDirty() && control.dirty)
+      )
+    );
+
+    return [
+      'form-control',
+      this.hasPrefixIcon() ? '!ps-10' : '',
+      this.hasSuffixContent() ? '!pe-10' : '',
+      showInvalidState
+        ? 'is-invalid'
+        : '',
+      this.inputClass()
+    ]
+      .filter(Boolean)
+      .join(' ');
+  });
+
+  readonly describedBy = computed(() => {
+    this.controlStateVersion();
+
+    const ids: string[] = [];
+    const control = this.control();
+
+    if (this.description()) {
+      ids.push(`${this.inputId()}-description`);
+    }
+
+    if (this.hint()) {
+      ids.push(`${this.inputId()}-hint`);
+    }
+
+    if (
+      control?.invalid &&
+      (
+        this.submitAttempted() ||
+        (this.showValidationWhenDirty() && control.dirty)
+      )
+    ) {
+      ids.push(`${this.inputId()}-validation`);
+    }
+
+    return ids.length ? ids.join(' ') : null;
+  });
+
+  writeValue(value: string | number | null): void {
+    this.value.set(value ?? null);
+  }
+
+  registerOnChange(
+    fn: (value: string | number | null) => void
+  ): void {
+    this.onChange = fn;
+  }
+
+  registerOnTouched(fn: () => void): void {
+    this.onTouched = fn;
+  }
+
+  setDisabledState(isDisabled: boolean): void {
+    this.formDisabled.set(isDisabled);
+  }
+
+  onInput(event: Event): void {
+    const element = event.target as HTMLInputElement;
+
+    const nextValue = this.resolveValue(element.value);
+
+    this.value.set(nextValue);
+    this.onChange(nextValue);
+  }
+
+  onBlur(): void {
+    this.focused.set(false);
+    this.onTouched();
+  }
+
+  onFocus(): void {
+    this.focused.set(true);
+  }
+
+  togglePasswordVisibility(): void {
+    if (
+      this.type() !== 'password' ||
+      this.isDisabled()
+    ) {
+      return;
+    }
+
+    this.passwordVisible.update(value => !value);
+  }
+
+  private resolveValue(
+    rawValue: string
+  ): string | number | null {
+    if (this.type() !== 'number') {
+      return rawValue;
+    }
+
+    if (rawValue === '') {
+      return null;
+    }
+
+    const numericValue = Number(rawValue);
+
+    return Number.isNaN(numericValue)
+      ? null
+      : numericValue;
+  }
+}
diff --git a/src/app/shared/components/form/form-radio/form-radio.html b/src/app/shared/components/form/form-radio/form-radio.html
new file mode 100644
index 00000000..72cf9976
--- /dev/null
+++ b/src/app/shared/components/form/form-radio/form-radio.html
@@ -0,0 +1 @@
+<p>form-radio works!</p>
diff --git a/src/app/shared/components/form/form-radio/form-radio.scss b/src/app/shared/components/form/form-radio/form-radio.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/src/app/shared/components/form/form-radio/form-radio.ts b/src/app/shared/components/form/form-radio/form-radio.ts
new file mode 100644
index 00000000..013166e5
--- /dev/null
+++ b/src/app/shared/components/form/form-radio/form-radio.ts
@@ -0,0 +1,11 @@
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'form-radio',
+  imports: [],
+  templateUrl: './form-radio.html',
+  styleUrl: './form-radio.scss',
+})
+export class FormRadio {
+
+}
diff --git a/src/app/shared/components/form/form-select/form-select.html b/src/app/shared/components/form/form-select/form-select.html
new file mode 100644
index 00000000..7323075c
--- /dev/null
+++ b/src/app/shared/components/form/form-select/form-select.html
@@ -0,0 +1,225 @@
+<app-form-field
+  [label]="label()"
+  [inputId]="resolvedInputId()"
+  [control]="control()"
+  [required]="required()"
+  [disabled]="isDisabled()"
+  [description]="description()"
+  [hint]="hint()"
+  [floating]="isFloating()"
+  [forceFloat]="shouldFloat()"
+  [labelPosition]="labelPosition()"
+  [hideLabel]="hideLabel()"
+  [hideValidation]="hideValidation()"
+  [showValidationWhenDirty]="showValidationWhenDirty()"
+  [submitAttempted]="submitAttempted()"
+  [validationMessages]="validationMessages()"
+  [wrapperClass]="(isFloating() ? 'form-select-floating ' : '') + wrapperClass()"
+  [labelClass]="labelClass()"
+  [contentClass]="fieldContentClass()"
+>
+  <ng-select
+    #select
+    bindLabel="label"
+    bindValue="value"
+    appearance="outline"
+    [items]="selectItems()"
+    [ngModel]="modelValue()"
+    [multiple]="isMultiple()"
+    [searchable]="false"
+    [editableSearchTerm]="resolvedEditableSearchTerm()"
+    [clearable]="clearable()"
+    [hideSelected]="hideSelected()"
+    [closeOnSelect]="resolvedCloseOnSelect()"
+    [maxSelectedItems]="maxSelectedItems()"
+    [placeholder]="resolvedPlaceholder()"
+    [loading]="loading()"
+    [loadingText]="loadingText()"
+    [notFoundText]="notFoundText()"
+    [typeToSearchText]="typeToSearchText()"
+    [clearAllText]="clearAllText()"
+    [appendTo]="appendTo()"
+    [dropdownPosition]="dropdownPosition()"
+    [virtualScroll]="virtualScroll()"
+    [bufferAmount]="bufferAmount()"
+    [groupBy]="groupBy()"
+    [selectableGroup]="selectableGroup()"
+    [selectableGroupAsModel]="selectableGroupAsModel()"
+    [selectOnTab]="selectOnTab()"
+    [clearOnBackspace]="clearOnBackspace()"
+    [readonly]="resolvedReadonly()"
+    [labelForId]="resolvedInputId()"
+    [inputAttrs]="inputAttrs()"
+    [ariaLabel]="ariaLabel() || label() || resolvedPlaceholder()"
+    [ngClass]="resolvedSelectClass()"
+    (ngModelChange)="onValueChange($event)"
+    (open)="onOpen()"
+    (close)="onClose()"
+    (focus)="onFocus()"
+    (blur)="onBlur()"
+    (clear)="onClear()"
+    (scroll)="onScroll($event)"
+    (scrollToEnd)="onScrollToEnd()"
+  >
+    @if (showDropdownHeader()) {
+      <ng-template ng-header-tmp>
+        @if (searchable()) {
+          <div class="w-full">
+            <input
+              type="search"
+              class="form-control form-control-sm w-full rounded-sm border-defaultborder text-defaulttextcolor dark:border-defaultborder/10 dark:text-white/70"
+              [value]="searchTerm()"
+              [placeholder]="resolvedSearchPlaceholder()"
+              [disabled]="isDisabled()"
+              autocomplete="off"
+              (input)="onSearchInput($event)"
+              (keydown)="$event.stopPropagation()"
+            />
+          </div>
+        }
+
+        @if (isMultiple() && showSelectAll()) {
+          <button
+            type="button"
+            class="flex w-full items-center gap-2 border-b border-defaultborder px-3 py-2 text-start text-[0.8125rem] text-defaulttextcolor hover:bg-light dark:border-defaultborder/10 dark:text-white/70 dark:hover:bg-black/20"
+            [class.text-primary]="allSelected() || partiallySelected()"
+            [disabled]="isDisabled()"
+            (click)="toggleSelectAll()"
+          >
+            @if (showCheckboxes()) {
+              <span
+                class="flex size-4 shrink-0 items-center justify-center rounded-sm border border-defaultborder bg-white text-[0.625rem] dark:border-defaultborder/10 dark:bg-bodybg"
+                [class.bg-primary]="allSelected() || partiallySelected()"
+                [class.text-white]="allSelected() || partiallySelected()"
+                aria-hidden="true"
+              >
+                @if (allSelected()) {
+                  <i class="ri-check-line leading-none"></i>
+                } @else if (partiallySelected()) {
+                  <i class="ri-subtract-line leading-none"></i>
+                }
+              </span>
+            }
+
+            <span class="min-w-0 flex-1 truncate">
+              {{ selectAllLabel() }}
+            </span>
+          </button>
+        }
+      </ng-template>
+    }
+
+    <ng-template ng-option-tmp let-item="item" let-item$="item$">
+      <div [class]="getOptionContainerClass(item)">
+        @if (isMultiple() && showCheckboxes()) {
+          <span
+            class="mt-0.5 flex size-4 shrink-0 items-center justify-center rounded-sm border border-defaultborder bg-white text-[0.625rem] dark:border-defaultborder/10 dark:bg-bodybg"
+            [class.bg-primary]="isOptionSelected(item)"
+            [class.text-white]="isOptionSelected(item)"
+            aria-hidden="true"
+          >
+            @if (isOptionSelected(item)) {
+              <i class="ri-check-line leading-none"></i>
+            }
+          </span>
+        }
+
+        @if (item.prefixText) {
+          <span [class]="getOptionPrefixClass(item)">
+            {{ item.prefixText }}
+          </span>
+        }
+
+        <span class="min-w-0 flex-1">
+          <span [class]="getOptionLabelClass(item)">
+            {{ getOptionDisplayLabel(item, item$.label) }}
+          </span>
+
+          @if (item.description) {
+            <span class="mt-0.5 block truncate text-[0.75rem] text-inherit opacity-80">
+              {{ item.description }}
+            </span>
+          }
+        </span>
+      </div>
+    </ng-template>
+
+    <ng-template ng-label-tmp let-item="item" let-clear="clear" let-label="label">
+      <span class="inline-flex min-w-0 items-center gap-1">
+        @if (getSelectionPrefixText(item)) {
+          <span class="shrink-0 text-primary">
+            {{ getSelectionPrefixText(item) }}
+          </span>
+        }
+
+        <span class="truncate">
+          {{ getSelectionDisplayLabel(item, label) }}
+        </span>
+
+        @if (isMultiple() && clearable() && !resolvedReadonly()) {
+          <button
+            type="button"
+            class="ms-1 inline-flex text-white/80 hover:text-white"
+            aria-label="Remove selected option"
+            (click)="clear(item)"
+          >
+            <i class="ri-close-line leading-none"></i>
+          </button>
+        }
+      </span>
+    </ng-template>
+
+    @if (isMultiple()) {
+      <ng-template ng-multi-label-tmp let-items="items" let-clear="clear">
+        <div class="flex min-w-0 items-center gap-1">
+          @if (items.length > 0) {
+            <span class="inline-flex max-w-full items-center gap-1 rounded-sm bg-primary px-2 py-0.5 text-[0.75rem] text-white">
+              <span class="truncate">
+                {{ getMultiLabelText(items) }}
+              </span>
+
+              @if (clearable() && !resolvedReadonly()) {
+                <button
+                  type="button"
+                  class="inline-flex text-white/80 hover:text-white"
+                  aria-label="Remove selected option"
+                  (click)="clear(items[0])"
+                >
+                  <i class="ri-close-line leading-none"></i>
+                </button>
+              }
+            </span>
+          }
+        </div>
+      </ng-template>
+    }
+
+    @if (isMultiple() && showMultiSelectFooter()) {
+      <ng-template ng-footer-tmp>
+        <div class="flex items-center justify-between gap-2 border-t border-defaultborder px-3 py-2 dark:border-defaultborder/10">
+          <span class="text-[0.75rem] text-textmuted">
+            {{ pendingValue().length }} selected
+          </span>
+
+          <span class="inline-flex items-center gap-2">
+            <button
+              type="button"
+              class="ti-btn ti-btn-light !px-3 !py-1.5 !text-[0.75rem]"
+              (click)="cancelSelection(select)"
+            >
+              {{ cancelLabel() }}
+            </button>
+
+            <button
+              type="button"
+              class="ti-btn ti-btn-primary-full !px-3 !py-1.5 !text-[0.75rem]"
+              (click)="confirmSelection(select)"
+            >
+              {{ confirmLabel() }}
+            </button>
+          </span>
+        </div>
+      </ng-template>
+    }
+  </ng-select>
+</app-form-field>
diff --git a/src/app/shared/components/form/form-select/form-select.scss b/src/app/shared/components/form/form-select/form-select.scss
new file mode 100644
index 00000000..e8532903
--- /dev/null
+++ b/src/app/shared/components/form/form-select/form-select.scss
@@ -0,0 +1,35 @@
+:host {
+  display: block;
+  width: 100%;
+  min-width: 0;
+}
+
+:host ::ng-deep .form-select-floating .floating-label .ng-select-container {
+  min-height: 2.5rem;
+  border: 1px solid var(--color-inputborder);
+  border-radius: 0.5rem;
+  background-color: var(--color-white);
+  color: var(--color-defaulttextcolor);
+  font-size: 0.8125rem;
+  box-shadow: none;
+}
+
+:host ::ng-deep .form-select-floating .floating-label > label {
+  padding-inline: 0.25rem;
+  background-color: var(--color-white) !important;
+  font-size: 0.75rem !important;
+}
+
+:host ::ng-deep .form-select-floating .floating-label--float .ng-select-container,
+:host ::ng-deep .form-select-floating .floating-label:focus-within .ng-select-container {
+  border-color: var(--color-primary);
+}
+
+:host ::ng-deep .form-select-floating .floating-label--invalid .ng-select-container {
+  border-color: var(--color-danger);
+}
+
+:host-context(.dark) ::ng-deep .form-select-floating .ng-select-container,
+:host-context(.dark) ::ng-deep .form-select-floating .floating-label > label {
+  background-color: var(--color-bodybg) !important;
+}
diff --git a/src/app/shared/components/form/form-select/form-select.ts b/src/app/shared/components/form/form-select/form-select.ts
new file mode 100644
index 00000000..641af404
--- /dev/null
+++ b/src/app/shared/components/form/form-select/form-select.ts
@@ -0,0 +1,739 @@
+import {
+  ChangeDetectionStrategy,
+  Component,
+  Injector,
+  computed,
+  forwardRef,
+  inject,
+  input,
+  output,
+  signal
+} from '@angular/core';
+import { AbstractControl, ControlValueAccessor, FormsModule, NG_VALUE_ACCESSOR, NgControl } from '@angular/forms';
+import {
+  NgFooterTemplateDirective,
+  NgHeaderTemplateDirective,
+  NgLabelTemplateDirective,
+  NgMultiLabelTemplateDirective,
+  NgOptionTemplateDirective,
+  NgSelectComponent
+} from '@ng-select/ng-select';
+
+import { FormField, FormLabelPosition } from '../form-field/form-field';
+import { ValidationMessageMap } from '../form-validation-message/form-validation-message';
+import {
+  FormSelectDropdownPosition,
+  FormSelectMode,
+  FormSelectOption,
+  FormSelectPrimitive,
+  FormSelectScrollEvent,
+  FormSelectSearchEvent,
+  FormSelectSearchMode,
+  FormSelectValue
+} from '../models/form-select.models';
+
+@Component({
+  selector: 'app-form-select',
+  standalone: true,
+  imports: [
+    FormsModule,
+    FormField,
+    NgFooterTemplateDirective,
+    NgHeaderTemplateDirective,
+    NgLabelTemplateDirective,
+    NgMultiLabelTemplateDirective,
+    NgOptionTemplateDirective,
+    NgSelectComponent
+  ],
+  templateUrl: './form-select.html',
+  styleUrl: './form-select.scss',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  providers: [
+    {
+      provide: NG_VALUE_ACCESSOR,
+      useExisting: forwardRef(() => FormSelect),
+      multi: true
+    }
+  ]
+})
+export class FormSelect<TValue extends FormSelectPrimitive = string> implements ControlValueAccessor {
+  private static nextId = 0;
+
+  private readonly injector = inject(Injector);
+
+  private readonly generatedInputId = `form-select-${FormSelect.nextId++}`;
+
+  readonly inputId = input<string | null>(null);
+
+  readonly label = input('');
+  readonly variant = input<'default' | 'floating'>('default');
+
+  readonly name = input<string | null>(null);
+
+  readonly options = input<readonly FormSelectOption<TValue>[]>([]);
+
+  readonly mode = input<FormSelectMode>('single');
+
+  readonly searchable = input(true);
+
+  readonly searchMode = input<FormSelectSearchMode>('client');
+
+  readonly editableSearchTerm = input<boolean | null>(null);
+
+  readonly clearable = input(true);
+
+  readonly hideSelected = input(false);
+
+  readonly closeOnSelect = input<boolean | null>(null);
+
+  readonly maxSelectedItems = input<number | null>(null);
+
+  readonly placeholder = input('');
+
+  readonly required = input(false);
+
+  readonly disabled = input(false);
+
+  readonly readonly = input(false);
+
+  readonly loading = input(false);
+
+  readonly loadingText = input('Loading...');
+
+  readonly notFoundText = input('No options found');
+
+  readonly typeToSearchText = input('Type to search');
+
+  readonly clearAllText = input('Clear all');
+
+  readonly appendTo = input('');
+
+  readonly dropdownPosition = input<FormSelectDropdownPosition>('auto');
+
+  readonly virtualScroll = input(false);
+
+  readonly bufferAmount = input(4);
+
+  readonly groupBy = input('');
+
+  readonly selectableGroup = input(false);
+
+  readonly selectableGroupAsModel = input(false);
+
+  readonly selectOnTab = input(true);
+
+  readonly clearOnBackspace = input(true);
+
+  readonly showCheckboxes = input(true);
+
+  readonly showSelectAll = input(true);
+
+  readonly showMultiSelectFooter = input(false);
+
+  readonly confirmLabel = input('OK');
+
+  readonly cancelLabel = input('Cancel');
+
+  readonly selectAllLabel = input('Select All');
+
+  readonly hideValidation = input(false);
+
+  readonly showValidationWhenDirty = input(false);
+
+  readonly submitAttempted = input(false);
+
+  readonly validationMessages = input<ValidationMessageMap>({});
+
+  readonly description = input<string | null>(null);
+
+  readonly hint = input<string | null>(null);
+
+  readonly labelPosition = input<FormLabelPosition>('top');
+
+  readonly hideLabel = input(false);
+
+  readonly wrapperClass = input('');
+
+  readonly labelClass = input('');
+
+  readonly fieldContentClass = input('');
+
+  readonly selectClass = input('');
+
+  readonly ariaLabel = input<string | null>(null);
+
+  readonly ariaDescription = input<string | null>(null);
+
+  readonly selectionChanged = output<FormSelectValue<TValue>>();
+
+  readonly searchChanged = output<FormSelectSearchEvent>();
+
+  readonly opened = output<void>();
+
+  readonly closed = output<void>();
+
+  readonly cleared = output<void>();
+
+  readonly focused = output<void>();
+
+  readonly blurred = output<void>();
+
+  readonly scrolled = output<FormSelectScrollEvent>();
+
+  readonly scrolledToEnd = output<void>();
+
+  readonly value = signal<FormSelectValue<TValue>>(null);
+
+  readonly pendingValue = signal<readonly TValue[]>([]);
+
+  readonly formDisabled = signal(false);
+
+  readonly dropdownOpen = signal(false);
+
+  readonly searchTerm = signal('');
+  readonly hasFocus = signal(false);
+
+  private onChange: (value: FormSelectValue<TValue>) => void = () => {};
+
+  private onTouched: () => void = () => {};
+
+  readonly control = computed<AbstractControl | null>(() => {
+    return this.injector.get(NgControl, null, {
+      self: true,
+      optional: true
+    })?.control ?? null;
+  });
+
+  readonly resolvedInputId = computed(() =>
+    this.inputId()?.trim() || this.generatedInputId
+  );
+
+  readonly resolvedName = computed(() =>
+    this.name()?.trim() || this.resolvedInputId()
+  );
+
+  readonly isMultiple = computed(() => this.mode() === 'multiple');
+
+  readonly isDisabled = computed(() =>
+    this.disabled() ||
+    this.formDisabled() ||
+    this.loading()
+  );
+
+  readonly isFloating = computed(() => this.variant() === 'floating');
+
+  readonly hasValue = computed(() => {
+    const currentValue = this.value();
+    return Array.isArray(currentValue) ? currentValue.length > 0 : currentValue !== null && currentValue !== '';
+  });
+
+  readonly shouldFloat = computed(() => this.hasFocus() || this.dropdownOpen() || this.hasValue());
+
+  readonly resolvedReadonly = computed(() =>
+    this.readonly() ||
+    this.isDisabled()
+  );
+
+  readonly resolvedCloseOnSelect = computed(() =>
+    this.closeOnSelect() ?? !this.isMultiple()
+  );
+
+  readonly resolvedEditableSearchTerm = computed(() =>
+    this.editableSearchTerm() ?? false
+  );
+
+  readonly resolvedOptions = computed<readonly FormSelectOption<TValue>[]>(() => {
+    const options = this.options();
+    const term = this.searchTerm().trim().toLocaleLowerCase();
+
+    if (
+      !this.searchable() ||
+      this.searchMode() === 'server' ||
+      !term
+    ) {
+      return options;
+    }
+
+    return options.filter(option =>
+      this.optionMatchesSearchTerm(option, term)
+    );
+  });
+
+  readonly selectItems = computed<readonly FormSelectOption<TValue>[]>(() => {
+    const selected = new Set(this.activeSelectedValues());
+    const selectedOptions = this.options()
+      .filter(option => selected.has(option.value));
+    const optionValues = new Set(selectedOptions.map(option => option.value));
+    const visibleOptions = this.resolvedOptions()
+      .filter(option => !optionValues.has(option.value));
+
+    return [
+      ...selectedOptions,
+      ...visibleOptions
+    ];
+  });
+
+  readonly showDropdownHeader = computed(() =>
+    this.searchable() ||
+    (
+      this.isMultiple() &&
+      this.showSelectAll()
+    )
+  );
+
+  readonly selectedValues = computed<readonly TValue[]>(() => {
+    const currentValue = this.value();
+
+    return Array.isArray(currentValue)
+      ? currentValue
+      : [];
+  });
+
+  readonly modelValue = computed<FormSelectValue<TValue>>(() => {
+    if (
+      this.isMultiple() &&
+      this.showMultiSelectFooter() &&
+      this.dropdownOpen()
+    ) {
+      return this.pendingValue();
+    }
+
+    return this.value();
+  });
+
+  readonly allEnabledValues = computed<readonly TValue[]>(() =>
+    this.options()
+      .filter(option => !option.disabled)
+      .map(option => option.value)
+  );
+
+  readonly allSelected = computed(() => {
+    const selected = new Set(
+      this.showMultiSelectFooter()
+        ? this.pendingValue()
+        : this.selectedValues()
+    );
+
+    const enabledValues = this.allEnabledValues();
+
+    return (
+      enabledValues.length > 0 &&
+      enabledValues.every(value => selected.has(value))
+    );
+  });
+
+  readonly partiallySelected = computed(() => {
+    const selected = new Set(
+      this.showMultiSelectFooter()
+        ? this.pendingValue()
+        : this.selectedValues()
+    );
+
+    const selectedCount = this.allEnabledValues()
+      .filter(value => selected.has(value))
+      .length;
+
+    return (
+      selectedCount > 0 &&
+      selectedCount < this.allEnabledValues().length
+    );
+  });
+
+  readonly selectedCount = computed(() =>
+    this.selectedValues().length
+  );
+
+  readonly resolvedPlaceholder = computed(() =>
+    this.placeholder().trim() ||
+    (
+      this.label().trim()
+        ? `Select ${this.label().trim()}`
+        : 'Select'
+    )
+  );
+
+  readonly resolvedSearchPlaceholder = computed(() =>
+    this.placeholder().trim() ||
+    (
+      this.label().trim()
+        ? `Search ${this.label().trim()}`
+        : 'Search'
+    )
+  );
+
+  
+
+  readonly describedBy = computed(() => {
+    const ids: string[] = [];
+    const control = this.control();
+
+    if (this.description()) {
+      ids.push(`${this.resolvedInputId()}-description`);
+    }
+
+    if (this.hint()) {
+      ids.push(`${this.resolvedInputId()}-hint`);
+    }
+
+    if (
+      control?.invalid &&
+      (
+        this.submitAttempted() ||
+        (this.showValidationWhenDirty() && control.dirty)
+      )
+    ) {
+      ids.push(`${this.resolvedInputId()}-validation`);
+    }
+
+    return ids.length ? ids.join(' ') : null;
+  });
+
+  readonly inputAttrs = computed<Record<string, string>>(() => {
+    const attrs: Record<string, string> = {
+      name: this.resolvedName(),
+      'data-form-control': ''
+    };
+
+    const describedBy = this.describedBy();
+    const ariaDescription = this.ariaDescription();
+
+    if (describedBy) {
+      attrs['aria-describedby'] = describedBy;
+    }
+
+    if (ariaDescription) {
+      attrs['aria-description'] = ariaDescription;
+    }
+
+    if (this.required()) {
+      attrs['aria-required'] = 'true';
+    }
+
+    if (this.control()?.invalid && this.submitAttempted()) {
+      attrs['aria-invalid'] = 'true';
+    }
+
+    return attrs;
+  });
+
+  readonly resolvedSelectClass = computed(() => {
+    const control = this.control();
+    const showInvalidState = !!(
+      control?.invalid &&
+      (
+        this.submitAttempted() ||
+        (this.showValidationWhenDirty() && control.dirty)
+      )
+    );
+
+    return [
+      'ti-form-select',
+      'rounded-sm',
+      'border-defaultborder',
+      'text-defaulttextcolor',
+      'dark:border-defaultborder/10',
+      'dark:text-white/70',
+      'w-full',
+      'app-form-select-control',
+      showInvalidState ? 'is-invalid' : '',
+      this.isDisabled() ? 'opacity-60 pointer-events-none' : '',
+      this.selectClass()
+    ]
+      .filter(Boolean)
+      .join(' ');
+  });
+
+  writeValue(value: FormSelectValue<TValue>): void {
+    this.value.set(this.normalizeValue(value));
+  }
+
+  registerOnChange(fn: (value: FormSelectValue<TValue>) => void): void {
+    this.onChange = fn;
+  }
+
+  registerOnTouched(fn: () => void): void {
+    this.onTouched = fn;
+  }
+
+  setDisabledState(disabled: boolean): void {
+    this.formDisabled.set(disabled);
+  }
+
+  onValueChange(incomingValue: FormSelectValue<TValue>): void {
+    const normalizedValue = this.normalizeValue(incomingValue);
+
+    if (
+      this.isMultiple() &&
+      this.showMultiSelectFooter() &&
+      this.dropdownOpen()
+    ) {
+      this.pendingValue.set(
+        Array.isArray(normalizedValue)
+          ? normalizedValue
+          : []
+      );
+
+      return;
+    }
+
+    this.commitValue(normalizedValue);
+  }
+
+  onSearchInput(event: Event): void {
+    const inputElement = event.target instanceof HTMLInputElement
+      ? event.target
+      : null;
+    const term = inputElement?.value ?? '';
+
+    this.searchTerm.set(term);
+    this.searchChanged.emit({
+      term: term.trim()
+    });
+  }
+
+  toggleSelectAll(): void {
+    if (!this.isMultiple() || this.isDisabled()) {
+      return;
+    }
+
+    const nextValue = this.allSelected()
+      ? []
+      : [...this.allEnabledValues()];
+
+    if (
+      this.showMultiSelectFooter() &&
+      this.dropdownOpen()
+    ) {
+      this.pendingValue.set(nextValue);
+      return;
+    }
+
+    this.commitValue(nextValue);
+  }
+
+  onOpen(): void {
+    this.dropdownOpen.set(true);
+    this.searchTerm.set('');
+
+    if (
+      this.isMultiple() &&
+      this.showMultiSelectFooter()
+    ) {
+      this.pendingValue.set([
+        ...this.selectedValues()
+      ]);
+    }
+
+    this.opened.emit();
+  }
+
+  onClose(): void {
+    this.dropdownOpen.set(false);
+    this.searchTerm.set('');
+    this.onTouched();
+    this.closed.emit();
+  }
+
+  onFocus(): void {
+    this.hasFocus.set(true);
+    this.focused.emit();
+  }
+
+  onBlur(): void {
+    this.hasFocus.set(false);
+    this.onTouched();
+    this.blurred.emit();
+  }
+
+  onClear(): void {
+    this.searchTerm.set('');
+    this.cleared.emit();
+  }
+
+  onScroll(event: FormSelectScrollEvent): void {
+    this.scrolled.emit(event);
+  }
+
+  onScrollToEnd(): void {
+    this.scrolledToEnd.emit();
+  }
+
+  confirmSelection(select: NgSelectComponent): void {
+    if (!this.isMultiple()) {
+      return;
+    }
+
+    this.commitValue([
+      ...this.pendingValue()
+    ]);
+
+    select.close();
+  }
+
+  cancelSelection(select: NgSelectComponent): void {
+    this.pendingValue.set([
+      ...this.selectedValues()
+    ]);
+
+    select.close();
+  }
+
+  isOptionSelected(option: FormSelectOption<TValue>): boolean {
+    const value = option.value;
+    const source = this.activeSelectedValues();
+
+    return source.includes(value);
+  }
+
+  getMultiLabelText(items: readonly FormSelectOption<TValue>[]): string {
+    const firstLabel = items[0]?.label ?? '';
+    const remainingCount = items.length - 1;
+
+    return remainingCount > 0
+      ? `${firstLabel} +${remainingCount}`
+      : firstLabel;
+  }
+
+  trackOption(option: FormSelectOption<TValue>): TValue {
+    return option.value;
+  }
+
+  getOptionContainerClass(option: FormSelectOption<TValue>): string {
+    return [
+      'flex min-w-0 w-full items-start gap-2 text-inherit',
+      option.disabled ? 'text-textmuted opacity-60' : '',
+      this.isOptionSelected(option) && !option.disabled ? 'text-white' : ''
+    ]
+      .filter(Boolean)
+      .join(' ');
+  }
+
+  getOptionLabelClass(option: FormSelectOption<TValue>): string {
+    return [
+      'block truncate text-inherit',
+      option.disabled ? 'text-textmuted' : ''
+    ]
+      .filter(Boolean)
+      .join(' ');
+  }
+
+  getOptionDisplayLabel(
+    option: FormSelectOption<TValue>,
+    resolvedLabel: string | null | undefined
+  ): string {
+    return this.cleanText(option.label) || this.cleanText(resolvedLabel);
+  }
+
+  getSelectionPrefixText(item: FormSelectOption<TValue> | TValue): string {
+    return this.isOption(item)
+      ? item.prefixText?.trim() ?? ''
+      : '';
+  }
+
+  getSelectionDisplayLabel(
+    item: FormSelectOption<TValue> | TValue,
+    resolvedLabel: string | null | undefined
+  ): string {
+    if (this.isOption(item)) {
+      return this.cleanText(item.label) || this.cleanText(resolvedLabel);
+    }
+
+    return this.cleanText(resolvedLabel) || this.findOptionLabel(item);
+  }
+
+  getOptionPrefixClass(option: FormSelectOption<TValue>): string {
+    return [
+      'shrink-0 rounded-sm px-1.5 py-0.5 text-[0.6875rem] font-medium',
+      option.disabled
+        ? 'bg-light text-textmuted dark:bg-black/20'
+        : 'bg-light text-primary dark:bg-black/20'
+    ]
+      .filter(Boolean)
+      .join(' ');
+  }
+
+  private commitValue(value: FormSelectValue<TValue>): void {
+    this.value.set(value);
+    this.onChange(value);
+    this.selectionChanged.emit(value);
+  }
+
+  private activeSelectedValues(): readonly TValue[] {
+    if (
+      this.isMultiple() &&
+      this.showMultiSelectFooter() &&
+      this.dropdownOpen()
+    ) {
+      return this.pendingValue();
+    }
+
+    const currentValue = this.value();
+
+    if (this.isValueArray(currentValue)) {
+      return currentValue;
+    }
+
+    return currentValue === null
+      ? []
+      : [currentValue];
+  }
+
+  private normalizeValue(value: FormSelectValue<TValue>): FormSelectValue<TValue> {
+    if (this.isMultiple()) {
+      return this.isValueArray(value)
+        ? value.filter(item => !this.isEmptyStringValue(item))
+        : [];
+    }
+
+    return this.isValueArray(value)
+      ? this.normalizeSingleValue(value[0] ?? null)
+      : this.normalizeSingleValue(value);
+  }
+
+  private normalizeSingleValue(value: TValue | null): TValue | null {
+    return this.isEmptyStringValue(value)
+      ? null
+      : value ?? null;
+  }
+
+  private isValueArray(value: FormSelectValue<TValue>): value is readonly TValue[] {
+    return Array.isArray(value);
+  }
+
+  private isEmptyStringValue(value: TValue | null): boolean {
+    return typeof value === 'string' && value.trim() === '';
+  }
+
+  private isOption(value: FormSelectOption<TValue> | TValue): value is FormSelectOption<TValue> {
+    return (
+      typeof value === 'object' &&
+      value !== null &&
+      'value' in value &&
+      'label' in value
+    );
+  }
+
+  private findOptionLabel(value: TValue): string {
+    return this.options()
+      .find(option => option.value === value)
+      ?.label
+      ?.trim() ?? '';
+  }
+
+  private optionMatchesSearchTerm(
+    option: FormSelectOption<TValue>,
+    term: string
+  ): boolean {
+    return [
+      option.label,
+      option.prefixText ?? '',
+      option.description ?? ''
+    ].some(value =>
+      this.cleanText(value).toLocaleLowerCase().includes(term)
+    );
+  }
+
+  private cleanText(value: string | null | undefined): string {
+    return value?.trim() ?? '';
+  }
+}
diff --git a/src/app/shared/components/form/form-textarea/form-textarea.html b/src/app/shared/components/form/form-textarea/form-textarea.html
new file mode 100644
index 00000000..1c38d096
--- /dev/null
+++ b/src/app/shared/components/form/form-textarea/form-textarea.html
@@ -0,0 +1 @@
+<p>form-textarea works!</p>
diff --git a/src/app/shared/components/form/form-textarea/form-textarea.scss b/src/app/shared/components/form/form-textarea/form-textarea.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/src/app/shared/components/form/form-textarea/form-textarea.ts b/src/app/shared/components/form/form-textarea/form-textarea.ts
new file mode 100644
index 00000000..4b87d7cf
--- /dev/null
+++ b/src/app/shared/components/form/form-textarea/form-textarea.ts
@@ -0,0 +1,11 @@
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'form-textarea',
+  imports: [],
+  templateUrl: './form-textarea.html',
+  styleUrl: './form-textarea.scss',
+})
+export class FormTextarea {
+
+}
diff --git a/src/app/shared/components/form/form-validation-message/form-validation-message.html b/src/app/shared/components/form/form-validation-message/form-validation-message.html
new file mode 100644
index 00000000..eec0bb7e
--- /dev/null
+++ b/src/app/shared/components/form/form-validation-message/form-validation-message.html
@@ -0,0 +1,14 @@
+@if (shouldShow() && message()) {
+  <p
+    [class]="customClass()"
+    role="alert"
+    aria-live="polite"
+  >
+    <i
+      class="ri-error-warning-line me-1 align-middle"
+      aria-hidden="true"
+    ></i>
+
+    {{ message() }}
+  </p>
+}
\ No newline at end of file
diff --git a/src/app/shared/components/form/form-validation-message/form-validation-message.scss b/src/app/shared/components/form/form-validation-message/form-validation-message.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/src/app/shared/components/form/form-validation-message/form-validation-message.ts b/src/app/shared/components/form/form-validation-message/form-validation-message.ts
new file mode 100644
index 00000000..804d5e92
--- /dev/null
+++ b/src/app/shared/components/form/form-validation-message/form-validation-message.ts
@@ -0,0 +1,167 @@
+import {
+  ChangeDetectionStrategy,
+  Component,
+  computed,
+  effect,
+  input,
+  signal
+} from '@angular/core';
+import { AbstractControl } from '@angular/forms';
+
+export type ValidationMessageMap = Partial<Record<string, string>>;
+
+@Component({
+  selector: 'app-form-validation-message',
+  standalone: true,
+  templateUrl: './form-validation-message.html',
+  changeDetection: ChangeDetectionStrategy.OnPush
+})
+export class FormValidationMessage {
+  readonly control = input<AbstractControl | null>(null);
+
+  readonly fieldName = input('Field');
+
+  readonly messages = input<ValidationMessageMap>({});
+
+  readonly showWhenDirty = input(false);
+
+  readonly submitAttempted = input(false);
+
+  readonly customClass = input(
+    'mt-1 text-[0.75rem] text-danger'
+  );
+
+  private readonly controlStateVersion = signal(0);
+
+  constructor() {
+    effect((onCleanup) => {
+      const control = this.control();
+
+      if (!control) {
+        return;
+      }
+
+      const statusSubscription = control.statusChanges.subscribe(() => {
+        this.controlStateVersion.update(value => value + 1);
+      });
+
+      const valueSubscription = control.valueChanges.subscribe(() => {
+        this.controlStateVersion.update(value => value + 1);
+      });
+
+      const eventsSubscription = control.events?.subscribe(() => {
+        this.controlStateVersion.update(value => value + 1);
+      });
+
+      onCleanup(() => {
+        statusSubscription.unsubscribe();
+        valueSubscription.unsubscribe();
+        eventsSubscription?.unsubscribe();
+      });
+    });
+  }
+
+  readonly shouldShow = computed(() => {
+    this.controlStateVersion();
+
+    const control = this.control();
+
+    if (!control || !control.invalid) {
+      return false;
+    }
+
+    return (
+      this.submitAttempted() ||
+      (this.showWhenDirty() && control.dirty)
+    );
+  });
+
+  readonly message = computed(() => {
+    this.controlStateVersion();
+    this.submitAttempted();
+
+    const control = this.control();
+
+    if (!control?.errors) {
+      return '';
+    }
+
+    const errorKey = Object.keys(control.errors)[0];
+
+    if (!errorKey) {
+      return '';
+    }
+
+    const customMessage = this.messages()[errorKey];
+
+    if (customMessage) {
+      return customMessage;
+    }
+
+    return this.resolveDefaultMessage(
+      errorKey,
+      control.errors[errorKey]
+    );
+  });
+
+  private resolveDefaultMessage(
+    errorKey: string,
+    errorValue: unknown
+  ): string {
+    const fieldName = this.fieldName();
+
+    switch (errorKey) {
+      case 'required':
+        return `${fieldName} is required.`;
+
+      case 'email':
+        return `Enter a valid ${fieldName.toLowerCase()}.`;
+
+      case 'minlength': {
+        const error = errorValue as {
+          requiredLength?: number;
+          actualLength?: number;
+        };
+
+        return `${fieldName} must be at least ${
+          error.requiredLength ?? 0
+        } characters.`;
+      }
+
+      case 'maxlength': {
+        const error = errorValue as {
+          requiredLength?: number;
+          actualLength?: number;
+        };
+
+        return `${fieldName} cannot exceed ${
+          error.requiredLength ?? 0
+        } characters.`;
+      }
+
+      case 'min': {
+        const error = errorValue as {
+          min?: number;
+          actual?: number;
+        };
+
+        return `${fieldName} must be at least ${error.min}.`;
+      }
+
+      case 'max': {
+        const error = errorValue as {
+          max?: number;
+          actual?: number;
+        };
+
+        return `${fieldName} cannot exceed ${error.max}.`;
+      }
+
+      case 'pattern':
+        return `Enter a valid ${fieldName.toLowerCase()}.`;
+
+      default:
+        return `${fieldName} is invalid.`;
+    }
+  }
+}
diff --git a/src/app/shared/components/form/models/form-select.models.ts b/src/app/shared/components/form/models/form-select.models.ts
new file mode 100644
index 00000000..8506d088
--- /dev/null
+++ b/src/app/shared/components/form/models/form-select.models.ts
@@ -0,0 +1,37 @@
+export type FormSelectPrimitive = string | number;
+
+export type FormSelectMode = 'single' | 'multiple';
+
+export type FormSelectSearchMode = 'client' | 'server';
+
+export type FormSelectDropdownPosition =
+  | 'auto'
+  | 'bottom'
+  | 'top'
+  | 'left'
+  | 'right';
+
+export type FormSelectValue<
+  TValue extends FormSelectPrimitive = FormSelectPrimitive
+> = TValue | readonly TValue[] | null;
+
+export interface FormSelectOption<
+  TValue extends FormSelectPrimitive = FormSelectPrimitive
+> {
+  readonly value: TValue;
+  readonly label: string;
+  readonly prefixText?: string | null;
+  readonly description?: string | null;
+  readonly group?: string | null;
+  readonly disabled?: boolean;
+  readonly metadata?: Readonly<Record<string, unknown>>;
+}
+
+export interface FormSelectSearchEvent {
+  readonly term: string;
+}
+
+export interface FormSelectScrollEvent {
+  readonly start: number;
+  readonly end: number;
+}
diff --git a/src/app/shared/components/modal/modal.html b/src/app/shared/components/modal/modal.html
new file mode 100644
index 00000000..5fdd66da
--- /dev/null
+++ b/src/app/shared/components/modal/modal.html
@@ -0,0 +1,176 @@
+<!-- @if (open()) {
+<div
+  class="hs-overlay open hs-overlay-backdrop-open:!bg-[#32325180] dark:hs-overlay-backdrop-open:!bg-[#323251cc] ti-modal pointer-events-none"
+  (mousedown)="onBackdropClick($event)">
+  <div class="fixed inset-0 pointer-events-auto bg-[#32325180] dark:bg-[#323251cc]" aria-hidden="true"
+    (mousedown)="onBackdropClick($event)"></div>
+
+  <div [class]="modalBoxClass()" role="dialog" aria-modal="true" [attr.aria-label]="title()" tabindex="-1"
+    (mousedown)="$event.stopPropagation()">
+    <div class="ti-modal-content border-defaultborder dark:border-defaultborder max-h-[90vh] overflow-hidden">
+      @if (showHeader()) {
+      <div class="ti-modal-header border-defaultborder dark:border-defaultborder">
+        <div class="min-w-0">
+          <h6 class="ti-modal-title m-0">
+            {{ title() }}
+          </h6>
+        </div>
+
+        @if (showCloseButton()) {
+        <button type="button" class="ti-modal-close-btn cursor-pointer disabled:cursor-not-allowed disabled:opacity-50"
+          aria-label="Close modal" [disabled]="loading()" (click)="close()">
+          <i class="ri-close-line leading-none"></i>
+        </button>
+        }
+      </div>
+      }
+
+      <div class="ti-modal-body px-4 min-h-0 overflow-y-auto">
+        @if (subtitle()) {
+        <p class="mb-4 text-[0.8125rem] leading-5 text-textmuted">
+          {{ subtitle() }}
+        </p>
+        }
+
+        <ng-content />
+      </div>
+
+      @if (showFooter()) {
+      <div class="ti-modal-footer border-defaultborder dark:border-defaultborder">
+        @if (showCancelButton()) {
+        <app-button action="cancel" [label]="cancelLabel()" [showIcon]="true" [disabled]="loading()"
+          (buttonClicked)="close()" />
+        }
+
+        @if (showSubmitButton()) {
+        <app-button [action]="submitAction()" [label]="submitLabel()" [loadingLabel]="loadingLabel()" [showIcon]="true"
+          [loading]="loading()" [disabled]="submitDisabled()" (buttonClicked)="submit()" />
+        }
+      </div>
+      }
+    </div>
+  </div>
+</div>
+} -->
+
+@if (open()) {
+<div
+  class="hs-overlay modal-overlay"
+  (mousedown)="onBackdropClick($event)">
+
+  <!-- Backdrop -->
+  <div
+    class="modal-backdrop"
+    aria-hidden="true"
+    (mousedown)="onBackdropClick($event)">
+  </div>
+
+  <!-- Modal -->
+  <div
+    [class]="modalBoxClass() + ' modern-modal-wrapper'"
+    role="dialog"
+    aria-modal="true"
+    [attr.aria-label]="title()"
+    tabindex="-1"
+    (mousedown)="$event.stopPropagation()">
+
+    <div class="modern-modal">
+
+      @if (showHeader()) {
+      <div class="modern-modal-header">
+
+        <!-- Decorative Background -->
+        <div class="modal-header-bg"></div>
+
+        <div class="modal-header-content">
+
+          <div class="modal-header-left">
+
+            <!-- Header Icon -->
+            <!-- <div class="modal-icon">
+
+              <div class="modal-icon-inner">
+                <i class="ri-layout-grid-fill"></i>
+              </div>
+
+            </div> -->
+
+            <!-- Title -->
+            <div class="modal-title-wrapper">
+
+              <h6 class="modern-modal-title">
+                {{ title() }}
+              </h6>
+
+              @if (subtitle()) {
+              <p class="modern-modal-subtitle">
+                {{ subtitle() }}
+              </p>
+              }
+
+            </div>
+
+          </div>
+
+          @if (showCloseButton()) {
+          <button
+            type="button"
+            class="modern-close-btn"
+            aria-label="Close modal"
+            [disabled]="loading()"
+            (click)="close()">
+
+            <i class="ri-close-line"></i>
+
+          </button>
+          }
+
+        </div>
+
+      </div>
+      }
+
+      <!-- Body -->
+      <div class="modern-modal-body">
+
+        <div class="modal-content-wrapper">
+
+          <ng-content />
+
+        </div>
+
+      </div>
+
+      <!-- Footer -->
+      @if (showFooter()) {
+      <div class="modern-modal-footer">
+
+        @if (showCancelButton()) {
+        <app-button
+          action="cancel"
+          [label]="cancelLabel()"
+          [showIcon]="true"
+          [disabled]="loading()"
+          (buttonClicked)="close()" />
+        }
+
+        @if (showSubmitButton()) {
+        <app-button
+          [action]="submitAction()"
+          [label]="submitLabel()"
+          [loadingLabel]="loadingLabel()"
+          [showIcon]="true"
+          [loading]="loading()"
+          [disabled]="submitDisabled()"
+          (buttonClicked)="submit()" />
+        }
+
+      </div>
+      }
+
+    </div>
+
+  </div>
+
+</div>
+}
\ No newline at end of file
diff --git a/src/app/shared/components/modal/modal.scss b/src/app/shared/components/modal/modal.scss
new file mode 100644
index 00000000..c251a389
--- /dev/null
+++ b/src/app/shared/components/modal/modal.scss
@@ -0,0 +1,750 @@
+// :host {
+//   display: contents;
+// }
+
+// :host(.modern-modal) .ti-modal-content {
+//   border-radius: 1rem !important;
+//   box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25) !important;
+//   border-color: var(--color-defaultborder) !important;
+
+//   &:where(.dark, .dark *) {
+//     box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5) !important;
+//   }
+// }
+
+// :host(.modern-modal) .ti-modal-header {
+//   padding-inline: 1.5rem !important;
+//   padding-block: 1.25rem !important;
+//   border-color: var(--color-defaultborder) !important;
+// }
+
+// :host(.modern-modal) .ti-modal-title {
+//   font-size: 1.125rem !important;
+//   font-weight: 600 !important;
+//   color: var(--color-gray-800) !important;
+
+//   &:where(.dark, .dark *) {
+//     color: var(--color-white) !important;
+//   }
+// }
+
+// :host(.modern-modal) .ti-modal-close-btn {
+//   border-radius: 0.5rem !important;
+//   color: var(--color-gray-500) !important;
+//   transition: all 0.2s ease !important;
+
+//   &:hover {
+//     color: var(--color-primary) !important;
+//     background-color: color-mix(in srgb, var(--color-primary) 10%, transparent) !important;
+//   }
+// }
+
+// :host(.modern-modal) .ti-modal-body {
+//   padding: 1.5rem !important;
+// }
+
+// :host(.modern-modal) .ti-modal-footer {
+//   padding-inline: 1.5rem !important;
+//   padding-block: 1rem !important;
+//   gap: 0.75rem !important;
+//   border-color: var(--color-defaultborder) !important;
+// }
+
+
+/* ==========================================================
+   Overlay
+========================================================== */
+
+.modal-overlay {
+  position: fixed;
+  inset: 0;
+  z-index: 9999;
+
+  display: flex;
+  justify-content: center;
+  align-items: center;
+
+  padding: 1.5rem;
+
+  animation: modalFade .22s ease;
+}
+
+/* ==========================================================
+   Backdrop
+========================================================== */
+
+.modal-backdrop {
+  position: absolute;
+  inset: 0;
+
+  background: rgba(15, 23, 42, .42);
+
+  backdrop-filter: blur(1px);
+  -webkit-backdrop-filter: blur(1px);
+}
+
+/* ==========================================================
+   Wrapper
+========================================================== */
+
+.modern-modal-wrapper {
+
+  position: relative;
+
+  width: 100%;
+
+  display: flex;
+  justify-content: center;
+  align-items: center;
+
+  pointer-events: auto;
+
+  animation: modalSlide .28s ease;
+}
+
+/* ==========================================================
+   Modal
+========================================================== */
+
+.modern-modal {
+
+  position: relative;
+
+  display: flex;
+  flex-direction: column;
+
+  width: 100%;
+  max-height: 90vh;
+
+  overflow: hidden;
+
+  border-radius: 20px;
+
+  background: #ffffff;
+
+  // border: 1px solid #edf2f7;
+
+  box-shadow:
+    0 15px 40px rgba(15, 23, 42, .10),
+    0 30px 80px rgba(15, 23, 42, .14);
+
+}
+
+/* ==========================================================
+   Header
+========================================================== */
+
+.modern-modal-header {
+
+  position: relative;
+
+  overflow: hidden;
+
+  border-bottom: 1px solid rgba(255, 255, 255, .08);
+
+  // background: linear-gradient(135deg,
+  //     #020617 0%,
+  //     #172554 40%,
+  //     #4338CA 75%,
+  //     #7C3AED 100%);
+  // background: linear-gradient(135deg,
+  //   #111C43 0%,
+  //   #16285c 55%,
+  //   #1d3578 100%);
+  background-color: #7c3deb;
+
+  isolation: isolate;
+}
+
+/* Decorative Background */
+.modal-header-bg {
+
+  position: absolute;
+
+  inset: 0;
+
+  overflow: hidden;
+
+  pointer-events: none;
+}
+
+/* Left Glow */
+
+.modal-header-bg::before {
+
+  content: "";
+
+  position: absolute;
+
+  width: 280px;
+
+  height: 280px;
+
+  left: -120px;
+
+  top: -120px;
+
+  border-radius: 50%;
+
+  background:
+    radial-gradient(circle,
+      rgba(255, 255, 255, .14),
+      transparent 72%);
+
+  filter: blur(8px);
+}
+
+/* Right Glow */
+
+.modal-header-bg::after {
+
+  content: "";
+
+  position: absolute;
+
+  width: 240px;
+
+  height: 240px;
+
+  right: -80px;
+
+  top: -90px;
+
+  border-radius: 50%;
+
+  background:
+    radial-gradient(circle,
+      rgba(91, 140, 255, .25),
+      transparent 72%);
+
+  filter: blur(10px);
+}
+
+.modern-modal-header::after {
+
+  content: "";
+
+  position: absolute;
+
+  left: 0;
+
+  bottom: 0;
+
+  width: 100%;
+
+  height: 1px;
+
+  background:
+    linear-gradient(90deg,
+      transparent,
+      rgba(255, 255, 255, .18),
+      transparent);
+}
+
+/* Header Layout */
+
+.modal-header-content {
+
+  position: relative;
+
+  z-index: 2;
+
+  display: flex;
+
+  justify-content: space-between;
+
+  align-items: center;
+
+  gap: 20px;
+
+  padding: 10px 2rem;
+}
+
+.modal-header-left {
+
+  display: flex;
+
+  align-items: center;
+
+  gap: 18px;
+
+  min-width: 0;
+
+  flex: 1;
+}
+
+/* ==========================================================
+   Icon
+========================================================== */
+
+.modal-icon {
+
+  flex-shrink: 0;
+}
+
+.modal-icon-inner {
+
+  width: 40px;
+
+  height: 40px;
+
+  border-radius: 12px;
+
+  display: flex;
+
+  justify-content: center;
+
+  align-items: center;
+
+  color: #ffffff;
+
+  background:
+    linear-gradient(145deg,
+      rgba(255, 255, 255, .18),
+      rgba(255, 255, 255, .06));
+
+  border: 1px solid rgba(255, 255, 255, .18);
+
+  backdrop-filter: blur(12px);
+
+  box-shadow:
+    inset 0 1px 1px rgba(255, 255, 255, .15),
+    0 10px 30px rgba(0, 0, 0, .25);
+}
+
+.modal-icon-inner i {
+
+  font-size: 17px;
+}
+
+/* ==========================================================
+   Title
+========================================================== */
+
+.modal-title-wrapper {
+
+  min-width: 0;
+}
+
+.modern-modal-title {
+
+  margin: 0;
+
+  color: #ffffff;
+
+  font-size: 17px;
+
+  font-weight: 700;
+
+  letter-spacing: -.4px;
+
+  line-height: 1.3;
+}
+
+.modern-modal-subtitle {
+
+  margin-top: .45rem;
+
+  color: rgba(255, 255, 255, .72);
+
+  font-size: .9rem;
+
+  line-height: 1.6;
+}
+
+/* ==========================================================
+   Close
+========================================================== */
+
+.modern-close-btn {
+
+  width: 25px;
+
+  height: 25px;
+
+  border-radius: 14px;
+
+  display: flex;
+
+  align-items: center;
+
+  justify-content: center;
+
+  cursor: pointer;
+
+  color: #ffffff;
+
+  background: rgba(255, 255, 255, .08);
+
+  // border: 1px solid rgba(255, 255, 255, .12);
+
+  backdrop-filter: blur(8px);
+
+  transition: .28s;
+}
+
+.modern-close-btn:hover {
+
+  background: rgba(255, 255, 255, .18);
+
+  transform: rotate(90deg) scale(1.05);
+
+  border-color: rgba(255, 255, 255, .25);
+}
+
+.modern-close-btn i {
+
+  font-size: 16px;
+}
+
+/* ==========================================================
+   Body
+========================================================== */
+
+.modern-modal-body {
+
+  flex: 1;
+
+  overflow: auto;
+
+  padding: 2rem;
+}
+
+.modal-content-wrapper {
+
+  display: flex;
+
+  flex-direction: column;
+
+  gap: 1.5rem;
+}
+
+/* Scroll */
+
+.modern-modal-body::-webkit-scrollbar {
+
+  width: 7px;
+}
+
+.modern-modal-body::-webkit-scrollbar-thumb {
+
+  background: #d4dbe6;
+
+  border-radius: 20px;
+}
+
+.modern-modal-body::-webkit-scrollbar-thumb:hover {
+
+  background: #b8c3d3;
+}
+
+/* ==========================================================
+   Footer
+========================================================== */
+/* Footer */
+
+.modern-modal-footer {
+
+  display: flex;
+
+  justify-content: flex-end;
+
+  align-items: center;
+
+  gap: 12px;
+
+  padding: 5px 2rem;
+
+  border-top: 1px solid #edf2f7;
+
+  background: #ffffff;
+}
+
+
+/* ============================
+   Cancel Button
+============================ */
+
+
+::ng-deep .modern-modal-footer app-button:first-child button {
+
+
+  height: 36px;
+
+  padding: 0 16px;
+
+  border-radius: 10px;
+
+  border: 1px solid #dbe3ef;
+
+  background: #ffffff;
+
+  color: #475569;
+
+  font-weight: 600;
+
+  font-size: 13px;
+
+  transition: .3s ease;
+
+}
+
+
+::ng-deep .modern-modal-footer app-button:first-child button:hover {
+
+
+  background: #f8fafc;
+
+  border-color: #cbd5e1;
+
+  transform: translateY(-2px);
+
+}
+
+
+
+/* ============================
+   Save Button
+============================ */
+
+
+::ng-deep .modern-modal-footer app-button:last-child button {
+
+
+  position: relative;
+
+  overflow: hidden;
+
+  height: 36px;
+
+  padding: 0 16px;
+
+  border-radius: 10px;
+
+  border: none;
+
+
+  color: #ffffff;
+
+
+  // background:
+
+  //   linear-gradient(135deg,
+  //     #111C43,
+  //     #2563eb);
+  background: #7c3deb;
+
+  box-shadow:
+
+    0 8px 20px rgba(125, 61, 235, 0.468);
+
+
+  font-weight: 600;
+
+  font-size: 13px;
+
+
+  transition: .35s ease;
+
+}
+
+
+
+::ng-deep .modern-modal-footer app-button:last-child button:hover {
+
+
+  transform: translateY(-3px);
+
+
+  box-shadow:
+
+    0 12px 28px rgba(37, 99, 235, .45);
+
+}
+
+
+
+/* ============================
+   Shine Animation
+============================ */
+
+
+::ng-deep .modern-modal-footer app-button:last-child button::before {
+
+
+  content: "";
+
+
+  position: absolute;
+
+
+  top: 0;
+
+  left: -120%;
+
+
+  width: 70%;
+
+
+  height: 100%;
+
+
+  background:
+
+    linear-gradient(120deg,
+      transparent,
+      rgba(255, 255, 255, .55),
+      transparent);
+
+
+  transform: skewX(-25deg);
+
+
+  animation: saveButtonShine 2s infinite;
+
+}
+
+
+
+@keyframes saveButtonShine {
+
+
+  0% {
+
+    left: -120%;
+
+  }
+
+
+  40% {
+
+    left: 130%;
+
+  }
+
+
+  100% {
+
+    left: 130%;
+
+  }
+
+}
+
+
+/* Disabled */
+
+::ng-deep .modern-modal-footer button:disabled {
+
+
+  opacity: .55;
+
+  cursor: not-allowed;
+
+  transform: none !important;
+
+  box-shadow: none !important;
+
+}
+
+::ng-deep .modern-modal-footer app-button button {
+
+  height: 36px;
+
+  padding: 0 16px;
+
+  border-radius: 10px;
+
+  font-size: 13px;
+
+  font-weight: 600;
+
+  transition: .3s ease;
+
+}
+
+/* ==========================================================
+   Mobile
+========================================================== */
+
+@media (max-width:768px) {
+
+  .modal-overlay {
+
+    padding: 1rem;
+  }
+
+  .modern-modal {
+
+    border-radius: 18px;
+
+    max-height: 95vh;
+  }
+
+  .modal-header-content {
+
+    padding: 1em;
+  }
+
+  .modal-icon-inner {
+
+    width: 48px;
+    height: 48px;
+
+    border-radius: 14px;
+  }
+
+  .modern-modal-title {
+
+    font-size: 12px;
+  }
+
+  .modern-modal-body {
+
+    padding: 1.2rem;
+  }
+
+  .modern-modal-footer {
+
+    padding: 1rem 1.2rem;
+
+    flex-wrap: wrap;
+  }
+
+}
+
+/* ==========================================================
+   Animation
+========================================================== */
+
+@keyframes modalFade {
+
+  from {
+
+    opacity: 0;
+  }
+
+  to {
+
+    opacity: 1;
+  }
+
+}
+
+@keyframes modalSlide {
+
+  from {
+
+    opacity: 0;
+
+    transform: translateY(20px) scale(.98);
+  }
+
+  to {
+
+    opacity: 1;
+
+    transform: translateY(0) scale(1);
+  }
+
+}
\ No newline at end of file
diff --git a/src/app/shared/components/modal/modal.ts b/src/app/shared/components/modal/modal.ts
new file mode 100644
index 00000000..faf5b0f4
--- /dev/null
+++ b/src/app/shared/components/modal/modal.ts
@@ -0,0 +1,127 @@
+import {ChangeDetectionStrategy, Component, ElementRef, HostListener, OnDestroy, computed, effect,
+  input, output } from '@angular/core';
+import { Button, ButtonAction } from "../button/button";
+
+export type ModalSize = 'sm' | 'md' | 'lg' | 'xl' | 'full';
+
+@Component({
+  selector: 'modal',
+  standalone: true,
+  templateUrl: './modal.html',
+  styleUrl: './modal.scss',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+  imports: [Button]
+})
+export class Modal implements OnDestroy {
+  readonly open = input(false);
+
+  readonly title = input('');
+  readonly subtitle = input<string | null>(null);
+  readonly submitAction = input<ButtonAction>('save');
+
+  readonly size = input<ModalSize>('md');
+
+  readonly showHeader = input(true);
+  readonly showFooter = input(true);
+  readonly showCloseButton = input(true);
+  readonly showCancelButton = input(true);
+  readonly showSubmitButton = input(true);
+
+  readonly closeOnBackdrop = input(true);
+  readonly closeOnEscape = input(true);
+
+  readonly loading = input(false);
+  readonly submitDisabled = input(false);
+
+  readonly submitLabel = input('Save');
+  readonly loadingLabel = input('Saving...');
+  readonly cancelLabel = input('Cancel');
+
+  readonly closed = output<void>();
+  readonly submitted = output<void>();
+
+  readonly modalSizeClass = computed(() => {
+    const sizes: Record<ModalSize, string> = {
+      sm: 'max-w-md',
+      md: 'max-w-2xl',
+      lg: 'max-w-4xl',
+      xl: 'max-w-6xl',
+      full: 'max-w-[96vw]'
+    };
+
+    return sizes[this.size()];
+  });
+
+  readonly modalBoxClass = computed(() => {
+    return [
+      'hs-overlay-open:mt-7',
+      'ti-modal-box',
+      'mt-0',
+      'ease-out',
+      'relative',
+      'z-[1]',
+      'pointer-events-auto',
+      this.modalSizeClass()
+    ].join(' ');
+  });
+
+  constructor(private readonly elementRef: ElementRef<HTMLElement>) {
+    effect(() => {
+      if (this.open()) {
+        document.body.classList.add('overflow-hidden');
+
+        queueMicrotask(() => {
+          const dialog =
+            this.elementRef.nativeElement.querySelector<HTMLElement>(
+              '[role="dialog"]'
+            );
+
+          dialog?.focus();
+        });
+      } else {
+        document.body.classList.remove('overflow-hidden');
+      }
+    });
+  }
+
+  @HostListener('document:keydown.escape')
+  onEscape(): void {
+    if (
+      this.open() &&
+      this.closeOnEscape() &&
+      !this.loading()
+    ) {
+      this.close();
+    }
+  }
+
+  onBackdropClick(event: MouseEvent): void {
+    if (
+      event.target === event.currentTarget &&
+      this.closeOnBackdrop() &&
+      !this.loading()
+    ) {
+      this.close();
+    }
+  }
+
+  close(): void {
+    if (this.loading()) {
+      return;
+    }
+
+    this.closed.emit();
+  }
+
+  submit(): void {
+    if (this.loading() || this.submitDisabled()) {
+      return;
+    }
+
+    this.submitted.emit();
+  }
+
+  ngOnDestroy(): void {
+    document.body.classList.remove('overflow-hidden');
+  }
+}
diff --git a/src/app/shared/components/spk-reusable-tables/spk-reusable-tables.html b/src/app/shared/components/spk-reusable-tables/spk-reusable-tables.html
new file mode 100644
index 00000000..f03ef579
--- /dev/null
+++ b/src/app/shared/components/spk-reusable-tables/spk-reusable-tables.html
@@ -0,0 +1,51 @@
+<table class="{{tableClass()}}">
+  @if(headercaption()){
+  <caption [class]="captionheaderclass()">{{captionheaderContent()}}</caption>
+  }
+  <thead class="{{tableHead()}}">
+    <tr [class]="trHeadClass()">
+      @if(showCheckbox()){
+      <th class="{{checkboxClass()}}">
+        <input class="form-check-input" type="checkbox" [checked]="allTasksChecked" (change)="onToggleSelectAll($event)"
+          aria-label="Select all" />
+          @if(CheckboxText()){
+
+            {{CheckboxText()}}
+          }
+      </th>
+      }
+      @for(column of columns(); track $index){
+      <th [class]="column.tableHeadColumn" (click)="onSort(column)">
+        <span class="inline-flex items-center gap-1" [class.cursor-pointer]="column.sortable">
+          {{ column.header }}
+          @if(column.sortable) {
+            @if(sortColumn() === column.key) {
+              <i class="text-xs align-middle" [class.ri-sort-asc]="sortDirection() === 'asc'" [class.ri-sort-desc]="sortDirection() === 'desc'"></i>
+            } @else {
+              <i class="ri-arrow-up-down-line text-xs align-middle"></i>
+            }
+          }
+        </span>
+      </th>
+      }
+    </tr>
+  </thead>
+
+  <tbody class="{{tableBody()}}">
+    <ng-content />
+  </tbody>
+
+  @if(showFooter()){
+  <tfoot class="{{tableFooter()}}">
+    @if(footerData()){
+    @for(column of footerData(); track $index){
+    <th>{{ column }}</th>
+    }
+    }
+    <ng-content select="[footer]" />
+  </tfoot>
+  }
+  @if(footercaption()){
+  <caption [class]="captionfooterclass()">{{captionfooterContent()}}</caption>
+  }
+</table>
diff --git a/src/app/shared/components/spk-reusable-tables/spk-reusable-tables.scss b/src/app/shared/components/spk-reusable-tables/spk-reusable-tables.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/src/app/shared/components/spk-reusable-tables/spk-reusable-tables.ts b/src/app/shared/components/spk-reusable-tables/spk-reusable-tables.ts
new file mode 100644
index 00000000..bf85568d
--- /dev/null
+++ b/src/app/shared/components/spk-reusable-tables/spk-reusable-tables.ts
@@ -0,0 +1,85 @@
+
+import { Component, ContentChild, ElementRef, EventEmitter, input, Input, output, Output } from '@angular/core';
+import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+interface column {
+  tableHeadColumn?: string;
+  header?:       string;
+  key?:          string;
+  sortable?:     boolean;
+}
+@Component({
+  selector: 'spk-reusable-tables',
+  standalone: true,
+  imports: [FormsModule, ReactiveFormsModule],
+  templateUrl: './spk-reusable-tables.html',
+  styleUrl: './spk-reusable-tables.scss'
+})
+export class SpkReusableTables {
+  columns = input<column[]>([])
+  tableClass = input<string>('');
+  tableHead = input<string>('');
+  trHeadClass = input<string>('');
+  tableFooter = input<string>('');
+  tableBody = input<string>('');
+  trClass = input<string>('');
+  checkboxClass = input<string>('');
+  CheckboxText = input<string>('');
+  tableFoot = input<string>('');
+  tableHeadColumn = input<string>('');
+  data = input<any[]>([]);
+  title = input<any[]>([]);
+  footerData = input<any[]>([]);
+  showFooter = input<boolean>(false);
+  showCheckbox = input<boolean>(false);
+
+  headercaption = input<boolean>(false);
+  footercaption = input<boolean>(false);
+  captionheaderclass = input<string>();
+  captionfooterclass = input<string>();
+  captionheaderContent = input<string>();
+  captionfooterContent = input<string>();
+
+
+
+
+
+
+  rows = input<{ checked: boolean;[key: string]: any }[]>([]);
+  allTasksChecked!: boolean;
+
+  // Converted output signals
+  toggleSelectAll = output<boolean>();
+  openDetails = output<any>();
+  sortChange = output<{column: string, direction: 'asc'|'desc'}>();
+
+  sortColumn = input<string>('');
+  sortDirection = input<'asc'|'desc'>('asc');
+
+  onSort(column: column) {
+    if (!column.sortable || !column.key) return;
+    
+    let direction: 'asc'|'desc' = 'asc';
+    if (this.sortColumn() === column.key && this.sortDirection() === 'asc') {
+      direction = 'desc';
+    }
+    
+    this.sortChange.emit({
+      column: column.key,
+      direction
+    });
+  }
+
+  // Toggle select/deselect all checkboxes
+  onToggleSelectAll(event: any) {
+    this.toggleSelectAll.emit(event.target.checked);
+  }
+  toggleRowChecked(row: any) {
+    row.checked = !row.checked;
+    this.allTasksChecked = this.data().every(row => row.checked);
+  }
+
+  // Update the "Select All" checkbox based on row selections
+  updateSelectAllCheckbox(): void {
+    this.allTasksChecked = this.data().every(row => row.checked); // Check if all rows are selected
+  }
+}
diff --git a/src/app/shared/date-time/constants/date-time-formats.ts b/src/app/shared/date-time/constants/date-time-formats.ts
new file mode 100644
index 00000000..d1cf94e7
--- /dev/null
+++ b/src/app/shared/date-time/constants/date-time-formats.ts
@@ -0,0 +1,65 @@
+import { DateTimeFormat } from '../models/date-time-format';
+
+export const DATE_TIME_FORMATS: Readonly<Record<DateTimeFormat, Intl.DateTimeFormatOptions>> =
+  Object.freeze({
+    [DateTimeFormat.Date]: Object.freeze({
+      day: '2-digit',
+      month: 'short',
+      year: 'numeric'
+    }),
+    [DateTimeFormat.ShortDate]: Object.freeze({
+      day: '2-digit',
+      month: '2-digit',
+      year: 'numeric'
+    }),
+    [DateTimeFormat.LongDate]: Object.freeze({
+      weekday: 'long',
+      day: '2-digit',
+      month: 'long',
+      year: 'numeric'
+    }),
+    [DateTimeFormat.DateTime]: Object.freeze({
+      day: '2-digit',
+      month: 'short',
+      year: 'numeric',
+      hour: '2-digit',
+      minute: '2-digit',
+      hour12: true
+    }),
+    [DateTimeFormat.ShortDateTime]: Object.freeze({
+      day: '2-digit',
+      month: '2-digit',
+      year: 'numeric',
+      hour: '2-digit',
+      minute: '2-digit',
+      hour12: true
+    }),
+    [DateTimeFormat.LongDateTime]: Object.freeze({
+      weekday: 'long',
+      day: '2-digit',
+      month: 'long',
+      year: 'numeric',
+      hour: '2-digit',
+      minute: '2-digit',
+      second: '2-digit',
+      hour12: true
+    }),
+    [DateTimeFormat.Time]: Object.freeze({
+      hour: '2-digit',
+      minute: '2-digit',
+      hour12: true
+    }),
+    [DateTimeFormat.TimeWithSeconds]: Object.freeze({
+      hour: '2-digit',
+      minute: '2-digit',
+      second: '2-digit',
+      hour12: true
+    }),
+    [DateTimeFormat.MonthYear]: Object.freeze({
+      month: 'long',
+      year: 'numeric'
+    }),
+    [DateTimeFormat.Year]: Object.freeze({
+      year: 'numeric'
+    })
+  });
diff --git a/src/app/shared/date-time/models/date-time-format.ts b/src/app/shared/date-time/models/date-time-format.ts
new file mode 100644
index 00000000..bdae9c4f
--- /dev/null
+++ b/src/app/shared/date-time/models/date-time-format.ts
@@ -0,0 +1,12 @@
+export enum DateTimeFormat {
+  Date = 'date',
+  ShortDate = 'shortDate',
+  LongDate = 'longDate',
+  DateTime = 'dateTime',
+  ShortDateTime = 'shortDateTime',
+  LongDateTime = 'longDateTime',
+  Time = 'time',
+  TimeWithSeconds = 'timeWithSeconds',
+  MonthYear = 'monthYear',
+  Year = 'year'
+}
diff --git a/src/app/shared/date-time/pipes/app-date-time.pipe.spec.ts b/src/app/shared/date-time/pipes/app-date-time.pipe.spec.ts
new file mode 100644
index 00000000..81321017
--- /dev/null
+++ b/src/app/shared/date-time/pipes/app-date-time.pipe.spec.ts
@@ -0,0 +1,35 @@
+import { DateTimeFormat } from '../models/date-time-format';
+import { DateTimeFormatterService } from '../services/date-time-formatter.service';
+import { AppDateTimePipe } from './app-date-time.pipe';
+
+describe('AppDateTimePipe', () => {
+  let formatter: DateTimeFormatterService;
+  let pipe: AppDateTimePipe;
+
+  beforeEach(() => {
+    formatter = new DateTimeFormatterService();
+    pipe = new AppDateTimePipe(formatter);
+  });
+
+  it('matches the formatter service output', () => {
+    const value = '2026-07-20T14:30:45.000Z';
+    const expected = formatter.format(value, {
+      format: DateTimeFormat.LongDateTime,
+      timeZone: 'Asia/Dubai',
+      locale: 'en-GB',
+      fallback: 'N/A'
+    });
+
+    expect(pipe.transform(
+      value,
+      DateTimeFormat.LongDateTime,
+      'Asia/Dubai',
+      'en-GB',
+      'N/A'
+    )).toBe(expected);
+  });
+
+  it('passes a custom fallback through to the formatter', () => {
+    expect(pipe.transform(null, DateTimeFormat.Date, 'UTC', 'en-GB', 'N/A')).toBe('N/A');
+  });
+});
diff --git a/src/app/shared/date-time/pipes/app-date-time.pipe.ts b/src/app/shared/date-time/pipes/app-date-time.pipe.ts
new file mode 100644
index 00000000..5cefc141
--- /dev/null
+++ b/src/app/shared/date-time/pipes/app-date-time.pipe.ts
@@ -0,0 +1,28 @@
+import { Pipe, PipeTransform } from '@angular/core';
+
+import { DateTimeFormat } from '../models/date-time-format';
+import { DateTimeFormatterService } from '../services/date-time-formatter.service';
+
+@Pipe({
+  name: 'appDateTime',
+  standalone: true,
+  pure: true
+})
+export class AppDateTimePipe implements PipeTransform {
+  constructor(private readonly dateTimeFormatter: DateTimeFormatterService) {}
+
+  transform(
+    value: string | number | Date | null | undefined,
+    format?: DateTimeFormat,
+    timeZone?: string,
+    locale?: string,
+    fallback?: string
+  ): string {
+    return this.dateTimeFormatter.format(value, {
+      format,
+      timeZone,
+      locale,
+      fallback
+    });
+  }
+}
diff --git a/src/app/shared/date-time/services/date-time-formatter.service.spec.ts b/src/app/shared/date-time/services/date-time-formatter.service.spec.ts
new file mode 100644
index 00000000..4ff53eb3
--- /dev/null
+++ b/src/app/shared/date-time/services/date-time-formatter.service.spec.ts
@@ -0,0 +1,82 @@
+import { DateTimeFormat } from '../models/date-time-format';
+import { DateTimeFormatterService } from './date-time-formatter.service';
+
+describe('DateTimeFormatterService', () => {
+  const isoDate = '2026-07-20T14:30:45.000Z';
+  const utcOptions = { timeZone: 'UTC' } as const;
+  let service: DateTimeFormatterService;
+
+  beforeEach(() => {
+    service = new DateTimeFormatterService();
+  });
+
+  it('formats an ISO UTC string using the default format', () => {
+    expect(service.format(isoDate, utcOptions)).toBe('20 Jul 2026, 02:30 pm');
+  });
+
+  it('formats a JavaScript Date', () => {
+    expect(service.format(new Date(isoDate), {
+      format: DateTimeFormat.Date,
+      timeZone: 'UTC'
+    })).toBe('20 Jul 2026');
+  });
+
+  it('formats a numeric timestamp', () => {
+    expect(service.format(Date.parse(isoDate), {
+      format: DateTimeFormat.TimeWithSeconds,
+      timeZone: 'UTC'
+    })).toBe('02:30:45 pm');
+  });
+
+  it.each([
+    [DateTimeFormat.Date, '20 Jul 2026'],
+    [DateTimeFormat.ShortDate, '20/07/2026'],
+    [DateTimeFormat.LongDate, 'Monday, 20 July 2026'],
+    [DateTimeFormat.DateTime, '20 Jul 2026, 02:30 pm'],
+    [DateTimeFormat.ShortDateTime, '20/07/2026, 02:30 pm'],
+    [DateTimeFormat.LongDateTime, 'Monday, 20 July 2026 at 02:30:45 pm'],
+    [DateTimeFormat.Time, '02:30 pm'],
+    [DateTimeFormat.TimeWithSeconds, '02:30:45 pm'],
+    [DateTimeFormat.MonthYear, 'July 2026'],
+    [DateTimeFormat.Year, '2026']
+  ])('formats %s using its predefined options', (format, expected) => {
+    expect(service.format(isoDate, { format, timeZone: 'UTC' })).toBe(expected);
+  });
+
+  it.each([null, undefined, '', '   ', 'not-a-date'])(
+    'returns the default fallback for %s',
+    value => {
+      expect(service.format(value)).toBe('—');
+    }
+  );
+
+  it('uses a custom fallback', () => {
+    expect(service.format('invalid', { fallback: 'N/A' })).toBe('N/A');
+  });
+
+  it('supports a custom locale', () => {
+    expect(service.format(isoDate, {
+      format: DateTimeFormat.ShortDate,
+      locale: 'de-DE',
+      timeZone: 'UTC'
+    })).toBe('20.07.2026');
+  });
+
+  it('supports a valid IANA timezone', () => {
+    expect(service.format(isoDate, {
+      format: DateTimeFormat.Time,
+      timeZone: 'Asia/Dubai'
+    })).toBe('06:30 pm');
+  });
+
+  it('handles a day change caused by timezone conversion', () => {
+    expect(service.format('2026-07-20T23:30:00.000Z', {
+      format: DateTimeFormat.Date,
+      timeZone: 'Asia/Dubai'
+    })).toBe('21 Jul 2026');
+  });
+
+  it('returns the fallback instead of throwing for an invalid timezone', () => {
+    expect(service.format(isoDate, { timeZone: 'Invalid/Timezone' })).toBe('—');
+  });
+});
diff --git a/src/app/shared/date-time/services/date-time-formatter.service.ts b/src/app/shared/date-time/services/date-time-formatter.service.ts
new file mode 100644
index 00000000..8c1d21b4
--- /dev/null
+++ b/src/app/shared/date-time/services/date-time-formatter.service.ts
@@ -0,0 +1,48 @@
+import { Injectable } from '@angular/core';
+
+import { DATE_TIME_FORMATS } from '../constants/date-time-formats';
+import { DateTimeFormat } from '../models/date-time-format';
+
+export interface DateTimeFormattingOptions {
+  readonly format?: DateTimeFormat;
+  readonly locale?: string;
+  readonly timeZone?: string;
+  readonly fallback?: string;
+}
+
+@Injectable({
+  providedIn: 'root'
+})
+export class DateTimeFormatterService {
+  format(
+    value: string | number | Date | null | undefined,
+    options: DateTimeFormattingOptions = {}
+  ): string {
+    const fallback = options.fallback ?? '—';
+
+    if (value === null || value === undefined || (typeof value === 'string' && !value.trim())) {
+      return fallback;
+    }
+
+    const date = value instanceof Date
+      ? new Date(value.getTime())
+      : new Date(value);
+
+    if (Number.isNaN(date.getTime())) {
+      return fallback;
+    }
+
+    const format = options.format ?? DateTimeFormat.DateTime;
+    const locale = options.locale?.trim() || 'en-GB';
+    const timeZone = options.timeZone?.trim();
+
+    try {
+      return new Intl.DateTimeFormat(locale, {
+        ...DATE_TIME_FORMATS[format],
+        ...(timeZone ? { timeZone } : {})
+      }).format(date);
+    } catch {
+      return fallback;
+    }
+  }
+}
diff --git a/src/app/shared/directives/data-table-cell.directive.ts b/src/app/shared/directives/data-table-cell.directive.ts
new file mode 100644
index 00000000..b6bcdf1d
--- /dev/null
+++ b/src/app/shared/directives/data-table-cell.directive.ts
@@ -0,0 +1,12 @@
+import { Directive, TemplateRef, input } from '@angular/core';
+import { DataTableCellContext, DataTableRecord } from '../components/data-table/data-table.types';
+
+@Directive({
+  selector: '[appDataTableCell]',
+  standalone: true
+})
+export class DataTableCellDirective<T extends DataTableRecord = DataTableRecord> {
+  readonly appDataTableCell = input.required<string>();
+
+  constructor(public readonly templateRef: TemplateRef<DataTableCellContext<T>>) {}
+}
\ No newline at end of file
diff --git a/src/app/shared/directives/data-table-toolbar/data-table-toolbar.directive.spec.ts b/src/app/shared/directives/data-table-toolbar/data-table-toolbar.directive.spec.ts
new file mode 100644
index 00000000..8769e42d
--- /dev/null
+++ b/src/app/shared/directives/data-table-toolbar/data-table-toolbar.directive.spec.ts
@@ -0,0 +1,16 @@
+import { TemplateRef } from '@angular/core';
+import { TestBed } from '@angular/core/testing';
+
+import { DataTableToolbarDirective } from './data-table-toolbar.directive';
+
+describe('DataTableToolbarDirective', () => {
+  it('should create an instance', () => {
+    TestBed.configureTestingModule({
+      providers: [{ provide: TemplateRef, useValue: {} }],
+    });
+
+    const directive = TestBed.runInInjectionContext(() => new DataTableToolbarDirective());
+
+    expect(directive).toBeTruthy();
+  });
+});
diff --git a/src/app/shared/directives/data-table-toolbar/data-table-toolbar.directive.ts b/src/app/shared/directives/data-table-toolbar/data-table-toolbar.directive.ts
new file mode 100644
index 00000000..4ee2c6a0
--- /dev/null
+++ b/src/app/shared/directives/data-table-toolbar/data-table-toolbar.directive.ts
@@ -0,0 +1,15 @@
+import {
+  Directive,
+  TemplateRef,
+  inject
+} from '@angular/core';
+
+@Directive({
+  selector: '[appDataTableToolbar]',
+  standalone: true
+})
+export class DataTableToolbarDirective {
+  readonly templateRef = inject(
+    TemplateRef<unknown>
+  );
+}
\ No newline at end of file
diff --git a/src/app/shared/directives/tooltip/tooltip.directive.ts b/src/app/shared/directives/tooltip/tooltip.directive.ts
new file mode 100644
index 00000000..1028027f
--- /dev/null
+++ b/src/app/shared/directives/tooltip/tooltip.directive.ts
@@ -0,0 +1,231 @@
+import {
+  ComponentRef,
+  Directive,
+  ElementRef,
+  HostListener,
+  OnDestroy,
+  effect,
+  inject,
+  input
+} from '@angular/core';
+import {
+  ConnectedPosition,
+  Overlay,
+  OverlayRef
+} from '@angular/cdk/overlay';
+import { ComponentPortal } from '@angular/cdk/portal';
+
+import {
+  Tooltip
+} from './tooltip/tooltip';
+import { TooltipVariant }  from './tooltip/tooltip';
+
+export type TooltipPosition =
+  | 'top'
+  | 'bottom'
+  | 'left'
+  | 'right';
+
+@Directive({
+  selector: '[appTooltip]',
+  standalone: true
+})
+export class TooltipDirective implements OnDestroy {
+  private readonly elementRef =
+    inject<ElementRef<HTMLElement>>(ElementRef);
+
+  private readonly overlay = inject(Overlay);
+
+  readonly appTooltip = input.required<string>();
+
+  readonly tooltipPosition =
+    input<TooltipPosition>('top');
+
+  readonly tooltipVariant =
+    input<TooltipVariant>('default');
+
+  readonly tooltipDisabled = input(false);
+
+  readonly tooltipDelay = input(200);
+
+  private overlayRef: OverlayRef | null = null;
+
+  private tooltipComponentRef:
+    ComponentRef<Tooltip> | null = null;
+
+  private showTimeout:
+    ReturnType<typeof setTimeout> | null = null;
+
+  constructor() {
+    effect(() => {
+      const text = this.appTooltip();
+      const variant = this.tooltipVariant();
+
+      this.tooltipComponentRef?.setInput('text', text);
+      this.tooltipComponentRef?.setInput(
+        'variant',
+        variant
+      );
+    });
+  }
+
+  @HostListener('mouseenter')
+  @HostListener('focusin')
+  show(): void {
+    const tooltipText = this.appTooltip().trim();
+
+    if (
+      this.tooltipDisabled() ||
+      tooltipText.length === 0
+    ) {
+      return;
+    }
+
+    this.clearTimeout();
+
+    this.showTimeout = setTimeout(() => {
+      this.showTimeout = null;
+      this.openTooltip();
+    }, Math.max(0, this.tooltipDelay()));
+  }
+
+  @HostListener('mouseleave')
+  @HostListener('focusout')
+  hide(): void {
+    this.clearTimeout();
+    this.closeTooltip();
+  }
+
+  private openTooltip(): void {
+    if (this.overlayRef?.hasAttached()) {
+      return;
+    }
+
+    const positionStrategy = this.overlay
+      .position()
+      .flexibleConnectedTo(
+        this.elementRef.nativeElement
+      )
+      .withPositions(this.getPositions())
+      .withPush(true);
+
+    this.overlayRef = this.overlay.create({
+      positionStrategy,
+      scrollStrategy:
+        this.overlay.scrollStrategies.reposition()
+    });
+
+    const portal = new ComponentPortal(Tooltip);
+
+    this.tooltipComponentRef =
+      this.overlayRef.attach(portal);
+
+    this.tooltipComponentRef.setInput(
+      'text',
+      this.appTooltip().trim()
+    );
+
+    this.tooltipComponentRef.setInput(
+      'variant',
+      this.tooltipVariant()
+    );
+  }
+
+  private closeTooltip(): void {
+    this.overlayRef?.dispose();
+
+    this.overlayRef = null;
+    this.tooltipComponentRef = null;
+  }
+
+  private clearTimeout(): void {
+    if (this.showTimeout === null) {
+      return;
+    }
+
+    clearTimeout(this.showTimeout);
+    this.showTimeout = null;
+  }
+
+  private getPositions(): ConnectedPosition[] {
+    const positions: Record<
+      TooltipPosition,
+      ConnectedPosition[]
+    > = {
+      top: [
+        {
+          originX: 'center',
+          originY: 'top',
+          overlayX: 'center',
+          overlayY: 'bottom',
+          offsetY: -8
+        },
+        {
+          originX: 'center',
+          originY: 'bottom',
+          overlayX: 'center',
+          overlayY: 'top',
+          offsetY: 8
+        }
+      ],
+
+      bottom: [
+        {
+          originX: 'center',
+          originY: 'bottom',
+          overlayX: 'center',
+          overlayY: 'top',
+          offsetY: 8
+        },
+        {
+          originX: 'center',
+          originY: 'top',
+          overlayX: 'center',
+          overlayY: 'bottom',
+          offsetY: -8
+        }
+      ],
+
+      left: [
+        {
+          originX: 'start',
+          originY: 'center',
+          overlayX: 'end',
+          overlayY: 'center',
+          offsetX: -8
+        },
+        {
+          originX: 'end',
+          originY: 'center',
+          overlayX: 'start',
+          overlayY: 'center',
+          offsetX: 8
+        }
+      ],
+
+      right: [
+        {
+          originX: 'end',
+          originY: 'center',
+          overlayX: 'start',
+          overlayY: 'center',
+          offsetX: 8
+        },
+        {
+          originX: 'start',
+          originY: 'center',
+          overlayX: 'end',
+          overlayY: 'center',
+          offsetX: -8
+        }
+      ]
+    };
+
+    return positions[this.tooltipPosition()];
+  }
+
+  ngOnDestroy(): void {
+    this.clearTimeout();
+    this.closeTooltip();
+  }
+}
\ No newline at end of file
diff --git a/src/app/shared/directives/tooltip/tooltip/tooltip.html b/src/app/shared/directives/tooltip/tooltip/tooltip.html
new file mode 100644
index 00000000..ca66ff07
--- /dev/null
+++ b/src/app/shared/directives/tooltip/tooltip/tooltip.html
@@ -0,0 +1,26 @@
+<!-- <div
+  class="
+    pointer-events-none
+    max-w-xs
+    whitespace-normal
+    rounded-sm
+    bg-primary
+    px-2
+    py-1
+    text-xs
+    font-medium
+    leading-4
+    text-white
+    shadow-sm
+  "
+  role="tooltip"
+>
+  {{ text() }}
+</div> -->
+
+<div
+  [class]="resolvedTooltipClass()"
+  role="tooltip"
+>
+  {{ text() }}
+</div>
\ No newline at end of file
diff --git a/src/app/shared/directives/tooltip/tooltip/tooltip.scss b/src/app/shared/directives/tooltip/tooltip/tooltip.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/src/app/shared/directives/tooltip/tooltip/tooltip.ts b/src/app/shared/directives/tooltip/tooltip/tooltip.ts
new file mode 100644
index 00000000..d38b7207
--- /dev/null
+++ b/src/app/shared/directives/tooltip/tooltip/tooltip.ts
@@ -0,0 +1,59 @@
+import {
+  ChangeDetectionStrategy,
+  Component,
+  input,
+  computed
+} from '@angular/core';
+
+
+export type TooltipVariant =
+  | 'default'
+  | 'info';
+
+@Component({
+  selector: 'app-tooltip',
+  standalone: true,
+  templateUrl: './tooltip.html',
+  changeDetection: ChangeDetectionStrategy.OnPush
+})
+export class Tooltip {
+  readonly text = input.required<string>();
+
+  readonly variant =
+    input<TooltipVariant>('default');
+
+  readonly resolvedTooltipClass = computed(() => {
+    const baseClasses = [
+      'pointer-events-none',
+      'max-w-xs',
+      'whitespace-normal',
+      'rounded-sm',
+      'px-2',
+      'py-1',
+      'text-xs',
+      'font-medium',
+      'leading-4'
+    ];
+
+    const variantClasses =
+      this.variant() === 'info'
+        ? [
+          'border',
+          'border-defaultborder',
+          'bg-white',
+          'text-defaulttextcolor',
+          'shadow-lg',
+          'dark:bg-bodybg'
+        ]
+        : [
+          'bg-primary',
+          'text-white',
+          'shadow-sm'
+        ];
+
+    return [
+      ...baseClasses,
+      ...variantClasses
+    ].join(' ');
+  });
+}
\ No newline at end of file
diff --git a/src/app/shared/routes/auth.routes.ts b/src/app/shared/routes/auth.routes.ts
deleted file mode 100644
index 3e72981a..00000000
--- a/src/app/shared/routes/auth.routes.ts
+++ /dev/null
@@ -1,19 +0,0 @@
-import { Routes } from '@angular/router';
-import { guestGuard } from '../../core/guards/guest.guard';
-
-export const authen: Routes = [
-  {
-    path: 'login',
-    canActivate: [guestGuard],
-    loadComponent: () => import('../../authentication/login/login').then((m) => m.Login),
-  },
-  {
-    path: '',
-    children: [
-      {
-        path: '',
-        loadChildren: () => import('../../components/error/error.routes').then((m) => m.errorRoutingModule),
-      },
-    ],
-  },
-];
diff --git a/src/app/shell/layouts/authentication-layout/authentication-layout.html b/src/app/shell/layouts/authentication-layout/authentication-layout.html
new file mode 100644
index 00000000..f2dc9c19
--- /dev/null
+++ b/src/app/shell/layouts/authentication-layout/authentication-layout.html
@@ -0,0 +1,2 @@
+
+<router-outlet />
diff --git a/src/app/shell/layouts/authentication-layout/authentication-layout.scss b/src/app/shell/layouts/authentication-layout/authentication-layout.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/src/app/shell/layouts/authentication-layout/authentication-layout.ts b/src/app/shell/layouts/authentication-layout/authentication-layout.ts
new file mode 100644
index 00000000..85f07795
--- /dev/null
+++ b/src/app/shell/layouts/authentication-layout/authentication-layout.ts
@@ -0,0 +1,14 @@
+import { Component } from '@angular/core';
+import { RouterOutlet } from '@angular/router';
+
+@Component({
+    selector: 'app-authentication-layout',
+    templateUrl: './authentication-layout.html',
+    styleUrl: './authentication-layout.scss',
+    imports: [RouterOutlet]
+})
+export class AuthenticationLayout {
+
+}
+
+
diff --git a/src/app/shell/layouts/content-layout/content-layout.html b/src/app/shell/layouts/content-layout/content-layout.html
new file mode 100644
index 00000000..4609eac5
--- /dev/null
+++ b/src/app/shell/layouts/content-layout/content-layout.html
@@ -0,0 +1,46 @@
+<app-switcher />
+<app-loader />
+<div class="page">
+  <app-header />
+  <app-sidebar appHoverEffectSidebar />
+  <div class="content">
+    <div class="main-content" (click)="clickOnBody()">
+
+         <app-page-header />
+          <router-outlet />
+
+    </div>
+  </div>
+  <app-footer />
+  <app-tab-to-top />
+
+</div>
+<div #responsiveoverlay id="responsive-overlay" (click)="clearToggle()"></div>
+
+@if (sessionTimeoutService.showWarning()) {
+  <div
+    class="hs-overlay ti-modal mt-[1.75rem] hs-overlay-backdrop-open:!bg-[#32325180] dark:hs-overlay-backdrop-open:!bg-[#323251cc] pointer-events-none !block">
+    <div class="ti-modal-box pointer-events-auto">
+      <div class="ti-modal-content !border !border-defaultborder dark:!border-defaultborder/10 !rounded-[0.5rem]">
+        <div class="ti-modal-body !p-[1.5rem]">
+          <div class="flex items-start gap-4">
+            <span class="!w-[3rem] !h-[3rem] !leading-[3rem] rounded-[50%] avatar bg-warning/10 !text-warning text-center">
+              <i class="fe fe-alert-triangle text-[1.125rem]"></i>
+            </span>
+            <div>
+              <p class="text-[1rem] font-semibold text-defaulttextcolor dark:text-defaulttextcolor/70 mb-2">Session Expiring Soon</p>
+              <p class="text-[#8c9097] dark:text-white/50 text-[0.875rem] mb-0">
+                You have been inactive. You will be signed out in {{ sessionTimeoutService.remainingSeconds() }} seconds unless you continue your session.
+              </p>
+            </div>
+          </div>
+        </div>
+        <div class="ti-modal-footer !border !border-defaultborder dark:!border-defaultborder/10 !py-[1rem] !px-[1.25rem] justify-end gap-2">
+          <button type="button" class="ti-btn ti-btn-light" (click)="sessionTimeoutService.logoutNow()">Log Out</button>
+          <button type="button" class="ti-btn ti-btn-primary-full" (click)="sessionTimeoutService.staySignedIn()">Stay Signed In</button>
+        </div>
+      </div>
+    </div>
+  </div>
+}
+
diff --git a/src/app/shell/layouts/content-layout/content-layout.scss b/src/app/shell/layouts/content-layout/content-layout.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/src/app/shell/layouts/content-layout/content-layout.ts b/src/app/shell/layouts/content-layout/content-layout.ts
new file mode 100644
index 00000000..4310e75c
--- /dev/null
+++ b/src/app/shell/layouts/content-layout/content-layout.ts
@@ -0,0 +1,143 @@
+import { Component, DOCUMENT, ElementRef, Renderer2, ViewChild, inject } from '@angular/core';
+import { Menu, NavService } from '../../../core/services/common/nav.service';
+import { Router, RouterOutlet } from '@angular/router';
+import { AppStateService } from '../../../core/services/common/app-state.service';
+import { Switcher } from '../../ui/switcher/switcher';
+import { Header } from '../../ui/header/header';
+import { Sidebar } from '../../ui/sidebar/sidebar';
+import { HoverEffectSidebarDirective } from '../../../shared/directives/hover-effect-sidebar.directive';
+import { PageHeader } from '../../ui/page-header/page-header';
+import { Footer } from '../../ui/footer/footer';
+import { TabToTop } from '../../ui/tab-to-top/tab-to-top';
+import { AppLoader } from '../../ui/app-loader/app-loader';
+import { SessionTimeoutService } from '../../../core/services/auth/session-timeout.service';
+import { AppContextService } from '../../../core/services/context/app-context.service';
+import { AuthService } from '../../../core/services/auth/auth.service';
+@Component({
+  selector: 'app-content-layout',
+  templateUrl: './content-layout.html',
+  styleUrl: './content-layout.scss',
+  providers: [SessionTimeoutService],
+  imports: [
+    Switcher,
+    Header,
+    Sidebar,
+    HoverEffectSidebarDirective,
+    PageHeader,
+    RouterOutlet,
+    Footer,
+    TabToTop,
+    AppLoader,
+  ],
+})
+export class ContentLayout {
+  navServices = inject(NavService);
+  sessionTimeoutService = inject(SessionTimeoutService);
+  private readonly appContextService = inject(AppContextService);
+  private readonly authService = inject(AuthService);
+  private document = inject<Document>(DOCUMENT);
+  private appStateService = inject(AppStateService);
+  private elementRef = inject(ElementRef);
+  private renderer = inject(Renderer2);
+  @ViewChild('responsiveoverlay') responsiveoverlay!: ElementRef<HTMLDivElement>;
+  public menuItems!: Menu[];
+
+  constructor() {
+    this.sessionTimeoutService.start();
+
+    if (this.authService.isLoggedIn) {
+      this.appContextService.ensureMenuInitialized().subscribe();
+    }
+
+    this.navServices.items.subscribe((menuItems: any) => {
+      this.menuItems = menuItems;
+    });
+    let html = this.document.documentElement;
+    this.appStateService.state$.subscribe(state => {
+      if (state) {
+        if (window.innerWidth <= 996) {
+          html?.setAttribute('data-toggled', html?.getAttribute('data-toggled') == 'close' ? 'close' : 'close');
+        }
+        if (state.menuStyles == 'menu-hover' || state.menuStyles == 'icon-hover') {
+          this.clearNavDropdown()
+        }
+      }
+
+    });
+  }
+
+  clearNavDropdown() {
+
+
+    this.menuItems?.forEach((a: any) => {
+      a.active = false;
+      a?.children?.forEach((b: any) => {
+        b.active = false;
+        b?.children?.forEach((c: any) => {
+          c.active = false;
+        });
+      });
+    });
+  }
+
+  clickOnBody() {
+    this.responsiveoverlay.nativeElement.classList.remove('active');
+    const htmlElement = this.document.documentElement;
+    this.renderer.removeAttribute(htmlElement, 'data-icon-overlay');
+    if (window.innerWidth <= 996) {
+      htmlElement?.setAttribute('data-toggled', htmlElement?.getAttribute('data-toggled') == 'close' ? 'close' : 'close');
+    }
+    const navStyle = htmlElement.getAttribute('data-nav-style');
+
+    if (htmlElement.getAttribute('data-toggled') == 'icon-text-close') {
+      this.renderer.removeAttribute(htmlElement, 'data-icon-text');
+    }
+    if (htmlElement.getAttribute('data-nav-layout') == 'horizontal'
+      && window.innerWidth > 996) {
+      this.clearNavDropdown();
+    }
+    else
+      if (navStyle === 'menu-click' || navStyle === 'menu-hover' || navStyle === 'icon-click' || navStyle === 'icon-hover') {
+        document.querySelector('.double-menu-active')?.setAttribute('style', 'display: none;');
+      }
+
+    const switcher = this.elementRef.nativeElement.querySelector('.switcher');
+    if (switcher) {
+      this.renderer.removeClass(switcher, 'show');
+      this.responsiveoverlay.nativeElement.classList.add('active');
+    } else {
+      this.responsiveoverlay.nativeElement.classList.remove('active');
+    }
+    const sidebar = this.elementRef.nativeElement.querySelector('.sidebar');
+    if (sidebar) {
+      this.renderer.removeClass(sidebar, 'show');
+
+    }
+
+
+  }
+
+  closeMenu() {
+    this.menuItems?.forEach((a: any) => {
+      if (this.menuItems) {
+        a.active = false;
+      }
+      a?.children?.forEach((b: any) => {
+        if (a.children) {
+          b.active = false;
+        }
+      });
+    });
+  }
+
+
+  clearToggle() {
+    let html = this.elementRef.nativeElement.ownerDocument.documentElement;
+    html?.setAttribute('data-toggled', 'close');
+    document.querySelector('#responsive-overlay')?.classList.remove('active');
+  }
+
+
+}
+
+
diff --git a/src/app/shared/routes/content.routes.ts b/src/app/shell/routes/content.routes.ts
similarity index 81%
rename from src/app/shared/routes/content.routes.ts
rename to src/app/shell/routes/content.routes.ts
index 044ccf86..41c53d2b 100644
--- a/src/app/shared/routes/content.routes.ts
+++ b/src/app/shell/routes/content.routes.ts
@@ -3,7 +3,7 @@ import { Routes } from '@angular/router';
 export const content: Routes = [
   {
     path: 'dashboards',
-    loadChildren: () => import('../../components/dashboards/dashboard.routes').then((m) => m.dashboardRoutingModule),
+    loadChildren: () => import('../../features/dashboards/dashboard.routes').then((m) => m.dashboardRoutingModule),
   },
   {
     path: 'global-masters',
@@ -13,6 +13,10 @@ export const content: Routes = [
     path: 'users',
     loadChildren: () => import('../../features/users/users.routes').then((m) => m.usersRoutes),
   },
+  {
+    path: 'organizations',
+    loadChildren: () => import('../../features/organizations/organizations.routes').then((m) => m.organizationsRoutes),
+  },
   {
     path: 'tenants',
     loadChildren: () => import('../../features/tenants/tenants.routes').then((m) => m.tenantsRoutes),
diff --git a/src/app/shell/ui/app-loader/app-loader.html b/src/app/shell/ui/app-loader/app-loader.html
new file mode 100644
index 00000000..b5de70f9
--- /dev/null
+++ b/src/app/shell/ui/app-loader/app-loader.html
@@ -0,0 +1,8 @@
+@if (loadingService.isLoading()) {
+  <div class="fixed inset-0 z-[9999] flex items-center justify-center bg-black/20">
+    <button type="button" class="ti-btn ti-btn-disabled ti-btn-primary-full" disabled>
+      <span class="ti-spinner text-white" role="status" aria-label="loading"></span>
+      <span>Loading...</span>
+    </button>
+  </div>
+}
\ No newline at end of file
diff --git a/src/app/shell/ui/app-loader/app-loader.scss b/src/app/shell/ui/app-loader/app-loader.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/src/app/shell/ui/app-loader/app-loader.ts b/src/app/shell/ui/app-loader/app-loader.ts
new file mode 100644
index 00000000..e06ae3e6
--- /dev/null
+++ b/src/app/shell/ui/app-loader/app-loader.ts
@@ -0,0 +1,13 @@
+import { Component,inject } from '@angular/core';
+import { LoadingService } from '../../../core/services/common/loading.service';
+
+@Component({
+  selector: 'app-loader',
+  imports: [],
+  standalone: true,
+  templateUrl: './app-loader.html',
+  styleUrl: './app-loader.scss',
+})
+export class AppLoader {
+readonly loadingService = inject(LoadingService);
+}
diff --git a/src/app/shell/ui/footer/footer.html b/src/app/shell/ui/footer/footer.html
new file mode 100644
index 00000000..bf43af8d
--- /dev/null
+++ b/src/app/shell/ui/footer/footer.html
@@ -0,0 +1,15 @@
+<!-- Footer Start -->
+<footer
+  class="footer mt-auto xl:ps-[15rem]  font-normal font-inter bg-white text-defaultsize leading-normal text-[0.813] shadow-[0_0_0.4rem_rgba(0,0,0,0.1)] dark:!bg-bodybg py-4 text-center">
+  <div class="container">
+    <span class=" dark:text-defaulttextcolor/50"> Copyright © <span id="year">{{fullyear}}</span> <a
+        href="javascript:void(0);" class="text-defaulttextcolor font-semibold dark:text-defaulttextcolor"> Ynex</a>.
+      Designed with <span class="bi bi-heart-fill text-danger"></span> by <a href="javascript:void(0);">
+        <span class="font-semibold text-primary underline">Spruko</span>
+      </a> All
+      rights
+      reserved
+    </span>
+  </div>
+</footer>
+<!-- Footer End -->
diff --git a/src/app/shell/ui/footer/footer.scss b/src/app/shell/ui/footer/footer.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/src/app/shell/ui/footer/footer.ts b/src/app/shell/ui/footer/footer.ts
new file mode 100644
index 00000000..fbc97626
--- /dev/null
+++ b/src/app/shell/ui/footer/footer.ts
@@ -0,0 +1,13 @@
+import { Component } from '@angular/core';
+
+
+@Component({
+    selector: 'app-footer',
+    templateUrl: './footer.html',
+    styleUrl: './footer.scss'
+})
+export class Footer {
+  fullyear=new Date().getFullYear()
+}
+
+
diff --git a/src/app/shell/ui/header/header.html b/src/app/shell/ui/header/header.html
new file mode 100644
index 00000000..9cb86a42
--- /dev/null
+++ b/src/app/shell/ui/header/header.html
@@ -0,0 +1,524 @@
+<!-- Start::Header -->
+<header class="app-header">
+  <nav class="main-header !h-[3.75rem]" aria-label="Global">
+    <div class="main-header-container ps-[0.725rem] pe-[1rem] ">
+
+      <div class="header-content-left">
+        <!-- Start::header-element -->
+        <div class="header-element">
+          <div class="horizontal-logo">
+            <a routerLink="/dashboards/crm" class="header-logo">
+              <img src="./assets/images/brand-logos/desktop-logo.png" alt="logo" class="desktop-logo">
+              <img src="./assets/images/brand-logos/toggle-logo.png" alt="logo" class="toggle-logo">
+              <img src="./assets/images/brand-logos/desktop-dark.png" alt="logo" class="desktop-dark">
+              <img src="./assets/images/brand-logos/toggle-dark.png" alt="logo" class="toggle-dark">
+              <img src="./assets/images/brand-logos/desktop-white.png" alt="logo" class="desktop-white">
+              <img src="./assets/images/brand-logos/toggle-white.png" alt="logo" class="toggle-white">
+            </a>
+          </div>
+        </div>
+        <!-- End::header-element -->
+        <!-- Start::header-element -->
+        <div class="header-element md:px-[0.325rem] !items-center">
+          <!-- Start::header-link -->
+          <a aria-label="Hide Sidebar"
+            class="sidemenu-toggle animated-arrow  hor-toggle horizontal-navtoggle inline-flex items-center  focus-visible:outline-none"
+            (click)="toggleSidebar()" href="javascript:void(0);"><span></span></a>
+          <!-- End::header-link -->
+        </div>
+        <!-- End::header-element -->
+      </div>
+
+
+
+      <div class="header-content-right">
+
+        <div class="header-element py-[1rem] md:px-[0.65rem] px-2 header-search">
+          <button aria-label="button" type="button" data-hs-overlay="#search-modal"
+            class="inline-flex flex-shrink-0 justify-center items-center gap-2  rounded-full font-medium focus:ring-offset-0 focus:ring-offset-white transition-all text-xs dark:bg-bgdark dark:hover:bg-black/20 dark:text-[#8c9097] dark:text-white/50 dark:hover:text-white dark:focus:ring-white/10 dark:focus:ring-offset-white/10">
+            <i class="bx bx-search-alt-2 header-link-icon"></i>
+          </button>
+        </div>
+
+        <!-- start header country -->
+        <div
+          class="header-element py-[1rem] md:px-[0.65rem] px-2  header-country hs-dropdown ti-dropdown  hidden sm:block [--placement:bottom-right] rtl:[--placement:bottom-left]">
+          <button id="dropdown-flag" type="button"
+            class="hs-dropdown-toggle ti-dropdown-toggle !p-0 flex-shrink-0  !border-0 !rounded-full !shadow-none">
+            <img src="./assets/images/flags/us_flag.jpg" alt="flag-img" class="h-[1.25rem] w-[1.25rem] rounded-full">
+          </button>
+
+          <div class="hs-dropdown-menu ti-dropdown-menu min-w-[10rem] hidden !-mt-3" aria-labelledby="dropdown-flag">
+            <div class="ti-dropdown-divider divide-y divide-gray-200 dark:divide-white/10">
+              <div class="py-2 first:pt-0 last:pb-0">
+                @for (lang of headeData.languages; track $index) {
+                <div class="ti-dropdown-item !p-[0.65rem] hover:cursor-pointer">
+                  <div class="flex items-center space-x-2  w-full">
+                    <div class="h-[1.375rem] w-[1.375rem] flex items-center rounded-full">
+                      <img [src]="lang.flag" [alt]="lang.name + ' flag'" class="h-[1rem] w-[1rem] rounded-full">
+                    </div>
+                    <div>
+                      <p class="!text-[0.8125rem] font-medium">
+                        {{ lang.name }}
+                      </p>
+                    </div>
+                  </div>
+                </div>
+                }
+              </div>
+            </div>
+          </div>
+        </div>
+        <!-- end header country -->
+
+        <!-- light and dark theme -->
+        <div class="header-element header-theme-mode hidden !items-center sm:block !py-[1rem] md:!px-[0.65rem] px-2">
+          <a aria-label="anchor"
+            class="hs-dark-mode-active:hidden flex hs-dark-mode group flex-shrink-0 justify-center items-center gap-2  rounded-full font-medium transition-all text-xs dark:bg-bgdark dark:hover:bg-black/20 dark:text-[#8c9097] dark:text-white/50 dark:hover:text-white dark:focus:ring-white/10 dark:focus:ring-offset-white/10"
+            href="javascript:void(0);" (click)="updateTheme('dark')">
+            <i class="bx bx-moon header-link-icon"></i>
+          </a>
+          <a aria-label="anchor"
+            class="hs-dark-mode-active:flex hidden hs-dark-mode group flex-shrink-0 justify-center items-center gap-2  rounded-full font-medium text-defaulttextcolor  transition-all text-xs dark:bg-bodybg dark:bg-bgdark dark:hover:bg-black/20 dark:text-[#8c9097] dark:text-white/50 dark:hover:text-white dark:focus:ring-white/10 dark:focus:ring-offset-white/10"
+            href="javascript:void(0);" (click)="updateTheme('light')">
+            <i class="bx bx-sun header-link-icon"></i>
+          </a>
+        </div>
+        <!-- End light and dark theme -->
+
+        <!-- Header Cart item -->
+        <div
+          class="header-element cart-dropdown hs-dropdown ti-dropdown md:!block !hidden py-[1rem] md:px-[0.65rem] px-2 [--placement:bottom-right] [--auto-close:true] rtl:[--placement:bottom-left] ">
+          <button id="dropdown-cart" type="button"
+            class="hs-dropdown-toggle relative ti-dropdown-toggle !p-0 !border-0 flex-shrink-0  !rounded-full !shadow-none align-middle text-xs">
+            <i class="bx bx-cart header-link-icon"></i>
+            <span class="flex absolute h-5 w-5 -top-[0.25rem] end-0 -me-[0.6rem]">
+              <span
+                class="relative inline-flex rounded-full h-[14.7px] w-[14px] text-[0.625rem] bg-primary text-white justify-center items-center"
+                id="cart-icon-badge">{{ cartItemCount }}</span>
+            </span>
+          </button>
+          <div
+            class="main-header-dropdown bg-white !-mt-3 !p-0 hs-dropdown-menu ti-dropdown-menu w-[22rem] border-0 border-defaultborder hidden"
+            aria-labelledby="dropdown-cart">
+            <div class="ti-dropdown-header !bg-transparent flex justify-between items-center !m-0 !p-4">
+              <p class="text-defaulttextcolor  !text-[1.0625rem] dark:text-[#8c9097] dark:text-white/50 font-semibold">
+                Cart Items</p>
+              <a href="javascript:void(0);"
+                class="font-[600] py-[0.25/2rem] px-[0.45rem] rounded-[0.25rem] bg-success/10 text-success text-[0.75em] "
+                id="cart-data">{{ cartItemCount }} Items</a>
+            </div>
+            <div>
+              <hr class="dropdown-divider dark:border-white/10">
+            </div>
+            @if(headeData.cartItems.length>0){
+            <ul class="list-none mb-0" id="header-cart-items-scroll">
+              @for (item of headeData.cartItems; track $index) {
+              <li class="ti-dropdown-item border-b dark:border-defaultborder/10 border-defaultborder" [id]="item.id">
+                <div class="flex items-start cart-dropdown-item">
+
+                  <img [src]="item.img" alt="img"
+                    class="!h-[1.75rem] !w-[1.75rem] leading-[1.75rem] text-[0.65rem] rounded-[50%] br-5 me-3">
+
+                  <div class="grow">
+                    <div class="flex items-start justify-between mb-0">
+                      <div
+                        class="mb-0 !text-[0.8125rem] text-[#232323] font-semibold dark:text-[#8c9097] dark:text-white">
+                        <a href="javascript:void(0);">{{ item.name }}</a>
+                      </div>
+
+                      <div class="inline-flex">
+                        <span class="text-black mb-1 font-semibold! dark:text-white ">{{ item.price }}</span>
+                        <a aria-label="anchor" (click)="removeRow(item.id,$event)"
+                          class="header-cart-remove ltr:float-right rtl:float-left dropdown-item-close">
+                          <i class="ti ti-trash"></i>
+                        </a>
+                      </div>
+                    </div>
+
+                    <div class="min-w-fit flex items-start justify-between">
+                      <ul class="header-product-item dark:text-white/50 flex gap-2">
+                        @for (tag of item.tags; track $index) {
+                        <li>{{ tag }}</li>
+                        }
+                        @if (item.freeShipping) {
+                        <li>
+                          <span
+                            class="font-[600] py-[0.25rem] px-[0.45rem] rounded-[0.25rem] bg-pink/10 text-pink text-[0.625rem]">
+                            Free shipping
+                          </span>
+                        </li>
+                        }
+                      </ul>
+                    </div>
+                  </div>
+                </div>
+              </li>
+              }
+            </ul>
+            @if(cartItemCount > 0){
+
+            <div class="p-3 empty-header-item ">
+              <div class="grid">
+                <a href="javascript:void(0);" class="w-full ti-btn ti-btn-primary-full p-2">Proceed to
+                  checkout</a>
+              </div>
+            </div>
+            }
+            }
+            @else {
+            <div class="p-[3rem] empty-item ">
+              <div class="text-center">
+                <span class="!w-[4rem] !h-[4rem] !leading-[4rem] rounded-[50%] avatar bg-warning/10 !text-warning">
+                  <i class="ri-shopping-cart-2-line text-[2rem]"></i>
+                </span>
+                <h6 class="font-bold mb-1 mt-3 text-[1rem] text-defaulttextcolor dark:text-white">Your Cart is Empty
+                </h6>
+                <span
+                  class="mb-3 !font-normal text-[0.8125rem] block text-defaulttextcolor dark:text-[#8c9097] dark:text-white/50">Add
+                  some items to make me happy :)</span>
+                <a href="javascript:void(0);"
+                  class="ti-btn ti-btn-primary btn-wave ti-btn-wave btn-sm m-1 !text-[0.75rem] !py-[0.25rem] !px-[0.5rem]"
+                  data-abc="true">continue shopping <i class="bi bi-arrow-right ms-1"></i></a>
+              </div>
+            </div>
+            }
+
+          </div>
+        </div>
+        <!--End Header cart item  -->
+
+        <!--Header Notifictaion -->
+        <div
+          class="header-element py-[1rem] md:px-[0.65rem] px-2 notifications-dropdown header-notification hs-dropdown ti-dropdown !hidden md:!block [--placement:bottom-right] rtl:[--placement:bottom-left]">
+          <button id="dropdown-notification" type="button"
+            class="hs-dropdown-toggle relative ti-dropdown-toggle !p-0 !border-0 flex-shrink-0  !rounded-full !shadow-none align-middle text-xs">
+            <i class="bx bx-bell header-link-icon  text-[1.125rem]"></i>
+            <span class="flex absolute h-5 w-5 -top-[0.25rem] end-0  -me-[0.6rem]">
+              <span
+                class="animate-slow-ping absolute inline-flex -top-[2px] -start-[2px] h-full w-full rounded-full bg-secondary/40 opacity-75"></span>
+              <span
+                class="relative inline-flex justify-center items-center rounded-full  h-[14.7px] w-[14px] bg-secondary text-[0.625rem] text-white"
+                id="notification-icon-badge">{{notificationItemCount}}</span>
+            </span>
+          </button>
+          <div
+            class="main-header-dropdown !-mt-3 !p-0 hs-dropdown-menu ti-dropdown-menu bg-white !w-[22rem] border-0 border-defaultborder dark:!border-defaultborder/10 hidden !m-0"
+            aria-labelledby="dropdown-notification">
+
+            <div class="ti-dropdown-header !m-0 !p-4 !bg-transparent flex justify-between items-center">
+              <p
+                class="mb-0 text-[1.0625rem] text-defaulttextcolor font-semibold dark:text-[#8c9097] dark:text-white/50">
+                Notifications</p>
+              <span
+                class="text-[0.75em] py-[0.25rem/2] px-[0.45rem] font-[600] rounded-sm bg-secondary/10 text-secondary"
+                id="notifiation-data">{{notificationItemCount}} Unread</span>
+            </div>
+            <div class="dropdown-divider "></div>
+            <ul class="list-none !m-0 !p-0 end-0" id="header-notification-scroll" (click)="handleCardClick($event)">
+              @for (item of headeData.notifications; track $index) {
+              <li class="ti-dropdown-item dropdown-item !block">
+                <div class="flex items-start">
+                  <div class="pe-2">
+                    <span
+                      [class]="`inline-flex justify-center items-center !w-[2.5rem] !h-[2.5rem] !leading-[2.5rem] !text-[0.8rem] rounded-[50%]  ${item.colorClass}  ${item.bgClass}`">
+                      <i [class]="`ti  ${item.icon}  text-[1.125rem]`"></i>
+                    </span>
+                  </div>
+
+                  <div class="grow flex items-center justify-between">
+                    <div>
+                      <p class="mb-0 text-defaulttextcolor dark:text-white text-[0.8125rem] font-semibold">
+                        <a href="javascript:void(0);">{{ item.title }} </a>
+                        @if(item.orderId){
+                        <span [class]="item.colorClass">ID:{{item.orderId}}</span>
+                        }
+                      </p>
+                      <span class="text-[#8c9097] dark:text-white/50 font-normal text-[0.75rem]">
+                        {{ item.description }}
+                      </span>
+                    </div>
+
+                    <div>
+                      <a href="javascript:void(0);" (click)="removeNotification(item.id, $event)"
+                        class="min-w-fit text-[#8c9097] dark:text-white/50 me-1">
+                        <i class="ti ti-x text-[1rem]"></i>
+                      </a>
+                    </div>
+                  </div>
+                </div>
+              </li>
+              }
+            </ul>
+            @if (headeData.notifications.length > 0){
+            <div class="p-4 empty-header-item1 mt-2 border-t border-defaultborder dark:border-defaultborder/10">
+              <div class="grid">
+                <a href="javascript:void(0);" class="ti-btn ti-btn-primary-full !m-0 w-full p-2">View All</a>
+              </div>
+            </div>
+            }
+            @if (headeData.notifications.length === 0){
+
+            <div class="p-[3rem] empty-item1 ">
+              <div class="text-center">
+                <span
+                  class="!h-[4rem]  !w-[4rem] avatar !leading-[4rem] !rounded-full !bg-secondary/10 !text-secondary">
+                  <i class="ri-notification-off-line text-[2rem]  "></i>
+                </span>
+                <h6 class="font-semibold mt-3 text-defaulttextcolor dark:text-white text-[1rem]">No New Notifications
+                </h6>
+              </div>
+            </div>
+            }
+          </div>
+        </div>
+        <!--End Header Notifictaion -->
+
+        <!-- Related Apps -->
+        <div
+          class="header-element header-apps dark:text-[#8c9097] dark:text-white/50 py-[1rem] md:px-[0.65rem] px-2 hs-dropdown ti-dropdown md:!block !hidden [--placement:bottom-left] [--auto-close:true]">
+
+          <button aria-label="button" id="dropdown-apps" type="button"
+            class="hs-dropdown-toggle ti-dropdown-toggle !p-0 !border-0 flex-shrink-0  !rounded-full !shadow-none text-xs">
+            <i class="bx bx-grid-alt header-link-icon text-[1.125rem]"></i>
+          </button>
+
+          <div
+            class="main-header-dropdown !-mt-3 hs-dropdown-menu ti-dropdown-menu !w-[22rem] border-0 border-defaultborder   hidden"
+            aria-labelledby="dropdown-apps">
+
+            <div class="p-4">
+              <div class="flex items-center justify-between">
+                <p
+                  class="mb-0 text-defaulttextcolor text-[1.0625rem] dark:text-[#8c9097] dark:text-white/50 font-semibold">
+                  Related Apps</p>
+              </div>
+            </div>
+            <div class="dropdown-divider mb-0"></div>
+            <div class="ti-dropdown-divider divide-y divide-gray-200 dark:divide-white/10 main-header-shortcuts p-2"
+              id="header-shortcut-scroll">
+              <div class="grid grid-cols-3 gap-2">
+                @for (app of headeData.relatedApps; track $index) {
+                <div class="">
+                  <a href="javascript:void(0);"
+                    class="p-4 items-center related-app block text-center rounded-sm hover:!bg-gray-100 dark:hover:!bg-black/20">
+                    <div>
+                      <img [src]="app.img" [alt]="app.alt"
+                        class="!h-[1.75rem] !w-[1.75rem] text-2xl avatar text-primary flex justify-center items-center mx-auto">
+                      <div class="text-[0.75rem] text-defaulttextcolor dark:text-[#8c9097] dark:text-white/50">
+                        {{ app.name }}
+                      </div>
+                    </div>
+                  </a>
+                </div>
+                }
+              </div>
+            </div>
+            <div class="p-4 first:pt-0 border-t border-defaultborder dark:border-defaultborder/10">
+              <a class="w-full ti-btn ti-btn-primary-full p-2 !m-0" href="javascript:void(0);">
+                View All
+              </a>
+            </div>
+
+          </div>
+        </div>
+        <!--End Related Apps -->
+
+        <!-- Fullscreen -->
+        <div class="header-element header-fullscreen py-[1rem] md:px-[0.65rem] px-2" appFullscreen>
+          <!-- Start::header-link -->
+          <a aria-label="anchor" (click)="toggleFullscreen()" href="javascript:void(0);"
+            class="inline-flex flex-shrink-0 justify-center items-center gap-2  !rounded-full font-medium dark:hover:bg-black/20 dark:text-[#8c9097] dark:text-white/50 dark:hover:text-white dark:focus:ring-white/10 dark:focus:ring-offset-white/10">
+            @if (isFullscreen) {
+            <i class="bx bx-exit-fullscreen full-screen-close header-link-icon hidden"></i>
+            } @else {
+            <i class="bx bx-fullscreen full-screen-open header-link-icon"></i>
+            }
+          </a>
+          <!-- End::header-link -->
+        </div>
+        <!-- End Full screen -->
+
+        <!-- Header Profile -->
+        <div
+          class="header-element md:!px-[0.65rem] px-2 hs-dropdown !items-center ti-dropdown  [--placement:bottom-right]">
+
+          <button id="dropdown-profile" type="button"
+            class="hs-dropdown-toggle ti-dropdown-toggle !gap-2 !p-0 flex-shrink-0 !rounded-full !shadow-none text-xs align-middle !border-0 !shadow-transparent hover:!bg-transparent ">
+            <img class="inline-block rounded-full " src="./assets/images/faces/9.jpg" width="32" height="32"
+              alt="Image Description">
+            <div class="md:block hidden dropdown-profile">
+              <p class="font-semibold mb-0 leading-none text-[#536485] text-[0.813rem] ">{{ getDisplayName() }}</p>
+              <span class="opacity-[0.7] font-normal text-[#536485] block text-[0.6875rem] ">{{ getPrimaryRole() }}</span>
+            </div>
+          </button>
+          <div
+            class="hs-dropdown-menu ti-dropdown-menu !-mt-3 border-0 w-[11rem] !p-0 border-defaultborder hidden main-header-dropdown  pt-0 overflow-hidden header-profile-dropdown dropdown-menu-end"
+            aria-labelledby="dropdown-profile">
+
+            <ul class="text-defaulttextcolor font-medium dark:text-[#8c9097] dark:text-white/50">
+              @for (item of headeData.menuItems; track $index) {
+              <li>
+                <a href="javascript:void(0);" (click)="handleProfileItemClick(item, $event)"
+                  class="w-full ti-dropdown-item !text-[0.8125rem] !gap-x-0 !p-[0.65rem] !inline-flex">
+
+                  <i class="ti {{ item.icon }} text-[1.125rem] me-2 opacity-[0.7]"></i>
+
+                  {{ item.label }}
+
+                  @if (item.badge) {
+                  <span
+                    class="!py-1 !px-[0.45rem] !font-semibold !rounded-sm text-success text-[0.75em] bg-success/10 ms-auto">
+                    {{ item.badge }}
+                  </span>
+                  }
+                </a>
+              </li>
+              }
+            </ul>
+          </div>
+        </div>
+        <!-- End Header Profile -->
+
+        <!-- Switcher Icon -->
+        <div class="header-element md:px-[0.48rem]">
+          <button aria-label="button" type="button"
+            class="hs-dropdown-toggle switcher-icon focus-visible:outline-none inline-flex flex-shrink-0 justify-center items-center gap-2  rounded-full font-medium  align-middle transition-all text-xs dark:text-[#8c9097] dark:text-white/50 dark:hover:text-white dark:focus:ring-white/10 dark:focus:ring-offset-white/10"
+            data-hs-overlay="#hs-overlay-switcher" data-hs-overlay-options='{
+      "backdrop": true,
+      "isClosePrev": true
+    }'>
+            <i class="bx bx-cog header-link-icon animate-spin-slow !p-0 !block"></i>
+          </button>
+        </div>
+        <!-- Switcher Icon -->
+
+
+        <!-- End::header-element -->
+      </div>
+    </div>
+  </nav>
+</header>
+<!-- End::Header -->
+
+
+
+<div id="search-modal"
+  class="hs-overlay  ti-modal hidden mt-[1.75rem] hs-overlay-backdrop-open:!bg-[#32325180] dark:hs-overlay-backdrop-open:!bg-[#323251cc] pointer-events-none">
+  <div class="ti-modal-box pointer-events-auto">
+    <div class="ti-modal-content !border !border-defaultborder dark:!border-defaultborder/10 !rounded-[0.5rem]">
+      <div class="ti-modal-body">
+
+        <div class="input-group border-[2px] border-primary rounded-[0.25rem] w-full flex">
+          <a aria-label="anchor" href="javascript:void(0);"
+            class="input-group-text flex items-center bg-light border-e-[#dee2e6] !py-[0.375rem] border-0! !px-[0.75rem] !rounded-none !text-[0.875rem]"
+            id="Search-Grid">
+            <i class="fe fe-search header-link-icon text-[0.875rem]"></i>
+          </a>
+
+          <input type="search" class="form-control border-0! px-2 !text-[0.8rem] w-full focus:ring-transparent"
+            placeholder="Search" aria-label="Username" [(ngModel)]="text" (keyup)="Search(text)" type="search">
+
+          <a aria-label="anchor" href="javascript:void(0);"
+            class="flex items-center input-group-text bg-light !py-[0.375rem] !px-[0.75rem]" id="voice-search"><i
+              class="fe fe-mic header-link-icon"></i></a>
+          <div class="hs-dropdown ti-dropdown">
+            <a aria-label="anchor" href="javascript:void(0);"
+              class="flex items-center hs-dropdown-toggle ti-dropdown-toggle border-0! border-defaultborder dark:border-defaultborder/10 btn btn-light btn-icon !bg-light !py-[0.375rem] !rounded-none !px-[0.75rem] text-[0.95rem] h-[2.413rem] w-[2.313rem]">
+              <i class="fe fe-more-vertical"></i>
+            </a>
+
+            <ul class="absolute hs-dropdown-menu ti-dropdown-menu !-mt-2 !p-0 hidden">
+              <li><a
+                  class="ti-dropdown-item flex text-defaulttextcolor dark:text-defaulttextcolor/70 !py-[0.5rem] !px-[0.9375rem] !text-[0.8125rem] font-medium"
+                  href="javascript:void(0);">Action</a></li>
+              <li><a
+                  class="ti-dropdown-item flex text-defaulttextcolor dark:text-defaulttextcolor/70 !py-[0.5rem] !px-[0.9375rem] !text-[0.8125rem] font-medium"
+                  href="javascript:void(0);">Another action</a></li>
+              <li><a
+                  class="ti-dropdown-item flex text-defaulttextcolor dark:text-defaulttextcolor/70 !py-[0.5rem] !px-[0.9375rem] !text-[0.8125rem] font-medium"
+                  href="javascript:void(0);">Something else here</a></li>
+              <li>
+                <hr class="dropdown-divider">
+              </li>
+              <li><a
+                  class="ti-dropdown-item flex text-defaulttextcolor dark:text-defaulttextcolor/70 !py-[0.5rem] !px-[0.9375rem] !text-[0.8125rem] font-medium"
+                  href="javascript:void(0);">Separated link</a></li>
+            </ul>
+          </div>
+        </div>
+
+
+        <div class="mt-5">
+          <p class="font-normal  text-[#8c9097] dark:text-white/50 text-[0.813rem] dark:text-gray-200 mb-2">Are You
+            Looking For...</p>
+          @if (menuItems && menuItems.length > 0) {
+
+          <div
+            class=" w-full mb-2! bg-white dark:!bg-bodybg shadow-md  top-[2.5rem] !rounded-s rounded-md border border-defaultborder dark:!border-defaultborder/10">
+
+            <ul class="divide-y divide-gray-200">
+              @for (menuItem of menuItems | slice:0:5;track $index) {
+
+              <li [routerLink]="menuItem?.path"
+                class="p-3  dark:!border-defaultborder/10 cursor-pointer flex items-center hover:bg-primary hover:text-white "
+                (click)="clearSearch()">
+                <i class="fe fe-chevrons-right mx-1 customsearcharrow  rtl:rotate-[180deg]"></i>
+                <span class="truncate">{{ menuItem?.title }}</span>
+              </li>
+              }
+            </ul>
+          </div>
+          }
+          @for (tag of headeData.searchTags; track tag.id) {
+          <span class="search-tags text-[0.75rem] !py-[0rem] !px-[0.55rem] border-defaultborder dark:!border-defaultborder/10">
+            <i class="fe {{tag.icon}} me-2"></i> {{tag.label}}
+            <a href="javascript:void(0);" (click)="removeAlert(headeData.searchTags,tag.id)"  class="tag-addon header-remove-btn">
+              <span class="sr-only">Remove badge</span><i class="fe fe-x text-[10px]"></i>
+            </a>
+          </span>
+          }
+
+
+        </div>
+
+
+
+        <div class="my-[1.5rem]">
+          <p class="font-normal  text-[#8c9097] dark:text-white/50 text-[0.813rem] mb-2">Recent Search :</p>
+
+          @for (alert of headeData.alertItems; track alert.id) {
+          <div role="alert"
+            class="!p-2 border border-defaultborder dark:border-defaultborder/10 rounded-[0.3125rem] flex items-center text-defaulttextcolor dark:text-defaulttextcolor/70 !mb-2 !text-[0.8125rem] alert">
+
+            <a [routerLink]="alert.link">
+              <span>{{ alert.label }}</span>
+            </a>
+
+            <a (click)="removeAlert(headeData.alertItems,alert.id)" aria-label="anchor"
+              class="ms-auto leading-none cursor-pointer" href="javascript:void(0);">
+              <i class="fe fe-x !text-[0.8125rem] text-[#8c9097] dark:text-white/50"></i>
+            </a>
+          </div>
+          }
+        </div>
+
+      </div>
+
+      <div
+        class="ti-modal-footer !border !border-defaultborder dark:!border-defaultborder/10  !py-[1rem] !px-[1.25rem]">
+        <div class="inline-flex rounded-md  shadow-sm">
+          <button type="button"
+            class="ti-btn-group focus-visible:outline-none !px-[0.75rem] !py-[0.45rem]  rounded-s-[0.25rem] !rounded-e-none ti-btn-primary !text-[0.75rem] dark:border-white/10">
+            Search
+          </button>
+          <button type="button"
+            class="ti-btn-group  ti-btn-primary-full rounded-e-[0.25rem] dark:border-white/10 !text-[0.75rem] !rounded-s-none !px-[0.75rem] !py-[0.45rem]">
+            Clear Recents
+          </button>
+        </div>
+      </div>
+    </div>
+  </div>
+
+</div>
diff --git a/src/app/shell/ui/header/header.scss b/src/app/shell/ui/header/header.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/src/app/shell/ui/header/header.ts b/src/app/shell/ui/header/header.ts
new file mode 100644
index 00000000..e47f9e23
--- /dev/null
+++ b/src/app/shell/ui/header/header.ts
@@ -0,0 +1,318 @@
+import { Component, DOCUMENT, ElementRef, Renderer2, inject } from '@angular/core';
+import { Menu, NavService } from '../../../core/services/common/nav.service';
+import * as headeData from "./headerdata"
+import { AppStateService } from '../../../core/services/common/app-state.service';
+import { Subscription } from 'rxjs';
+import { Router, RouterLink } from '@angular/router';
+import { FullscreenDirective } from '../../../shared/directives/fullscreen.directive';
+import { FormsModule } from '@angular/forms';
+import { SlicePipe } from '@angular/common';
+import { AuthService } from '../../../core/services/auth/auth.service';
+interface Item {
+  id: number;
+  name: string;
+  type: string;
+  title: string;
+  // Add other properties as needed
+}
+declare const HSStaticMethods: any;
+@Component({
+    selector: 'app-header',
+    templateUrl: './header.html',
+    styleUrls: ['./header.scss'],
+    imports: [RouterLink, FullscreenDirective, FormsModule, SlicePipe]
+})
+
+export class Header {
+  headeData = headeData;
+  public menuItems!: Menu[];
+  public menuitemsSubscribe$!: Subscription;
+  public NavServices = inject(NavService)
+  private appStateService = inject(AppStateService)
+  private readonly authService = inject(AuthService);
+  private readonly router = inject(Router);
+  readonly currentUser = this.authService.currentUserSignal;
+  Selector = (selector: any) => document.querySelector(selector);
+
+  SelectorAll = (selector: any) => document.querySelectorAll(selector);
+
+  private doc = inject(DOCUMENT);
+  toggleSidebar() {
+    const html = this.doc.documentElement;
+    // Check the window width
+    if (window.innerWidth <= 992) {
+      let dataToggled = html.getAttribute("data-toggled");
+
+      if (dataToggled == "open") {
+        html.setAttribute("data-toggled", "close");
+      } else {
+        html.setAttribute("data-toggled", "open");
+      }
+    }
+    else {
+      let menuNavLayoutType = html.getAttribute("data-nav-style");
+      let verticalStyleType = html.getAttribute("data-vertical-style");
+
+      if (menuNavLayoutType) {
+        let dataToggled = html.getAttribute("data-toggled");
+        if (dataToggled) {
+          html.removeAttribute("data-toggled");
+        } else {
+          html.setAttribute(
+            "data-toggled",
+            menuNavLayoutType + "-closed",
+          );
+        }
+      } else if (verticalStyleType) {
+        let dataToggled = html.getAttribute("data-toggled");
+
+        if (verticalStyleType == "doublemenu") {
+          if (
+            html.getAttribute("data-toggled") === "double-menu-open" && this.Selector(".double-menu-active")) {
+            html.setAttribute("data-toggled", "double-menu-close");
+          } else {
+            if (this.Selector(".double-menu-active")) { html.setAttribute("data-toggled", "double-menu-open"); }
+          }
+        } else if (dataToggled) {
+          html.removeAttribute("data-toggled");
+        } else {
+          switch (verticalStyleType) {
+            case "closed":
+              html.setAttribute(
+                "data-toggled",
+                "close-menu-close",
+              );
+              break;
+            case "icontext":
+              html.setAttribute(
+                "data-toggled",
+                "icon-text-close",
+              );
+              break;
+            case "overlay":
+              html.setAttribute(
+                "data-toggled",
+                "icon-overlay-close",
+              );
+              break;
+            case "detached":
+              html.setAttribute("data-toggled", "detached-close");
+              break;
+            default:
+          }
+        }
+      }
+    }
+  }
+
+
+  public items: Menu[] = []; // Your full menu data (source)
+  public text: string = '';
+  public SearchResultEmpty: boolean = false;
+  public isDropdownVisible: boolean = false;
+  Search(searchText: string) {
+    // 2. Safety Check: If search is empty or source data hasn't loaded
+    if (!searchText || !this.items) {
+      this.menuItems = [];
+      this.SearchResultEmpty = false;
+      return;
+    }
+
+    const results: Menu[] = [];
+    const query = searchText.toLowerCase().trim();
+
+    // 3. Deep search through 3 levels of menu
+    this.items.forEach((level1: Menu) => {
+      // Check Level 1
+      if (level1.title?.toLowerCase().includes(query)) {
+        results.push(level1);
+      }
+
+      // Check Level 2 (Children)
+      if (level1.children) {
+        level1.children.forEach((level2: Menu) => {
+          if (level2.title?.toLowerCase().includes(query)) {
+            results.push(level2);
+          }
+
+          // Check Level 3 (Sub-children)
+          if (level2.children) {
+            level2.children.forEach((level3: Menu) => {
+              if (level3.title?.toLowerCase().includes(query)) {
+                results.push(level3);
+              }
+            });
+          }
+        });
+      }
+    });
+
+    // 4. Update UI State
+    this.menuItems = results;
+    this.SearchResultEmpty = results.length === 0;
+  }
+
+
+
+  //  Used to clear previous search result
+  clearSearch() {
+    const headerSearch = this.Selector('.header-search');
+    if (headerSearch) {
+      headerSearch.classList.remove('searchdrop');
+    }
+    this.text = '';
+    this.menuItems = [];
+    this.SearchResultEmpty = false;
+    return this.text, this.menuItems;
+
+  }
+
+  updateTheme(theme: string) {
+
+
+    this.appStateService.updateState({ theme, menuColor: theme, headerColor: theme });
+    if (theme == 'light') {
+      this.appStateService.updateState({ theme, themeBackground: '', headerColor: 'light', menuColor: 'dark' });
+      let html = document.querySelector('html');
+      html?.style.removeProperty('--color-bodybg');
+      html?.style.removeProperty('--color-bodybg2');
+      html?.style.removeProperty('--color-light');
+      html?.style.removeProperty('--color-formcontrolbg');
+      html?.style.removeProperty('--color-inputborder');
+      html?.style.removeProperty('--color-gray3');
+      if (window.innerWidth <= 992) {
+        html?.setAttribute('data-toggled', 'close');
+      }
+    }
+    if (theme == 'dark') {
+      this.appStateService.updateState({ theme, themeBackground: '', headerColor: 'dark', menuColor: 'dark' });
+      let html = document.querySelector('html');
+      html?.style.removeProperty('--color-bodybg');
+      html?.style.removeProperty('--color-bodybg2');
+      html?.style.removeProperty('--color-light');
+      html?.style.removeProperty('--color-formcontrolbg');
+      html?.style.removeProperty('--color-inputborder');
+      html?.style.removeProperty('--color-gray3');
+      if (window.innerWidth <= 992) {
+        html?.setAttribute('data-toggled', 'close');
+      }
+    }
+  }
+
+
+  cartItemCount = this.headeData.cartItems.length;
+  notificationItemCount = this.headeData.notifications.length;
+  handleCardClick(event: MouseEvent) {
+    // Prevent the click event from propagating to the container
+    event.stopPropagation();
+  }
+  removeRow(itemId: string,event: MouseEvent) {
+    const index = this.headeData.cartItems.findIndex(i => i.id === itemId);
+    if (index !== -1) {
+      this.headeData.cartItems.splice(index, 1);
+    }
+    this.updateCartItemCount();
+      event.stopPropagation();
+  }
+  updateCartItemCount() {
+    this.cartItemCount = this.headeData.cartItems.length;
+  }
+
+  removeNotification(id: number, event: Event): void {
+    event.preventDefault(); // Prevent link navigation
+    this.headeData.notifications.splice(
+      this.headeData.notifications.findIndex(item => item.id === id),
+      1
+    );
+
+    this.updatenotificationsItemCount();
+  }
+
+  updatenotificationsItemCount() {
+    this.notificationItemCount = this.headeData.notifications.length;
+  }
+
+  isFullscreen: boolean = false;
+  toggleFullscreen() {
+
+    this.isFullscreen = !this.isFullscreen;
+  }
+
+
+
+  removeAlert<T extends { id: string }>(array: T[], id: string): void {
+    const index = array.findIndex(item => item.id === id);
+
+    if (index !== -1) {
+      array.splice(index, 1);
+    }
+  }
+
+  ngOnInit(): void {
+    this.NavServices.items.subscribe((menuItems) => {
+      this.items = menuItems;
+    });
+  }
+
+  ngAfterViewInit(): void {
+    HSStaticMethods.autoInit();
+  }
+
+  getDisplayName(): string {
+    const email = this.currentUser()?.email?.trim();
+    if (email) {
+      const localPart = email.split('@')[0];
+      const formatted = localPart
+        .replace(/[._-]+/g, ' ')
+        .replace(/\s+/g, ' ')
+        .trim();
+
+      if (formatted) {
+        return formatted
+          .split(' ')
+          .filter(Boolean)
+          .map((part: string) => part.charAt(0).toUpperCase() + part.slice(1).toLowerCase())
+          .join(' ');
+      }
+    }
+
+    return this.currentUser()?.displayName?.trim() || 'User';
+  }
+
+  getPrimaryRole(): string {
+    const roles = this.currentUser()?.roles;
+    if (roles && roles.length > 0) {
+      const role = roles[0].trim();
+      if (role) {
+        return role
+          .replace(/[_-]+/g, ' ')
+          .replace(/\s+/g, ' ')
+          .split(' ')
+          .filter(Boolean)
+          .map((part: string) => part.charAt(0).toUpperCase() + part.slice(1).toLowerCase())
+          .join(' ');
+      }
+    }
+
+    return 'User';
+  }
+
+  handleProfileItemClick(item: { label?: string; link?: string | null }, event: MouseEvent): void {
+    event.preventDefault();
+
+    if (item.label === 'Log Out') {
+      this.logout();
+      return;
+    }
+
+    if (item.link) {
+      void this.router.navigateByUrl(item.link);
+    }
+  }
+
+  logout(): void {
+    this.authService.logout();
+    void this.router.navigate(['/auth/login']);
+  }
+}
+
diff --git a/src/app/shell/ui/header/headerdata.ts b/src/app/shell/ui/header/headerdata.ts
new file mode 100644
index 00000000..15f150a3
--- /dev/null
+++ b/src/app/shell/ui/header/headerdata.ts
@@ -0,0 +1,102 @@
+export const languages = [
+  { name: 'English', flag: './assets/images/flags/us_flag.jpg' },
+  { name: 'Spanish', flag: './assets/images/flags/spain_flag.jpg' },
+  { name: 'French', flag: './assets/images/flags/french_flag.jpg' },
+  { name: 'German', flag: './assets/images/flags/germany_flag.jpg' },
+  { name: 'Italian', flag: './assets/images/flags/italy_flag.jpg' },
+  { name: 'Russian', flag: './assets/images/flags/russia_flag.jpg' }
+];
+
+
+export const cartItems = [
+  { id: 'row1', name: 'SomeThing Phone', price: '$1,299.00', img: './assets/images/ecommerce/jpg/1.jpg', tags: ['Metallic Blue', '6gb Ram'] },
+  { id: 'row2', name: 'Stop Watch', price: '$179.29', img: './assets/images/ecommerce/jpg/3.jpg', tags: ['Analog'], freeShipping: true },
+  { id: 'row3', name: 'Photo Frame', price: '$29.00', img: './assets/images/ecommerce/jpg/5.jpg', tags: ['Decorative'] },
+  { id: 'row4', name: 'Kikon Camera', price: '$4,999.00', img: './assets/images/ecommerce/jpg/4.jpg', tags: ['Black', '50MM'] },
+  { id: 'row5', name: 'Canvas Shoes', price: '$129.00', img: './assets/images/ecommerce/jpg/6.jpg', tags: ['Gray', 'Sports'] },
+];
+
+
+
+export const notifications = [
+  {
+    id: 1,
+    type: 'shipment',
+    icon: 'ti-gift',
+    colorClass: 'text-primary',
+    bgClass: 'bg-primary/10',
+    title: 'Your Order Has Been Shipped',
+    description: 'Order No: 123456 Has Shipped To Your Delivery Address',  },
+  {
+    id: 2,
+    type: 'discount',
+    icon: 'ti-discount-2',
+    colorClass: 'text-secondary',
+    bgClass: 'bg-secondary/10',
+    title: 'Discount Available',
+    description: 'Discount Available On Selected Products',  },
+  {
+    id: 3,
+    type: 'verify',
+    icon: 'ti-user-check',
+    colorClass: 'text-pink',
+    bgClass: 'bg-pink/10',
+    title: 'Account Has Been Verified',
+    description: 'Your Account Has Been Verified Successfully',  },
+  {
+    id: 4,
+    type: 'placed',
+    icon: 'ti-circle-check',
+    colorClass: 'text-warning',
+    bgClass: 'bg-warning/10',
+    title: 'Order Placed',
+    description: 'Order Placed Successfully',
+    orderId: '#1116773'
+  },
+  {
+    id: 5,
+    type: 'delayed',
+    icon: 'ti-clock',
+    colorClass: 'text-success',
+    bgClass: 'bg-success/10',
+    title: 'Order Delayed',
+    description: 'Order Delayed Unfortunately',
+    orderId: '7731116'
+  }
+];
+
+export const relatedApps = [
+  { name: 'Figma', img: './assets/images/apps/figma.png', alt: 'figma' },
+  { name: 'Power Point', img: './assets/images/apps/microsoft-powerpoint.png', alt: 'microsoft' },
+  { name: 'MS Word', img: './assets/images/apps/microsoft-word.png', alt: 'msword' },
+  { name: 'Calendar', img: './assets/images/apps/calender.png', alt: 'calendar' },
+  { name: 'Sketch', img: './assets/images/apps/sketch.png', alt: 'sketch' },
+  { name: 'Docs', img: './assets/images/apps/google-docs.png', alt: 'docs' },
+  { name: 'Google', img: './assets/images/apps/google.png', alt: 'google' },
+  { name: 'Translate', img: './assets/images/apps/translate.png', alt: 'translate' },
+  { name: 'Sheets', img: './assets/images/apps/google-sheets.png', alt: 'sheets' }
+];
+
+
+export const menuItems = [
+  { label: 'Profile', link: '/pages/profile', icon: 'ti-user-circle' },
+  { label: 'Inbox', link: '/pages/email/mailapp', icon: 'ti-inbox', badge: '25' },
+  { label: 'Task Manager', link: '/pages/todolist', icon: 'ti-clipboard-check' },
+  { label: 'Settings', link: '/pages/email/mailsettings', icon: 'ti-adjustments-horizontal' },
+  { label: 'Bal: $7,12,950', link: null, icon: 'ti-wallet' }, // Special case for non-router link
+  { label: 'Support', link: '/pages/chat', icon: 'ti-headset' },
+  { label: 'Log Out', link: '/authentication/sign-in/cover', icon: 'ti-logout' },
+];
+
+export const searchTags = [
+  { id: 'tag1', label: 'People', icon: 'fe-user' },
+  { id: 'tag2', label: 'Pages', icon: 'fe-file-text' },
+  { id: 'tag3', label: 'Articles', icon: 'fe-align-left' },
+  { id: 'tag4', label: 'Tags', icon: 'fe-server' }
+];
+
+export const alertItems = [
+  { id: 'tag5', label: 'Notifications', link: '/pages/notifications' },
+  { id: 'tag6', label: 'Alerts', link: '/uielements/alerts' },
+  { id: 'tag7', label: 'Mail', link: '/pages/email/mailapp' }
+];
diff --git a/src/app/shell/ui/page-header/page-header.html b/src/app/shell/ui/page-header/page-header.html
new file mode 100644
index 00000000..044b00a6
--- /dev/null
+++ b/src/app/shell/ui/page-header/page-header.html
@@ -0,0 +1,35 @@
+@if(childTitle){
+<div class="block justify-between page-header md:flex">
+  <div>
+    <!-- <h3 class="!text-defaulttextcolor dark:!text-defaulttextcolor/70 dark:text-white dark:hover:text-white text-[1.125rem]! font-semibold">
+      {{childTitle}}</h3> -->
+  </div>
+  <!-- <ol class="flex items-center whitespace-nowrap min-w-0">
+    @if(parentTitle){
+    <li class="text-[0.813rem] sm:ps-[0.5rem] ps-0">
+      <a class="flex items-center text-primary hover:text-primary dark:text-primary truncate"
+        href="javascript:void(0);">
+        {{parentTitle}}
+        <i
+          class="ti ti-chevrons-right !text-defaulttextcolor dark:!text-defaulttextcolor/70 px-[0.5rem] overflow-visible rtl:rotate-180"></i>
+      </a>
+    </li>
+    }
+    @if(subParentTitle){
+    <li class="text-[0.813rem] ps-[0.5rem]">
+      <a class="flex items-center text-primary hover:text-primary dark:text-primary truncate"
+        href="javascript:void(0);">
+        {{subParentTitle}}
+        <i
+          class="ti ti-chevrons-right flex-shrink-0 !text-defaulttextcolor dark:!text-defaulttextcolor/70  px-[0.5rem] overflow-visible rtl:rotate-180"></i>
+      </a>
+    </li>
+    }
+    <li
+      class="text-[0.813rem] !text-defaulttextcolor dark:!text-defaulttextcolor/70  font-semibold hover:!text-primary "
+      aria-current="page">
+      {{childTitle}}
+    </li>
+  </ol> -->
+</div>
+}
diff --git a/src/app/shell/ui/page-header/page-header.scss b/src/app/shell/ui/page-header/page-header.scss
new file mode 100644
index 00000000..6fc90ede
--- /dev/null
+++ b/src/app/shell/ui/page-header/page-header.scss
@@ -0,0 +1,11 @@
+.page-header {
+	min-height: auto;
+	padding-top: 0.5rem;
+	padding-bottom: 0.5rem;
+	margin-bottom: 0.5rem;
+}
+
+.page-header-title {
+	margin: 0;
+	line-height: 1.25;
+}
diff --git a/src/app/shell/ui/page-header/page-header.ts b/src/app/shell/ui/page-header/page-header.ts
new file mode 100644
index 00000000..e7504809
--- /dev/null
+++ b/src/app/shell/ui/page-header/page-header.ts
@@ -0,0 +1,34 @@
+import { Component, input } from '@angular/core';
+import { ChildrenOutletContexts, NavigationEnd, Router } from '@angular/router';
+import { filter } from 'rxjs';
+
+@Component({
+    selector: 'app-page-header',
+    templateUrl: './page-header.html',
+    styleUrls: ['./page-header.scss']
+})
+export class PageHeader {
+  parentTitle?: string;
+  subParentTitle?: string;
+  childTitle?: string;
+
+  constructor(
+    private router: Router,
+    private childrenOutletContexts: ChildrenOutletContexts
+  ) {
+    this.router.events
+      .pipe(filter(event => event instanceof NavigationEnd))
+      .subscribe(() => {
+        const context = this.childrenOutletContexts.getContext('primary');
+        const routeData = context?.route?.snapshot?.data;
+        if (routeData) {
+          this.childTitle = routeData['childTitle'] ?? '';
+          this.parentTitle = routeData['parentTitle'] ?? '';
+          this.subParentTitle = routeData['subParentTitle'] ?? '';
+
+        }
+      });
+  }
+}
+
+
diff --git a/src/app/shell/ui/problem-details-toast/problem-details-toast.ts b/src/app/shell/ui/problem-details-toast/problem-details-toast.ts
new file mode 100644
index 00000000..be1879dc
--- /dev/null
+++ b/src/app/shell/ui/problem-details-toast/problem-details-toast.ts
@@ -0,0 +1,16 @@
+import { Component, Input } from '@angular/core';
+
+@Component({
+  selector: 'app-problem-details-toast',
+  standalone: true,
+  template: `
+    <div class="rounded-lg border border-danger/20 bg-danger/10 p-3 text-sm text-danger">
+      <div class="font-semibold">{{ title }}</div>
+      <div>{{ detail }}</div>
+    </div>
+  `,
+})
+export class ProblemDetailsToast {
+  @Input() title = 'Request failed';
+  @Input() detail = 'An unexpected error occurred.';
+}
diff --git a/src/app/shell/ui/sidebar/sidebar.html b/src/app/shell/ui/sidebar/sidebar.html
new file mode 100644
index 00000000..ec13545c
--- /dev/null
+++ b/src/app/shell/ui/sidebar/sidebar.html
@@ -0,0 +1,216 @@
+<aside class="app-sidebar" id="sidebar" [ngClass]="{ 'sticky-pin': scrolled }">
+
+  <!-- Start::main-sidebar-header -->
+  <div class="main-sidebar-header">
+    <a routerLink="/dashboards/crm" class="header-logo">
+      <!-- <img src="./assets/images/brand-logos/desktop-logo.png" alt="logo" class="desktop-logo">
+      <img src="./assets/images/brand-logos/toggle-logo.png" alt="logo" class="toggle-logo">
+      <img src="./assets/images/brand-logos/desktop-dark.png" alt="logo" class="desktop-dark">
+      <img src="./assets/images/brand-logos/toggle-dark.png" alt="logo" class="toggle-dark">
+      <img src="./assets/images/brand-logos/desktop-white.png" alt="logo" class="desktop-white">
+      <img src="./assets/images/brand-logos/toggle-white.png" alt="logo" class="toggle-white"> -->
+
+      <img src="assets/images/brand-logos/erp-logo-icon.png" alt="ERP Logo" class="desktop-logo" />
+
+      <img src="assets/images/brand-logos/erp-logo-icon.png" alt="ERP Logo" class="toggle-logo" />
+
+      <img src="assets/images/brand-logos/erp-logo-icon.png" alt="ERP Logo" class="desktop-dark" />
+
+      <img src="assets/images/brand-logos/erp-logo-icon.png" alt="ERP Logo" class="toggle-dark" />
+
+      <img src="assets/images/brand-logos/erp-logo-icon.png" alt="ERP Logo" class="desktop-white" />
+
+      <img src="assets/images/brand-logos/erp-logo-icon.png" alt="ERP Logo" class="toggle-white" />
+
+    </a>
+  </div>
+  <div>
+    <ngx-simplebar [options]="options" class="main-sidebar" id="sidebar-scroll">
+      <nav class="main-menu-container nav nav-pills flex-column sub-open">
+        <div class="slide-left" id="slide-left" (click)="leftArrowFn()">
+          <svg xmlns="http://www.w3.org/2000/svg" fill="#7b8191" width="24" height="24" viewBox="0 0 24 24">
+            <path d="M13.293 6.293 7.586 12l5.707 5.707 1.414-1.414L10.414 12l4.293-4.293z"></path>
+          </svg>
+        </div>
+
+        <ul class="main-menu" [ngStyle]="{ display: 'block' }">
+          @for (menuItem of menuItems; track menuItem) {
+          <li class="slide" #activeMenuItems [ngClass]="{'slide__category':menuItem.headTitle,
+                    'slide has-sub':menuItem.title,
+                    'open': menuItem.active,
+                    'active': menuItem.selected}">
+            <!-- head title  -->
+            @if(menuItem.headTitle){
+
+            <span class="category-name">{{ menuItem.headTitle }}</span>
+            }
+            <!-- has-Link -->
+            @if (menuItem.type === 'link') {
+            <a class="side-menu__item" [routerLink]="!menuItem.type ? null : [menuItem.path]" routerLinkActive="active"
+              (click)="setNavActive($event, menuItem.path ?? '')">
+              @if (menuItem.icon) {
+              <span [appSvgReplace]="menuItem.icon" class="iconclick"></span>
+              }
+              <span class="side-menu__label">{{ menuItem.title }}
+                @if(menuItem.badgeValue){
+
+                <span class="badge bg-{{ menuItem.badgeClass }} text-{{menuItem.badgeText}}">{{menuItem.badgeValue
+                  }}</span>
+                }
+              </span>
+            </a>
+            }
+            <!-- has-empty -->
+            @if (menuItem.type === 'empty') {
+            <a class="side-menu__item" href="javascript:;" (click)="setNavActive($event, menuItem.path ?? '')">
+              @if (menuItem.icon) {
+              <span [appSvgReplace]="menuItem.icon" class="iconclick"></span>
+              }
+              <span class="side-menu__label">{{menuItem.title}} <span class="badge bg-warning ms-2">hot</span>
+              </span>
+            </a>
+            }
+            <!-- has-Sub -->
+            @if (menuItem.type === 'sub') {
+            <a class="side-menu__item" [routerLink]="menuItem.type ? null: [menuItem.path]"
+              [ngClass]="{active: menuItem.selected}" (click)="toggleNavActive($event, menuItem )">
+              @if (menuItem.icon) {
+              <span [appSvgReplace]="menuItem.icon" class="iconclick"></span>
+              }
+              <span class="side-menu__label">{{menuItem.title}}
+                @if(menuItem.badgeValue){
+                <span
+                  class="badge bg-{{ menuItem.badgeClass }} text-{{menuItem.badgeText}} ms-2">{{menuItem.badgeValue}}</span>
+                }
+              </span>
+              <i class="fe fe-chevron-right side-menu__angle"></i>
+            </a>
+            }
+            <!-- 2nd Level menu -->
+            @if (menuItem.children) {
+            <ul class="slide-menu child1"
+              [ngClass]="{'active':menuItem.active,'double-menu-active':menuItem.active, 'force-left' : menuItem.dirchange}"
+              [ngStyle]="{ display: menuItem.active ? 'block' : 'none' }">
+              <li class="slide side-menu__label1"><a href="javascript:void(0)">{{menuItem.title}}</a></li>
+              @for (childrenItem of menuItem.children; track childrenItem) {
+              <li class="slide" activeMenuItems [ngClass]="{'active':childrenItem.selected}" appDropdownPosition
+                [ngClass]="{'has-sub': childrenItem.type === 'sub','open':childrenItem.active}">
+                <!-- link -->
+                @if (childrenItem.type === 'link') {
+                <a class="side-menu__item" [routerLink]="!childrenItem.type ? null : [childrenItem.path] "
+                  routerLinkActive="active" [routerLinkActiveOptions]="{exact: true}"
+                  (click)="setNavActive($event, childrenItem.path ?? '')">
+                  {{childrenItem.title}}
+                  @if(childrenItem.badgeClass){
+
+                  <span class="m-1 badge bg-{{ menuItem.badgeClass }}">{{menuItem.badgeValue }}</span>
+                  }
+
+                </a>
+                }
+                <!-- empty -->
+                @if (childrenItem.type === 'empty' ) {
+                <a class="side-menu__item " href="javascript:;" (click)="setNavActive($event, childrenItem.path ?? '')">
+                  {{childrenItem.title }}
+                </a>
+                }
+                <!-- sub -->
+                @if (childrenItem.type === 'sub') {
+                <a class="side-menu__item " [ngClass]="{'active': childrenItem.selected}"
+                  [routerLink]="childrenItem.type ? null : [childrenItem.path]"
+                  (click)="toggleNavActive($event, childrenItem)">
+                  <span class="">{{childrenItem.title}}</span>
+                  <i class="fe fe-chevron-right side-menu__angle"></i>
+                </a>
+                }
+                <!-- 3rd Level menu -->
+                @if (childrenItem.children) {
+                <ul class="slide-menu child2" force [ngClass]="{'force-left' : childrenItem.dirchange}" [ngStyle]="{
+                                  display: childrenItem.active ? 'block' : 'none',
+                                  right: localdata['dir'] == 'rtl' ? 'auto' : '',
+                      left: localdata['dir'] == 'rtl' ? '100%' : ''
+                                }">
+                  @for (childrenSubItem of childrenItem.children; track childrenSubItem) {
+                  <li class="slide" activeMenuItems appDropdownPosition [ngClass]="{open:childrenSubItem.active}">
+                    @if (childrenSubItem.type === 'link') {
+                    <a class="side-menu__item" routerLinkActive="active"
+                      [routerLink]="!childrenSubItem.type ?  null : [childrenSubItem.path]"
+                      [routerLinkActiveOptions]="{exact : true}">
+                      {{childrenSubItem.title}}
+                    </a>
+                    }
+                    @if (childrenSubItem.type === 'empty') {
+                    <a class="side-menu__item" href="javascript:;">
+                      {{childrenSubItem.title}}
+                    </a>
+                    }
+
+                    @if (childrenSubItem.type === 'sub') {
+                    <a class="side-menu__item " [ngClass]="{'active': childrenSubItem.active}"
+                      [routerLink]="childrenSubItem.type ? null : [childrenSubItem.path]" routerLinkActive="active"
+                      (click)="toggleNavActive($event, childrenSubItem)">
+                      <span class="">{{childrenSubItem.title}}</span>
+                      <i class="fe fe-chevron-right side-menu__angle"></i>
+                    </a>
+                    }
+                    <!-- 3rd Level menu -->
+                    @if (childrenSubItem.children) {
+                    <ul class="slide-menu child2" [ngClass]="{'force-left' : childrenItem.dirchange}" [ngStyle]="{
+                                                          display: childrenSubItem.active ? 'block' : 'none',
+
+                                                        }">
+                      @for (childrenSubItem1 of childrenSubItem.children; track childrenSubItem1) {
+                      <li class="slide" activeMenuItems [ngClass]="{'open': childrenSubItem1.active}">
+                        @if (childrenSubItem1.type === 'link') {
+                        <a class="side-menu__item" routerLinkActive="active"
+                          [routerLink]="!childrenSubItem1.type ?  null : [childrenSubItem1.path]"
+                          [routerLinkActiveOptions]="{exact : true}">
+                          {{childrenSubItem1.title}}
+                        </a>
+                        }
+                        @if (childrenSubItem1.type === 'empty') {
+                        <a class="side-menu__item" href="javascript:;">
+                          {{childrenSubItem1.title}}
+                        </a>
+                        }
+                      </li>
+                      }
+                    </ul>
+                    }
+                  </li>
+                  }
+                </ul>
+                }
+              </li>
+              }
+            </ul>
+            }
+          </li>
+          @if (menuItem.type === 'external') {
+          <a class="side-menu__item" target="_blank" [routerLink]="!menuItem.type ? null : [menuItem.path]"
+            routerLinkActive="active" (click)="setNavActive($event, menuItem.path ?? '')">
+            @if (menuItem.icon) {
+            <span [appSvgReplace]="menuItem.icon" class="iconclick"></span>
+            }
+            <span class="side-menu__label">{{ menuItem.title }}
+              @if(menuItem.badgeValue){
+              <span
+                class="badge bg-{{ menuItem.badgeClass }} text-{{menuItem.badgeText}} float-end">{{menuItem.badgeValue
+                }}</span>
+              }
+            </span>
+          </a>
+          }
+          }
+          <!-- End::slide -->
+        </ul>
+        <div class="slide-right" id="slide-right" (click)="rightArrowFn()">
+          <svg xmlns="http://www.w3.org/2000/svg" fill="#7b8191" width="24" height="24" viewBox="0 0 24 24">
+            <path d="M10.707 17.707 16.414 12l-5.707-5.707-1.414 1.414L13.586 12l-4.293 4.293z"></path>
+          </svg>
+        </div>
+      </nav>
+    </ngx-simplebar>
+  </div>
+
+</aside>
\ No newline at end of file
diff --git a/src/app/shell/ui/sidebar/sidebar.scss b/src/app/shell/ui/sidebar/sidebar.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/src/app/shell/ui/sidebar/sidebar.ts b/src/app/shell/ui/sidebar/sidebar.ts
new file mode 100644
index 00000000..f22275f2
--- /dev/null
+++ b/src/app/shell/ui/sidebar/sidebar.ts
@@ -0,0 +1,526 @@
+import { Component, Renderer2, HostListener, ElementRef, } from '@angular/core';
+import { Menu, NavService } from '../../../core/services/common/nav.service';
+import { Subscription, fromEvent } from 'rxjs';
+import { DomSanitizer } from '@angular/platform-browser';
+import { NavigationEnd, Router, RouterLink, RouterLinkActive } from '@angular/router';
+import { AppStateService } from '../../../core/services/common/app-state.service';
+import { NgClass, NgStyle } from '@angular/common';
+import { SimplebarAngularModule } from 'simplebar-angular';
+import { SvgReplaceDirective } from '../../../shared/directives/svgReplace.directive';
+@Component({
+  selector: 'app-sidebar',
+  templateUrl: './sidebar.html',
+  styleUrl: './sidebar.scss',
+  imports: [NgClass, RouterLink, SimplebarAngularModule, NgStyle, RouterLinkActive, SvgReplaceDirective]
+})
+
+export class Sidebar {
+  doublemenuTooltiPosition = 'right'
+  eventTriggered: boolean = false;
+  screenWidth!: number;
+  public localdata = localStorage;
+  public windowSubscribe$!: Subscription;
+  options = { autoHide: false, scrollbarMinSize: 100 };
+  public menuItems!: Menu[];
+  public menuitemsSubscribe$!: Subscription;
+  constructor(
+    private navServices: NavService,
+    public router: Router,
+    public renderer: Renderer2,
+    private sanitizer: DomSanitizer,
+    private appStateService: AppStateService,
+    private elementRef: ElementRef
+  ) { }
+  isDoubleMenu(): boolean {
+    const htmlElement = document.querySelector('[data-vertical-style="doublemenu"]');
+    return htmlElement !== null;
+  }
+
+  // Method to determine if tooltip should be shown
+  shouldShowTooltip(menuItem: any): boolean {
+    return this.isDoubleMenu() && menuItem.title !== '';
+  }
+  clearNavDropdown() {
+    this.menuItems?.forEach((a: any) => {
+      a.active = false;
+      a?.children?.forEach((b: any) => {
+        b.active = false;
+        b?.children?.forEach((c: any) => {
+          c.active = false;
+        });
+      });
+    });
+  }
+
+
+  ngOnInit() {
+    let bodyElement: any = document.querySelector('.main-content');
+    bodyElement.onclick = () => {
+      if (localStorage.getItem('layoutStyles') == 'icontext' || localStorage.getItem('layoutStyles') == 'icon-hover') {
+        document.querySelector('html')?.removeAttribute('data-icon-text')
+      }
+
+    };
+
+    this.menuitemsSubscribe$ = this.navServices.items.subscribe((items) => {
+      this.menuItems = items;
+    });
+
+    this.setNavActive(null, this.router.url);
+    this.router.events.subscribe((event) => {
+      if (event instanceof NavigationEnd) {
+        this.setNavActive(null, this.router.url);
+      }
+    });
+
+    const WindowResize = fromEvent(window, 'resize');
+    // subscribing the Observable
+    if (WindowResize) {
+      this.windowSubscribe$ = WindowResize.subscribe(() => {
+        // to check and adjst the menu on screen size change
+        // checkHoriMenu();
+      });
+    }
+
+    if (document.querySelector('html')?.getAttribute('data-nav-layout') == 'horizontal' && window.innerWidth >= 992) { this.clearNavDropdown(); }
+  }
+  // Start of Set menu Active event
+  setNavActive(event: any, currentPath: string, menuData = this.menuItems) {
+    if (event) {
+      if (event?.ctrlKey) {
+        return;
+      }
+    }
+    let html = this.elementRef.nativeElement.ownerDocument.documentElement;
+    //if (html.getAttribute('data-nav-style') != "icon-hover" && html.getAttribute('data-nav-style') != "menu-hover") {
+    // if (!event?.ctrlKey) {
+    for (const item of menuData) {
+      if (item.path === currentPath) {
+        item.active = true;
+        item.selected = true;
+        this.setMenuAncestorsActive(item);
+      } else if (!item.active && !item.selected) {
+        item.active = false; // Set active to false for items not matching the target
+        item.selected = false; // Set active to false for items not matching the target
+      } else {
+        this.removeActiveOtherMenus(item);
+      }
+      if (item.children && item.children.length > 0) {
+        this.setNavActive(event, currentPath, item.children);
+      }
+    }
+    // }
+    //}
+    if (window.innerWidth <= 996) {
+      html?.setAttribute('data-toggled', html?.getAttribute('data-toggled') == 'close' ? 'close' : 'close');
+    }
+
+    if (html?.getAttribute('data-vertical-style') == "icontext" && html?.getAttribute('data-icon-text') == 'open' && window.innerWidth >= 992) { html?.setAttribute('data-icon-text', 'close') }
+
+
+  }
+
+  getParentObject(obj: any, childObject: Menu) {
+    for (const key in obj) {
+      if (obj.hasOwnProperty(key)) {
+        if (typeof obj[key] === 'object' && JSON.stringify(obj[key]) === JSON.stringify(childObject)) {
+          return obj; // Return the parent object
+        }
+        if (typeof obj[key] === 'object') {
+          const parentObject: any = this.getParentObject(obj[key], childObject);
+          if (parentObject !== null) {
+            return parentObject;
+          }
+        }
+      }
+    }
+    return null; // Object not found
+  }
+
+  hasParent = false;
+  hasParentLevel = 0;
+
+  setMenuAncestorsActive(targetObject: Menu) {
+    const parent = this.getParentObject(this.menuItems, targetObject);
+    let html = document.documentElement;
+    if (parent) {
+      if (this.hasParentLevel >= 2) {
+        this.hasParent = true;
+      }
+      parent.active = true;
+      parent.selected = true;
+      this.hasParentLevel += 1;
+      this.setMenuAncestorsActive(parent);
+    }
+    else if (!this.hasParent) {
+      this.hasParentLevel = 0;
+      if (html.getAttribute('data-vertical-style') == 'doublemenu') {
+        if (window.innerWidth < 992) {
+          html.setAttribute('data-toggled', 'close');
+        } else {
+          html.setAttribute('data-toggled', 'double-menu-close');
+        }
+      }
+    } else {
+      this.hasParentLevel = 0;
+      this.hasParent = false;
+    }
+  }
+  removeActiveOtherMenus(item: any) {
+    if (item) {
+      if (Array.isArray(item)) {
+        for (const val of item) {
+          val.active = false;
+          val.selected = false;
+        }
+      }
+      item.active = false;
+      item.selected = false;
+
+      if (item.children && item.children.length > 0) {
+        this.removeActiveOtherMenus(item.children);
+      }
+    }
+    else {
+      return;
+    }
+  }
+
+  // Start of Toggle menu event
+  toggleNavActive(event: any, targetObject: Menu, menuData = this.menuItems, state?: any) {
+    let html = document.documentElement;
+    let element = event.target;
+    if (html.getAttribute('data-nav-style') != "icon-hover" && html.getAttribute('data-nav-style') != "menu-hover" || (window.innerWidth < 992) || (html.getAttribute('data-nav-layout') != "horizontal") && (html.getAttribute('data-nav-style') != "icon-hover-closed" && html.getAttribute('data-nav-style') != "menu-hover-closed")) {
+      for (const item of menuData) {
+        if (item === targetObject) {
+          if (html.getAttribute('data-vertical-style') == 'doublemenu' && item.active && window.innerWidth > 992 && state) { return }
+          item.active = !item.active;
+          if (item.active) {
+            this.closeOtherMenus(menuData, item);
+          }
+          this.setAncestorsActive(menuData, item);
+
+        } else if (!item.active) {
+          if (html.getAttribute('data-vertical-style') != 'doublemenu') {
+            item.active = false; // Set active to false for items not matching the target
+          }
+        }
+        if (item.children && item.children.length > 0) {
+          this.toggleNavActive(event, targetObject, item.children);
+        }
+      }
+      if (targetObject?.children && targetObject.active) {
+        if (html.getAttribute('data-vertical-style') == 'doublemenu' && html.getAttribute('data-toggled') != 'double-menu-open') {
+          html.setAttribute('data-toggled', 'double-menu-open');
+        }
+      }
+
+      if (element && html.getAttribute("data-nav-layout") == 'horizontal' && (html.getAttribute("data-nav-style") == 'menu-click' || html.getAttribute("data-nav-style") == 'icon-click')) {
+        const listItem = element.closest("li");
+        if (listItem) {
+          // Find the first sibling <ul> element
+          const siblingUL = listItem.querySelector("ul");
+          let outterUlWidth = 0;
+          let listItemUL = listItem.closest('ul:not(.main-menu)');
+          while (listItemUL) {
+            listItemUL = listItemUL.parentElement.closest('ul:not(.main-menu)');
+            if (listItemUL) {
+              outterUlWidth += listItemUL.clientWidth;
+            }
+          }
+          if (siblingUL) {
+            // You've found the sibling <ul> element
+            let siblingULRect = listItem.getBoundingClientRect();
+            if (html.getAttribute('dir') == 'rtl') {
+              if ((siblingULRect.left - siblingULRect.width - outterUlWidth + 150 < 0 && outterUlWidth < window.innerWidth) && (outterUlWidth + siblingULRect.width + siblingULRect.width < window.innerWidth)) {
+                targetObject.dirchange = true;
+              } else {
+                targetObject.dirchange = false;
+              }
+            } else {
+              if ((outterUlWidth + siblingULRect.right + siblingULRect.width + 50 > window.innerWidth && siblingULRect.right >= 0) && (outterUlWidth + siblingULRect.width + siblingULRect.width < window.innerWidth)) {
+                targetObject.dirchange = true;
+              } else {
+                targetObject.dirchange = false;
+              }
+            }
+          }
+          setTimeout(() => {
+            let computedValue = siblingUL.getBoundingClientRect();
+            if ((computedValue.bottom) > window.innerHeight) {
+              siblingUL.style.height = (window.innerHeight - computedValue.top - 8) + 'px !important';
+              siblingUL.style.overflow = 'auto !important';
+            }
+          }, 100);
+        }
+      }
+    }
+    else {
+      for (const item of menuData) {
+        if (item === targetObject) {
+          if (html.getAttribute('data-vertical-style') == 'doublemenu' && item.active && window.innerWidth > 992 && state) { return }
+          item.active = !item.active;
+          if (item.active) {
+            this.closeOtherMenus(menuData, item);
+          }
+          this.setAncestorsActive(menuData, item);
+        }
+      }
+    }
+
+    if (html.getAttribute('data-vertical-style') == 'icontext') {
+      document.querySelector('html')?.setAttribute('data-icon-text', 'open')
+    } else {
+      document.querySelector('html')?.removeAttribute('data-icon-text')
+    }
+
+  }
+
+
+  setAncestorsActive(menuData: Menu[], targetObject: Menu) {
+    let html = document.documentElement;
+    const parent = this.findParent(menuData, targetObject);
+
+    if (parent) {
+      parent.active = true;
+      if (parent.active) {
+        html.setAttribute('data-toggled', 'double-menu-open');
+      }
+      this.setAncestorsActive(menuData, parent);
+    }
+  }
+  closeOtherMenus(menuData: Menu[], targetObject: Menu) {
+    for (const item of menuData) {
+      if (item !== targetObject) {
+        item.active = false;
+        if (item.children && item.children.length > 0) {
+          this.closeOtherMenus(item.children, targetObject);
+        }
+      }
+    }
+  }
+  findParent(menuData: Menu[], targetObject: Menu) {
+    for (const item of menuData) {
+      if (item.children && item.children.includes(targetObject)) {
+        return item;
+      }
+      if (item.children && item.children.length > 0) {
+        const parent: any = this.findParent(item.children, targetObject);
+        if (parent) {
+          return parent;
+        }
+      }
+    }
+    return null;
+  }
+  // End of Toggle menu event
+  HoverToggleInnerMenuFn(event: Event, item: Menu) {
+    let html = document.documentElement;
+    let element = event.target as HTMLElement;
+    if (element && html.getAttribute("data-nav-layout") == 'horizontal' && (html.getAttribute("data-nav-style") == 'menu-hover' || html.getAttribute("data-nav-style") == 'icon-hover')) {
+      const listItem = element.closest("li");
+      if (listItem) {
+        // Find the first sibling <ul> element
+        const siblingUL = listItem.querySelector("ul");
+        let outterUlWidth = 0;
+        let listItemUL: any = listItem.closest('ul:not(.main-menu)');
+        while (listItemUL) {
+          listItemUL = listItemUL.parentElement?.closest('ul:not(.main-menu)');
+          if (listItemUL) {
+            outterUlWidth += listItemUL.clientWidth;
+          }
+        }
+        if (siblingUL) {
+          // You've found the sibling <ul> element
+          let siblingULRect = listItem.getBoundingClientRect();
+          if (html.getAttribute('dir') == 'rtl') {
+            if ((siblingULRect.left - siblingULRect.width - outterUlWidth + 150 < 0 && outterUlWidth < window.innerWidth) && (outterUlWidth + siblingULRect.width + siblingULRect.width < window.innerWidth)) {
+              item.dirchange = true;
+            } else {
+              item.dirchange = false;
+            }
+          } else {
+            if ((outterUlWidth + siblingULRect.right + siblingULRect.width + 50 > window.innerWidth && siblingULRect.right >= 0) && (outterUlWidth + siblingULRect.width + siblingULRect.width < window.innerWidth)) {
+              item.dirchange = true;
+            } else {
+              item.dirchange = false;
+            }
+          }
+        }
+      }
+    }
+  }
+
+  ngAfterViewInit(): void {
+    //Called after ngAfterContentInit when the component's view has been initialized. Applies to components only.
+    //Add 'implements AfterViewInit' to the class.
+    // checkHoriMenu();
+
+  }
+
+  ngOnDestroy() {
+    this.menuitemsSubscribe$.unsubscribe();
+    this.windowSubscribe$.unsubscribe();
+    document.querySelector('html')?.setAttribute('data-vertical-style', 'overlay');
+    document.querySelector('html')?.setAttribute('data-nav-layout', 'vertical');
+  }
+
+  leftArrowFn() {
+    // Used to move the slide of the menu in Horizontal and also remove the arrows after click  if there was no space
+    // Used to Slide the menu to Left side
+    let slideLeft = document.querySelector('.slide-left') as HTMLElement;
+    let slideRight = document.querySelector('.slide-right') as HTMLElement;
+    let menuNav = document.querySelector('.main-menu') as HTMLElement;
+    let mainContainer1 = document.querySelector('.main-sidebar') as HTMLElement;
+    let marginRightValue = Math.ceil(Number(window.getComputedStyle(menuNav).marginInlineStart.split('px')[0]));
+    let mainContainer1Width = mainContainer1.offsetWidth;
+    if (menuNav.scrollWidth > mainContainer1.offsetWidth) {
+      if (marginRightValue < 0 && !(Math.abs(marginRightValue) < mainContainer1Width)) {
+        menuNav.style.marginInlineStart = Number(menuNav.style.marginInlineStart.split('px')[0]) + Math.abs(mainContainer1Width) + 'px';
+        slideRight.classList.remove('d-none');
+      } else if (marginRightValue >= 0) {
+        menuNav.style.marginInlineStart = '0px';
+        slideLeft.classList.add('d-none');
+        slideRight.classList.remove('d-none');
+      } else {
+        menuNav.style.marginInlineStart = '0px';
+        slideLeft.classList.add('d-none');
+        slideRight.classList.remove('d-none');
+      }
+    }
+    else {
+      menuNav.style.marginInlineStart = "0px";
+      slideLeft.classList.add('d-none');
+    }
+
+    let element = document.querySelector(".main-menu > .slide.open") as HTMLElement;
+    let element1 = document.querySelector(".main-menu > .slide.open >ul") as HTMLElement;
+    if (element) {
+      element.classList.remove("open")
+    }
+    if (element1) {
+      element1.style.display = "none"
+    }
+  }
+  rightArrowFn() {
+    // Used to move the slide of the menu in Horizontal and also remove the arrows after click  if there was no space
+    // Used to Slide the menu to Right side
+    let slideLeft = document.querySelector('.slide-left') as HTMLElement;
+    let slideRight = document.querySelector('.slide-right') as HTMLElement;
+    let menuNav = document.querySelector('.main-menu') as HTMLElement;
+    let mainContainer1 = document.querySelector('.main-sidebar') as HTMLElement;
+    let marginRightValue = Math.ceil(Number(window.getComputedStyle(menuNav).marginInlineStart.split('px')[0]));
+    let check = menuNav.scrollWidth - mainContainer1.offsetWidth;
+    let mainContainer1Width = mainContainer1.offsetWidth;
+    if (menuNav.scrollWidth > mainContainer1.offsetWidth) {
+      if (Math.abs(check) > Math.abs(marginRightValue)) {
+        if (!(Math.abs(check) > Math.abs(marginRightValue) + mainContainer1Width)) {
+          mainContainer1Width = Math.abs(check) - Math.abs(marginRightValue);
+          slideRight.classList.add('d-none');
+        }
+        menuNav.style.marginInlineStart = Number(menuNav.style.marginInlineStart.split('px')[0]) - Math.abs(mainContainer1Width) + 'px';
+        slideLeft.classList.remove('d-none');
+      }
+    }
+
+    let element = document.querySelector(".main-menu > .slide.open") as HTMLElement
+    let element1 = document.querySelector(".main-menu > .slide.open >ul") as HTMLElement
+    if (element) {
+      element.classList.remove("open")
+    }
+    if (element1) {
+      element1.style.display = "none"
+    }
+  }
+
+  // Addding sticky-pin
+  scrolled = false;
+
+  @HostListener('window:scroll', [])
+  onWindowScroll() {
+    this.scrolled = window.scrollY > 10;
+
+    const sections = document.querySelectorAll('.side-menu__item');
+    const scrollPos =
+      window.pageYOffset ||
+      document.documentElement.scrollTop ||
+      document.body.scrollTop;
+
+    sections.forEach((ele, i) => {
+      const currLink = sections[i];
+      const val: any = currLink.getAttribute('value');
+      const refElement: any = document.querySelector('#' + val);
+
+      // Add a null check here before accessing properties of refElement
+      if (refElement !== null) {
+        const scrollTopMinus = scrollPos + 73;
+        if (
+          refElement.offsetTop <= scrollTopMinus &&
+          refElement.offsetTop + refElement.offsetHeight > scrollTopMinus
+        ) {
+          document.querySelector('.nav-scroll')?.classList.remove('active');
+          currLink.classList.add('active');
+        } else {
+          currLink.classList.remove('active');
+        }
+      }
+    });
+  }
+
+  @HostListener('window:resize', ['$event'])
+  onResize(event: any): void {
+    this.menuResizeFn();
+
+    this.screenWidth = window.innerWidth;
+
+    // Check if the event hasn't been triggered and the screen width is less than or equal to your breakpoint
+    if (!this.eventTriggered && this.screenWidth <= 992) {
+      document.documentElement?.setAttribute('data-toggled', 'close')
+
+
+      // Trigger your event or perform any action here
+      this.eventTriggered = true; // Set the flag to true to prevent further triggering
+    } else if (this.screenWidth > 992) {
+      // Reset the flag when the screen width goes beyond the breakpoint
+      this.eventTriggered = false;
+    }
+  }
+  WindowPreSize: number[] = [window.innerWidth];
+
+  menuResizeFn(): void {
+    this.WindowPreSize.push(window.innerWidth);
+    const html = document.documentElement;
+
+    if (this.WindowPreSize.length > 2) {
+      this.WindowPreSize.shift();
+    }
+    if (this.WindowPreSize.length > 1) {
+
+      if (this.WindowPreSize[this.WindowPreSize.length - 1] < 996 && this.WindowPreSize[this.WindowPreSize.length - 2] >= 996) {
+        // less than 996
+        html.setAttribute('data-toggled', 'close');
+      }
+
+      if (this.WindowPreSize[this.WindowPreSize.length - 1] >= 996 && this.WindowPreSize[this.WindowPreSize.length - 2] < 996) {
+        // greater than 996
+        html.removeAttribute('data-toggled');
+        document.querySelector('#responsive-overlay')?.classList.remove('active');
+      }
+    }
+
+    if ((this.WindowPreSize[this.WindowPreSize.length - 1] >= 996) && (this.WindowPreSize[this.WindowPreSize.length - 2] < 996)) {
+      if (html.getAttribute('data-vertical-style') === 'doublemenu') {
+        const doublemenuactive = document.querySelectorAll(".double-menu-active .active");
+        if (doublemenuactive.length > 0) {
+          html.setAttribute('data-toggled', 'double-menu-open');
+
+        } else {
+          html.setAttribute('data-toggled', 'double-menu-close');
+        }
+      } else {
+        html.setAttribute('data-toggled', '');
+      }
+    }
+  }
+
+}
diff --git a/src/app/shell/ui/switcher/switcher.html b/src/app/shell/ui/switcher/switcher.html
new file mode 100644
index 00000000..fbb7512f
--- /dev/null
+++ b/src/app/shell/ui/switcher/switcher.html
@@ -0,0 +1,543 @@
+<div id="hs-overlay-switcher"
+  class="hs-overlay hidden ti-offcanvas border-defaultborder dark:border-defaultborder/10 ti-offcanvas-right hs-overlay-backdrop-open:bg-[#32325180] dark:hs-overlay-backdrop-open:bg-[#323251cc]"
+  data-hs-overlay-backdrop="false">
+  <div
+    class="ti-offcanvas-header border-defaultborder dark:border-defaultborder/10  z-10 relative items-center !block !p-0">
+    <div class="flex items-center justify-between p-3">
+      <h5 class="ti-offcanvas-title">
+        Switcher
+      </h5>
+      <button type="button"
+        class="ti-btn flex-shrink-0 p-0  transition-none text-defaulttextcolor dark:text-defaulttextcolor/70 hover:text-gray-700 focus:ring-gray-400 focus:ring-offset-white  dark:hover:text-white/80 dark:focus:ring-white/10 dark:focus:ring-offset-white/10 !m-0"
+        data-hs-overlay="#hs-overlay-switcher">
+        <span class="sr-only">Close modal</span>
+        <i class="ri-close-circle-line leading-none items-center text-lg"></i>
+      </button>
+    </div>
+    <nav class="flex border-t border-defaultborder dark:border-defaultborder/10 " aria-label="Tabs" role="tablist">
+
+      <button type="button"
+        class="hs-tab-active:bg-success/20 w-full !py-2 !px-4 hs-tab-active:border-b-transparent text-defaultsize border-0 hs-tab-active:!text-success dark:hs-tab-active:!bg-success/20 dark:hs-tab-active:border-b-white/10 dark:hs-tab-active:!text-success -mb-px font-semibold text-center  text-defaulttextcolor dark:text-defaulttextcolor/70 rounded-none  dark:bg-bodybg dark:border-white/10 cursor-pointer active"
+        id="switcher-item-1" data-hs-tab="#switcher-1" aria-controls="switcher-1" role="tab">
+        Theme Style
+      </button>
+      <button type="button"
+        class="hs-tab-active:bg-success/20 w-full !py-2 !px-4 hs-tab-active:border-b-transparent text-defaultsize border-0 hs-tab-active:!text-success dark:hs-tab-active:!bg-success/20 dark:hs-tab-active:border-b-white/10 dark:hs-tab-active:!text-success -mb-px  font-semibold text-center  text-defaulttextcolor dark:text-defaulttextcolor/70 rounded-none  dark:bg-bodybg dark:border-white/10  cursor-pointer"
+        id="switcher-item-2" data-hs-tab="#switcher-2" aria-controls="switcher-2" role="tab">
+        Theme Colors
+      </button>
+    </nav>
+
+  </div>
+  <div class="ti-offcanvas-body  overflow-auto  border-defaultborder dark:border-defaultborder/10   relative "
+    id="switcher-body">
+
+    <div id="switcher-1" role="tabpanel" aria-labelledby="switcher-item-1" class="">
+      <div class="">
+        <p class="switcher-style-head">Theme Color Mode:</p>
+        <div class="grid grid-cols-3 switcher-style">
+          <div class="flex items-center">
+            <input type="radio" name="theme-style" class="ti-form-radio form-check-input" id="switcher-light-theme"
+              (click)="updateTheme('light')" [checked]="localdata['theme'] == 'light'">
+            <label for="switcher-light-theme"
+              class="text-defaultsize text-defaulttextcolor dark:text-defaulttextcolor/70 ms-2  font-semibold">Light</label>
+          </div>
+          <div class="flex items-center">
+            <input type="radio" name="theme-style" class="ti-form-radio form-check-input" id="switcher-dark-theme"
+              (click)="updateTheme('dark')" [checked]="localdata['theme'] == 'dark'">
+            <label for="switcher-dark-theme"
+              class="text-defaultsize text-defaulttextcolor dark:text-defaulttextcolor/70 ms-2  font-semibold">Dark</label>
+          </div>
+        </div>
+      </div>
+      <div>
+        <p class="switcher-style-head">Directions:</p>
+        <div class="grid grid-cols-3  switcher-style">
+          <div class="flex items-center">
+            <input type="radio" name="direction" class="ti-form-radio form-check-input" id="switcher-ltr"
+              (click)="updateDirection('ltr')" [checked]="localdata['direction'] != 'rtl'">
+            <label for="switcher-ltr"
+              class="text-defaultsize text-defaulttextcolor dark:text-defaulttextcolor/70 ms-2  font-semibold">LTR</label>
+          </div>
+          <div class="flex items-center">
+            <input type="radio" name="direction" class="ti-form-radio form-check-input" id="switcher-rtl"
+              (click)="updateDirection('rtl')" [checked]="localdata['direction'] == 'rtl'">
+            <label for="switcher-rtl"
+              class="text-defaultsize text-defaulttextcolor dark:text-defaulttextcolor/70 ms-2  font-semibold">RTL</label>
+          </div>
+        </div>
+      </div>
+      <div>
+        <p class="switcher-style-head">Navigation Styles:</p>
+        <div class="grid grid-cols-3  switcher-style">
+          <div class="flex items-center">
+            <input type="radio" name="navigation-style" class="ti-form-radio form-check-input" id="switcher-vertical"
+              [checked]="localdata['navigationStyles'] == 'vertical'" (click)="updatemenuType('vertical')">
+            <label for="switcher-vertical"
+              class="text-defaultsize text-defaulttextcolor dark:text-defaulttextcolor/70 ms-2  font-semibold">Vertical</label>
+          </div>
+          <div class="flex items-center">
+            <input type="radio" name="navigation-style" class="ti-form-radio form-check-input" id="switcher-horizontal"
+              [checked]="localdata['navigationStyles'] == 'horizontal'" (click)="updatemenuType('horizontal')">
+            <label for="switcher-horizontal"
+              class="text-defaultsize text-defaulttextcolor dark:text-defaulttextcolor/70 ms-2  font-semibold">Horizontal</label>
+          </div>
+        </div>
+      </div>
+      <div>
+        <p class="switcher-style-head">Navigation Menu Style:</p>
+        <div class="grid grid-cols-2 gap-2 switcher-style">
+          <div class="flex items-center">
+            <input type="radio" name="navigation-data-menu-styles" class="ti-form-radio form-check-input"
+              id="switcher-menu-click" (click)="updatemenuStyle('menu-click')"
+              [checked]="localdata['menuStyles'] == 'menu-click'">
+            <label for="switcher-menu-click"
+              class="text-defaultsize text-defaulttextcolor dark:text-defaulttextcolor/70 ms-2  font-semibold">Menu
+              Click</label>
+          </div>
+          <div class="flex items-center">
+            <input type="radio" name="navigation-data-menu-styles" class="ti-form-radio form-check-input"
+              id="switcher-menu-hover" (click)="updatemenuStyle('menu-hover')"
+              [checked]="localdata['menuStyles'] == 'menu-hover'">
+            <label for="switcher-menu-hover"
+              class="text-defaultsize text-defaulttextcolor dark:text-defaulttextcolor/70 ms-2  font-semibold">Menu
+              Hover</label>
+          </div>
+          <div class="flex items-center">
+            <input type="radio" name="navigation-data-menu-styles" class="ti-form-radio form-check-input"
+              id="switcher-icon-click" (click)="updatemenuStyle('icon-click')"
+              [checked]="localdata['menuStyles'] == 'icon-click'">
+            <label for="switcher-icon-click"
+              class="text-defaultsize text-defaulttextcolor dark:text-defaulttextcolor/70 ms-2  font-semibold">Icon
+              Click</label>
+          </div>
+          <div class="flex items-center">
+            <input type="radio" name="navigation-data-menu-styles" class="ti-form-radio form-check-input"
+              id="switcher-icon-hover" (click)="updatemenuStyle('icon-hover')"
+              [checked]="localdata['menuStyles'] == 'icon-hover'">
+            <label for="switcher-icon-hover"
+              class="text-defaultsize text-defaulttextcolor dark:text-defaulttextcolor/70 ms-2  font-semibold">Icon
+              Hover</label>
+          </div>
+        </div>
+        <div class="px-4 text-secondary text-xs"><b class="me-2">Note:</b>Works same for both Vertical and
+          Horizontal
+        </div>
+      </div>
+      <div class=" sidemenu-layout-styles">
+        <p class="switcher-style-head">Sidemenu Layout Syles:</p>
+        <div class="grid grid-cols-2 gap-2 switcher-style">
+          <div class="flex items-center">
+            <input type="radio" name="sidemenu-layout-styles" class="ti-form-radio form-check-input"
+              id="switcher-default-menu" (click)="updatelayoutStyles('default')"
+              [checked]="localdata['layoutStyles'] == 'default'">
+            <label for="switcher-default-menu"
+              class="text-defaultsize text-defaulttextcolor dark:text-defaulttextcolor/70 ms-2  font-semibold ">Default
+              Menu</label>
+          </div>
+          <div class="flex items-center">
+            <input type="radio" name="sidemenu-layout-styles" class="ti-form-radio form-check-input"
+              id="switcher-closed-menu" (click)="updatelayoutStyles('closed')"
+              [checked]="localdata['layoutStyles'] == 'closed'">
+            <label for="switcher-closed-menu"
+              class="text-defaultsize text-defaulttextcolor dark:text-defaulttextcolor/70 ms-2  font-semibold ">
+              Closed
+              Menu</label>
+          </div>
+          <div class="flex items-center">
+            <input type="radio" name="sidemenu-layout-styles" class="ti-form-radio form-check-input"
+              id="switcher-icontext-menu" (click)="updatelayoutStyles('icontext')"
+              [checked]="localdata['layoutStyles'] == 'icontext'">
+            <label for="switcher-icontext-menu"
+              class="text-defaultsize text-defaulttextcolor dark:text-defaulttextcolor/70 ms-2  font-semibold ">Icon
+              Text</label>
+
+          </div>
+          <div class="flex items-center">
+            <input type="radio" name="sidemenu-layout-styles" class="ti-form-radio form-check-input"
+              id="switcher-icon-overlay" (click)="updatelayoutStyles('overlay')"
+              [checked]="localdata['layoutStyles'] == 'overlay'">
+            <label for="switcher-icon-overlay"
+              class="text-defaultsize text-defaulttextcolor dark:text-defaulttextcolor/70 ms-2  font-semibold ">Icon
+              Overlay</label>
+          </div>
+          <div class="flex items-center">
+            <input type="radio" name="sidemenu-layout-styles" class="ti-form-radio form-check-input"
+              id="switcher-detached" (click)="updatelayoutStyles('detached')"
+              [checked]="localdata['layoutStyles'] == 'detached'">
+            <label for="switcher-detached"
+              class="text-defaultsize text-defaulttextcolor dark:text-defaulttextcolor/70 ms-2  font-semibold ">Detached</label>
+          </div>
+          <div class="flex items-center">
+            <input type="radio" name="sidemenu-layout-styles" class="ti-form-radio form-check-input"
+              id="switcher-double-menu" (click)="updatelayoutStyles('doublemenu')"
+              [checked]="localdata['layoutStyles'] == 'doublemenu'">
+            <label for="switcher-double-menu"
+              class="text-defaultsize text-defaulttextcolor dark:text-defaulttextcolor/70 ms-2  font-semibold">Double
+              Menu</label>
+          </div>
+        </div>
+        <div class="px-4 text-secondary text-xs"><b class="me-2">Note:</b>Navigation menu styles won't work
+          here.</div>
+      </div>
+      <div>
+        <p class="switcher-style-head">Page Styles:</p>
+        <div class="grid grid-cols-3  switcher-style">
+          <div class="flex items-center">
+            <input type="radio" name="data-page-styles" class="ti-form-radio form-check-input" id="switcher-regular"
+              (click)="updatepageStyles('regular')" [checked]="localdata['pageStyles'] != 'classic'">
+            <label for="switcher-regular"
+              class="text-defaultsize text-defaulttextcolor dark:text-defaulttextcolor/70 ms-2  font-semibold">Regular</label>
+          </div>
+          <div class="flex items-center">
+            <input type="radio" name="data-page-styles" class="ti-form-radio form-check-input" id="switcher-classic"
+              (click)="updatepageStyles('classic')" [checked]="localdata['pageStyles'] == 'classic'">
+            <label for="switcher-classic"
+              class="text-defaultsize text-defaulttextcolor dark:text-defaulttextcolor/70 ms-2  font-semibold">Classic</label>
+          </div>
+          <div class="flex items-center">
+            <input type="radio" name="data-page-styles" class="ti-form-radio form-check-input" id="switcher-modern"
+              (click)="updatepageStyles('modern')" [checked]="localdata['pageStyles'] == 'modern'">
+            <label for="switcher-modern"
+              class="text-defaultsize text-defaulttextcolor dark:text-defaulttextcolor/70 ms-2  font-semibold">
+              Modern</label>
+          </div>
+        </div>
+      </div>
+      <div>
+        <p class="switcher-style-head">Layout Width Styles:</p>
+        <div class="grid grid-cols-3 switcher-style">
+          <div class="flex items-center">
+            <input type="radio" name="layout-width" class="ti-form-radio form-check-input" id="switcher-full-width"
+              (click)="updatewidthStyles('full-width')" [checked]="localdata['widthStyles'] != 'full-width'">
+            <label for="switcher-full-width"
+              class="text-defaultsize text-defaulttextcolor dark:text-defaulttextcolor/70 ms-2  font-semibold">FullWidth</label>
+          </div>
+          <div class="flex items-center">
+            <input type="radio" name="layout-width" class="ti-form-radio form-check-input" id="switcher-boxed"
+              (click)="updatewidthStyles('boxed')" [checked]="localdata['widthStyles'] == 'boxed'">
+            <label for="switcher-boxed"
+              class="text-defaultsize text-defaulttextcolor dark:text-defaulttextcolor/70 ms-2  font-semibold">Boxed</label>
+          </div>
+        </div>
+      </div>
+      <div>
+        <p class="switcher-style-head">Menu Positions:</p>
+        <div class="grid grid-cols-3  switcher-style">
+          <div class="flex items-center">
+            <input type="radio" name="data-menu-positions" class="ti-form-radio form-check-input"
+              id="switcher-menu-fixed" (click)="updatemenuPosition('fixed')"
+              [checked]="localdata['menuPosition'] != 'scrollable'">
+            <label for="switcher-menu-fixed"
+              class="text-defaultsize text-defaulttextcolor dark:text-defaulttextcolor/70 ms-2  font-semibold">Fixed</label>
+          </div>
+          <div class="flex items-center">
+            <input type="radio" name="data-menu-positions" class="ti-form-radio form-check-input"
+              id="switcher-menu-scroll" (click)="updatemenuPosition('scrollable')"
+              [checked]="localdata['menuPosition'] == 'scrollable'">
+            <label for="switcher-menu-scroll"
+              class="text-defaultsize text-defaulttextcolor dark:text-defaulttextcolor/70 ms-2  font-semibold">Scrollable
+            </label>
+          </div>
+        </div>
+      </div>
+      <div>
+        <p class="switcher-style-head">Header Positions:</p>
+        <div class="grid grid-cols-3 switcher-style">
+          <div class="flex items-center">
+            <input type="radio" name="data-header-positions" class="ti-form-radio form-check-input"
+              id="switcher-header-fixed" (click)="updateheaderPosition('fixed')"
+              [checked]="localdata['headerPosition'] != 'scrollable'">
+            <label for="switcher-header-fixed"
+              class="text-defaultsize text-defaulttextcolor dark:text-defaulttextcolor/70 ms-2  font-semibold">
+              Fixed</label>
+          </div>
+          <div class="flex items-center">
+            <input type="radio" name="data-header-positions" class="ti-form-radio form-check-input"
+              id="switcher-header-scroll" (click)="updateheaderPosition('scrollable')"
+              [checked]="localdata['headerPosition'] == 'scrollable'">
+            <label for="switcher-header-scroll"
+              class="text-defaultsize text-defaulttextcolor dark:text-defaulttextcolor/70 ms-2  font-semibold">Scrollable
+            </label>
+          </div>
+        </div>
+      </div>
+
+    </div>
+    <div id="switcher-2" class="hidden" role="tabpanel" aria-labelledby="switcher-item-2">
+      <div class="theme-colors">
+        <p class="switcher-style-head">Menu Colors:</p>
+        <div class="flex switcher-style space-x-3 ">
+          <div class="hs-tooltip ti-main-tooltip ti-form-radio switch-select ">
+            <input class="hs-tooltip-toggle ti-form-radio form-check-input color-input  color-white" type="radio"
+              name="menu-colors" id="switcher-menu-light" checked (click)="updatemenuColor('light')"
+              [checked]="localdata['menuColor'] == 'light'">
+            <span
+              class="hs-tooltip-content ti-main-tooltip-content !py-1 !px-2 !bg-black text-xs font-medium !text-white shadow-sm dark:!bg-black"
+              role="tooltip">
+              Light Menu
+            </span>
+          </div>
+          <div class="hs-tooltip ti-main-tooltip ti-form-radio switch-select ">
+            <input class="hs-tooltip-toggle ti-form-radio form-check-input color-input  color-dark" type="radio"
+              name="menu-colors" id="switcher-menu-dark" (click)="updatemenuColor('dark')"
+              [checked]="localdata['menuColor'] == 'dark'">
+            <span
+              class="hs-tooltip-content ti-main-tooltip-content !py-1 !px-2 !bg-black text-xs font-medium !text-white shadow-sm dark:!bg-black"
+              role="tooltip">
+              Dark Menu
+            </span>
+          </div>
+          <div class="hs-tooltip ti-main-tooltip ti-form-radio switch-select ">
+            <input class="hs-tooltip-toggle ti-form-radio form-check-input color-input  color-primary" type="radio"
+              name="menu-colors" id="switcher-menu-primary" (click)="updatemenuColor('color')"
+              [checked]="localdata['menuColor'] == 'color'">
+            <span
+              class="hs-tooltip-content ti-main-tooltip-content !py-1 !px-2 !bg-black text-xs font-medium !text-white shadow-sm dark:!bg-black"
+              role="tooltip">
+              Color Menu
+            </span>
+          </div>
+          <div class="hs-tooltip ti-main-tooltip ti-form-radio switch-select ">
+            <input class="hs-tooltip-toggle ti-form-radio form-check-input color-input  color-gradient" type="radio"
+              name="menu-colors" id="switcher-menu-gradient" (click)="updatemenuColor('gradient')"
+              [checked]="localdata['menuColor'] == 'gradient'">
+            <span
+              class="hs-tooltip-content ti-main-tooltip-content !py-1 !px-2 !bg-black text-xs font-medium !text-white shadow-sm dark:!bg-black"
+              role="tooltip">
+              Gradient Menu
+            </span>
+          </div>
+          <div class="hs-tooltip ti-main-tooltip ti-form-radio switch-select ">
+            <input class="hs-tooltip-toggle ti-form-radio form-check-input color-input  color-transparent" type="radio"
+              name="menu-colors" id="switcher-menu-transparent" (click)="updatemenuColor('transparent')"
+              [checked]="localdata['menuColor'] == 'transparent'">
+            <span
+              class="hs-tooltip-content ti-main-tooltip-content !py-1 !px-2 !bg-black text-xs font-medium !text-white shadow-sm dark:!bg-black"
+              role="tooltip">
+              Transparent Menu
+            </span>
+          </div>
+        </div>
+        <div class="px-4 text-[#8c9097] dark:text-white/50 text-[.6875rem]"><b class="me-2">Note:</b>If you want to
+          change color Menu
+          dynamically
+          change from below Theme Primary color picker.</div>
+      </div>
+      <div class="theme-colors">
+        <p class="switcher-style-head">Header Colors:</p>
+        <div class="flex switcher-style space-x-3 ">
+          <div class="hs-tooltip ti-main-tooltip ti-form-radio switch-select ">
+            <input class="hs-tooltip-toggle ti-form-radio   form-check-input color-input    color-white !border"
+              type="radio" name="header-colors" id="switcher-header-light" checked (click)="updateheaderColor('light')"
+              [checked]="localdata['headerColor'] == 'light'">
+            <span
+              class="hs-tooltip-content ti-main-tooltip-content !py-1 !px-2 !bg-black text-xs font-medium !text-white shadow-sm dark:!bg-black"
+              role="tooltip">
+              Light Header
+            </span>
+          </div>
+          <div class="hs-tooltip ti-main-tooltip ti-form-radio switch-select ">
+            <input class="hs-tooltip-toggle ti-form-radio form-check-input color-input    color-dark" type="radio"
+              name="header-colors" id="switcher-header-dark" (click)="updateheaderColor('dark')"
+              [checked]="localdata['headerColor'] == 'dark'">
+            <span
+              class="hs-tooltip-content ti-main-tooltip-content !py-1 !px-2 !bg-black text-xs font-medium !text-white shadow-sm dark:!bg-black"
+              role="tooltip">
+              Dark Header
+            </span>
+          </div>
+          <div class="hs-tooltip ti-main-tooltip ti-form-radio switch-select ">
+            <input class="hs-tooltip-toggle ti-form-radio form-check-input color-input    color-primary" type="radio"
+              name="header-colors" id="switcher-header-primary" (click)="updateheaderColor('color')"
+              [checked]="localdata['headerColor'] == 'color'">
+            <span
+              class="hs-tooltip-content ti-main-tooltip-content !py-1 !px-2 !bg-black text-xs font-medium !text-white shadow-sm dark:!bg-black"
+              role="tooltip">
+              Color Header
+            </span>
+          </div>
+          <div class="hs-tooltip ti-main-tooltip ti-form-radio switch-select ">
+            <input class="hs-tooltip-toggle ti-form-radio form-check-input color-input    color-gradient" type="radio"
+              name="header-colors" id="switcher-header-gradient" (click)="updateheaderColor('gradient')"
+              [checked]="localdata['headerColor'] == 'gradient'">
+            <span
+              class="hs-tooltip-content ti-main-tooltip-content !py-1 !px-2 !bg-black text-xs font-medium !text-white shadow-sm dark:!bg-black"
+              role="tooltip">
+              Gradient Header
+            </span>
+          </div>
+          <div class="hs-tooltip ti-main-tooltip ti-form-radio switch-select ">
+            <input class="hs-tooltip-toggle ti-form-radio form-check-input color-input    color-transparent"
+              type="radio" name="header-colors" id="switcher-header-transparent"
+              (click)="updateheaderColor('transparent')" [checked]="localdata['headerColor'] == 'transparent'">
+            <span
+              class="hs-tooltip-content ti-main-tooltip-content !py-1 !px-2 !bg-black text-xs font-medium !text-white shadow-sm dark:!bg-black"
+              role="tooltip">
+              Transparent Header
+            </span>
+          </div>
+        </div>
+        <div class="px-4 text-[#8c9097] dark:text-white/50 text-[.6875rem]"><b class="me-2">Note:</b>If you want to
+          change color
+          Header dynamically
+          change from below Theme Primary color picker.</div>
+      </div>
+      <div class="theme-colors">
+        <p class="switcher-style-head">Theme Primary:</p>
+        <div class="flex switcher-style space-x-3 ">
+          <div class="ti-form-radio switch-select">
+            <input class="ti-form-radio form-check-input color-input color-primary-1" type="radio" name="theme-primary"
+              id="switcher-primary" (click)="updateprimary('58,88,146')"
+              [checked]="localdata['themePrimary'] == 'rgb(58,88,146)'">
+          </div>
+          <div class="ti-form-radio switch-select">
+            <input class="ti-form-radio form-check-input color-input color-primary-2" type="radio" name="theme-primary"
+              id="switcher-primary1" (click)="updateprimary('92,144,163')"
+              [checked]="localdata['themePrimary'] == 'rgb(92,144,163)'">
+          </div>
+          <div class="ti-form-radio switch-select">
+            <input class="ti-form-radio form-check-input color-input color-primary-3" type="radio" name="theme-primary"
+              id="switcher-primary2" (click)="updateprimary('161,90,223')"
+              [checked]="localdata['themePrimary'] == 'rgb(161,90,223)'">
+          </div>
+          <div class="ti-form-radio switch-select">
+            <input class="ti-form-radio form-check-input color-input color-primary-4" type="radio" name="theme-primary"
+              id="switcher-primary3" (click)="updateprimary('78,172,76')"
+              [checked]="localdata['themePrimary'] == 'rgb(78,172,76)'">
+          </div>
+          <div class="ti-form-radio switch-select">
+            <input class="ti-form-radio form-check-input color-input color-primary-5" type="radio" name="theme-primary"
+              id="switcher-primary4" (click)="updateprimary('223,90,90')"
+              [checked]="localdata['themePrimary'] == 'rgb(223,90,90)'">
+          </div>
+          <div class="ti-form-radio switch-select   color-primary-light">
+            <div class="theme-container-primary"></div>
+            <div class="pickr-container-primary">
+
+              <div class="pickr">
+                <button type="button" type="button" role="button" aria-label="toggle color picker dialog"
+                  class="color-bg-transparent pcr-button" style="--pcr-color: rgba(132, 90, 223, 1);"
+                  [style.background]="defaultPrimary" [cpAlphaChannel]="'disabled'" [cpOutputFormat]="'rgba'"
+                  [(colorPicker)]="defaultPrimary" (cpSliderDragEnd)="dynamicLightPrimary($event)"></button>
+
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="theme-colors">
+        <p class="switcher-style-head">Theme Background:</p>
+        <div class="flex switcher-style space-x-3 ">
+
+          <div class="ti-form-radio switch-select">
+            <input class="ti-form-radio form-check-input color-input color-bg-1" type="radio" name="theme-background"
+              id="switcher-background" (click)="
+                        updateBackground({
+                          main: '20,30,96',
+                          secondary: '25, 38, 101',
+                          accent: '25, 38, 101',
+                          overlay: 'rgba(255,255,255,0.1)',
+                          primary:'rgba(255,255,255,0.1)',
+                          theme: 'dark'
+                        })
+                      " [checked]="localdata['themeBackground']?.['main'] === 'rgb(20,30,96)'">
+          </div>
+          <div class="ti-form-radio switch-select">
+            <input class="ti-form-radio color-input form-check-input color-bg-2" type="radio" name="theme-background"
+              id="switcher-background1" (click)="
+                        updateBackground({
+                          main: '8,78,115',
+                          secondary: ' 13, 86, 120',
+                          accent: '13, 86, 120',
+                          overlay: 'rgba(255,255,255,0.1)',
+                          primary:'rgba(255,255,255,0.1)',
+                          theme: 'dark'
+                        })
+                      " [checked]="localdata['themeBackground']?.['main'] === 'rgb(8,78,115)'">
+          </div>
+          <div class="ti-form-radio switch-select">
+            <input class="ti-form-radio color-input  form-check-input color-bg-3" type="radio" name="theme-background"
+              id="switcher-background2" (click)="
+                        updateBackground({
+                          main: '90,37,135',
+                          secondary: '95, 45, 140',
+                          accent: '95, 45, 140',
+                          overlay: 'rgb(95, 45, 140)',
+                          primary:'rgb(95, 45, 140)',
+                          theme: 'dark'
+                        })
+                      " [checked]="localdata['themeBackground']?.['main'] === 'rgb(90,37,135)'">
+          </div>
+          <div class="ti-form-radio switch-select">
+            <input class="ti-form-radio color-input form-check-input color-bg-4" type="radio" name="theme-background"
+              id="switcher-background3" (click)="
+                        updateBackground({
+                          main: '24,101,51',
+                          secondary: '29, 109, 56',
+                          accent: '29, 109, 56',
+                          overlay: 'rgba(255,255,255,0.1)',
+                          primary:'rgba(255,255,255,0.1)',
+                          theme: 'dark'
+                        })
+                      " [checked]="localdata['themeBackground']?.['main'] === 'rgb(24,101,51)'">
+          </div>
+          <div class="ti-form-radio switch-select">
+            <input class="ti-form-radio color-input form-check-input color-bg-5" type="radio" name="theme-background"
+              id="switcher-background4" (click)="
+                        updateBackground({   main: '120, 66, 20',   secondary: '125, 74, 25',   accent: '125, 74, 25',   overlay: 'rgba(255,255,255,0.1)',   primary:'rgba(255,255,255,0.1)',   theme: 'dark'    })
+                      " [checked]="localdata['themeBackground']?.['main'] === 'rgb(120,66,20)'">
+          </div>
+          <div class="ti-form-radio switch-select  color-bg-transparent">
+            <div class="theme-container-background hidden"></div>
+            <div class="pickr-container-background">
+              <div class="pickr">
+                <button type="button" role="button" aria-label="toggle color picker dialog"
+                  class="color-bg-transparent pcr-button" style="--pcr-color: rgba(132, 90, 223, 1);"
+                  [style.background]="defaultBg" [cpAlphaChannel]="'disabled'" [cpOutputFormat]="'rgba'"
+                  [(colorPicker)]="defaultBg" (cpSliderDragEnd)="dynamicTranparentBgPrimary($event)"></button>
+
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="menu-image theme-colors">
+        <p class="switcher-style-head">Menu With Background Image:</p>
+        <div class="flex switcher-style space-x-3  flex-wrap gap-3">
+          <div class="ti-form-radio switch-select">
+            <input class="ti-form-radio  bgimage-input form-check-input bg-img1" type="radio" name="theme-images"
+              id="switcher-bg-img" (click)="updateBgImage('bgimg1')"
+              [checked]="localdata['backgroundImage'] == 'bgimg1'">
+          </div>
+          <div class="ti-form-radio switch-select">
+            <input class="ti-form-radio bgimage-input form-check-input bg-img2" type="radio" name="theme-images"
+              id="switcher-bg-img1" (click)="updateBgImage('bgimg2')"
+              [checked]="localdata['backgroundImage'] == 'bgimg2'">
+          </div>
+          <div class="ti-form-radio switch-select">
+            <input class="ti-form-radio bgimage-input form-check-input bg-img3" type="radio" name="theme-images"
+              id="switcher-bg-img2" (click)="updateBgImage('bgimg3')"
+              [checked]="localdata['backgroundImage'] == 'bgimg3'">
+          </div>
+          <div class="ti-form-radio switch-select">
+            <input class="ti-form-radio bgimage-input form-check-input bg-img4" type="radio" name="theme-images"
+              id="switcher-bg-img3" (click)="updateBgImage('bgimg4')"
+              [checked]="localdata['backgroundImage'] == 'bgimg4'">
+          </div>
+          <div class="ti-form-radio switch-select">
+            <input class="ti-form-radio bgimage-input form-check-input bg-img5" type="radio" name="theme-images"
+              id="switcher-bg-img4" (click)="updateBgImage('bgimg5')"
+              [checked]="localdata['backgroundImage'] == 'bgimg5'">
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+
+  <div class="ti-offcanvas-footer sm:flex justify-between">
+    <a href="javascript:void(0);" id="reset-all" class=" ti-btn ti-btn-danger-full m-1 w-full"
+      (click)="reset()">Reset</a>
+  </div>
+</div>
+<!-- ========== END Switcher  ========== -->
diff --git a/src/app/shell/ui/switcher/switcher.scss b/src/app/shell/ui/switcher/switcher.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/src/app/shell/ui/switcher/switcher.ts b/src/app/shell/ui/switcher/switcher.ts
new file mode 100644
index 00000000..36157f41
--- /dev/null
+++ b/src/app/shell/ui/switcher/switcher.ts
@@ -0,0 +1,191 @@
+import { Component, DOCUMENT, ElementRef, inject, Renderer2 } from '@angular/core';
+import { AppStateService } from '../../../core/services/common/app-state.service';
+import { ColorPickerDirective } from 'ngx-color-picker';
+@Component({
+    selector: 'app-switcher',
+    templateUrl: './switcher.html',
+    styleUrls: ['./switcher.scss'],
+    imports: [ColorPickerDirective]
+})
+export class Switcher {
+  public localdata: any;
+  private document = inject<Document>(DOCUMENT);
+  constructor(
+    private elementRef: ElementRef,
+    private appStateService: AppStateService,
+    private renderer: Renderer2
+  ) {
+    this.appStateService.state$.subscribe(state => {
+      this.localdata = state;
+
+    });
+  }
+
+
+  updateTheme(theme: string) {
+
+    this.appStateService.updateState({ theme, menuColor: theme, headerColor: theme });
+    if (theme == 'light') {
+      this.appStateService.updateState({ theme, themeBackground: '', headerColor: 'light', menuColor: 'dark' });
+      let html = document.querySelector('html');
+      html?.style.removeProperty('--color-bodybg');
+      html?.style.removeProperty('--color-bodybg2');
+      html?.style.removeProperty('--color-light');
+      html?.style.removeProperty('--color-formcontrolbg');
+      html?.style.removeProperty('--color-inputborder');
+      html?.style.removeProperty('--color-gray3');
+      if (window.innerWidth <= 992) {
+        html?.setAttribute('data-toggled', 'close');
+      }
+    }
+    if (theme == 'dark') {
+      this.appStateService.updateState({ theme, themeBackground: '', headerColor: 'dark', menuColor: 'dark' });
+      let html = document.querySelector('html');
+      html?.style.removeProperty('--color-bodybg');
+      html?.style.removeProperty('--color-bodybg2');
+      html?.style.removeProperty('--color-light');
+      html?.style.removeProperty('--color-formcontrolbg');
+      html?.style.removeProperty('--color-inputborder');
+      html?.style.removeProperty('--color-gray3');
+      if (window.innerWidth <= 992) {
+        html?.setAttribute('data-toggled', 'close');
+      }
+    }
+  }
+
+
+  updateDirection(direction: string) {
+    let html = this.elementRef.nativeElement.ownerDocument.documentElement;
+    this.appStateService.updateState({ direction });
+  }
+  updatemenuType(navigationStyles: string) {
+
+
+    this.appStateService.updateState({ navigationStyles });
+    if (navigationStyles == 'horizontal') {
+      this.appStateService.updateState({ navigationStyles, menuStyles: 'menu-click', layoutStyles: '', });
+      const menuclickclosed = document.getElementById(
+        'switcher-menu-click'
+      ) as HTMLInputElement;
+
+      menuclickclosed.checked = true;
+      setTimeout(() => {
+        const mainContentElement = document.querySelector(".main-content") as HTMLElement | null;
+        if (mainContentElement) {
+          mainContentElement.click();
+        }
+      }, 100);
+    } else if (navigationStyles == 'vertical') {
+      this.appStateService.updateState({ navigationStyles, menuStyles: '', layoutStyles: 'default', });
+
+    }
+
+  }
+
+
+  updatemenuStyle(menuStyles: string) {
+
+    this.appStateService.updateState({ menuStyles, layoutStyles: '' });
+
+
+    const navStyle = document.documentElement.getAttribute('data-nav-style');
+
+    if (navStyle === 'icon-hover') {
+      document.querySelector('.double-menu-active')?.setAttribute('style', 'display: none;');
+      const Sidebar: any = document.querySelector(".main-menu");
+      if (Sidebar) {
+        Sidebar.style.marginInline = "0px";
+      }
+    }
+
+    if (navStyle === 'icon-click') {
+      const Sidebar: any = document.querySelector(".main-menu");
+      if (Sidebar) {
+        Sidebar.style.marginInline = "0px";
+      }
+
+    }
+  }
+  updatelayoutStyles(layoutStyles: string) {
+    this.appStateService.updateState({ layoutStyles, menuStyles: '', navigationStyles: '' });
+    if (document.querySelector('html')?.getAttribute('data-vertical-style') == 'doublemenu') {
+      document.querySelector('.slide-menu')?.classList.add('double-menu-active');
+    }
+    else {
+      document.querySelector('.slide-menu')?.classList.remove('double-menu-active');
+    }
+  }
+  updatepageStyles(pageStyles: string) {
+    this.appStateService.updateState({ pageStyles });
+  }
+  updatewidthStyles(widthStyles: string) {
+    this.appStateService.updateState({ widthStyles });
+  }
+  updatemenuPosition(menuPosition: string) {
+    this.appStateService.updateState({ menuPosition });
+  }
+  updateheaderPosition(headerPosition: string) {
+    this.appStateService.updateState({ headerPosition });
+  }
+  updatemenuColor(menuColor: string) {
+    this.appStateService.updateState({ menuColor });
+  }
+  updateheaderColor(headerColor: string) {
+    this.appStateService.updateState({ headerColor: headerColor });
+  }
+  updateprimary(themePrimary: string) {
+    this.appStateService.updateState({ themePrimary: `rgb(${themePrimary})` });
+  }
+  updateBackground(themeBackground: any) {
+    const background = {
+      main: `rgb(${themeBackground.main})`,
+      secondary: `rgb(${themeBackground.secondary})`,
+      accent: `rgb(${themeBackground.accent})`,
+      overlay: themeBackground.overlay,
+      primary: themeBackground.primary,
+      theme: themeBackground.theme
+    }
+    this.appStateService.updateState({ themeBackground: background, menuColor: 'dark', headerColor: 'dark', theme: "dark" });
+  }
+  updateBgImage(backgroundImage: string) {
+    this.appStateService.updateState({ backgroundImage });
+  }
+
+
+  defaultPrimary = '#6c5ffc';
+  public dynamicLightPrimary(data: any): void {
+    this.defaultPrimary = data.color;
+    let primaryColor = this.convertRgbToIndividual(this.defaultPrimary)
+
+    this.updateprimary(primaryColor);
+
+  }
+
+  //background theme change
+  convertRgbToIndividual(value: string): string {
+    // Use a regular expression to extract the numeric values
+    const numericValues = value.match(/\d+/g) || [];
+    // Join the numeric values with spaces to get the desired format
+    return numericValues.join(' ');
+  }
+  public defaultBg = '#6c5ffc';
+  public dynamicTranparentBgPrimary(data: any): void {
+    this.defaultBg = data.color;
+    let bgRgb = this.convertRgbToIndividual(this.defaultBg);
+    let bgRgb2 = this.convertRgbToIndividual(this.defaultBg);
+    let bg1Update = bgRgb.split(' ').join(', ');
+    let bg2Update: any = bgRgb2.split(' ');
+    bg2Update[0] = Number(bg2Update[0]) + 14;
+    bg2Update[1] = Number(bg2Update[1]) + 14;
+    bg2Update[2] = Number(bg2Update[2]) + 14;
+    let bgColor = {
+      main: bg1Update, secondary: bg2Update.join(', '),
+      accent: bg2Update.join(', '), overlay: 'rgba(255,255,255,0.1)',
+      theme: 'dark',
+    }
+    this.updateBackground(bgColor);
+  }
+  reset() {
+    this.appStateService.applyReset();
+  }
+}
diff --git a/src/app/shell/ui/tab-to-top/tab-to-top.html b/src/app/shell/ui/tab-to-top/tab-to-top.html
new file mode 100644
index 00000000..1ac3e07b
--- /dev/null
+++ b/src/app/shell/ui/tab-to-top/tab-to-top.html
@@ -0,0 +1,6 @@
+    <!-- Back To Top -->
+    <div class="scrollToTop" (click)="taptotop()"
+    [ngStyle]="{ display: show ? 'block' : 'none' }"
+    style="display: flex">
+        <span class="arrow"><i class="ri-arrow-up-s-fill text-xl leading-loose"></i></span>
+    </div>
\ No newline at end of file
diff --git a/src/app/shell/ui/tab-to-top/tab-to-top.scss b/src/app/shell/ui/tab-to-top/tab-to-top.scss
new file mode 100644
index 00000000..e69de29b
diff --git a/src/app/shell/ui/tab-to-top/tab-to-top.ts b/src/app/shell/ui/tab-to-top/tab-to-top.ts
new file mode 100644
index 00000000..3c508544
--- /dev/null
+++ b/src/app/shell/ui/tab-to-top/tab-to-top.ts
@@ -0,0 +1,35 @@
+import { ViewportScroller, NgStyle } from '@angular/common';
+import { Component, HostListener, inject } from '@angular/core';
+
+@Component({
+    selector: 'app-tab-to-top',
+    templateUrl: './tab-to-top.html',
+    styleUrl: './tab-to-top.scss',
+    imports: [NgStyle]
+})
+export class TabToTop {
+  private viewScroller = inject(ViewportScroller);
+
+  public show: boolean = false;
+
+  ngOnInit(): void {
+  }
+
+  @HostListener("window:scroll", [])
+
+  onWindowScroll() {
+    let number = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0;
+    if (number > 150) {
+      this.show = true;
+    } else {
+      this.show = false;
+    }
+  }
+
+  taptotop() {
+    let body: any = document.querySelector('body')
+    body.style.scrollBehavior = 'smooth';
+  }
+}
+
+
diff --git a/src/app/tsconfig.app.json b/src/app/tsconfig.app.json
new file mode 100644
index 00000000..e4dd97c6
--- /dev/null
+++ b/src/app/tsconfig.app.json
@@ -0,0 +1,16 @@
+/* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */
+/* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "./out-tsc/app",
+    "rootDir": "./src",
+    "types": []
+  },
+  "include": [
+    "src/**/*.ts"
+  ],
+  "exclude": [
+    "src/**/*.spec.ts"
+  ]
+}
diff --git a/src/app/tsconfig.json b/src/app/tsconfig.json
new file mode 100644
index 00000000..2ab74427
--- /dev/null
+++ b/src/app/tsconfig.json
@@ -0,0 +1,33 @@
+/* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */
+/* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */
+{
+  "compileOnSave": false,
+  "compilerOptions": {
+    "strict": true,
+    "noImplicitOverride": true,
+    "noPropertyAccessFromIndexSignature": true,
+    "noImplicitReturns": true,
+    "noFallthroughCasesInSwitch": true,
+    "skipLibCheck": true,
+    "isolatedModules": true,
+    "experimentalDecorators": true,
+    "importHelpers": true,
+    "target": "ES2022",
+    "module": "preserve"
+  },
+  "angularCompilerOptions": {
+    "enableI18nLegacyMessageIdFormat": false,
+    "strictInjectionParameters": true,
+    "strictInputAccessModifiers": true,
+    "strictTemplates": true
+  },
+  "files": [],
+  "references": [
+    {
+      "path": "./tsconfig.app.json"
+    },
+    {
+      "path": "./tsconfig.spec.json"
+    }
+  ]
+}
diff --git a/src/app/tsconfig.spec.json b/src/app/tsconfig.spec.json
new file mode 100644
index 00000000..d3837063
--- /dev/null
+++ b/src/app/tsconfig.spec.json
@@ -0,0 +1,15 @@
+/* To learn more about Typescript configuration file: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html. */
+/* To learn more about Angular compiler options: https://angular.dev/reference/configs/angular-compiler-options. */
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "./out-tsc/spec",
+    "types": [
+      "vitest/globals"
+    ]
+  },
+  "include": [
+    "src/**/*.d.ts",
+    "src/**/*.spec.ts"
+  ]
+}
diff --git a/src/environments/environment.model.ts b/src/environments/environment.model.ts
new file mode 100644
index 00000000..c741a1f2
--- /dev/null
+++ b/src/environments/environment.model.ts
@@ -0,0 +1,24 @@
+export interface AppFirebaseConfig {
+  apiKey: string;
+  authDomain: string;
+  projectId: string;
+  storageBucket: string;
+  messagingSenderId: string;
+  appId: string;
+  measurementId: string;
+}
+
+export interface AppSessionTimeoutConfig {
+  warningAfterMs: number;
+  logoutAfterMs: number;
+}
+
+export interface AppEnvironment {
+  production: boolean;
+  api: {
+    identity: string;
+    masterAdmin: string;
+  };
+  sessionTimeout: AppSessionTimeoutConfig;
+  firebase: AppFirebaseConfig;
+}
diff --git a/src/environments/environment.prod.ts b/src/environments/environment.prod.ts
index 6e2bb8b7..828c2a61 100644
--- a/src/environments/environment.prod.ts
+++ b/src/environments/environment.prod.ts
@@ -1,6 +1,11 @@
-export const environment = {
+import { AppEnvironment } from './environment.model';
+
+export const environment: AppEnvironment = {
   production: true,
-  apiBaseUrl: '/api',
+  api: {
+    identity: '/api',
+    masterAdmin: '/api',
+  },
   sessionTimeout: {
     warningAfterMs: 25 * 60 * 1000,
     logoutAfterMs: 30 * 60 * 1000,
diff --git a/src/environments/environment.ts b/src/environments/environment.ts
index 689c3d01..9203fb91 100644
--- a/src/environments/environment.ts
+++ b/src/environments/environment.ts
@@ -1,9 +1,17 @@
 // This file can be replaced during build by using the `fileReplacements` array.
 // `ng build` replaces `environment.ts` with `environment.prod.ts`.
 // The list of file replacements can be found in `angular.json`.
-export const environment = {
+import { AppEnvironment } from './environment.model';
+
+export const environment: AppEnvironment = {
   production: false,
-  apiBaseUrl: 'https://localhost:5001/api',
+  api: {
+    identity: 'https://localhost:5001/api',
+    masterAdmin: 'https://localhost:5002/api',
+
+    // identity: 'https://identity.yourdomain.com/api',
+    // masterAdmin: 'https://master-admin.yourdomain.com/api',
+  },
   sessionTimeout: {
     warningAfterMs: 25 * 60 * 1000,
     logoutAfterMs: 30 * 60 * 1000,
diff --git a/src/styles.scss b/src/styles.scss
index 16554952..68b419e8 100644
--- a/src/styles.scss
+++ b/src/styles.scss
@@ -6,8 +6,6 @@
 @forward "../node_modules/ngx-toastr/toastr.css";
 
 
-
-
 /* inter */
 @import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');
 
@@ -15,6 +13,28 @@
 @import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@500;600&display=swap');
 
 
+/* Etihad Altis Text (local font) */
+@font-face {
+  font-family: 'EtihadAltis-Text';
+  src: url('/assets/fonts/EtihadAltis-Text_V3.ttf') format('truetype');
+  font-weight: normal;
+  font-style: normal;
+  font-display: swap;
+}
+
+body {
+  font-family: 'EtihadAltis-Text', 'Inter', 'Noto Sans', sans-serif !important;
+}
+
+.app-sidebar,
+.app-header {
+  font-family: 'EtihadAltis-Text', 'Inter', 'Noto Sans', sans-serif !important;
+}
+
+.main-header-container .header-element {
+  align-items: center !important;
+}
+
 .total-mail-recepients::-webkit-scrollbar {
   @apply h-0!;
 }
@@ -23,3 +43,32 @@
 .custom-scrollbar-width::-webkit-scrollbar {
      @apply w-[5px]!;
 }
+
+.ng-dropdown-panel .ng-dropdown-panel-items .ng-option.ng-option-selected {
+  background-color: var(--color-primary) !important;
+  color: var(--color-white) !important;
+}
+
+.ng-select.app-form-select-control .ng-dropdown-panel {
+  z-index: 99 !important;
+}
+
+.ng-select.app-form-select-control .ng-dropdown-header {
+  padding: 0;
+}
+
+.swal2-styled.app-confirm-dialog-btn {
+  min-width: 110px;
+  min-height: 44px;
+  padding: 0.625em 1.25em;
+  font-size: 1rem;
+  line-height: 1.25;
+}
+
+/* Remove unwanted bottom margin from primary-full buttons */
+.ti-btn-primary-full {
+  margin-bottom: 0 !important;
+}
+.ti-form-select{
+      border: 1px solid #7c3deb !important;
+}