diff --git a/src/app/app.component.ts b/src/app/app.component.ts
index 04f6090..04933c0 100644
--- a/src/app/app.component.ts
+++ b/src/app/app.component.ts
@@ -1,6 +1,6 @@
 import { Component } from '@angular/core';
 import { RouterOutlet } from '@angular/router';
-import { SnackbarContainerComponent } from './shared/components/snackbar-container/snackbar-container.component';
+import { SnackbarContainerComponent } from './shared/components/ui/snackbar-container/snackbar-container.component';
 import { CookieConsentComponent } from './core/components/cookie-consent/cookie-consent.component';
 
 @Component({
diff --git a/src/app/features/demo/components/demo2/demo2.component.html b/src/app/features/demo/components/demo2/demo2.component.html
index a84b8d6..1607bcb 100644
--- a/src/app/features/demo/components/demo2/demo2.component.html
+++ b/src/app/features/demo/components/demo2/demo2.component.html
@@ -57,11 +57,11 @@
 
       <app-card class="grid-col-span-2">
         <h3 class="card-header">Letzte Bestellungen</h3>
-        <!-- <app-orders-table
+        <app-orders-table
           [orders]="ordersData"
           (deleteOrder)="handleDeleteOrder($event)"
         >
-        </app-orders-table> -->
+        </app-orders-table>
         <app-paginator
           [currentPage]="currentPage"
           [totalItems]="totalItems"
diff --git a/src/app/shared/components/data-display/orders-table/orders-table.component.css b/src/app/shared/components/data-display/data-display.css
similarity index 55%
rename from src/app/shared/components/data-display/orders-table/orders-table.component.css
rename to src/app/shared/components/data-display/data-display.css
index 2cfcb8a..63c8f92 100644
--- a/src/app/shared/components/data-display/orders-table/orders-table.component.css
+++ b/src/app/shared/components/data-display/data-display.css
@@ -1,3 +1,61 @@
+/* WICHTIG: Diese Stile sollten aus der globalen styles.css HIERHER VERSCHOBEN werden. */
+:host {
+  display: block;
+}
+
+.kpi-card {
+  display: flex;
+  align-items: center;
+  gap: 1rem;
+  padding: 1.5rem;
+}
+
+.kpi-icon {
+  width: 50px;
+  height: 50px;
+  border-radius: 50%;
+  display: grid;
+  place-items: center;
+  flex-shrink: 0;
+  background-color: var(--color-surface);
+}
+
+.kpi-icon app-icon {
+  width: 24px;
+  height: 24px;
+  color: #fff;
+}
+
+.icon-blue {
+  background: linear-gradient(135deg, #3498db, #2980b9);
+}
+.icon-green {
+  background: linear-gradient(135deg, #2ecc71, #27ae60);
+}
+.icon-orange {
+  background: linear-gradient(135deg, #f39c12, #f1c40f);
+}
+.icon-purple {
+  background: linear-gradient(135deg, #9b59b6, #8e44ad);
+}
+
+.kpi-content {
+  display: flex;
+  flex-direction: column;
+}
+
+.kpi-value {
+  font-size: 1.75rem;
+  font-weight: 700;
+  color: var(--color-text);
+}
+
+.kpi-label {
+  font-size: 0.9rem;
+  color: var(--color-text-light);
+}
+
+
 /* Verschieben Sie alle Tabellen-Stile aus styles.css hierher */
 :host {
   display: block;
@@ -82,4 +140,27 @@
   text-align: center;
   padding: 2rem;
   color: var(--color-text-light);
+}
+
+/* Verschieben Sie diese Stile aus der globalen styles.css hierher */
+:host {
+  display: block;
+}
+
+.paginator {
+  display: flex;
+  justify-content: flex-end;
+  align-items: center;
+  gap: 1.5rem;
+  padding: 1rem;
+  border-top: 1px solid var(--color-border);
+}
+.paginator-info {
+  font-size: 0.9rem;
+  color: var(--color-text-light);
+  font-weight: 500;
+}
+.paginator-controls {
+  display: flex;
+  gap: 0.5rem;
 }
\ No newline at end of file
diff --git a/src/app/shared/components/data-display/kpi-card/kpi-card.component.css b/src/app/shared/components/data-display/kpi-card/kpi-card.component.css
deleted file mode 100644
index 80d944f..0000000
--- a/src/app/shared/components/data-display/kpi-card/kpi-card.component.css
+++ /dev/null
@@ -1,56 +0,0 @@
-/* WICHTIG: Diese Stile sollten aus der globalen styles.css HIERHER VERSCHOBEN werden. */
-:host {
-  display: block;
-}
-
-.kpi-card {
-  display: flex;
-  align-items: center;
-  gap: 1rem;
-  padding: 1.5rem;
-}
-
-.kpi-icon {
-  width: 50px;
-  height: 50px;
-  border-radius: 50%;
-  display: grid;
-  place-items: center;
-  flex-shrink: 0;
-  background-color: var(--color-surface);
-}
-
-.kpi-icon app-icon {
-  width: 24px;
-  height: 24px;
-  color: #fff;
-}
-
-.icon-blue {
-  background: linear-gradient(135deg, #3498db, #2980b9);
-}
-.icon-green {
-  background: linear-gradient(135deg, #2ecc71, #27ae60);
-}
-.icon-orange {
-  background: linear-gradient(135deg, #f39c12, #f1c40f);
-}
-.icon-purple {
-  background: linear-gradient(135deg, #9b59b6, #8e44ad);
-}
-
-.kpi-content {
-  display: flex;
-  flex-direction: column;
-}
-
-.kpi-value {
-  font-size: 1.75rem;
-  font-weight: 700;
-  color: var(--color-text);
-}
-
-.kpi-label {
-  font-size: 0.9rem;
-  color: var(--color-text-light);
-}
diff --git a/src/app/shared/components/data-display/kpi-card/kpi-card.component.ts b/src/app/shared/components/data-display/kpi-card/kpi-card.component.ts
index e82288a..9c1db25 100644
--- a/src/app/shared/components/data-display/kpi-card/kpi-card.component.ts
+++ b/src/app/shared/components/data-display/kpi-card/kpi-card.component.ts
@@ -2,14 +2,14 @@ import { Component, Input } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { IconComponent } from '../../ui/icon/icon.component';
 
-type KpiColor = 'blue' | 'green' | 'orange' | 'purple'; 
+type KpiColor = 'blue' | 'green' | 'orange' | 'purple';
 
 @Component({
   selector: 'app-kpi-card',
   standalone: true,
   imports: [CommonModule, IconComponent],
   templateUrl: './kpi-card.component.html',
-  styleUrl: './kpi-card.component.css',
+  styleUrl: '../data-display.css',
 })
 export class KpiCardComponent {
   @Input() value: string = '';
@@ -17,4 +17,4 @@ export class KpiCardComponent {
   @Input() color: KpiColor = 'blue';
   @Input() iconName: string | null = null;
   @Input() svgColor: string | null = null;
-}
\ No newline at end of file
+}
diff --git a/src/app/shared/components/data-display/orders-table/orders-table.component.ts b/src/app/shared/components/data-display/orders-table/orders-table.component.ts
index c0d6d59..3d5a5e7 100644
--- a/src/app/shared/components/data-display/orders-table/orders-table.component.ts
+++ b/src/app/shared/components/data-display/orders-table/orders-table.component.ts
@@ -29,7 +29,7 @@ export interface Order {
     IconComponent
   ],
   templateUrl: './orders-table.component.html',
-  styleUrl: './orders-table.component.css'
+  styleUrl: '../data-display.css'
 })
 export class OrdersTableComponent {
   // Nimmt die anzuzeigenden Bestelldaten entgegen
diff --git a/src/app/shared/components/data-display/paginator/paginator.component.css b/src/app/shared/components/data-display/paginator/paginator.component.css
deleted file mode 100644
index a162fbc..0000000
--- a/src/app/shared/components/data-display/paginator/paginator.component.css
+++ /dev/null
@@ -1,22 +0,0 @@
-/* Verschieben Sie diese Stile aus der globalen styles.css hierher */
-:host {
-  display: block;
-}
-
-.paginator {
-  display: flex;
-  justify-content: flex-end;
-  align-items: center;
-  gap: 1.5rem;
-  padding: 1rem;
-  border-top: 1px solid var(--color-border);
-}
-.paginator-info {
-  font-size: 0.9rem;
-  color: var(--color-text-light);
-  font-weight: 500;
-}
-.paginator-controls {
-  display: flex;
-  gap: 0.5rem;
-}
\ No newline at end of file
diff --git a/src/app/shared/components/data-display/paginator/paginator.component.ts b/src/app/shared/components/data-display/paginator/paginator.component.ts
index c6f51f7..6735e4d 100644
--- a/src/app/shared/components/data-display/paginator/paginator.component.ts
+++ b/src/app/shared/components/data-display/paginator/paginator.component.ts
@@ -7,7 +7,7 @@ import { ButtonComponent } from '../../ui/button/button.component';
   standalone: true,
   imports: [CommonModule, ButtonComponent],
   templateUrl: './paginator.component.html',
-  styleUrl: './paginator.component.css'
+  styleUrl: '../data-display.css'
 })
 export class PaginatorComponent {
   // --- EINGABEN von außen ---
diff --git a/src/app/shared/components/snackbar-container/snackbar-container.component.css b/src/app/shared/components/ui/snackbar-container/snackbar-container.component.css
similarity index 100%
rename from src/app/shared/components/snackbar-container/snackbar-container.component.css
rename to src/app/shared/components/ui/snackbar-container/snackbar-container.component.css
diff --git a/src/app/shared/components/snackbar-container/snackbar-container.component.html b/src/app/shared/components/ui/snackbar-container/snackbar-container.component.html
similarity index 100%
rename from src/app/shared/components/snackbar-container/snackbar-container.component.html
rename to src/app/shared/components/ui/snackbar-container/snackbar-container.component.html
diff --git a/src/app/shared/components/snackbar-container/snackbar-container.component.ts b/src/app/shared/components/ui/snackbar-container/snackbar-container.component.ts
similarity index 95%
rename from src/app/shared/components/snackbar-container/snackbar-container.component.ts
rename to src/app/shared/components/ui/snackbar-container/snackbar-container.component.ts
index 5fcb93d..44912ed 100644
--- a/src/app/shared/components/snackbar-container/snackbar-container.component.ts
+++ b/src/app/shared/components/ui/snackbar-container/snackbar-container.component.ts
@@ -1,7 +1,7 @@
 import { Component } from '@angular/core';
 import { CommonModule } from '@angular/common';
 import { Observable } from 'rxjs';
-import { Snackbar, SnackbarService } from '../../services/snackbar.service';
+import { Snackbar, SnackbarService } from '../../../services/snackbar.service';
 import { SnackbarComponent } from '../snackbar/snackbar.component';
 
 @Component({
diff --git a/src/app/shared/components/snackbar/snackbar.component.css b/src/app/shared/components/ui/snackbar/snackbar.component.css
similarity index 100%
rename from src/app/shared/components/snackbar/snackbar.component.css
rename to src/app/shared/components/ui/snackbar/snackbar.component.css
diff --git a/src/app/shared/components/snackbar/snackbar.component.html b/src/app/shared/components/ui/snackbar/snackbar.component.html
similarity index 100%
rename from src/app/shared/components/snackbar/snackbar.component.html
rename to src/app/shared/components/ui/snackbar/snackbar.component.html
diff --git a/src/app/shared/components/snackbar/snackbar.component.ts b/src/app/shared/components/ui/snackbar/snackbar.component.ts
similarity index 100%
rename from src/app/shared/components/snackbar/snackbar.component.ts
rename to src/app/shared/components/ui/snackbar/snackbar.component.ts