Still working on upgrading to Tailwind CSS v4 an dSkeleton v3.....

src/routes/events/+layout.svelte

@@ -5,18 +5,18 @@ let log_lvl: number = 0;
 // *** Import Svelte specific
 import { browser } from '$app/environment';
 // *** Import other supporting libraries
-import { AppShell, AppBar, initializeStores } from '@skeletonlabs/skeleton';
-import { Modal } from '@skeletonlabs/skeleton';
-import type {
-    ModalComponent
-    } from '@skeletonlabs/skeleton';
+import { AppBar } from '@skeletonlabs/skeleton-svelte';
+import { Modal } from '@skeletonlabs/skeleton-svelte';
+// import type {
+//     ModalComponent
+//     } from '@skeletonlabs/skeleton-svelte';
 
-const modalRegistry: Record<string, ModalComponent> = {
-	// Set a unique modal ID, then pass the component reference
-	// modalComponentEditSponsorshipObj: { ref: ModalComponentEditSponsorshipObj },
-	// modalComponentTwo: { ref: ModalComponentTwo },
-	// ...
-};
+// const modalRegistry: Record<string, ModalComponent> = {
+// 	// Set a unique modal ID, then pass the component reference
+// 	// modalComponentEditSponsorshipObj: { ref: ModalComponentEditSponsorshipObj },
+// 	// modalComponentTwo: { ref: ModalComponentTwo },
+// 	// ...
+// };
 
 // *** Import Aether specific variables and functions
 import type { key_val } from '$lib/ae_stores';
@@ -119,20 +119,20 @@ if (browser) {
 </svelte:head>
 
 
-<Modal components={modalRegistry}
+<!-- <Modal components={modalRegistry}
     regionBackdrop=''
     regionBody=''
     regionHeader='modal-header card-header text-2xl font-bold'
     regionFooter='modal-footer flex justify-between space-x-2'
-    />
+    /> -->
 
 <!-- App Shell -->
-<AppShell
+<!-- <AppShell
     regionPage={($ae_loc.iframe ? 'iframe' : '')}
     slotHeader={($ae_loc.iframe ? 'iframe' : '')}
     slotFooter={($ae_loc.iframe ? 'iframe' : '')}
-    >
-
+    > -->
+<main>
     {#snippet header()}
 
             <!-- App Bar -->
@@ -202,5 +202,5 @@ if (browser) {
 
     {/snippet}
 
-
-</AppShell>
+</main>
+<!-- </AppShell> -->