diff --git a/apps/36-blocks/src/app/features/create-feature/create-feature.component.html b/apps/36-blocks/src/app/features/create-feature/create-feature.component.html
index 0a2491be..9dd9ce21 100644
--- a/apps/36-blocks/src/app/features/create-feature/create-feature.component.html
+++ b/apps/36-blocks/src/app/features/create-feature/create-feature.component.html
@@ -876,13 +876,7 @@ <h2 class="mat-h2 font-semibold text-light-gray mb-0" [style.color]="getEffectiv
                 [class.dark-theme]="featureForm.get('brandingDetails.theme')?.value === WidgetTheme.Dark"
             >
                 <div class="auth-option-content">
-                    <mat-icon
-                        class="material-icons-outlined auth-option-icon"
-                        [style.color]="
-                            featureForm.get('brandingDetails.theme')?.value === WidgetTheme.Dark ? '#ffffff' : '#000000'
-                        "
-                        >phone_android</mat-icon
-                    >
+                    <mat-icon class="material-icons-outlined auth-option-icon">phone_android</mat-icon>
                     <span
                         class="auth-option-text"
                         [class.dark-theme]="featureForm.get('brandingDetails.theme')?.value === WidgetTheme.Dark"
@@ -897,13 +891,7 @@ <h2 class="mat-h2 font-semibold text-light-gray mb-0" [style.color]="getEffectiv
                 [class.dark-theme]="featureForm.get('brandingDetails.theme')?.value === WidgetTheme.Dark"
             >
                 <div class="auth-option-content">
-                    <mat-icon
-                        class="material-icons-outlined auth-option-icon"
-                        [style.color]="
-                            featureForm.get('brandingDetails.theme')?.value === WidgetTheme.Dark ? '#ffffff' : '#000000'
-                        "
-                        >apple</mat-icon
-                    >
+                    <mat-icon class="material-icons-outlined auth-option-icon">apple</mat-icon>
                     <span
                         class="auth-option-text"
                         [class.dark-theme]="featureForm.get('brandingDetails.theme')?.value === WidgetTheme.Dark"
@@ -934,13 +922,7 @@ <h2 class="mat-h2 font-semibold text-light-gray mb-0" [style.color]="getEffectiv
                 [class.dark-theme]="featureForm.get('brandingDetails.theme')?.value === WidgetTheme.Dark"
             >
                 <div class="auth-option-content">
-                    <mat-icon
-                        class="material-icons-outlined auth-option-icon"
-                        [style.color]="
-                            featureForm.get('brandingDetails.theme')?.value === WidgetTheme.Dark ? '#ffffff' : '#000000'
-                        "
-                        >password</mat-icon
-                    >
+                    <mat-icon class="material-icons-outlined auth-option-icon">password</mat-icon>
                     <span
                         class="auth-option-text"
                         [class.dark-theme]="featureForm.get('brandingDetails.theme')?.value === WidgetTheme.Dark"
@@ -2106,26 +2088,20 @@ <h5 class="mat-h5 my-0">Taxes</h5>
         <div class="branding-preview">
             @if (isEditMode && featureForm.get('serviceDetails')?.at(3)?.controls?.is_enable?.value &&
             featureForm.get('brandingDetails.version')?.value === 'v2') {
-            <div class="flex items-center justify-center w-full mb-6">
-                <div class="custom-toggle-group">
-                    <button
-                        type="button"
-                        class="custom-toggle-btn"
-                        [class.active]="previewInputPosition !== 'bottom'"
+            <section class="mb-6 flex items-center justify-center">
+                <mat-button-toggle-group>
+                    <mat-button-toggle
+                        [class.mat-button-toggle-checked]="previewInputPosition !== 'bottom'"
                         (click)="previewInputPosition = 'top'"
+                        >Input on Top</mat-button-toggle
                     >
-                        Input on Top
-                    </button>
-                    <button
-                        type="button"
-                        class="custom-toggle-btn"
-                        [class.active]="previewInputPosition === 'bottom'"
+                    <mat-button-toggle
+                        [class.mat-button-toggle-checked]="previewInputPosition === 'bottom'"
                         (click)="previewInputPosition = 'bottom'"
+                        >Input on Bottom</mat-button-toggle
                     >
-                        Input on Bottom
-                    </button>
-                </div>
-            </div>
+                </mat-button-toggle-group>
+            </section>
             }
             <ng-container *ngTemplateOutlet="previewAuthorization; context: { previewVersion: 'v2' }"></ng-container>
         </div>
diff --git a/apps/36-blocks/src/app/features/create-feature/create-feature.component.scss b/apps/36-blocks/src/app/features/create-feature/create-feature.component.scss
index 13d7ee53..39c9c717 100644
--- a/apps/36-blocks/src/app/features/create-feature/create-feature.component.scss
+++ b/apps/36-blocks/src/app/features/create-feature/create-feature.component.scss
@@ -150,40 +150,6 @@
     color: var(--color-common-primary) !important;
 }
 
-.custom-toggle-group {
-    display: inline-flex;
-    border-radius: 8px;
-    overflow: hidden;
-    border: 1px solid var(--color-common-border);
-    background-color: var(--color-common-bg);
-
-    .custom-toggle-btn {
-        padding: 8px 20px;
-        font-size: 13px;
-        font-weight: 500;
-        border: none;
-        background-color: transparent;
-        color: var(--color-common-secondary-text);
-        cursor: pointer;
-        transition: all 0.2s ease;
-        outline: none;
-
-        &:not(:last-child) {
-            border-right: 1px solid var(--color-common-border);
-        }
-
-        &:hover:not(.active) {
-            background-color: var(--color-common-hover);
-        }
-
-        &.active {
-            background-color: var(--color-common-white);
-            color: var(--color-common-primary);
-            box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
-        }
-    }
-}
-
 .social-login-icon-box {
     border: 1px solid var(--color-common-border);
     border-radius: 8px;
@@ -205,15 +171,15 @@
     border-radius: 8px !important;
     font-size: 14px;
     font-weight: 600;
-    background-color: var(--color-common-white) !important;
+    // background-color: var(--color-common-white) !important;
     display: flex;
     align-items: center;
     justify-content: center;
 
-    &.dark-theme {
-        background-color: transparent !important;
-        border-color: #ffffff !important;
-    }
+    // &.dark-theme {
+    //     background-color: transparent !important;
+    border-color: #ffffff !important;
+    // }
 }
 
 .auth-option-content {
diff --git a/apps/36-blocks/src/app/features/create-feature/create-feature.component.ts b/apps/36-blocks/src/app/features/create-feature/create-feature.component.ts
index e5ee82b7..6679a49b 100644
--- a/apps/36-blocks/src/app/features/create-feature/create-feature.component.ts
+++ b/apps/36-blocks/src/app/features/create-feature/create-feature.component.ts
@@ -69,6 +69,7 @@ import { CreateTaxDialogComponent } from './create-tax-dialog/create-tax-dialog.
 import { ConfirmDialogComponent } from '@proxy/ui/confirm-dialog';
 import { ServiceListComponent, ServiceListItem } from '@proxy/ui/service-list';
 import { UiSettingsService } from '../../layout/ui-settings.service';
+import { MatButtonToggleModule } from '@angular/material/button-toggle';
 type ServiceFormGroup = FormGroup<{
     requirements: FormGroup<{
         [key: string]: FormControl<any>;
@@ -135,6 +136,7 @@ export interface PeriodicElement {
         MatExpansionModule,
         MatRadioModule,
         ServiceListComponent,
+        MatButtonToggleModule,
     ],
     templateUrl: './create-feature.component.html',
     styleUrls: ['./create-feature.component.scss'],
diff --git a/apps/36-blocks/src/app/users/management/management.component.ts b/apps/36-blocks/src/app/users/management/management.component.ts
index 406f65ea..948725a8 100644
--- a/apps/36-blocks/src/app/users/management/management.component.ts
+++ b/apps/36-blocks/src/app/users/management/management.component.ts
@@ -42,6 +42,7 @@ import { UserComponentStore } from '../user/user.store';
 import { MatDialog, MatDialogRef } from '@angular/material/dialog';
 import { PROXY_DOM_ID } from '@proxy/constant';
 import { MatChipsModule } from '@angular/material/chips';
+import { SearchComponent } from '@proxy/ui/search';
 
 interface IRole {
     id: number;
@@ -76,6 +77,7 @@ interface IRole {
         CopyButtonComponent,
         MarkdownModule,
         MatChipsModule,
+        SearchComponent,
     ],
     templateUrl: './management.component.html',
     styleUrls: ['./management.component.scss'],
diff --git a/apps/shared/scss/component/_table.scss b/apps/shared/scss/component/_table.scss
index bd276d20..84f73272 100644
--- a/apps/shared/scss/component/_table.scss
+++ b/apps/shared/scss/component/_table.scss
@@ -1,7 +1,10 @@
 $border: 1px solid var(--color-common-border);
 $border-radius: var(--border-common-radius-4);
 .table-scroll {
-    @apply w-full overflow-x-auto grow;
+    @apply w-full overflow-x-auto;
+    &:has(proxy-no-record-found) {
+        flex-grow: 1;
+    }
     @media screen and (min-width: 768px) {
         border: $border;
         border-radius: $border-radius;
diff --git a/libs/ui/loader/src/lib/loader.component.ts b/libs/ui/loader/src/lib/loader.component.ts
index 35d12e33..0ebdbc5a 100644
--- a/libs/ui/loader/src/lib/loader.component.ts
+++ b/libs/ui/loader/src/lib/loader.component.ts
@@ -6,10 +6,8 @@ import { MatProgressSpinnerModule } from '@angular/material/progress-spinner';
     imports: [MatProgressSpinnerModule],
     changeDetection: ChangeDetectionStrategy.OnPush,
     template: `
-        <div
-            class="h-screen content-loader absolute flex justify-center items-center bg-transparent top-0 left-0 right-0 bottom-0 bg-color rounded-lg"
-        >
-            <div class="loading-box flex items-center gap-4">
+        <div class="h-screen content-loader flex justify-center items-center bg-transparent">
+            <div class="flex gap-4 items-center loading-box p-1.5 rounded-lg bg-color">
                 <mat-spinner></mat-spinner>
                 <span class="text-color">{{ message() }}</span>
             </div>