diff --git a/resources/views/components/layouts/auth/card.blade.php b/resources/views/components/layouts/auth/card.blade.php
index 1a316ef..b5a62c6 100644
--- a/resources/views/components/layouts/auth/card.blade.php
+++ b/resources/views/components/layouts/auth/card.blade.php
@@ -15,7 +15,7 @@
                 </a>
 
                 <div class="flex flex-col gap-6">
-                    <div class="rounded-xl border bg-white dark:bg-stone-950 dark:border-stone-800 text-stone-800 shadow-xs">
+                    <div class="styled-container">
                         <div class="px-10 py-8">{{ $slot }}</div>
                     </div>
                 </div>
diff --git a/resources/views/livewire/device-dashboard.blade.php b/resources/views/livewire/device-dashboard.blade.php
index 5db65d1..7fd48a8 100644
--- a/resources/views/livewire/device-dashboard.blade.php
+++ b/resources/views/livewire/device-dashboard.blade.php
@@ -16,7 +16,7 @@ new class extends Component {
             @if($devices->isEmpty())
                 <div class="flex flex-col gap-6">
                     <div
-                        class="rounded-xl border bg-white dark:bg-stone-950 dark:border-stone-800 text-stone-800 shadow-xs">
+                        class="styled-container">
                         <div class="px-10 py-8">
                             <h1 class="text-xl font-medium dark:text-zinc-200">Add your first device</h1>
                             <flux:button href="{{ route('devices') }}" class="mt-4" icon="plus-circle" variant="primary"
@@ -30,7 +30,7 @@ new class extends Component {
             @foreach($devices as $device)
                 <div class="flex flex-col gap-6">
                     <div
-                        class="rounded-xl border bg-white dark:bg-stone-950 dark:border-stone-800 text-stone-800 shadow-xs">
+                        class="styled-container">
                         <div class="px-10 py-8">
                             @php
                                 $current_image_uuid =$device->current_screen_image;
diff --git a/resources/views/livewire/devices/configure.blade.php b/resources/views/livewire/devices/configure.blade.php
index 851c604..f9d49ca 100644
--- a/resources/views/livewire/devices/configure.blade.php
+++ b/resources/views/livewire/devices/configure.blade.php
@@ -309,7 +309,7 @@ new class extends Component {
 <div class="bg-muted flex flex-col items-center justify-center gap-6 p-6 md:p-10">
     <div class="flex flex-col gap-6">
         <div
-            class="rounded-xl border bg-white dark:bg-stone-950 dark:border-stone-800 text-stone-800 shadow-xs">
+            class="styled-container">
             <div class="px-10 py-8">
                 @php
                     $current_image_uuid =$device->current_screen_image;
diff --git a/resources/views/livewire/playlists/index.blade.php b/resources/views/livewire/playlists/index.blade.php
index 3e786b4..6c979e6 100644
--- a/resources/views/livewire/playlists/index.blade.php
+++ b/resources/views/livewire/playlists/index.blade.php
@@ -332,7 +332,7 @@ new class extends Component {
             @endforeach
 
             @if($devices->isEmpty() || $devices->every(fn($device) => $device->playlists->isEmpty()))
-                <div class="rounded-xl border bg-white dark:bg-stone-950 dark:border-stone-800 text-stone-800 shadow-xs">
+                <div class="styled-container">
                     <div class="px-10 py-8">
                         <h1 class="text-xl font-medium dark:text-zinc-200">No playlists found</h1>
                         <p class="text-sm dark:text-zinc-400 mt-2">Add playlists to your devices to see them here.</p>
diff --git a/resources/views/livewire/plugins/index.blade.php b/resources/views/livewire/plugins/index.blade.php
index 4347aaf..d902183 100644
--- a/resources/views/livewire/plugins/index.blade.php
+++ b/resources/views/livewire/plugins/index.blade.php
@@ -395,7 +395,7 @@ new class extends Component {
                     wire:key="plugin-{{ $plugin['id'] ?? $plugin['name'] ?? $index }}"
                     x-data="{ pluginName: {{ json_encode(strtolower($plugin['name'] ?? '')) }} }"
                     x-show="searchTerm.length <= 1 || pluginName.includes(searchTerm.toLowerCase())"
-                    class="rounded-xl border bg-white dark:bg-stone-950 dark:border-stone-800 text-stone-800 shadow-xs">
+                    class="styled-container">
                     <a href="{{ ($plugin['detail_view_route']) ? route($plugin['detail_view_route']) : route('plugins.recipe', ['plugin' => $plugin['id']]) }}"
                        class="block h-full">
                         <div class="flex items-center space-x-4 px-10 py-8 h-full">