diff --git a/.idea/DredgeTours.iml b/.idea/DredgeTours.iml
index 212719e..7169069 100644
--- a/.idea/DredgeTours.iml
+++ b/.idea/DredgeTours.iml
@@ -2,21 +2,144 @@
 <module type="WEB_MODULE" version="4">
   <component name="NewModuleRootManager">
     <content url="file://$MODULE_DIR$">
-      <sourceFolder url="file://$MODULE_DIR$/spec" isTestSource="true" />
+      <excludeFolder url="file://$MODULE_DIR$/storage/app" />
+      <excludeFolder url="file://$MODULE_DIR$/storage/framework" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/_laravel_idea" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/bacon/bacon-qr-code" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/brianium/paratest" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/brick/math" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/carbonphp/carbon-doctrine-types" />
       <excludeFolder url="file://$MODULE_DIR$/vendor/composer" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/dasprid/enum" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/dflydev/dot-access-data" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/doctrine/deprecations" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/doctrine/inflector" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/doctrine/lexer" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/dragonmantank/cron-expression" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/egulias/email-validator" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/fakerphp/faker" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/fidry/cpu-core-counter" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/filp/whoops" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/fruitcake/php-cors" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/graham-campbell/result-type" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/guzzlehttp/guzzle" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/guzzlehttp/promises" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/guzzlehttp/psr7" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/guzzlehttp/uri-template" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/hamcrest/hamcrest-php" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/inertiajs/inertia-laravel" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/jean85/pretty-package-versions" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/laravel/fortify" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/laravel/framework" />
       <excludeFolder url="file://$MODULE_DIR$/vendor/laravel/installer" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/laravel/pail" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/laravel/pint" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/laravel/prompts" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/laravel/sail" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/laravel/serializable-closure" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/laravel/tinker" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/laravel/wayfinder" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/league/commonmark" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/league/config" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/league/flysystem" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/league/flysystem-local" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/league/mime-type-detection" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/league/uri" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/league/uri-interfaces" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/mockery/mockery" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/monolog/monolog" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/myclabs/deep-copy" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/nesbot/carbon" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/nette/schema" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/nette/utils" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/nikic/php-parser" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/nunomaduro/collision" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/nunomaduro/termwind" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/paragonie/constant_time_encoding" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/pestphp/pest" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/pestphp/pest-plugin" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/pestphp/pest-plugin-arch" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/pestphp/pest-plugin-laravel" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/pestphp/pest-plugin-mutate" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/pestphp/pest-plugin-profanity" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/phar-io/manifest" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/phar-io/version" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/phpdocumentor/reflection-common" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/phpdocumentor/reflection-docblock" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/phpdocumentor/type-resolver" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/phpoption/phpoption" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/phpstan/phpdoc-parser" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/phpunit/php-code-coverage" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/phpunit/php-file-iterator" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/phpunit/php-invoker" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/phpunit/php-text-template" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/phpunit/php-timer" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/phpunit/phpunit" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/pragmarx/google2fa" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/psr/clock" />
       <excludeFolder url="file://$MODULE_DIR$/vendor/psr/container" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/psr/event-dispatcher" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/psr/http-client" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/psr/http-factory" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/psr/http-message" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/psr/log" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/psr/simple-cache" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/psy/psysh" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/ralouphie/getallheaders" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/ramsey/collection" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/ramsey/uuid" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/sebastian/cli-parser" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/sebastian/comparator" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/sebastian/complexity" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/sebastian/diff" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/sebastian/environment" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/sebastian/exporter" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/sebastian/global-state" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/sebastian/lines-of-code" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/sebastian/object-enumerator" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/sebastian/object-reflector" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/sebastian/recursion-context" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/sebastian/type" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/sebastian/version" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/staabm/side-effects-detector" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/symfony/clock" />
       <excludeFolder url="file://$MODULE_DIR$/vendor/symfony/console" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/symfony/css-selector" />
       <excludeFolder url="file://$MODULE_DIR$/vendor/symfony/deprecation-contracts" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/symfony/error-handler" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/symfony/event-dispatcher" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/symfony/event-dispatcher-contracts" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/symfony/finder" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/symfony/http-foundation" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/symfony/http-kernel" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/symfony/mailer" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/symfony/mime" />
       <excludeFolder url="file://$MODULE_DIR$/vendor/symfony/polyfill-ctype" />
       <excludeFolder url="file://$MODULE_DIR$/vendor/symfony/polyfill-intl-grapheme" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/symfony/polyfill-intl-idn" />
       <excludeFolder url="file://$MODULE_DIR$/vendor/symfony/polyfill-intl-normalizer" />
       <excludeFolder url="file://$MODULE_DIR$/vendor/symfony/polyfill-mbstring" />
       <excludeFolder url="file://$MODULE_DIR$/vendor/symfony/polyfill-php73" />
       <excludeFolder url="file://$MODULE_DIR$/vendor/symfony/polyfill-php80" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/symfony/polyfill-php83" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/symfony/polyfill-php84" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/symfony/polyfill-php85" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/symfony/polyfill-uuid" />
       <excludeFolder url="file://$MODULE_DIR$/vendor/symfony/process" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/symfony/routing" />
       <excludeFolder url="file://$MODULE_DIR$/vendor/symfony/service-contracts" />
       <excludeFolder url="file://$MODULE_DIR$/vendor/symfony/string" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/symfony/translation" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/symfony/translation-contracts" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/symfony/uid" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/symfony/var-dumper" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/symfony/yaml" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/ta-tikoma/phpunit-architecture-test" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/theseer/tokenizer" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/tijsverkoyen/css-to-inline-styles" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/vlucas/phpdotenv" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/voku/portable-ascii" />
+      <excludeFolder url="file://$MODULE_DIR$/vendor/webmozart/assert" />
     </content>
     <orderEntry type="inheritedJdk" />
     <orderEntry type="sourceFolder" forTests="false" />
diff --git a/.idea/php.xml b/.idea/php.xml
index f15750e..b38bdc7 100644
--- a/.idea/php.xml
+++ b/.idea/php.xml
@@ -1,5 +1,10 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <project version="4">
+  <component name="LaravelPint">
+    <laravel_pint_settings>
+      <LaravelPintConfiguration tool_path="$PROJECT_DIR$/vendor/bin/pint" />
+    </laravel_pint_settings>
+  </component>
   <component name="MessDetectorOptionsConfiguration">
     <option name="transferred" value="true" />
   </component>
@@ -10,6 +15,11 @@
     <option name="highlightLevel" value="WARNING" />
     <option name="transferred" value="true" />
   </component>
+  <component name="PhpCodeSniffer">
+    <phpcs_settings>
+      <phpcs_by_interpreter asDefaultInterpreter="true" interpreter_id="8fb3147c-6b6f-45ab-a890-92cb8433f45f" timeout="30000" />
+    </phpcs_settings>
+  </component>
   <component name="PhpIncludePathManager">
     <include_path>
       <path value="$PROJECT_DIR$/vendor/psr/container" />
@@ -26,9 +36,136 @@
       <path value="$PROJECT_DIR$/vendor/symfony/service-contracts" />
       <path value="$PROJECT_DIR$/vendor/symfony/string" />
       <path value="$PROJECT_DIR$/vendor/composer" />
+      <path value="$PROJECT_DIR$/vendor/doctrine/deprecations" />
+      <path value="$PROJECT_DIR$/vendor/doctrine/inflector" />
+      <path value="$PROJECT_DIR$/vendor/doctrine/lexer" />
+      <path value="$PROJECT_DIR$/vendor/fakerphp/faker" />
+      <path value="$PROJECT_DIR$/vendor/hamcrest/hamcrest-php" />
+      <path value="$PROJECT_DIR$/vendor/pragmarx/google2fa" />
+      <path value="$PROJECT_DIR$/vendor/carbonphp/carbon-doctrine-types" />
+      <path value="$PROJECT_DIR$/vendor/fruitcake/php-cors" />
+      <path value="$PROJECT_DIR$/vendor/inertiajs/inertia-laravel" />
+      <path value="$PROJECT_DIR$/vendor/paragonie/constant_time_encoding" />
+      <path value="$PROJECT_DIR$/vendor/phpoption/phpoption" />
+      <path value="$PROJECT_DIR$/vendor/ralouphie/getallheaders" />
+      <path value="$PROJECT_DIR$/vendor/sebastian/cli-parser" />
+      <path value="$PROJECT_DIR$/vendor/sebastian/comparator" />
+      <path value="$PROJECT_DIR$/vendor/sebastian/complexity" />
+      <path value="$PROJECT_DIR$/vendor/sebastian/diff" />
+      <path value="$PROJECT_DIR$/vendor/sebastian/environment" />
+      <path value="$PROJECT_DIR$/vendor/sebastian/exporter" />
+      <path value="$PROJECT_DIR$/vendor/sebastian/global-state" />
+      <path value="$PROJECT_DIR$/vendor/sebastian/lines-of-code" />
+      <path value="$PROJECT_DIR$/vendor/sebastian/object-enumerator" />
+      <path value="$PROJECT_DIR$/vendor/sebastian/object-reflector" />
+      <path value="$PROJECT_DIR$/vendor/sebastian/recursion-context" />
+      <path value="$PROJECT_DIR$/vendor/sebastian/type" />
+      <path value="$PROJECT_DIR$/vendor/sebastian/version" />
+      <path value="$PROJECT_DIR$/vendor/ta-tikoma/phpunit-architecture-test" />
+      <path value="$PROJECT_DIR$/vendor/webmozart/assert" />
+      <path value="$PROJECT_DIR$/vendor/guzzlehttp/guzzle" />
+      <path value="$PROJECT_DIR$/vendor/guzzlehttp/promises" />
+      <path value="$PROJECT_DIR$/vendor/guzzlehttp/psr7" />
+      <path value="$PROJECT_DIR$/vendor/guzzlehttp/uri-template" />
+      <path value="$PROJECT_DIR$/vendor/nunomaduro/collision" />
+      <path value="$PROJECT_DIR$/vendor/nunomaduro/termwind" />
+      <path value="$PROJECT_DIR$/vendor/tijsverkoyen/css-to-inline-styles" />
+      <path value="$PROJECT_DIR$/vendor/dragonmantank/cron-expression" />
+      <path value="$PROJECT_DIR$/vendor/phpdocumentor/reflection-common" />
+      <path value="$PROJECT_DIR$/vendor/phpdocumentor/reflection-docblock" />
+      <path value="$PROJECT_DIR$/vendor/phpdocumentor/type-resolver" />
+      <path value="$PROJECT_DIR$/vendor/graham-campbell/result-type" />
+      <path value="$PROJECT_DIR$/vendor/psr/clock" />
+      <path value="$PROJECT_DIR$/vendor/psr/event-dispatcher" />
+      <path value="$PROJECT_DIR$/vendor/psr/http-client" />
+      <path value="$PROJECT_DIR$/vendor/psr/http-factory" />
+      <path value="$PROJECT_DIR$/vendor/psr/http-message" />
+      <path value="$PROJECT_DIR$/vendor/psr/log" />
+      <path value="$PROJECT_DIR$/vendor/psr/simple-cache" />
+      <path value="$PROJECT_DIR$/vendor/psy/psysh" />
+      <path value="$PROJECT_DIR$/vendor/filp/whoops" />
+      <path value="$PROJECT_DIR$/vendor/voku/portable-ascii" />
+      <path value="$PROJECT_DIR$/vendor/bacon/bacon-qr-code" />
+      <path value="$PROJECT_DIR$/vendor/brick/math" />
+      <path value="$PROJECT_DIR$/vendor/fidry/cpu-core-counter" />
+      <path value="$PROJECT_DIR$/vendor/nette/schema" />
+      <path value="$PROJECT_DIR$/vendor/nette/utils" />
+      <path value="$PROJECT_DIR$/vendor/nikic/php-parser" />
+      <path value="$PROJECT_DIR$/vendor/jean85/pretty-package-versions" />
+      <path value="$PROJECT_DIR$/vendor/league/commonmark" />
+      <path value="$PROJECT_DIR$/vendor/league/config" />
+      <path value="$PROJECT_DIR$/vendor/league/flysystem" />
+      <path value="$PROJECT_DIR$/vendor/league/flysystem-local" />
+      <path value="$PROJECT_DIR$/vendor/league/mime-type-detection" />
+      <path value="$PROJECT_DIR$/vendor/league/uri" />
+      <path value="$PROJECT_DIR$/vendor/league/uri-interfaces" />
+      <path value="$PROJECT_DIR$/vendor/nesbot/carbon" />
+      <path value="$PROJECT_DIR$/vendor/ramsey/collection" />
+      <path value="$PROJECT_DIR$/vendor/ramsey/uuid" />
+      <path value="$PROJECT_DIR$/vendor/staabm/side-effects-detector" />
+      <path value="$PROJECT_DIR$/vendor/vlucas/phpdotenv" />
+      <path value="$PROJECT_DIR$/vendor/dasprid/enum" />
+      <path value="$PROJECT_DIR$/vendor/dflydev/dot-access-data" />
+      <path value="$PROJECT_DIR$/vendor/egulias/email-validator" />
+      <path value="$PROJECT_DIR$/vendor/laravel/fortify" />
+      <path value="$PROJECT_DIR$/vendor/laravel/framework" />
+      <path value="$PROJECT_DIR$/vendor/laravel/pail" />
+      <path value="$PROJECT_DIR$/vendor/laravel/pint" />
+      <path value="$PROJECT_DIR$/vendor/laravel/prompts" />
+      <path value="$PROJECT_DIR$/vendor/laravel/sail" />
+      <path value="$PROJECT_DIR$/vendor/laravel/serializable-closure" />
+      <path value="$PROJECT_DIR$/vendor/laravel/tinker" />
+      <path value="$PROJECT_DIR$/vendor/laravel/wayfinder" />
+      <path value="$PROJECT_DIR$/vendor/mockery/mockery" />
+      <path value="$PROJECT_DIR$/vendor/monolog/monolog" />
+      <path value="$PROJECT_DIR$/vendor/myclabs/deep-copy" />
+      <path value="$PROJECT_DIR$/vendor/pestphp/pest" />
+      <path value="$PROJECT_DIR$/vendor/pestphp/pest-plugin" />
+      <path value="$PROJECT_DIR$/vendor/pestphp/pest-plugin-arch" />
+      <path value="$PROJECT_DIR$/vendor/pestphp/pest-plugin-laravel" />
+      <path value="$PROJECT_DIR$/vendor/pestphp/pest-plugin-mutate" />
+      <path value="$PROJECT_DIR$/vendor/pestphp/pest-plugin-profanity" />
+      <path value="$PROJECT_DIR$/vendor/phar-io/manifest" />
+      <path value="$PROJECT_DIR$/vendor/phar-io/version" />
+      <path value="$PROJECT_DIR$/vendor/phpstan/phpdoc-parser" />
+      <path value="$PROJECT_DIR$/vendor/phpunit/php-code-coverage" />
+      <path value="$PROJECT_DIR$/vendor/phpunit/php-file-iterator" />
+      <path value="$PROJECT_DIR$/vendor/phpunit/php-invoker" />
+      <path value="$PROJECT_DIR$/vendor/phpunit/php-text-template" />
+      <path value="$PROJECT_DIR$/vendor/phpunit/php-timer" />
+      <path value="$PROJECT_DIR$/vendor/phpunit/phpunit" />
+      <path value="$PROJECT_DIR$/vendor/symfony/clock" />
+      <path value="$PROJECT_DIR$/vendor/symfony/css-selector" />
+      <path value="$PROJECT_DIR$/vendor/symfony/error-handler" />
+      <path value="$PROJECT_DIR$/vendor/symfony/event-dispatcher" />
+      <path value="$PROJECT_DIR$/vendor/symfony/event-dispatcher-contracts" />
+      <path value="$PROJECT_DIR$/vendor/symfony/finder" />
+      <path value="$PROJECT_DIR$/vendor/symfony/http-foundation" />
+      <path value="$PROJECT_DIR$/vendor/symfony/http-kernel" />
+      <path value="$PROJECT_DIR$/vendor/symfony/mailer" />
+      <path value="$PROJECT_DIR$/vendor/symfony/mime" />
+      <path value="$PROJECT_DIR$/vendor/symfony/polyfill-intl-idn" />
+      <path value="$PROJECT_DIR$/vendor/symfony/polyfill-php83" />
+      <path value="$PROJECT_DIR$/vendor/symfony/polyfill-php84" />
+      <path value="$PROJECT_DIR$/vendor/symfony/polyfill-php85" />
+      <path value="$PROJECT_DIR$/vendor/symfony/polyfill-uuid" />
+      <path value="$PROJECT_DIR$/vendor/symfony/routing" />
+      <path value="$PROJECT_DIR$/vendor/symfony/translation" />
+      <path value="$PROJECT_DIR$/vendor/symfony/translation-contracts" />
+      <path value="$PROJECT_DIR$/vendor/symfony/uid" />
+      <path value="$PROJECT_DIR$/vendor/symfony/var-dumper" />
+      <path value="$PROJECT_DIR$/vendor/symfony/yaml" />
+      <path value="$PROJECT_DIR$/vendor/theseer/tokenizer" />
+      <path value="$PROJECT_DIR$/vendor/brianium/paratest" />
+      <path value="$PROJECT_DIR$/vendor/_laravel_idea" />
     </include_path>
   </component>
-  <component name="PhpProjectSharedConfiguration" php_language_level="8.3" />
+  <component name="PhpProjectSharedConfiguration" php_language_level="8.4" />
+  <component name="PhpStan">
+    <PhpStan_settings>
+      <phpstan_by_interpreter asDefaultInterpreter="true" interpreter_id="8fb3147c-6b6f-45ab-a890-92cb8433f45f" timeout="60000" />
+    </PhpStan_settings>
+  </component>
   <component name="PhpStanOptionsConfiguration">
     <option name="transferred" value="true" />
   </component>
@@ -37,6 +174,11 @@
       <PhpUnitSettings custom_loader_path="$PROJECT_DIR$/vendor/autoload.php" />
     </phpunit_settings>
   </component>
+  <component name="Psalm">
+    <Psalm_settings>
+      <psalm_fixer_by_interpreter asDefaultInterpreter="true" interpreter_id="8fb3147c-6b6f-45ab-a890-92cb8433f45f" timeout="60000" />
+    </Psalm_settings>
+  </component>
   <component name="PsalmOptionsConfiguration">
     <option name="transferred" value="true" />
   </component>
diff --git a/app/Providers/AppServiceProvider.php b/app/Providers/AppServiceProvider.php
index 452e6b6..7bc0795 100644
--- a/app/Providers/AppServiceProvider.php
+++ b/app/Providers/AppServiceProvider.php
@@ -2,7 +2,9 @@
 
 namespace App\Providers;
 
+use App\Models\Continent;
 use Illuminate\Support\ServiceProvider;
+use Inertia\Inertia;
 
 class AppServiceProvider extends ServiceProvider
 {
@@ -19,6 +21,8 @@ class AppServiceProvider extends ServiceProvider
      */
     public function boot(): void
     {
-        //
+        Inertia::share([
+            'continents_with_tours' => fn() => Continent::allContinentsWithTours(),
+        ]);
     }
 }
diff --git a/composer.json b/composer.json
index 6e96a87..75c7df8 100644
--- a/composer.json
+++ b/composer.json
@@ -9,7 +9,7 @@
     ],
     "license": "MIT",
     "require": {
-        "php": "^8.2",
+        "php": "^8.4",
         "inertiajs/inertia-laravel": "^2.0",
         "laravel/fortify": "^1.30",
         "laravel/framework": "^12.0",
@@ -84,4 +84,4 @@
     },
     "minimum-stability": "stable",
     "prefer-stable": true
-}
\ No newline at end of file
+}
diff --git a/database/seeders/DatabaseSeeder.php b/database/seeders/DatabaseSeeder.php
index d01a0ef..a121999 100644
--- a/database/seeders/DatabaseSeeder.php
+++ b/database/seeders/DatabaseSeeder.php
@@ -14,6 +14,9 @@ class DatabaseSeeder extends Seeder
     public function run(): void
     {
         // User::factory(10)->create();
+        $this->call(ContinentSeeder::class);
+
+        $this->call(CountrySeeder::class);
 
         User::factory()->create([
             'name' => 'Test User',
diff --git a/resources/js/app.ts b/resources/js/app.ts
index 9f2f6d8..78543f8 100644
--- a/resources/js/app.ts
+++ b/resources/js/app.ts
@@ -6,6 +6,7 @@ import type { DefineComponent } from 'vue';
 import { createApp, h } from 'vue';
 import { initializeTheme } from './composables/useAppearance';
 
+
 const appName = import.meta.env.VITE_APP_NAME || 'Laravel';
 
 createInertiaApp({
diff --git a/resources/js/components/AppContent.vue b/resources/js/components/AppContent.vue
deleted file mode 100644
index 96e3d2a..0000000
--- a/resources/js/components/AppContent.vue
+++ /dev/null
@@ -1,21 +0,0 @@
-<script setup lang="ts">
-import { SidebarInset } from '@/components/ui/sidebar';
-import { computed } from 'vue';
-
-interface Props {
-    variant?: 'header' | 'sidebar';
-    class?: string;
-}
-
-const props = defineProps<Props>();
-const className = computed(() => props.class);
-</script>
-
-<template>
-    <SidebarInset v-if="props.variant === 'sidebar'" :class="className">
-        <slot />
-    </SidebarInset>
-    <main v-else class="mx-auto flex h-full w-full max-w-7xl flex-1 flex-col gap-4 rounded-xl" :class="className">
-        <slot />
-    </main>
-</template>
diff --git a/resources/js/components/AppHeader.vue b/resources/js/components/AppHeader.vue
deleted file mode 100644
index aeab950..0000000
--- a/resources/js/components/AppHeader.vue
+++ /dev/null
@@ -1,189 +0,0 @@
-<script setup lang="ts">
-import AppLogo from '@/components/AppLogo.vue';
-import AppLogoIcon from '@/components/AppLogoIcon.vue';
-import Breadcrumbs from '@/components/Breadcrumbs.vue';
-import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar';
-import { Button } from '@/components/ui/button';
-import { DropdownMenu, DropdownMenuContent, DropdownMenuTrigger } from '@/components/ui/dropdown-menu';
-import { NavigationMenu, NavigationMenuItem, NavigationMenuList, navigationMenuTriggerStyle } from '@/components/ui/navigation-menu';
-import { Sheet, SheetContent, SheetHeader, SheetTitle, SheetTrigger } from '@/components/ui/sheet';
-import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/components/ui/tooltip';
-import UserMenuContent from '@/components/UserMenuContent.vue';
-import { getInitials } from '@/composables/useInitials';
-import { toUrl, urlIsActive } from '@/lib/utils';
-import { dashboard } from '@/routes';
-import type { BreadcrumbItem, NavItem } from '@/types';
-import { InertiaLinkProps, Link, usePage } from '@inertiajs/vue3';
-import { BookOpen, Folder, LayoutGrid, Menu, Search } from 'lucide-vue-next';
-import { computed } from 'vue';
-
-interface Props {
-    breadcrumbs?: BreadcrumbItem[];
-}
-
-const props = withDefaults(defineProps<Props>(), {
-    breadcrumbs: () => [],
-});
-
-const page = usePage();
-const auth = computed(() => page.props.auth);
-
-const isCurrentRoute = computed(() => (url: NonNullable<InertiaLinkProps['href']>) => urlIsActive(url, page.url));
-
-const activeItemStyles = computed(
-    () => (url: NonNullable<InertiaLinkProps['href']>) =>
-        isCurrentRoute.value(toUrl(url)) ? 'text-neutral-900 dark:bg-neutral-800 dark:text-neutral-100' : '',
-);
-
-const mainNavItems: NavItem[] = [
-    {
-        title: 'Dashboard',
-        href: dashboard(),
-        icon: LayoutGrid,
-    },
-];
-
-const rightNavItems: NavItem[] = [
-    {
-        title: 'Repository',
-        href: 'https://github.com/laravel/vue-starter-kit',
-        icon: Folder,
-    },
-    {
-        title: 'Documentation',
-        href: 'https://laravel.com/docs/starter-kits#vue',
-        icon: BookOpen,
-    },
-];
-</script>
-
-<template>
-    <div>
-        <div class="border-b border-sidebar-border/80">
-            <div class="mx-auto flex h-16 items-center px-4 md:max-w-7xl">
-                <!-- Mobile Menu -->
-                <div class="lg:hidden">
-                    <Sheet>
-                        <SheetTrigger :as-child="true">
-                            <Button variant="ghost" size="icon" class="mr-2 h-9 w-9">
-                                <Menu class="h-5 w-5" />
-                            </Button>
-                        </SheetTrigger>
-                        <SheetContent side="left" class="w-[300px] p-6">
-                            <SheetTitle class="sr-only">Navigation Menu</SheetTitle>
-                            <SheetHeader class="flex justify-start text-left">
-                                <AppLogoIcon class="size-6 fill-current text-black dark:text-white" />
-                            </SheetHeader>
-                            <div class="flex h-full flex-1 flex-col justify-between space-y-4 py-6">
-                                <nav class="-mx-3 space-y-1">
-                                    <Link
-                                        v-for="item in mainNavItems"
-                                        :key="item.title"
-                                        :href="item.href"
-                                        class="flex items-center gap-x-3 rounded-lg px-3 py-2 text-sm font-medium hover:bg-accent"
-                                        :class="activeItemStyles(item.href)"
-                                    >
-                                        <component v-if="item.icon" :is="item.icon" class="h-5 w-5" />
-                                        {{ item.title }}
-                                    </Link>
-                                </nav>
-                                <div class="flex flex-col space-y-4">
-                                    <a
-                                        v-for="item in rightNavItems"
-                                        :key="item.title"
-                                        :href="toUrl(item.href)"
-                                        target="_blank"
-                                        rel="noopener noreferrer"
-                                        class="flex items-center space-x-2 text-sm font-medium"
-                                    >
-                                        <component v-if="item.icon" :is="item.icon" class="h-5 w-5" />
-                                        <span>{{ item.title }}</span>
-                                    </a>
-                                </div>
-                            </div>
-                        </SheetContent>
-                    </Sheet>
-                </div>
-
-                <Link :href="dashboard()" class="flex items-center gap-x-2">
-                    <AppLogo />
-                </Link>
-
-                <!-- Desktop Menu -->
-                <div class="hidden h-full lg:flex lg:flex-1">
-                    <NavigationMenu class="ml-10 flex h-full items-stretch">
-                        <NavigationMenuList class="flex h-full items-stretch space-x-2">
-                            <NavigationMenuItem v-for="(item, index) in mainNavItems" :key="index" class="relative flex h-full items-center">
-                                <Link
-                                    :class="[navigationMenuTriggerStyle(), activeItemStyles(item.href), 'h-9 cursor-pointer px-3']"
-                                    :href="item.href"
-                                >
-                                    <component v-if="item.icon" :is="item.icon" class="mr-2 h-4 w-4" />
-                                    {{ item.title }}
-                                </Link>
-                                <div
-                                    v-if="isCurrentRoute(item.href)"
-                                    class="absolute bottom-0 left-0 h-0.5 w-full translate-y-px bg-black dark:bg-white"
-                                ></div>
-                            </NavigationMenuItem>
-                        </NavigationMenuList>
-                    </NavigationMenu>
-                </div>
-
-                <div class="ml-auto flex items-center space-x-2">
-                    <div class="relative flex items-center space-x-1">
-                        <Button variant="ghost" size="icon" class="group h-9 w-9 cursor-pointer">
-                            <Search class="size-5 opacity-80 group-hover:opacity-100" />
-                        </Button>
-
-                        <div class="hidden space-x-1 lg:flex">
-                            <template v-for="item in rightNavItems" :key="item.title">
-                                <TooltipProvider :delay-duration="0">
-                                    <Tooltip>
-                                        <TooltipTrigger>
-                                            <Button variant="ghost" size="icon" as-child class="group h-9 w-9 cursor-pointer">
-                                                <a :href="toUrl(item.href)" target="_blank" rel="noopener noreferrer">
-                                                    <span class="sr-only">{{ item.title }}</span>
-                                                    <component :is="item.icon" class="size-5 opacity-80 group-hover:opacity-100" />
-                                                </a>
-                                            </Button>
-                                        </TooltipTrigger>
-                                        <TooltipContent>
-                                            <p>{{ item.title }}</p>
-                                        </TooltipContent>
-                                    </Tooltip>
-                                </TooltipProvider>
-                            </template>
-                        </div>
-                    </div>
-
-                    <DropdownMenu>
-                        <DropdownMenuTrigger :as-child="true">
-                            <Button
-                                variant="ghost"
-                                size="icon"
-                                class="relative size-10 w-auto rounded-full p-1 focus-within:ring-2 focus-within:ring-primary"
-                            >
-                                <Avatar class="size-8 overflow-hidden rounded-full">
-                                    <AvatarImage v-if="auth.user.avatar" :src="auth.user.avatar" :alt="auth.user.name" />
-                                    <AvatarFallback class="rounded-lg bg-neutral-200 font-semibold text-black dark:bg-neutral-700 dark:text-white">
-                                        {{ getInitials(auth.user?.name) }}
-                                    </AvatarFallback>
-                                </Avatar>
-                            </Button>
-                        </DropdownMenuTrigger>
-                        <DropdownMenuContent align="end" class="w-56">
-                            <UserMenuContent :user="auth.user" />
-                        </DropdownMenuContent>
-                    </DropdownMenu>
-                </div>
-            </div>
-        </div>
-
-        <div v-if="props.breadcrumbs.length > 1" class="flex w-full border-b border-sidebar-border/70">
-            <div class="mx-auto flex h-12 w-full items-center justify-start px-4 text-neutral-500 md:max-w-7xl">
-                <Breadcrumbs :breadcrumbs="breadcrumbs" />
-            </div>
-        </div>
-    </div>
-</template>
diff --git a/resources/js/components/AppLogo.vue b/resources/js/components/AppLogo.vue
deleted file mode 100644
index 01723b4..0000000
--- a/resources/js/components/AppLogo.vue
+++ /dev/null
@@ -1,12 +0,0 @@
-<script setup lang="ts">
-import AppLogoIcon from '@/components/AppLogoIcon.vue';
-</script>
-
-<template>
-    <div class="flex aspect-square size-8 items-center justify-center rounded-md bg-sidebar-primary text-sidebar-primary-foreground">
-        <AppLogoIcon class="size-5 fill-current text-white dark:text-black" />
-    </div>
-    <div class="ml-1 grid flex-1 text-left text-sm">
-        <span class="mb-0.5 truncate leading-tight font-semibold">Laravel Starter Kit</span>
-    </div>
-</template>
diff --git a/resources/js/components/AppLogoIcon.vue b/resources/js/components/AppLogoIcon.vue
deleted file mode 100644
index 6412a44..0000000
--- a/resources/js/components/AppLogoIcon.vue
+++ /dev/null
@@ -1,24 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue';
-
-defineOptions({
-    inheritAttrs: false,
-});
-
-interface Props {
-    className?: HTMLAttributes['class'];
-}
-
-defineProps<Props>();
-</script>
-
-<template>
-    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 40 42" :class="className" v-bind="$attrs">
-        <path
-            fill="currentColor"
-            fill-rule="evenodd"
-            clip-rule="evenodd"
-            d="M17.2 5.633 8.6.855 0 5.633v26.51l16.2 9 16.2-9v-8.442l7.6-4.223V9.856l-8.6-4.777-8.6 4.777V18.3l-5.6 3.111V5.633ZM38 18.301l-5.6 3.11v-6.157l5.6-3.11V18.3Zm-1.06-7.856-5.54 3.078-5.54-3.079 5.54-3.078 5.54 3.079ZM24.8 18.3v-6.157l5.6 3.111v6.158L24.8 18.3Zm-1 1.732 5.54 3.078-13.14 7.302-5.54-3.078 13.14-7.3v-.002Zm-16.2 7.89 7.6 4.222V38.3L2 30.966V7.92l5.6 3.111v16.892ZM8.6 9.3 3.06 6.222 8.6 3.143l5.54 3.08L8.6 9.3Zm21.8 15.51-13.2 7.334V38.3l13.2-7.334v-6.156ZM9.6 11.034l5.6-3.11v14.6l-5.6 3.11v-14.6Z"
-        />
-    </svg>
-</template>
diff --git a/resources/js/components/AppShell.vue b/resources/js/components/AppShell.vue
deleted file mode 100644
index 261cd77..0000000
--- a/resources/js/components/AppShell.vue
+++ /dev/null
@@ -1,21 +0,0 @@
-<script setup lang="ts">
-import { SidebarProvider } from '@/components/ui/sidebar';
-import { usePage } from '@inertiajs/vue3';
-
-interface Props {
-    variant?: 'header' | 'sidebar';
-}
-
-defineProps<Props>();
-
-const isOpen = usePage().props.sidebarOpen;
-</script>
-
-<template>
-    <div v-if="variant === 'header'" class="flex min-h-screen w-full flex-col">
-        <slot />
-    </div>
-    <SidebarProvider v-else :default-open="isOpen">
-        <slot />
-    </SidebarProvider>
-</template>
diff --git a/resources/js/components/AppSidebar.vue b/resources/js/components/AppSidebar.vue
deleted file mode 100644
index db9e759..0000000
--- a/resources/js/components/AppSidebar.vue
+++ /dev/null
@@ -1,58 +0,0 @@
-<script setup lang="ts">
-import NavFooter from '@/components/NavFooter.vue';
-import NavMain from '@/components/NavMain.vue';
-import NavUser from '@/components/NavUser.vue';
-import { Sidebar, SidebarContent, SidebarFooter, SidebarHeader, SidebarMenu, SidebarMenuButton, SidebarMenuItem } from '@/components/ui/sidebar';
-import { dashboard } from '@/routes';
-import { type NavItem } from '@/types';
-import { Link } from '@inertiajs/vue3';
-import { BookOpen, Folder, LayoutGrid } from 'lucide-vue-next';
-import AppLogo from './AppLogo.vue';
-
-const mainNavItems: NavItem[] = [
-    {
-        title: 'Dashboard',
-        href: dashboard(),
-        icon: LayoutGrid,
-    },
-];
-
-const footerNavItems: NavItem[] = [
-    {
-        title: 'Github Repo',
-        href: 'https://github.com/laravel/vue-starter-kit',
-        icon: Folder,
-    },
-    {
-        title: 'Documentation',
-        href: 'https://laravel.com/docs/starter-kits#vue',
-        icon: BookOpen,
-    },
-];
-</script>
-
-<template>
-    <Sidebar collapsible="icon" variant="inset">
-        <SidebarHeader>
-            <SidebarMenu>
-                <SidebarMenuItem>
-                    <SidebarMenuButton size="lg" as-child>
-                        <Link :href="dashboard()">
-                            <AppLogo />
-                        </Link>
-                    </SidebarMenuButton>
-                </SidebarMenuItem>
-            </SidebarMenu>
-        </SidebarHeader>
-
-        <SidebarContent>
-            <NavMain :items="mainNavItems" />
-        </SidebarContent>
-
-        <SidebarFooter>
-            <NavFooter :items="footerNavItems" />
-            <NavUser />
-        </SidebarFooter>
-    </Sidebar>
-    <slot />
-</template>
diff --git a/resources/js/components/AppSidebarHeader.vue b/resources/js/components/AppSidebarHeader.vue
deleted file mode 100644
index 3fd430c..0000000
--- a/resources/js/components/AppSidebarHeader.vue
+++ /dev/null
@@ -1,27 +0,0 @@
-<script setup lang="ts">
-import Breadcrumbs from '@/components/Breadcrumbs.vue';
-import { SidebarTrigger } from '@/components/ui/sidebar';
-import type { BreadcrumbItemType } from '@/types';
-
-withDefaults(
-    defineProps<{
-        breadcrumbs?: BreadcrumbItemType[];
-    }>(),
-    {
-        breadcrumbs: () => [],
-    },
-);
-</script>
-
-<template>
-    <header
-        class="flex h-16 shrink-0 items-center gap-2 border-b border-sidebar-border/70 px-6 transition-[width,height] ease-linear group-has-data-[collapsible=icon]/sidebar-wrapper:h-12 md:px-4"
-    >
-        <div class="flex items-center gap-2">
-            <SidebarTrigger class="-ml-1" />
-            <template v-if="breadcrumbs && breadcrumbs.length > 0">
-                <Breadcrumbs :breadcrumbs="breadcrumbs" />
-            </template>
-        </div>
-    </header>
-</template>
diff --git a/resources/js/components/AppearanceTabs.vue b/resources/js/components/AppearanceTabs.vue
deleted file mode 100644
index 43578fb..0000000
--- a/resources/js/components/AppearanceTabs.vue
+++ /dev/null
@@ -1,31 +0,0 @@
-<script setup lang="ts">
-import { useAppearance } from '@/composables/useAppearance';
-import { Monitor, Moon, Sun } from 'lucide-vue-next';
-
-const { appearance, updateAppearance } = useAppearance();
-
-const tabs = [
-    { value: 'light', Icon: Sun, label: 'Light' },
-    { value: 'dark', Icon: Moon, label: 'Dark' },
-    { value: 'system', Icon: Monitor, label: 'System' },
-] as const;
-</script>
-
-<template>
-    <div class="inline-flex gap-1 rounded-lg bg-neutral-100 p-1 dark:bg-neutral-800">
-        <button
-            v-for="{ value, Icon, label } in tabs"
-            :key="value"
-            @click="updateAppearance(value)"
-            :class="[
-                'flex items-center rounded-md px-3.5 py-1.5 transition-colors',
-                appearance === value
-                    ? 'bg-white shadow-xs dark:bg-neutral-700 dark:text-neutral-100'
-                    : 'text-neutral-500 hover:bg-neutral-200/60 hover:text-black dark:text-neutral-400 dark:hover:bg-neutral-700/60',
-            ]"
-        >
-            <component :is="Icon" class="-ml-1 h-4 w-4" />
-            <span class="ml-1.5 text-sm">{{ label }}</span>
-        </button>
-    </div>
-</template>
diff --git a/resources/js/components/Breadcrumbs.vue b/resources/js/components/Breadcrumbs.vue
deleted file mode 100644
index f6338d0..0000000
--- a/resources/js/components/Breadcrumbs.vue
+++ /dev/null
@@ -1,33 +0,0 @@
-<script setup lang="ts">
-import { Breadcrumb, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator } from '@/components/ui/breadcrumb';
-import { Link } from '@inertiajs/vue3';
-
-interface BreadcrumbItemType {
-    title: string;
-    href?: string;
-}
-
-defineProps<{
-    breadcrumbs: BreadcrumbItemType[];
-}>();
-</script>
-
-<template>
-    <Breadcrumb>
-        <BreadcrumbList>
-            <template v-for="(item, index) in breadcrumbs" :key="index">
-                <BreadcrumbItem>
-                    <template v-if="index === breadcrumbs.length - 1">
-                        <BreadcrumbPage>{{ item.title }}</BreadcrumbPage>
-                    </template>
-                    <template v-else>
-                        <BreadcrumbLink as-child>
-                            <Link :href="item.href ?? '#'">{{ item.title }}</Link>
-                        </BreadcrumbLink>
-                    </template>
-                </BreadcrumbItem>
-                <BreadcrumbSeparator v-if="index !== breadcrumbs.length - 1" />
-            </template>
-        </BreadcrumbList>
-    </Breadcrumb>
-</template>
diff --git a/resources/js/components/DeleteUser.vue b/resources/js/components/DeleteUser.vue
deleted file mode 100644
index 6d2b13d..0000000
--- a/resources/js/components/DeleteUser.vue
+++ /dev/null
@@ -1,85 +0,0 @@
-<script setup lang="ts">
-import ProfileController from '@/actions/App/Http/Controllers/Settings/ProfileController';
-import { Form } from '@inertiajs/vue3';
-import { ref } from 'vue';
-
-// Components
-import HeadingSmall from '@/components/HeadingSmall.vue';
-import InputError from '@/components/InputError.vue';
-import { Button } from '@/components/ui/button';
-import {
-    Dialog,
-    DialogClose,
-    DialogContent,
-    DialogDescription,
-    DialogFooter,
-    DialogHeader,
-    DialogTitle,
-    DialogTrigger,
-} from '@/components/ui/dialog';
-import { Input } from '@/components/ui/input';
-import { Label } from '@/components/ui/label';
-
-const passwordInput = ref<InstanceType<typeof Input> | null>(null);
-</script>
-
-<template>
-    <div class="space-y-6">
-        <HeadingSmall title="Delete account" description="Delete your account and all of its resources" />
-        <div class="space-y-4 rounded-lg border border-red-100 bg-red-50 p-4 dark:border-red-200/10 dark:bg-red-700/10">
-            <div class="relative space-y-0.5 text-red-600 dark:text-red-100">
-                <p class="font-medium">Warning</p>
-                <p class="text-sm">Please proceed with caution, this cannot be undone.</p>
-            </div>
-            <Dialog>
-                <DialogTrigger as-child>
-                    <Button variant="destructive" data-test="delete-user-button">Delete account</Button>
-                </DialogTrigger>
-                <DialogContent>
-                    <Form
-                        v-bind="ProfileController.destroy.form()"
-                        reset-on-success
-                        @error="() => passwordInput?.$el?.focus()"
-                        :options="{
-                            preserveScroll: true,
-                        }"
-                        class="space-y-6"
-                        v-slot="{ errors, processing, reset, clearErrors }"
-                    >
-                        <DialogHeader class="space-y-3">
-                            <DialogTitle>Are you sure you want to delete your account?</DialogTitle>
-                            <DialogDescription>
-                                Once your account is deleted, all of its resources and data will also be permanently deleted. Please enter your
-                                password to confirm you would like to permanently delete your account.
-                            </DialogDescription>
-                        </DialogHeader>
-
-                        <div class="grid gap-2">
-                            <Label for="password" class="sr-only">Password</Label>
-                            <Input id="password" type="password" name="password" ref="passwordInput" placeholder="Password" />
-                            <InputError :message="errors.password" />
-                        </div>
-
-                        <DialogFooter class="gap-2">
-                            <DialogClose as-child>
-                                <Button
-                                    variant="secondary"
-                                    @click="
-                                        () => {
-                                            clearErrors();
-                                            reset();
-                                        }
-                                    "
-                                >
-                                    Cancel
-                                </Button>
-                            </DialogClose>
-
-                            <Button type="submit" variant="destructive" :disabled="processing" data-test="confirm-delete-user-button"> Delete account </Button>
-                        </DialogFooter>
-                    </Form>
-                </DialogContent>
-            </Dialog>
-        </div>
-    </div>
-</template>
diff --git a/resources/js/components/Header.vue b/resources/js/components/Header.vue
new file mode 100644
index 0000000..3adc841
--- /dev/null
+++ b/resources/js/components/Header.vue
@@ -0,0 +1,420 @@
+<template>
+    <!-- Header -->
+    <header class="header">
+        <section class="navContainer">
+            <nav class="nav">
+                <div class="nav-brand">Dr Edgy Adventures</div>
+                <button class="mobile-menu-btn">
+                    <span></span><span></span><span></span>
+                </button>
+            </nav>
+
+            <div class="nav-menu">
+                <a href="#about" class="nav-link">About</a>
+                <a href="#contact" class="nav-link">Contact</a>
+                <div
+                    class="dropdown"
+                    :class="{ open: dropdownOpen }"
+                >
+                    <button
+                        class="dropdown-toggle nav-link"
+                        @click="dropdownOpen = !dropdownOpen"
+                    >
+                        Adventures
+                        <svg
+                            class="dropdown-icon"
+                            width="16" height="16" viewBox="0 0 24 24"
+                            fill="none" stroke="currentColor" stroke-width="2"
+                        >
+                            <polyline points="6,9 12,15 18,9"></polyline>
+                        </svg>
+                    </button>
+
+                    <div class="dropdown-menu" :class="{ 'is-visible': isDropdownVisible }">
+                        <a
+                            v-for="continent in sortedContinents"
+                            :key="continent.id"
+                            :href="`/tours/${continent.internal_name}`"
+                        >
+                            {{ continent.name }}
+                        </a>
+                    </div>
+                </div>
+            </div>
+        </section>
+    </header>
+</template>
+
+<script setup lang="ts">
+import { onMounted, onUnmounted, computed, ref } from 'vue';
+import { usePage} from "@inertiajs/vue3";
+import {Continent, GlobalProperties} from "@/types";
+
+const { continents_with_tours } = usePage().props as unknown as GlobalProperties
+
+
+const sortedContinents = computed(() => {
+    return [...continents_with_tours].sort((a, b) => a.name.localeCompare(b.name))
+})
+
+const dropdownOpen = ref(false)
+const windowWidth = ref(window.innerWidth);
+
+
+onMounted(() =>{
+    initDropdown();
+    initHeaderScroll()
+    initMobileMenu()
+    window.addEventListener('resize', handleResize)
+})
+
+onUnmounted(() => {
+    window.removeEventListener('resize', handleResize);
+});
+
+
+const isDropdownVisible = computed(() => {
+    return dropdownOpen.value || windowWidth.value < 768;
+});
+
+const handleResize = () => {
+    windowWidth.value = window.innerWidth;
+};
+
+
+
+// Mobile menu functionality
+const initMobileMenu = (): void => {
+    const mobileMenuBtn = document.querySelector('.mobile-menu-btn') as HTMLElement | null;
+    const navMenu = document.querySelector('.nav-menu') as HTMLElement | null;
+
+    if (!mobileMenuBtn || !navMenu) return;
+
+    mobileMenuBtn.addEventListener('click', () => {
+        navMenu.classList.toggle('open');
+        mobileMenuBtn.classList.toggle('open');
+    });
+};
+
+// Header background on scroll
+const initHeaderScroll = (): void => {
+    const header = document.querySelector('.header') as HTMLElement | null;
+    if (!header) return;
+
+    window.addEventListener('scroll', () => {
+        if (window.scrollY > 100) {
+            header.classList.add('scrolled');
+        } else {
+            header.classList.remove('scrolled');
+        }
+    });
+};
+
+const initDropdown = (): void => {
+    const dropdown = document.querySelector('.dropdown') as HTMLElement | null;
+    const dropdownToggle = dropdown?.querySelector('.dropdown-toggle') as HTMLElement | null;
+
+    if (!dropdown || !dropdownToggle) return;
+
+    dropdownToggle.addEventListener('click', (e: Event) => {
+        e.preventDefault();
+        dropdown.classList.toggle('open');
+    });
+
+    // Close dropdown when clicking outside
+    document.addEventListener('click', (e: Event) => {
+        if (!dropdown.contains(e.target as Node)) {
+            dropdown.classList.remove('open');
+        }
+    });
+
+    // Close dropdown when pressing escape
+    document.addEventListener('keydown', (e: KeyboardEvent) => {
+        if (e.key === 'Escape') {
+            dropdown.classList.remove('open');
+        }
+    });
+};
+</script>
+
+<style scoped>
+.header {
+    min-height: 5dvh;
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    z-index: 1000;
+    background: rgba(8, 8, 23, 0.95);
+    backdrop-filter: blur(10px);
+    border-bottom: 1px solid var(--border);
+}
+
+.navContainer{
+    width: 100%;
+    display: flex;
+}
+
+/* Desktop-safe layout guard:
+   This makes the header act like a single centered bar on desktop,
+   and ensures .nav and .nav-menu sit inline whether .nav-menu is
+   inside .nav or a sibling of .nav (the "restructure" case). */
+@media (min-width: 768px) {
+
+    .navContainer{
+        width: 80%;
+    }
+
+    .header {
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        padding: 0.5em;
+    }
+
+    .navContainer > .nav,
+    .navContainer .nav {
+        width: 80%;
+        max-width: 1200px;
+        margin: 0 auto;
+        box-sizing: border-box;
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        gap: 1rem;
+    }
+
+    /* if .nav-menu is a direct child of .header (restructured case),
+       make it behave like the original inline menu */
+    .navContainer > .nav-menu {
+        display: flex;
+        align-items: center;
+        gap: 2rem;
+    }
+
+    .dropdown-menu {
+        max-height: 0;
+        overflow: hidden;
+        opacity: 0;
+        transform: translateY(-10px);
+        transition: max-height 0.3s ease, opacity 0.3s ease, transform 0.3s ease;
+        pointer-events: none; /* disable clicks when closed */
+    }
+
+    .dropdown-menu.is-visible {
+        max-height: 500px; /* adjust for content */
+        opacity: 1;
+        transform: translateY(0);
+        pointer-events: auto;
+    }
+}
+
+.nav {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    width: 100%;
+    padding: 1em;
+    /* padding / width handled in the desktop guard above */
+}
+
+/* brand */
+.nav-brand {
+    font-size: 1.5rem;
+    font-weight: bold;
+    background: var(--gradient-adventure);
+    -webkit-background-clip: text;
+    background-clip: text;
+    -webkit-text-fill-color: transparent;
+}
+
+/* links container (desktop default) */
+.nav-menu {
+    display: flex;
+    align-items: center;
+    gap: 2rem;
+    flex-wrap: nowrap; /* keep them inline with the brand */
+    white-space: nowrap; /* avoid accidental wrapping */
+}
+
+/* links */
+.nav-link {
+    color: var(--foreground);
+    text-decoration: none;
+    position: relative;
+    transition: var(--transition-smooth);
+    background: none;
+    border: none;
+    cursor: pointer;
+    font-size: 1rem;
+    display: inline-flex; /* inline-flex prevents block behaviour */
+    align-items: center;
+    gap: 0.25rem;
+}
+
+.nav-link:hover {
+    color: var(--primary);
+}
+
+/* Dropdown (desktop behaviour preserved) */
+.dropdown {
+    position: relative;
+}
+
+.dropdown-icon {
+    transition: transform 0.3s ease;
+}
+
+.dropdown.open .dropdown-icon {
+    transform: rotate(180deg);
+}
+
+.dropdown-menu {
+    position: absolute;
+    top: 100%;
+    left: -50%;
+    min-width: 200px;
+    background: var(--card);
+    border: 1px solid var(--border);
+    border-radius: 0;
+    clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 12px 100%, 0 calc(100% - 12px));
+    transform: translateY(-10px);
+    transition: var(--transition-smooth);
+    z-index: 100;
+}
+
+/* Desktop show state (Vue sets .dropdown.open) */
+.dropdown.open .dropdown-menu {
+    opacity: 1;
+    visibility: visible;
+    transform: translateY(0);
+}
+
+.dropdown-menu a {
+    display: block;
+    padding: 0.75rem 1rem;
+    color: var(--card-foreground);
+    text-decoration: none;
+    transition: var(--transition-smooth);
+}
+
+.dropdown-menu a:hover {
+    background: var(--accent);
+    color: var(--background);
+}
+
+/* --- Mobile menu button animation --- */
+.mobile-menu-btn {
+    display: none;
+    flex-direction: column;
+    gap: 6px;
+    background: none;
+    border: none;
+    cursor: pointer;
+    padding: 0.5rem;
+    z-index: 1100; /* ensure it's above the nav overlay */
+}
+
+.mobile-menu-btn span {
+    width: 28px;
+    height: 2px;
+    background: var(--foreground);
+    border-radius: 1px;
+    transition: transform 0.3s ease, opacity 0.3s ease;
+}
+
+/* Animate to X */
+.mobile-menu-btn.open span:nth-child(1) {
+    transform: translateY(8px) rotate(45deg);
+}
+
+.mobile-menu-btn.open span:nth-child(2) {
+    opacity: 0;
+}
+
+.mobile-menu-btn.open span:nth-child(3) {
+    transform: translateY(-8px) rotate(-45deg);
+}
+
+/* Mobile override (left intact — this preserves the mobile overlay you said you liked) */
+@media (max-width: 767px) {
+    .nav-menu {
+        position: fixed;
+        top: 0;
+        left: 0;
+        right: 0;
+        bottom: 0;
+
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        justify-content: flex-start;
+
+        padding-top: 6rem; /* space for header/hamburger */
+        gap: 2rem;
+
+        /* glass background */
+        background: rgba(8, 8, 23, 0.85);
+        backdrop-filter: blur(12px);
+
+        transform: translateY(-100%);
+        opacity: 0;
+        pointer-events: none;
+        transition: transform 0.4s ease, opacity 0.4s ease;
+        z-index: 1000;
+        overflow-y: auto;
+    }
+
+    .nav-menu.open {
+        transform: translateY(0);
+        opacity: 1;
+        pointer-events: auto;
+        height: 100dvh;
+    }
+
+    .nav-link {
+        font-size: 1.5rem;
+    }
+
+    /* Dropdown in mobile: behave as inline sublist */
+    .dropdown {
+        width: 100%;
+        text-align: center;
+    }
+
+    .dropdown-toggle {
+        width: 100%;
+        justify-content: center;
+        font-size: 1.5rem;
+        background: none;
+        border: none;
+        cursor: pointer;
+    }
+
+    .dropdown-menu {
+        position: static;
+        opacity: 1 !important;
+        visibility: visible !important;
+        transform: none !important;
+        background: transparent;
+        border: none;
+        box-shadow: none;
+        min-width: unset;
+        display: flex !important;
+        flex-direction: column;
+        gap: 0.75rem;
+        margin-top: 0.5rem;
+    }
+
+    .dropdown-menu a {
+        font-size: 1.25rem;
+        color: var(--foreground);
+        padding: 0.5rem 0;
+    }
+
+    .mobile-menu-btn {
+        display: flex;
+    }
+}
+</style>
+
diff --git a/resources/js/components/Heading.vue b/resources/js/components/Heading.vue
deleted file mode 100644
index f50187a..0000000
--- a/resources/js/components/Heading.vue
+++ /dev/null
@@ -1,17 +0,0 @@
-<script setup lang="ts">
-interface Props {
-    title: string;
-    description?: string;
-}
-
-defineProps<Props>();
-</script>
-
-<template>
-    <div class="mb-8 space-y-0.5">
-        <h2 class="text-xl font-semibold tracking-tight">{{ title }}</h2>
-        <p v-if="description" class="text-sm text-muted-foreground">
-            {{ description }}
-        </p>
-    </div>
-</template>
diff --git a/resources/js/components/HeadingSmall.vue b/resources/js/components/HeadingSmall.vue
deleted file mode 100644
index d1602ba..0000000
--- a/resources/js/components/HeadingSmall.vue
+++ /dev/null
@@ -1,17 +0,0 @@
-<script setup lang="ts">
-interface Props {
-    title: string;
-    description?: string;
-}
-
-defineProps<Props>();
-</script>
-
-<template>
-    <header>
-        <h3 class="mb-0.5 text-base font-medium">{{ title }}</h3>
-        <p v-if="description" class="text-sm text-muted-foreground">
-            {{ description }}
-        </p>
-    </header>
-</template>
diff --git a/resources/js/components/Icon.vue b/resources/js/components/Icon.vue
deleted file mode 100644
index c0b1b76..0000000
--- a/resources/js/components/Icon.vue
+++ /dev/null
@@ -1,30 +0,0 @@
-<script setup lang="ts">
-import { cn } from '@/lib/utils';
-import * as icons from 'lucide-vue-next';
-import { computed } from 'vue';
-
-interface Props {
-    name: string;
-    class?: string;
-    size?: number | string;
-    color?: string;
-    strokeWidth?: number | string;
-}
-
-const props = withDefaults(defineProps<Props>(), {
-    class: '',
-    size: 16,
-    strokeWidth: 2,
-});
-
-const className = computed(() => cn('h-4 w-4', props.class));
-
-const icon = computed(() => {
-    const iconName = props.name.charAt(0).toUpperCase() + props.name.slice(1);
-    return (icons as Record<string, any>)[iconName];
-});
-</script>
-
-<template>
-    <component :is="icon" :class="className" :size="size" :stroke-width="strokeWidth" :color="color" />
-</template>
diff --git a/resources/js/components/InputError.vue b/resources/js/components/InputError.vue
deleted file mode 100644
index 3db9519..0000000
--- a/resources/js/components/InputError.vue
+++ /dev/null
@@ -1,13 +0,0 @@
-<script setup lang="ts">
-defineProps<{
-    message?: string;
-}>();
-</script>
-
-<template>
-    <div v-show="message">
-        <p class="text-sm text-red-600 dark:text-red-500">
-            {{ message }}
-        </p>
-    </div>
-</template>
diff --git a/resources/js/components/NavFooter.vue b/resources/js/components/NavFooter.vue
deleted file mode 100644
index 3ccd296..0000000
--- a/resources/js/components/NavFooter.vue
+++ /dev/null
@@ -1,29 +0,0 @@
-<script setup lang="ts">
-import { SidebarGroup, SidebarGroupContent, SidebarMenu, SidebarMenuButton, SidebarMenuItem } from '@/components/ui/sidebar';
-import { toUrl } from '@/lib/utils';
-import { type NavItem } from '@/types';
-
-interface Props {
-    items: NavItem[];
-    class?: string;
-}
-
-defineProps<Props>();
-</script>
-
-<template>
-    <SidebarGroup :class="`group-data-[collapsible=icon]:p-0 ${$props.class || ''}`">
-        <SidebarGroupContent>
-            <SidebarMenu>
-                <SidebarMenuItem v-for="item in items" :key="item.title">
-                    <SidebarMenuButton class="text-neutral-600 hover:text-neutral-800 dark:text-neutral-300 dark:hover:text-neutral-100" as-child>
-                        <a :href="toUrl(item.href)" target="_blank" rel="noopener noreferrer">
-                            <component :is="item.icon" />
-                            <span>{{ item.title }}</span>
-                        </a>
-                    </SidebarMenuButton>
-                </SidebarMenuItem>
-            </SidebarMenu>
-        </SidebarGroupContent>
-    </SidebarGroup>
-</template>
diff --git a/resources/js/components/NavMain.vue b/resources/js/components/NavMain.vue
deleted file mode 100644
index f4781ea..0000000
--- a/resources/js/components/NavMain.vue
+++ /dev/null
@@ -1,28 +0,0 @@
-<script setup lang="ts">
-import { SidebarGroup, SidebarGroupLabel, SidebarMenu, SidebarMenuButton, SidebarMenuItem } from '@/components/ui/sidebar';
-import { urlIsActive } from '@/lib/utils';
-import { type NavItem } from '@/types';
-import { Link, usePage } from '@inertiajs/vue3';
-
-defineProps<{
-    items: NavItem[];
-}>();
-
-const page = usePage();
-</script>
-
-<template>
-    <SidebarGroup class="px-2 py-0">
-        <SidebarGroupLabel>Platform</SidebarGroupLabel>
-        <SidebarMenu>
-            <SidebarMenuItem v-for="item in items" :key="item.title">
-                <SidebarMenuButton as-child :is-active="urlIsActive(item.href, page.url)" :tooltip="item.title">
-                    <Link :href="item.href">
-                        <component :is="item.icon" />
-                        <span>{{ item.title }}</span>
-                    </Link>
-                </SidebarMenuButton>
-            </SidebarMenuItem>
-        </SidebarMenu>
-    </SidebarGroup>
-</template>
diff --git a/resources/js/components/NavUser.vue b/resources/js/components/NavUser.vue
deleted file mode 100644
index fd9c8dc..0000000
--- a/resources/js/components/NavUser.vue
+++ /dev/null
@@ -1,35 +0,0 @@
-<script setup lang="ts">
-import UserInfo from '@/components/UserInfo.vue';
-import { DropdownMenu, DropdownMenuContent, DropdownMenuTrigger } from '@/components/ui/dropdown-menu';
-import { SidebarMenu, SidebarMenuButton, SidebarMenuItem, useSidebar } from '@/components/ui/sidebar';
-import { usePage } from '@inertiajs/vue3';
-import { ChevronsUpDown } from 'lucide-vue-next';
-import UserMenuContent from './UserMenuContent.vue';
-
-const page = usePage();
-const user = page.props.auth.user;
-const { isMobile, state } = useSidebar();
-</script>
-
-<template>
-    <SidebarMenu>
-        <SidebarMenuItem>
-            <DropdownMenu>
-                <DropdownMenuTrigger as-child>
-                    <SidebarMenuButton size="lg" class="data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground">
-                        <UserInfo :user="user" />
-                        <ChevronsUpDown class="ml-auto size-4" />
-                    </SidebarMenuButton>
-                </DropdownMenuTrigger>
-                <DropdownMenuContent
-                    class="w-(--reka-dropdown-menu-trigger-width) min-w-56 rounded-lg"
-                    :side="isMobile ? 'bottom' : state === 'collapsed' ? 'left' : 'bottom'"
-                    align="end"
-                    :side-offset="4"
-                >
-                    <UserMenuContent :user="user" />
-                </DropdownMenuContent>
-            </DropdownMenu>
-        </SidebarMenuItem>
-    </SidebarMenu>
-</template>
diff --git a/resources/js/components/PlaceholderPattern.vue b/resources/js/components/PlaceholderPattern.vue
deleted file mode 100644
index 88045f2..0000000
--- a/resources/js/components/PlaceholderPattern.vue
+++ /dev/null
@@ -1,16 +0,0 @@
-<script setup lang="ts">
-import { computed } from 'vue';
-
-const patternId = computed(() => `pattern-${Math.random().toString(36).substring(2, 9)}`);
-</script>
-
-<template>
-    <svg class="absolute inset-0 size-full stroke-neutral-900/20 dark:stroke-neutral-100/20" fill="none">
-        <defs>
-            <pattern :id="patternId" x="0" y="0" width="8" height="8" patternUnits="userSpaceOnUse">
-                <path d="M-1 5L5 -1M3 9L8.5 3.5" stroke-width="0.5"></path>
-            </pattern>
-        </defs>
-        <rect stroke="none" :fill="`url(#${patternId})`" width="100%" height="100%"></rect>
-    </svg>
-</template>
diff --git a/resources/js/components/TextLink.vue b/resources/js/components/TextLink.vue
deleted file mode 100644
index 36bab4f..0000000
--- a/resources/js/components/TextLink.vue
+++ /dev/null
@@ -1,25 +0,0 @@
-<script setup lang="ts">
-import { LinkComponentBaseProps, Method } from '@inertiajs/core';
-import { Link } from '@inertiajs/vue3';
-
-interface Props {
-    href: LinkComponentBaseProps['href'];
-    tabindex?: number;
-    method?: Method;
-    as?: string;
-}
-
-defineProps<Props>();
-</script>
-
-<template>
-    <Link
-        :href="href"
-        :tabindex="tabindex"
-        :method="method"
-        :as="as"
-        class="text-foreground underline decoration-neutral-300 underline-offset-4 transition-colors duration-300 ease-out hover:decoration-current! dark:decoration-neutral-500"
-    >
-        <slot />
-    </Link>
-</template>
diff --git a/resources/js/components/TwoFactorRecoveryCodes.vue b/resources/js/components/TwoFactorRecoveryCodes.vue
deleted file mode 100644
index aedb955..0000000
--- a/resources/js/components/TwoFactorRecoveryCodes.vue
+++ /dev/null
@@ -1,78 +0,0 @@
-<script setup lang="ts">
-import { Button } from '@/components/ui/button';
-import { Card, CardContent, CardDescription, CardHeader, CardTitle } from '@/components/ui/card';
-import { useTwoFactorAuth } from '@/composables/useTwoFactorAuth';
-import { regenerateRecoveryCodes } from '@/routes/two-factor';
-import { Form } from '@inertiajs/vue3';
-import { Eye, EyeOff, LockKeyhole, RefreshCw } from 'lucide-vue-next';
-import { nextTick, onMounted, ref } from 'vue';
-
-const { recoveryCodesList, fetchRecoveryCodes } = useTwoFactorAuth();
-const isRecoveryCodesVisible = ref<boolean>(false);
-const recoveryCodeSectionRef = ref<HTMLDivElement | null>(null);
-
-const toggleRecoveryCodesVisibility = async () => {
-    if (!isRecoveryCodesVisible.value && !recoveryCodesList.value.length) {
-        await fetchRecoveryCodes();
-    }
-
-    isRecoveryCodesVisible.value = !isRecoveryCodesVisible.value;
-
-    if (isRecoveryCodesVisible.value) {
-        await nextTick();
-        recoveryCodeSectionRef.value?.scrollIntoView({ behavior: 'smooth' });
-    }
-};
-
-onMounted(async () => {
-    if (!recoveryCodesList.value.length) {
-        await fetchRecoveryCodes();
-    }
-});
-</script>
-
-<template>
-    <Card>
-        <CardHeader>
-            <CardTitle class="flex gap-3"> <LockKeyhole class="size-4" />2FA Recovery Codes </CardTitle>
-            <CardDescription>
-                Recovery codes let you regain access if you lose your 2FA device. Store them in a secure password manager.
-            </CardDescription>
-        </CardHeader>
-        <CardContent>
-            <div class="flex flex-col gap-3 select-none sm:flex-row sm:items-center sm:justify-between">
-                <Button @click="toggleRecoveryCodesVisibility" class="w-fit">
-                    <component :is="isRecoveryCodesVisible ? EyeOff : Eye" class="size-4" />
-                    {{ isRecoveryCodesVisible ? 'Hide' : 'View' }} Recovery Codes
-                </Button>
-
-                <Form
-                    v-if="isRecoveryCodesVisible"
-                    v-bind="regenerateRecoveryCodes.form()"
-                    method="post"
-                    :options="{ preserveScroll: true }"
-                    @success="fetchRecoveryCodes"
-                    #default="{ processing }"
-                >
-                    <Button variant="secondary" type="submit" :disabled="processing"> <RefreshCw /> Regenerate Codes </Button>
-                </Form>
-            </div>
-            <div :class="['relative overflow-hidden transition-all duration-300', isRecoveryCodesVisible ? 'h-auto opacity-100' : 'h-0 opacity-0']">
-                <div class="mt-3 space-y-3">
-                    <div ref="recoveryCodeSectionRef" class="grid gap-1 rounded-lg bg-muted p-4 font-mono text-sm">
-                        <div v-if="!recoveryCodesList.length" class="space-y-2">
-                            <div v-for="n in 8" :key="n" class="h-4 animate-pulse rounded bg-muted-foreground/20"></div>
-                        </div>
-                        <div v-else v-for="(code, index) in recoveryCodesList" :key="index">
-                            {{ code }}
-                        </div>
-                    </div>
-                    <p class="text-xs text-muted-foreground select-none">
-                        Each recovery code can be used once to access your account and will be removed after use. If you need more, click
-                        <span class="font-bold">Regenerate Codes</span> above.
-                    </p>
-                </div>
-            </div>
-        </CardContent>
-    </Card>
-</template>
diff --git a/resources/js/components/TwoFactorSetupModal.vue b/resources/js/components/TwoFactorSetupModal.vue
deleted file mode 100644
index acbf9b5..0000000
--- a/resources/js/components/TwoFactorSetupModal.vue
+++ /dev/null
@@ -1,188 +0,0 @@
-<script setup lang="ts">
-import InputError from '@/components/InputError.vue';
-import { Button } from '@/components/ui/button';
-import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from '@/components/ui/dialog';
-import { PinInput, PinInputGroup, PinInputSlot } from '@/components/ui/pin-input';
-import { useTwoFactorAuth } from '@/composables/useTwoFactorAuth';
-import { confirm } from '@/routes/two-factor';
-import { Form } from '@inertiajs/vue3';
-import { useClipboard } from '@vueuse/core';
-import { Check, Copy, Loader2, ScanLine } from 'lucide-vue-next';
-import { computed, nextTick, ref, watch } from 'vue';
-
-interface Props {
-    requiresConfirmation: boolean;
-    twoFactorEnabled: boolean;
-}
-
-const props = defineProps<Props>();
-const isOpen = defineModel<boolean>('isOpen');
-
-const { copy, copied } = useClipboard();
-const { qrCodeSvg, manualSetupKey, clearSetupData, fetchSetupData } = useTwoFactorAuth();
-
-const showVerificationStep = ref(false);
-const code = ref<number[]>([]);
-const codeValue = computed<string>(() => code.value.join(''));
-
-const pinInputContainerRef = ref<HTMLElement | null>(null);
-
-const modalConfig = computed<{ title: string; description: string; buttonText: string }>(() => {
-    if (props.twoFactorEnabled) {
-        return {
-            title: 'Two-Factor Authentication Enabled',
-            description: 'Two-factor authentication is now enabled. Scan the QR code or enter the setup key in your authenticator app.',
-            buttonText: 'Close',
-        };
-    }
-
-    if (showVerificationStep.value) {
-        return {
-            title: 'Verify Authentication Code',
-            description: 'Enter the 6-digit code from your authenticator app',
-            buttonText: 'Continue',
-        };
-    }
-
-    return {
-        title: 'Enable Two-Factor Authentication',
-        description: 'To finish enabling two-factor authentication, scan the QR code or enter the setup key in your authenticator app',
-        buttonText: 'Continue',
-    };
-});
-
-const handleModalNextStep = () => {
-    if (props.requiresConfirmation) {
-        showVerificationStep.value = true;
-
-        nextTick(() => {
-            pinInputContainerRef.value?.querySelector('input')?.focus();
-        });
-
-        return;
-    }
-
-    clearSetupData();
-    isOpen.value = false;
-};
-
-const resetModalState = () => {
-    if (props.twoFactorEnabled) {
-        clearSetupData();
-    }
-
-    showVerificationStep.value = false;
-    code.value = [];
-};
-
-watch(
-    () => isOpen.value,
-    async (isOpen) => {
-        if (!isOpen) {
-            resetModalState();
-            return;
-        }
-
-        if (!qrCodeSvg.value) {
-            await fetchSetupData();
-        }
-    },
-);
-</script>
-
-<template>
-    <Dialog :open="isOpen" @update:open="isOpen = $event">
-        <DialogContent class="sm:max-w-md">
-            <DialogHeader class="flex items-center justify-center">
-                <div class="mb-3 w-auto rounded-full border border-border bg-card p-0.5 shadow-sm">
-                    <div class="relative overflow-hidden rounded-full border border-border bg-muted p-2.5">
-                        <div class="absolute inset-0 grid grid-cols-5 opacity-50">
-                            <div v-for="i in 5" :key="`col-${i}`" class="border-r border-border last:border-r-0" />
-                        </div>
-                        <div class="absolute inset-0 grid grid-rows-5 opacity-50">
-                            <div v-for="i in 5" :key="`row-${i}`" class="border-b border-border last:border-b-0" />
-                        </div>
-                        <ScanLine class="relative z-20 size-6 text-foreground" />
-                    </div>
-                </div>
-                <DialogTitle>{{ modalConfig.title }}</DialogTitle>
-                <DialogDescription class="text-center">
-                    {{ modalConfig.description }}
-                </DialogDescription>
-            </DialogHeader>
-
-            <div class="relative flex w-auto flex-col items-center justify-center space-y-5">
-                <template v-if="!showVerificationStep">
-                    <div class="relative mx-auto flex max-w-md items-center overflow-hidden">
-                        <div class="relative mx-auto aspect-square w-64 overflow-hidden rounded-lg border border-border">
-                            <div
-                                v-if="!qrCodeSvg"
-                                class="absolute inset-0 z-10 flex aspect-square h-auto w-full animate-pulse items-center justify-center bg-background"
-                            >
-                                <Loader2 class="size-6 animate-spin" />
-                            </div>
-                            <div v-else class="relative z-10 overflow-hidden border p-5">
-                                <div v-html="qrCodeSvg" class="flex aspect-square size-full items-center justify-center" />
-                            </div>
-                        </div>
-                    </div>
-
-                    <div class="flex w-full items-center space-x-5">
-                        <Button class="w-full" @click="handleModalNextStep">
-                            {{ modalConfig.buttonText }}
-                        </Button>
-                    </div>
-
-                    <div class="relative flex w-full items-center justify-center">
-                        <div class="absolute inset-0 top-1/2 h-px w-full bg-border" />
-                        <span class="relative bg-card px-2 py-1">or, enter the code manually</span>
-                    </div>
-
-                    <div class="flex w-full items-center justify-center space-x-2">
-                        <div class="flex w-full items-stretch overflow-hidden rounded-xl border border-border">
-                            <div v-if="!manualSetupKey" class="flex h-full w-full items-center justify-center bg-muted p-3">
-                                <Loader2 class="size-4 animate-spin" />
-                            </div>
-                            <template v-else>
-                                <input type="text" readonly :value="manualSetupKey" class="h-full w-full bg-background p-3 text-foreground" />
-                                <button @click="copy(manualSetupKey || '')" class="relative block h-auto border-l border-border px-3 hover:bg-muted">
-                                    <Check v-if="copied" class="w-4 text-green-500" />
-                                    <Copy v-else class="w-4" />
-                                </button>
-                            </template>
-                        </div>
-                    </div>
-                </template>
-
-                <template v-else>
-                    <Form v-bind="confirm.form()" reset-on-error @finish="code = []" @success="isOpen = false" v-slot="{ errors, processing }">
-                        <input type="hidden" name="code" :value="codeValue" />
-                        <div ref="pinInputContainerRef" class="relative w-full space-y-3">
-                            <div class="flex w-full flex-col items-center justify-center space-y-3 py-2">
-                                <PinInput id="otp" placeholder="○" v-model="code" type="number" otp>
-                                    <PinInputGroup>
-                                        <PinInputSlot autofocus v-for="(id, index) in 6" :key="id" :index="index" :disabled="processing" />
-                                    </PinInputGroup>
-                                </PinInput>
-                                <InputError :message="errors?.confirmTwoFactorAuthentication?.code" />
-                            </div>
-
-                            <div class="flex w-full items-center space-x-5">
-                                <Button
-                                    type="button"
-                                    variant="outline"
-                                    class="w-auto flex-1"
-                                    @click="showVerificationStep = false"
-                                    :disabled="processing"
-                                >
-                                    Back
-                                </Button>
-                                <Button type="submit" class="w-auto flex-1" :disabled="processing || codeValue.length < 6"> Confirm </Button>
-                            </div>
-                        </div>
-                    </Form>
-                </template>
-            </div>
-        </DialogContent>
-    </Dialog>
-</template>
diff --git a/resources/js/components/UserInfo.vue b/resources/js/components/UserInfo.vue
deleted file mode 100644
index 15ebf0e..0000000
--- a/resources/js/components/UserInfo.vue
+++ /dev/null
@@ -1,34 +0,0 @@
-<script setup lang="ts">
-import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar';
-import { useInitials } from '@/composables/useInitials';
-import type { User } from '@/types';
-import { computed } from 'vue';
-
-interface Props {
-    user: User;
-    showEmail?: boolean;
-}
-
-const props = withDefaults(defineProps<Props>(), {
-    showEmail: false,
-});
-
-const { getInitials } = useInitials();
-
-// Compute whether we should show the avatar image
-const showAvatar = computed(() => props.user.avatar && props.user.avatar !== '');
-</script>
-
-<template>
-    <Avatar class="h-8 w-8 overflow-hidden rounded-lg">
-        <AvatarImage v-if="showAvatar" :src="user.avatar!" :alt="user.name" />
-        <AvatarFallback class="rounded-lg text-black dark:text-white">
-            {{ getInitials(user.name) }}
-        </AvatarFallback>
-    </Avatar>
-
-    <div class="grid flex-1 text-left text-sm leading-tight">
-        <span class="truncate font-medium">{{ user.name }}</span>
-        <span v-if="showEmail" class="truncate text-xs text-muted-foreground">{{ user.email }}</span>
-    </div>
-</template>
diff --git a/resources/js/components/UserMenuContent.vue b/resources/js/components/UserMenuContent.vue
deleted file mode 100644
index dd565ac..0000000
--- a/resources/js/components/UserMenuContent.vue
+++ /dev/null
@@ -1,43 +0,0 @@
-<script setup lang="ts">
-import UserInfo from '@/components/UserInfo.vue';
-import { DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator } from '@/components/ui/dropdown-menu';
-import { logout } from '@/routes';
-import { edit } from '@/routes/profile';
-import type { User } from '@/types';
-import { Link, router } from '@inertiajs/vue3';
-import { LogOut, Settings } from 'lucide-vue-next';
-
-interface Props {
-    user: User;
-}
-
-const handleLogout = () => {
-    router.flushAll();
-};
-
-defineProps<Props>();
-</script>
-
-<template>
-    <DropdownMenuLabel class="p-0 font-normal">
-        <div class="flex items-center gap-2 px-1 py-1.5 text-left text-sm">
-            <UserInfo :user="user" :show-email="true" />
-        </div>
-    </DropdownMenuLabel>
-    <DropdownMenuSeparator />
-    <DropdownMenuGroup>
-        <DropdownMenuItem :as-child="true">
-            <Link class="block w-full" :href="edit()" prefetch as="button">
-                <Settings class="mr-2 h-4 w-4" />
-                Settings
-            </Link>
-        </DropdownMenuItem>
-    </DropdownMenuGroup>
-    <DropdownMenuSeparator />
-    <DropdownMenuItem :as-child="true">
-        <Link class="block w-full" :href="logout()" @click="handleLogout" as="button" data-test="logout-button">
-            <LogOut class="mr-2 h-4 w-4" />
-            Log out
-        </Link>
-    </DropdownMenuItem>
-</template>
diff --git a/resources/js/components/dredgy/EdgyButton.vue b/resources/js/components/dredgy/EdgyButton.vue
new file mode 100644
index 0000000..d448717
--- /dev/null
+++ b/resources/js/components/dredgy/EdgyButton.vue
@@ -0,0 +1,59 @@
+<template>
+    <button :class="['btn', classes]">
+        <slot />
+    </button>
+</template>
+
+<style scoped>
+/* Buttons */
+.btn {
+    padding: 1rem 2rem;
+    font-size: 1.125rem;
+    font-weight: 600;
+    border: none;
+    cursor: pointer;
+    transition: var(--transition-smooth);
+    text-transform: uppercase;
+    letter-spacing: 0.05em;
+    position: relative;
+    clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 12px 100%, 0 calc(100% - 12px));
+    text-decoration: none;
+    display: inline-block;
+    text-align: center;
+}
+
+.btn-primary {
+    background: var(--gradient-adventure);
+    color: var(--background);
+}
+
+.btn-primary:hover {
+    box-shadow: var(--shadow-glow);
+    transform: translateY(-2px);
+}
+
+.btn-secondary {
+    background: transparent;
+    color: var(--accent);
+    border: 2px solid var(--accent);
+}
+
+.btn-secondary:hover {
+    background: var(--accent);
+    color: var(--background);
+}
+
+.btn-full {
+    width: 100%;
+}
+
+</style>
+
+<script setup lang="ts">
+import { defineProps } from 'vue'
+
+const props = defineProps<{
+    classes?: string | string[]
+}>()
+
+</script>
diff --git a/resources/js/components/dredgy/FeaturedTourGrid.vue b/resources/js/components/dredgy/FeaturedTourGrid.vue
new file mode 100644
index 0000000..85af715
--- /dev/null
+++ b/resources/js/components/dredgy/FeaturedTourGrid.vue
@@ -0,0 +1,11 @@
+<script setup lang="ts">
+
+</script>
+
+<template>
+
+</template>
+
+<style scoped>
+
+</style>
diff --git a/resources/js/components/dredgy/GradientText.vue b/resources/js/components/dredgy/GradientText.vue
new file mode 100644
index 0000000..5969998
--- /dev/null
+++ b/resources/js/components/dredgy/GradientText.vue
@@ -0,0 +1,16 @@
+<script setup lang="ts">
+
+</script>
+
+<template>
+<span class="gradient-text"><slot/></span>
+</template>
+
+<style scoped>
+.gradient-text {
+    background: var(--gradient-adventure);
+    -webkit-background-clip: text;
+    background-clip: text;
+    -webkit-text-fill-color: transparent;
+}
+</style>
diff --git a/resources/js/components/dredgy/SectionContainer.vue b/resources/js/components/dredgy/SectionContainer.vue
new file mode 100644
index 0000000..b4a95fb
--- /dev/null
+++ b/resources/js/components/dredgy/SectionContainer.vue
@@ -0,0 +1,23 @@
+<script setup lang="ts">
+
+</script>
+
+<template>
+<div class="sectionContainer">
+    <slot />
+</div>
+</template>
+
+<style scoped>
+.sectionContainer {
+    max-width: 1200px;
+    margin: 0 auto;
+    padding: 0 2rem;
+}
+
+@media (max-width: 767px) {
+    .sectionContainer {
+        padding: 0 1rem;
+    }
+}
+</style>
diff --git a/resources/js/components/dredgy/SectionTitle.vue b/resources/js/components/dredgy/SectionTitle.vue
new file mode 100644
index 0000000..dfd761a
--- /dev/null
+++ b/resources/js/components/dredgy/SectionTitle.vue
@@ -0,0 +1,49 @@
+
+<template>
+    <h2 class="section-title">
+        <span>{{ title }}</span><br>
+        <GradientText v-if="gradient">{{ gradient }}</GradientText>
+    </h2>
+    <div class="section-divider"></div>
+    <p class="section-subtitle" v-if="subtitle">
+        {{ subtitle }}
+    </p>
+</template>
+
+<style scoped>
+.section-divider {
+    width: 128px;
+    height: 4px;
+    background: var(--gradient-adventure);
+    margin: 2rem auto;
+    clip-path: polygon(0 0, calc(100% - 8px) 0, 100% 100%, 8px 100%);
+}
+
+.section-title {
+    font-size: clamp(2.5rem, 5vw, 4rem);
+    font-weight: bold;
+    text-align: center;
+    margin-bottom: 1rem;
+    line-height: 1.1;
+}
+
+.section-subtitle {
+    font-size: 1.25rem;
+    color: var(--muted-foreground);
+    text-align: center;
+    max-width: 600px;
+    margin: 0 auto;
+}
+</style>
+<script setup lang="ts">
+
+import GradientText from "@/components/dredgy/GradientText.vue";
+import { defineProps } from 'vue'
+
+
+const props = defineProps<{
+    title: string
+    gradient?: string
+    subtitle?: string
+}>()
+</script>
diff --git a/resources/js/components/dredgy/TourCard.vue b/resources/js/components/dredgy/TourCard.vue
new file mode 100644
index 0000000..1da3a80
--- /dev/null
+++ b/resources/js/components/dredgy/TourCard.vue
@@ -0,0 +1,233 @@
+<script setup lang="ts">
+import {Tour} from "@/types";
+
+import { defineProps } from 'vue'
+import EdgyButton from "@/components/dredgy/EdgyButton.vue";
+const formatPrice = (price: number) => {
+    return new Intl.NumberFormat('en-US', { style: 'currency', currency: 'USD' }).format(price)
+}
+
+const props = defineProps<{
+    tour: Tour
+}>()
+</script>
+
+<template>
+    <div class="tour-card" data-index="0">
+        <div class="tour-image">
+            <img :src="`/img/tours/${tour.internal_name}.jpg`" alt="">
+            <div class="tour-overlay"></div>
+            <div :class="['tour-difficulty', tour.level.toLowerCase()]">{{tour.level}}</div>
+            <div class="tour-price">{{formatPrice(tour.price)}}</div>
+        </div>
+        <div class="tour-content">
+            <div class="tour-location">
+                <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+                    <path d="M21 10c0 7-9 13-9 13s-9-6-9-13a9 9 0 0 1 18 0z"></path>
+                    <circle cx="12" cy="10" r="3"></circle>
+                </svg>
+                {{tour.countryName}}, {{tour.continentName}}
+            </div>
+            <h3 class="tour-title">{{tour.title}}</h3>
+            <p class="tour-description" v-if="tour.description">{{tour.description}}</p>
+            <div class="tour-details">
+                <div class="tour-detail">
+                    <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+                        <circle cx="12" cy="12" r="10"></circle>
+                        <polyline points="12,6 12,12 16,14"></polyline>
+                    </svg>
+                    {{tour.length}} Days
+                </div>
+                <div class="tour-detail">
+                    <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
+                        <path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"></path>
+                        <circle cx="9" cy="7" r="4"></circle>
+                        <path d="M23 21v-2a4 4 0 0 0-3-3.87"></path>
+                        <path d="M16 3.13a4 4 0 0 1 0 7.75"></path>
+                    </svg>
+                    Maximum 6
+                </div>
+            </div>
+            <EdgyButton classes="btn-primary btn-full">Book Now</EdgyButton>
+        </div>
+    </div>
+</template>
+
+<style scoped>
+/* Tour Cards */
+.tour-card {
+    background: var(--card);
+    border: 1px solid var(--border);
+    border-radius: 0;
+    clip-path: polygon(0 0, calc(100% - 20px) 0, 100% 20px, 100% 100%, 20px 100%, 0 calc(100% - 20px));
+    cursor: pointer;
+    transition: all 1s cubic-bezier(0.4, 0, 0.2, 1);
+    transform: translateY(100px) rotate(-6deg) scale(0.9);
+    opacity: 0;
+    transform-origin: center bottom;
+}
+
+.tour-card:nth-child(2n) {
+    transform: translateY(100px) rotate(6deg) scale(0.9);
+}
+
+.tour-card.visible {
+    transform: translateY(0) rotate(0deg) scale(1);
+    opacity: 1;
+}
+
+.tour-card:hover {
+    box-shadow: var(--shadow-intense);
+    transform: translateY(-8px) rotate(0deg) scale(1.02);
+}
+
+.tour-image {
+    position: relative;
+    height: 256px;
+    overflow: hidden;
+}
+
+.tour-image img {
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+    transition: transform 0.5s ease;
+}
+
+.tour-card:hover .tour-image img {
+    transform: scale(1.1);
+}
+
+.tour-overlay {
+    position: absolute;
+    inset: 0;
+    background: linear-gradient(to top, rgba(0, 0, 0, 0.6), transparent);
+}
+
+.tour-difficulty {
+    position: absolute;
+    top: 1rem;
+    right: 1rem;
+    padding: 0.25rem 0.75rem;
+    border-radius: 999px;
+    font-size: 0.75rem;
+    font-weight: 600;
+    text-transform: uppercase;
+}
+
+.tour-difficulty.expert {
+    background: var(--destructive);
+    color: var(--destructive-foreground);
+}
+
+.tour-difficulty.moderate {
+    background: var(--secondary);
+    color: var(--secondary-foreground);
+}
+
+.tour-difficulty.beginner {
+    background: var(--accent);
+    color: var(--background);
+}
+
+.tour-price {
+    position: absolute;
+    bottom: 1rem;
+    right: 1rem;
+    background: var(--primary);
+    color: white;
+    padding: 0.5rem 0.75rem;
+    border-radius: 4px;
+    font-weight: bold;
+}
+
+.tour-content {
+    padding: 1.5rem;
+}
+
+.tour-location {
+    display: flex;
+    align-items: center;
+    gap: 0.25rem;
+    color: var(--muted-foreground);
+    font-size: 0.875rem;
+    margin-bottom: 0.5rem;
+}
+
+.tour-title {
+    font-size: 1.25rem;
+    font-weight: bold;
+    color: var(--card-foreground);
+    margin-bottom: 0.75rem;
+    transition: var(--transition-smooth);
+}
+
+.tour-card:hover .tour-title {
+    color: var(--primary);
+}
+
+.tour-description {
+    color: var(--muted-foreground);
+    font-size: 0.875rem;
+    line-height: 1.6;
+    margin-bottom: 1rem;
+}
+
+.tour-details {
+    display: flex;
+    justify-content: space-between;
+    margin-bottom: 1.5rem;
+}
+
+.tour-detail {
+    display: flex;
+    align-items: center;
+    gap: 0.25rem;
+    color: var(--muted-foreground);
+    font-size: 0.875rem;
+}
+
+/* Animations */
+@keyframes bounce {
+    0%, 20%, 53%, 80%, 100% {
+        transform: translateX(-50%) translateY(0);
+    }
+    40%, 43% {
+        transform: translateX(-50%) translateY(-15px);
+    }
+    70% {
+        transform: translateX(-50%) translateY(-7px);
+    }
+    90% {
+        transform: translateX(-50%) translateY(-2px);
+    }
+}
+
+@keyframes pulse {
+    0%, 100% {
+        opacity: 1;
+    }
+    50% {
+        opacity: 0.5;
+    }
+}
+
+.animate-fade {
+    animation: fadeInUp 1s ease-out;
+}
+
+.animate-slide {
+    animation: fadeInUp 1s ease-out 0.2s both;
+}
+
+@keyframes fadeInUp {
+    from {
+        opacity: 0;
+        transform: translateY(30px);
+    }
+    to {
+        opacity: 1;
+        transform: translateY(0);
+    }
+}
+</style>
diff --git a/resources/js/components/home/About.vue b/resources/js/components/home/About.vue
new file mode 100644
index 0000000..0c93da3
--- /dev/null
+++ b/resources/js/components/home/About.vue
@@ -0,0 +1,185 @@
+<template>
+    <section class="about" id="about">
+        <div class="about-decorations">
+            <div class="about-decoration about-decoration-1"></div>
+            <div class="about-decoration about-decoration-2"></div>
+            <div class="about-decoration about-decoration-3"></div>
+        </div>
+
+        <SectionContainer>
+            <div class="about-content">
+                <SectionTitle title="Beyond" gradient="Borders" />
+
+                <div class="about-grid">
+                    <div class="about-text">
+                        <p>
+                            We've been travelling the world our whole lives. From North Korea to Afghanistan, Comoros to Venezuela, Suriname to Uruguay. We know the world, and we want to show it to you.
+                        </p>
+                        <p>
+                            Dr Edgy offers immersive, authentic small group and private adventures, leveraging an extensive global network forged through decades of adventure travel.
+                        </p>
+                        <p>
+                            Our main focus for now is China, where we offer deep-dive adventures of individual provinces and subjects-of-interest and going to places that most other tours completely bypass.
+                            We can arrange private adventures in many other countries on request.
+                        </p>
+
+
+                    </div>
+
+                    <div class="about-cta">
+                        <h3>Who Are We?</h3>
+                        <p>Dr Edgy was founded by two close friends who met travelling in North Korea. Both of us love adventure travel with a bit of luxury. One of us is even a doctor.</p>
+                        <p> You are in safe hands.</p>
+                        <EdgyButton classes="btn-primary">GET TO KNOW US</EdgyButton>
+                    </div>
+                </div>
+            </div>
+        </SectionContainer>
+    </section>
+</template>
+
+<style scoped>
+/* About Section */
+.about {
+    position: relative;
+    padding: 5rem 0;
+    background: var(--background);
+    overflow: hidden;
+}
+
+.about-decorations {
+    position: absolute;
+    inset: 0;
+    pointer-events: none;
+}
+
+.about-decoration {
+    position: absolute;
+    opacity: 0.05;
+    clip-path: polygon(0 0, calc(100% - 20px) 0, 100% 20px, 100% 100%, 20px 100%, 0 calc(100% - 20px));
+}
+
+.about-decoration-1 {
+    top: 2rem;
+    right: 2rem;
+    width: 100px;
+    height: 100px;
+    background: var(--gradient-adventure);
+}
+
+.about-decoration-2 {
+    bottom: 3rem;
+    left: 3rem;
+    width: 80px;
+    height: 80px;
+    background: var(--gradient-accent);
+}
+
+.about-decoration-3 {
+    top: 50%;
+    right: 5rem;
+    width: 6px;
+    height: 100px;
+    background: var(--gradient-adventure);
+}
+
+.about-content {
+    opacity: 0;
+    transform: translateY(50px);
+    transition: all 1s cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+.about-content.visible {
+    opacity: 1;
+    transform: translateY(0);
+}
+
+.about-grid {
+    display: grid;
+    gap: 3rem;
+    margin-top: 3rem;
+}
+
+@media (min-width: 768px) {
+    .about-grid {
+        grid-template-columns: 1fr 1fr;
+        align-items: center;
+    }
+}
+
+.about-text p {
+    margin-bottom: 1.5rem;
+    color: var(--muted-foreground);
+    font-size: 1.125rem;
+}
+
+.stats-grid {
+    display: grid;
+    grid-template-columns: repeat(3, 1fr);
+    gap: 2rem;
+    margin-top: 2rem;
+}
+
+.stat {
+    text-align: center;
+}
+
+.stat-number {
+    font-size: 2.5rem;
+    font-weight: bold;
+    background: var(--gradient-adventure);
+    -webkit-background-clip: text;
+    background-clip: text;
+    -webkit-text-fill-color: transparent;
+}
+
+.stat-label {
+    color: var(--muted-foreground);
+    font-size: 0.875rem;
+    text-transform: uppercase;
+    letter-spacing: 0.05em;
+}
+
+.about-cta {
+    text-align: center;
+    padding: 2rem;
+    background: var(--card);
+    border-radius: 0;
+    clip-path: polygon(0 0, calc(100% - 20px) 0, 100% 20px, 100% 100%, 20px 100%, 0 calc(100% - 20px));
+}
+
+.about-cta h3 {
+    font-size: 1.5rem;
+    margin-bottom: 1rem;
+    background: var(--gradient-adventure);
+    -webkit-background-clip: text;
+    background-clip: text;
+    -webkit-text-fill-color: transparent;
+}
+
+.about-cta p {
+    color: var(--muted-foreground);
+    margin-bottom: 1.5rem;
+}
+
+@media (max-width: 767px) {
+    .stats-grid {
+        grid-template-columns: 1fr;
+        gap: 1rem;
+    }
+
+    .about-grid {
+        grid-template-columns: 1fr;
+        gap: 2rem;
+    }
+}
+</style>
+
+<script setup lang="ts">
+
+import EdgyButton from "@/components/dredgy/EdgyButton.vue";
+import GradientText from "@/components/dredgy/GradientText.vue";
+import SectionContainer from "@/components/dredgy/SectionContainer.vue";
+import SectionTitle from "@/components/dredgy/SectionTitle.vue";
+</script>
+
diff --git a/resources/js/components/home/FeaturedTours.vue b/resources/js/components/home/FeaturedTours.vue
new file mode 100644
index 0000000..d08077a
--- /dev/null
+++ b/resources/js/components/home/FeaturedTours.vue
@@ -0,0 +1,108 @@
+<template>
+    <section class="featured-tours">
+        <div class="tour-decorations">
+            <div class="tour-decoration tour-decoration-1"></div>
+            <div class="tour-decoration tour-decoration-2"></div>
+        </div>
+
+        <SectionContainer>
+            <div class="tours-header">
+                <SectionTitle title="Featured" gradient="Adventures" subtitle="Discover somewhere new, in a new way" />
+            </div>
+
+            <div class="tours-grid">
+                <TourCard
+                    v-for="tour in featuredTours"
+                    :tour="tour"
+                />
+            </div>
+            <br/>
+            <EdgyButton classes="btn-primary btn-full">Explore All Tours</EdgyButton>
+
+        </SectionContainer>
+    </section>
+</template>
+
+
+<style scoped>
+/* Featured Tours Section */
+.featured-tours {
+    position: relative;
+    padding: 5rem 0;
+    background: var(--background);
+    overflow: hidden;
+}
+
+.tour-decorations {
+    position: absolute;
+    inset: 0;
+    pointer-events: none;
+}
+
+.tour-decoration {
+    position: absolute;
+    opacity: 0.05;
+    clip-path: polygon(0 0, calc(100% - 20px) 0, 100% 20px, 100% 100%, 20px 100%, 0 calc(100% - 20px));
+}
+
+.tour-decoration-1 {
+    top: 5rem;
+    left: 0;
+    width: 128px;
+    height: 128px;
+    background: var(--gradient-adventure);
+}
+
+.tour-decoration-2 {
+    bottom: 10rem;
+    right: 5rem;
+    width: 96px;
+    height: 96px;
+    background: var(--gradient-accent);
+    opacity: 0.1;
+}
+
+.tours-header {
+    text-align: center;
+    margin-bottom: 4rem;
+    opacity: 0;
+    transform: translateY(50px);
+    transition: all 1s cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+.tours-header.visible {
+    opacity: 1;
+    transform: translateY(0);
+}
+
+.tours-grid {
+    display: grid;
+    gap: 2rem;
+}
+
+@media (min-width: 768px) {
+    .tours-grid {
+        grid-template-columns: repeat(2, 1fr);
+    }
+}
+
+@media (min-width: 1024px) {
+    .tours-grid {
+        grid-template-columns: repeat(3, 1fr);
+    }
+}
+</style>
+
+<script setup lang="ts">
+import SectionContainer from "@/components/dredgy/SectionContainer.vue";
+import SectionTitle from "@/components/dredgy/SectionTitle.vue";
+import TourCard from "@/components/dredgy/TourCard.vue";
+import { Tour } from "@/types";
+import EdgyButton from "@/components/dredgy/EdgyButton.vue";
+
+const featuredTours : Tour[] = [
+    {id: 1, length:8, title:"Cantonese Charm", countryId: 1, countryName: "China", continentId:1,continentName:"Asia",description:"Guangdong is known for it's big, global cities, but there is so much more to discover and pristine natural beauty.", internal_name:"cantonese_charm", level: "Beginner", price:1000},
+    {id: 2, length: 7, title:"Fujian Fantasy", countryId: 1, countryName: "China", continentId:1,continentName:"Asia",description:"Experience fresh seafood in Xiamen, and then move rurally for an authentic dive into Hakka culture", internal_name:"fujian_fantasy", level: "Beginner", price:1200},
+    {id: 3, length: 10, title:"Hebei Hijinx", countryId: 1, countryName: "China", continentId:1,continentName:"Asia",description:"The Great Wall, Great Food and ancient treasures in one of China's most underrated provinces.", internal_name:"hebei_hijinx", level: "Moderate", price:1500},
+]
+</script>
diff --git a/resources/js/components/home/Hero.vue b/resources/js/components/home/Hero.vue
new file mode 100644
index 0000000..8506220
--- /dev/null
+++ b/resources/js/components/home/Hero.vue
@@ -0,0 +1,139 @@
+<template>
+    <section class="hero">
+        <div class="hero-bg"></div>
+        <div class="hero-overlay"></div>
+
+        <div class="hero-content">
+            <h1 class="hero-title animate-fade">
+                <GradientText>Travel.</GradientText><br>
+                <span>On the Edge</span>
+            </h1>
+
+            <p class="hero-subtitle animate-slide">
+                We don't go wherever is trendy. <br/>
+                We set the trends.
+            </p>
+            <div class="hero-buttons">
+                <EdgyButton classes="btn-secondary">View Tours</EdgyButton>
+            </div>
+        </div>
+
+        <div class="scroll-indicator">
+            <div class="scroll-mouse">
+                <div class="scroll-dot"></div>
+            </div>
+        </div>
+    </section>
+
+</template>
+
+<style scoped>
+/* Hero Section */
+.hero {
+    position: relative;
+    min-height: 100vh;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    overflow: hidden;
+}
+
+.hero-bg {
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    height: 120%;
+    background-image: url('/img/hero.jpg');
+    background-size: cover;
+    background-position: center;
+    will-change: transform;
+}
+
+.hero-overlay {
+    position: absolute;
+    top: 0;
+    left: 0;
+    right: 0;
+    height: 120%;
+    background: var(--gradient-hero);
+    opacity: 0.8;
+}
+
+.hero-content {
+    position: relative;
+    z-index: 10;
+    text-align: center;
+    max-width: 1000px;
+    padding: 0 2rem;
+}
+
+.hero-title {
+    font-size: clamp(3rem, 8vw, 6rem);
+    font-weight: bold;
+    margin-bottom: 1.5rem;
+    line-height: 1.1;
+}
+
+.hero-subtitle {
+    font-size: clamp(1.125rem, 2.5vw, 1.5rem);
+    color: var(--muted-foreground);
+    margin-bottom: 2rem;
+    max-width: 600px;
+    margin-left: auto;
+    margin-right: auto;
+}
+
+.hero-buttons {
+    display: flex;
+    flex-direction: column;
+    gap: 1rem;
+    align-items: center;
+}
+
+@media (min-width: 640px) {
+    .hero-buttons {
+        flex-direction: row;
+        justify-content: center;
+    }
+}
+@media (max-width: 767px) {
+
+    .hero-content {
+        padding: 0 1rem;
+    }
+}
+
+.scroll-indicator {
+    position: absolute;
+    bottom: 2rem;
+    left: 50%;
+    transform: translateX(-50%);
+    animation: bounce 2s infinite;
+}
+
+.scroll-mouse {
+    width: 24px;
+    height: 40px;
+    border: 2px solid var(--foreground);
+    border-radius: 12px;
+    display: flex;
+    justify-content: center;
+    padding-top: 8px;
+}
+
+.scroll-dot {
+    width: 4px;
+    height: 12px;
+    background: var(--foreground);
+    border-radius: 2px;
+    animation: pulse 2s infinite;
+}
+
+</style>
+
+<script setup lang="ts">
+
+import EdgyButton from "@/components/dredgy/EdgyButton.vue";
+import GradientText from "@/components/dredgy/GradientText.vue";
+</script>
diff --git a/resources/js/components/ui/avatar/Avatar.vue b/resources/js/components/ui/avatar/Avatar.vue
deleted file mode 100644
index 1aa6462..0000000
--- a/resources/js/components/ui/avatar/Avatar.vue
+++ /dev/null
@@ -1,18 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-import { AvatarRoot } from 'reka-ui'
-
-const props = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
-</script>
-
-<template>
-  <AvatarRoot
-    data-slot="avatar"
-    :class="cn('relative flex size-8 shrink-0 overflow-hidden rounded-full', props.class)"
-  >
-    <slot />
-  </AvatarRoot>
-</template>
diff --git a/resources/js/components/ui/avatar/AvatarFallback.vue b/resources/js/components/ui/avatar/AvatarFallback.vue
deleted file mode 100644
index b0f3398..0000000
--- a/resources/js/components/ui/avatar/AvatarFallback.vue
+++ /dev/null
@@ -1,23 +0,0 @@
-<script setup lang="ts">
-import { cn } from '@/lib/utils'
-import { AvatarFallback, type AvatarFallbackProps } from 'reka-ui'
-import { computed, type HTMLAttributes } from 'vue'
-
-const props = defineProps<AvatarFallbackProps & { class?: HTMLAttributes['class'] }>()
-
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props
-
-  return delegated
-})
-</script>
-
-<template>
-  <AvatarFallback
-    data-slot="avatar-fallback"
-    v-bind="delegatedProps"
-    :class="cn('bg-muted flex size-full items-center justify-center rounded-full', props.class)"
-  >
-    <slot />
-  </AvatarFallback>
-</template>
diff --git a/resources/js/components/ui/avatar/AvatarImage.vue b/resources/js/components/ui/avatar/AvatarImage.vue
deleted file mode 100644
index 801392b..0000000
--- a/resources/js/components/ui/avatar/AvatarImage.vue
+++ /dev/null
@@ -1,16 +0,0 @@
-<script setup lang="ts">
-import type { AvatarImageProps } from 'reka-ui'
-import { AvatarImage } from 'reka-ui'
-
-const props = defineProps<AvatarImageProps>()
-</script>
-
-<template>
-  <AvatarImage
-    data-slot="avatar-image"
-    v-bind="props"
-    class="aspect-square size-full"
-  >
-    <slot />
-  </AvatarImage>
-</template>
diff --git a/resources/js/components/ui/avatar/index.ts b/resources/js/components/ui/avatar/index.ts
deleted file mode 100644
index 6a90410..0000000
--- a/resources/js/components/ui/avatar/index.ts
+++ /dev/null
@@ -1,3 +0,0 @@
-export { default as Avatar } from './Avatar.vue'
-export { default as AvatarFallback } from './AvatarFallback.vue'
-export { default as AvatarImage } from './AvatarImage.vue'
diff --git a/resources/js/components/ui/badge/Badge.vue b/resources/js/components/ui/badge/Badge.vue
deleted file mode 100644
index d894dfe..0000000
--- a/resources/js/components/ui/badge/Badge.vue
+++ /dev/null
@@ -1,26 +0,0 @@
-<script setup lang="ts">
-import type { PrimitiveProps } from "reka-ui"
-import type { HTMLAttributes } from "vue"
-import type { BadgeVariants } from "."
-import { reactiveOmit } from "@vueuse/core"
-import { Primitive } from "reka-ui"
-import { cn } from "@/lib/utils"
-import { badgeVariants } from "."
-
-const props = defineProps<PrimitiveProps & {
-  variant?: BadgeVariants["variant"]
-  class?: HTMLAttributes["class"]
-}>()
-
-const delegatedProps = reactiveOmit(props, "class")
-</script>
-
-<template>
-  <Primitive
-    data-slot="badge"
-    :class="cn(badgeVariants({ variant }), props.class)"
-    v-bind="delegatedProps"
-  >
-    <slot />
-  </Primitive>
-</template>
diff --git a/resources/js/components/ui/badge/index.ts b/resources/js/components/ui/badge/index.ts
deleted file mode 100644
index ac4c001..0000000
--- a/resources/js/components/ui/badge/index.ts
+++ /dev/null
@@ -1,26 +0,0 @@
-import type { VariantProps } from "class-variance-authority"
-import { cva } from "class-variance-authority"
-
-export { default as Badge } from "./Badge.vue"
-
-export const badgeVariants = cva(
-  "inline-flex items-center justify-center rounded-md border px-2 py-0.5 text-xs font-medium w-fit whitespace-nowrap shrink-0 [&>svg]:size-3 gap-1 [&>svg]:pointer-events-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive transition-[color,box-shadow] overflow-hidden",
-  {
-    variants: {
-      variant: {
-        default:
-          "border-transparent bg-primary text-primary-foreground [a&]:hover:bg-primary/90",
-        secondary:
-          "border-transparent bg-secondary text-secondary-foreground [a&]:hover:bg-secondary/90",
-        destructive:
-         "border-transparent bg-destructive text-white [a&]:hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60",
-        outline:
-          "text-foreground [a&]:hover:bg-accent [a&]:hover:text-accent-foreground",
-      },
-    },
-    defaultVariants: {
-      variant: "default",
-    },
-  },
-)
-export type BadgeVariants = VariantProps<typeof badgeVariants>
diff --git a/resources/js/components/ui/breadcrumb/Breadcrumb.vue b/resources/js/components/ui/breadcrumb/Breadcrumb.vue
deleted file mode 100644
index b99dcea..0000000
--- a/resources/js/components/ui/breadcrumb/Breadcrumb.vue
+++ /dev/null
@@ -1,17 +0,0 @@
-<script lang="ts" setup>
-import type { HTMLAttributes } from 'vue'
-
-const props = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
-</script>
-
-<template>
-  <nav
-    aria-label="breadcrumb"
-    data-slot="breadcrumb"
-    :class="props.class"
-  >
-    <slot />
-  </nav>
-</template>
diff --git a/resources/js/components/ui/breadcrumb/BreadcrumbEllipsis.vue b/resources/js/components/ui/breadcrumb/BreadcrumbEllipsis.vue
deleted file mode 100644
index fc1353f..0000000
--- a/resources/js/components/ui/breadcrumb/BreadcrumbEllipsis.vue
+++ /dev/null
@@ -1,23 +0,0 @@
-<script lang="ts" setup>
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-import { MoreHorizontal } from 'lucide-vue-next'
-
-const props = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
-</script>
-
-<template>
-  <span
-    data-slot="breadcrumb-ellipsis"
-    role="presentation"
-    aria-hidden="true"
-    :class="cn('flex size-9 items-center justify-center', props.class)"
-  >
-    <slot>
-      <MoreHorizontal class="size-4" />
-    </slot>
-    <span class="sr-only">More</span>
-  </span>
-</template>
diff --git a/resources/js/components/ui/breadcrumb/BreadcrumbItem.vue b/resources/js/components/ui/breadcrumb/BreadcrumbItem.vue
deleted file mode 100644
index f50f69d..0000000
--- a/resources/js/components/ui/breadcrumb/BreadcrumbItem.vue
+++ /dev/null
@@ -1,17 +0,0 @@
-<script lang="ts" setup>
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-
-const props = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
-</script>
-
-<template>
-  <li
-    data-slot="breadcrumb-item"
-    :class="cn('inline-flex items-center gap-1.5', props.class)"
-  >
-    <slot />
-  </li>
-</template>
diff --git a/resources/js/components/ui/breadcrumb/BreadcrumbLink.vue b/resources/js/components/ui/breadcrumb/BreadcrumbLink.vue
deleted file mode 100644
index 7edc1be..0000000
--- a/resources/js/components/ui/breadcrumb/BreadcrumbLink.vue
+++ /dev/null
@@ -1,20 +0,0 @@
-<script lang="ts" setup>
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-import { Primitive, type PrimitiveProps } from 'reka-ui'
-
-const props = withDefaults(defineProps<PrimitiveProps & { class?: HTMLAttributes['class'] }>(), {
-  as: 'a',
-})
-</script>
-
-<template>
-  <Primitive
-    data-slot="breadcrumb-link"
-    :as="as"
-    :as-child="asChild"
-    :class="cn('hover:text-foreground transition-colors', props.class)"
-  >
-    <slot />
-  </Primitive>
-</template>
diff --git a/resources/js/components/ui/breadcrumb/BreadcrumbList.vue b/resources/js/components/ui/breadcrumb/BreadcrumbList.vue
deleted file mode 100644
index 3a92c48..0000000
--- a/resources/js/components/ui/breadcrumb/BreadcrumbList.vue
+++ /dev/null
@@ -1,17 +0,0 @@
-<script lang="ts" setup>
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-
-const props = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
-</script>
-
-<template>
-  <ol
-    data-slot="breadcrumb-list"
-    :class="cn('text-muted-foreground flex flex-wrap items-center gap-1.5 text-sm break-words sm:gap-2.5', props.class)"
-  >
-    <slot />
-  </ol>
-</template>
diff --git a/resources/js/components/ui/breadcrumb/BreadcrumbPage.vue b/resources/js/components/ui/breadcrumb/BreadcrumbPage.vue
deleted file mode 100644
index cc667bc..0000000
--- a/resources/js/components/ui/breadcrumb/BreadcrumbPage.vue
+++ /dev/null
@@ -1,20 +0,0 @@
-<script lang="ts" setup>
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-
-const props = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
-</script>
-
-<template>
-  <span
-    data-slot="breadcrumb-page"
-    role="link"
-    aria-disabled="true"
-    aria-current="page"
-    :class="cn('text-foreground font-normal', props.class)"
-  >
-    <slot />
-  </span>
-</template>
diff --git a/resources/js/components/ui/breadcrumb/BreadcrumbSeparator.vue b/resources/js/components/ui/breadcrumb/BreadcrumbSeparator.vue
deleted file mode 100644
index 132dacf..0000000
--- a/resources/js/components/ui/breadcrumb/BreadcrumbSeparator.vue
+++ /dev/null
@@ -1,22 +0,0 @@
-<script lang="ts" setup>
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-import { ChevronRight } from 'lucide-vue-next'
-
-const props = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
-</script>
-
-<template>
-  <li
-    data-slot="breadcrumb-separator"
-    role="presentation"
-    aria-hidden="true"
-    :class="cn('[&>svg]:size-3.5', props.class)"
-  >
-    <slot>
-      <ChevronRight />
-    </slot>
-  </li>
-</template>
diff --git a/resources/js/components/ui/breadcrumb/index.ts b/resources/js/components/ui/breadcrumb/index.ts
deleted file mode 100644
index 0590983..0000000
--- a/resources/js/components/ui/breadcrumb/index.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-export { default as Breadcrumb } from './Breadcrumb.vue'
-export { default as BreadcrumbEllipsis } from './BreadcrumbEllipsis.vue'
-export { default as BreadcrumbItem } from './BreadcrumbItem.vue'
-export { default as BreadcrumbLink } from './BreadcrumbLink.vue'
-export { default as BreadcrumbList } from './BreadcrumbList.vue'
-export { default as BreadcrumbPage } from './BreadcrumbPage.vue'
-export { default as BreadcrumbSeparator } from './BreadcrumbSeparator.vue'
diff --git a/resources/js/components/ui/button/Button.vue b/resources/js/components/ui/button/Button.vue
deleted file mode 100644
index c6691f6..0000000
--- a/resources/js/components/ui/button/Button.vue
+++ /dev/null
@@ -1,27 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-import { Primitive, type PrimitiveProps } from 'reka-ui'
-import { type ButtonVariants, buttonVariants } from '.'
-
-interface Props extends PrimitiveProps {
-  variant?: ButtonVariants['variant']
-  size?: ButtonVariants['size']
-  class?: HTMLAttributes['class']
-}
-
-const props = withDefaults(defineProps<Props>(), {
-  as: 'button',
-})
-</script>
-
-<template>
-  <Primitive
-    data-slot="button"
-    :as="as"
-    :as-child="asChild"
-    :class="cn(buttonVariants({ variant, size }), props.class)"
-  >
-    <slot />
-  </Primitive>
-</template>
diff --git a/resources/js/components/ui/button/index.ts b/resources/js/components/ui/button/index.ts
deleted file mode 100644
index 616d1d3..0000000
--- a/resources/js/components/ui/button/index.ts
+++ /dev/null
@@ -1,36 +0,0 @@
-import { cva, type VariantProps } from 'class-variance-authority'
-
-export { default as Button } from './Button.vue'
-
-export const buttonVariants = cva(
-  'inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md text-sm font-medium transition-all disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg:not([class*=\'size-\'])]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive',
-  {
-    variants: {
-      variant: {
-        default:
-          'bg-primary text-primary-foreground shadow-xs hover:bg-primary/90',
-        destructive:
-          'bg-destructive text-white shadow-xs hover:bg-destructive/90 focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 dark:bg-destructive/60',
-        outline:
-          'border bg-background shadow-xs hover:bg-accent hover:text-accent-foreground dark:bg-input/30 dark:border-input dark:hover:bg-input/50',
-        secondary:
-          'bg-secondary text-secondary-foreground shadow-xs hover:bg-secondary/80',
-        ghost:
-          'hover:bg-accent hover:text-accent-foreground dark:hover:bg-accent/50',
-        link: 'text-primary underline-offset-4 hover:underline',
-      },
-      size: {
-        default: 'h-9 px-4 py-2 has-[>svg]:px-3',
-        sm: 'h-8 rounded-md gap-1.5 px-3 has-[>svg]:px-2.5',
-        lg: 'h-10 rounded-md px-6 has-[>svg]:px-4',
-        icon: 'size-9',
-      },
-    },
-    defaultVariants: {
-      variant: 'default',
-      size: 'default',
-    },
-  },
-)
-
-export type ButtonVariants = VariantProps<typeof buttonVariants>
diff --git a/resources/js/components/ui/card/Card.vue b/resources/js/components/ui/card/Card.vue
deleted file mode 100644
index 9154a6a..0000000
--- a/resources/js/components/ui/card/Card.vue
+++ /dev/null
@@ -1,22 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-
-const props = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
-</script>
-
-<template>
-  <div
-    data-slot="card"
-    :class="
-      cn(
-        'bg-card text-card-foreground flex flex-col gap-6 rounded-xl border py-6 shadow-sm',
-        props.class,
-      )
-    "
-  >
-    <slot />
-  </div>
-</template>
diff --git a/resources/js/components/ui/card/CardAction.vue b/resources/js/components/ui/card/CardAction.vue
deleted file mode 100644
index c2beb20..0000000
--- a/resources/js/components/ui/card/CardAction.vue
+++ /dev/null
@@ -1,17 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-
-const props = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
-</script>
-
-<template>
-  <div
-    data-slot="card-action"
-    :class="cn('col-start-2 row-span-2 row-start-1 self-start justify-self-end', props.class)"
-  >
-    <slot />
-  </div>
-</template>
diff --git a/resources/js/components/ui/card/CardContent.vue b/resources/js/components/ui/card/CardContent.vue
deleted file mode 100644
index 6bff4bc..0000000
--- a/resources/js/components/ui/card/CardContent.vue
+++ /dev/null
@@ -1,17 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-
-const props = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
-</script>
-
-<template>
-  <div
-    data-slot="card-content"
-    :class="cn('px-6', props.class)"
-  >
-    <slot />
-  </div>
-</template>
diff --git a/resources/js/components/ui/card/CardDescription.vue b/resources/js/components/ui/card/CardDescription.vue
deleted file mode 100644
index 2a0a755..0000000
--- a/resources/js/components/ui/card/CardDescription.vue
+++ /dev/null
@@ -1,17 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-
-const props = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
-</script>
-
-<template>
-  <p
-    data-slot="card-description"
-    :class="cn('text-muted-foreground text-sm', props.class)"
-  >
-    <slot />
-  </p>
-</template>
diff --git a/resources/js/components/ui/card/CardFooter.vue b/resources/js/components/ui/card/CardFooter.vue
deleted file mode 100644
index 1f3648d..0000000
--- a/resources/js/components/ui/card/CardFooter.vue
+++ /dev/null
@@ -1,17 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-
-const props = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
-</script>
-
-<template>
-  <div
-    data-slot="card-footer"
-    :class="cn('flex items-center px-6 [.border-t]:pt-6', props.class)"
-  >
-    <slot />
-  </div>
-</template>
diff --git a/resources/js/components/ui/card/CardHeader.vue b/resources/js/components/ui/card/CardHeader.vue
deleted file mode 100644
index f693a6c..0000000
--- a/resources/js/components/ui/card/CardHeader.vue
+++ /dev/null
@@ -1,17 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-
-const props = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
-</script>
-
-<template>
-  <div
-    data-slot="card-header"
-    :class="cn('@container/card-header grid auto-rows-min grid-rows-[auto_auto] items-start gap-1.5 px-6 has-data-[slot=card-action]:grid-cols-[1fr_auto] [.border-b]:pb-6', props.class)"
-  >
-    <slot />
-  </div>
-</template>
diff --git a/resources/js/components/ui/card/CardTitle.vue b/resources/js/components/ui/card/CardTitle.vue
deleted file mode 100644
index caa7e06..0000000
--- a/resources/js/components/ui/card/CardTitle.vue
+++ /dev/null
@@ -1,17 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-
-const props = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
-</script>
-
-<template>
-  <h3
-    data-slot="card-title"
-    :class="cn('leading-none font-semibold', props.class)"
-  >
-    <slot />
-  </h3>
-</template>
diff --git a/resources/js/components/ui/card/index.ts b/resources/js/components/ui/card/index.ts
deleted file mode 100644
index 73d985f..0000000
--- a/resources/js/components/ui/card/index.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-export { default as Card } from './Card.vue'
-export { default as CardAction } from './CardAction.vue'
-export { default as CardContent } from './CardContent.vue'
-export { default as CardDescription } from './CardDescription.vue'
-export { default as CardFooter } from './CardFooter.vue'
-export { default as CardHeader } from './CardHeader.vue'
-export { default as CardTitle } from './CardTitle.vue'
diff --git a/resources/js/components/ui/checkbox/Checkbox.vue b/resources/js/components/ui/checkbox/Checkbox.vue
deleted file mode 100644
index d43b7a4..0000000
--- a/resources/js/components/ui/checkbox/Checkbox.vue
+++ /dev/null
@@ -1,37 +0,0 @@
-<script setup lang="ts">
-import type { CheckboxRootEmits, CheckboxRootProps } from 'reka-ui'
-import { cn } from '@/lib/utils'
-import { Check } from 'lucide-vue-next'
-import { CheckboxIndicator, CheckboxRoot, useForwardPropsEmits } from 'reka-ui'
-import { computed, type HTMLAttributes } from 'vue'
-
-const props = defineProps<CheckboxRootProps & { class?: HTMLAttributes['class'] }>()
-const emits = defineEmits<CheckboxRootEmits>()
-
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props
-
-  return delegated
-})
-
-const forwarded = useForwardPropsEmits(delegatedProps, emits)
-</script>
-
-<template>
-  <CheckboxRoot
-    data-slot="checkbox"
-    v-bind="forwarded"
-    :class="
-      cn('peer border-input data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground data-[state=checked]:border-primary focus-visible:border-ring focus-visible:ring-ring/50 aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive size-4 shrink-0 rounded-[4px] border shadow-xs transition-shadow outline-none focus-visible:ring-[3px] disabled:cursor-not-allowed disabled:opacity-50',
-         props.class)"
-  >
-    <CheckboxIndicator
-      data-slot="checkbox-indicator"
-      class="flex items-center justify-center text-current transition-none"
-    >
-      <slot>
-        <Check class="size-3.5" />
-      </slot>
-    </CheckboxIndicator>
-  </CheckboxRoot>
-</template>
diff --git a/resources/js/components/ui/checkbox/index.ts b/resources/js/components/ui/checkbox/index.ts
deleted file mode 100644
index 8c28c28..0000000
--- a/resources/js/components/ui/checkbox/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { default as Checkbox } from './Checkbox.vue'
diff --git a/resources/js/components/ui/collapsible/Collapsible.vue b/resources/js/components/ui/collapsible/Collapsible.vue
deleted file mode 100644
index dcd58e2..0000000
--- a/resources/js/components/ui/collapsible/Collapsible.vue
+++ /dev/null
@@ -1,19 +0,0 @@
-<script setup lang="ts">
-import type { CollapsibleRootEmits, CollapsibleRootProps } from 'reka-ui'
-import { CollapsibleRoot, useForwardPropsEmits } from 'reka-ui'
-
-const props = defineProps<CollapsibleRootProps>()
-const emits = defineEmits<CollapsibleRootEmits>()
-
-const forwarded = useForwardPropsEmits(props, emits)
-</script>
-
-<template>
-  <CollapsibleRoot
-    v-slot="{ open }"
-    data-slot="collapsible"
-    v-bind="forwarded"
-  >
-    <slot :open="open" />
-  </CollapsibleRoot>
-</template>
diff --git a/resources/js/components/ui/collapsible/CollapsibleContent.vue b/resources/js/components/ui/collapsible/CollapsibleContent.vue
deleted file mode 100644
index 4120d2f..0000000
--- a/resources/js/components/ui/collapsible/CollapsibleContent.vue
+++ /dev/null
@@ -1,14 +0,0 @@
-<script setup lang="ts">
-import { CollapsibleContent, type CollapsibleContentProps } from 'reka-ui'
-
-const props = defineProps<CollapsibleContentProps>()
-</script>
-
-<template>
-  <CollapsibleContent
-    data-slot="collapsible-content"
-    v-bind="props"
-  >
-    <slot />
-  </CollapsibleContent>
-</template>
diff --git a/resources/js/components/ui/collapsible/CollapsibleTrigger.vue b/resources/js/components/ui/collapsible/CollapsibleTrigger.vue
deleted file mode 100644
index be603a4..0000000
--- a/resources/js/components/ui/collapsible/CollapsibleTrigger.vue
+++ /dev/null
@@ -1,14 +0,0 @@
-<script setup lang="ts">
-import { CollapsibleTrigger, type CollapsibleTriggerProps } from 'reka-ui'
-
-const props = defineProps<CollapsibleTriggerProps>()
-</script>
-
-<template>
-  <CollapsibleTrigger
-    data-slot="collapsible-trigger"
-    v-bind="props"
-  >
-    <slot />
-  </CollapsibleTrigger>
-</template>
diff --git a/resources/js/components/ui/collapsible/index.ts b/resources/js/components/ui/collapsible/index.ts
deleted file mode 100644
index abab956..0000000
--- a/resources/js/components/ui/collapsible/index.ts
+++ /dev/null
@@ -1,3 +0,0 @@
-export { default as Collapsible } from './Collapsible.vue'
-export { default as CollapsibleContent } from './CollapsibleContent.vue'
-export { default as CollapsibleTrigger } from './CollapsibleTrigger.vue'
diff --git a/resources/js/components/ui/dialog/Dialog.vue b/resources/js/components/ui/dialog/Dialog.vue
deleted file mode 100644
index bb8bf72..0000000
--- a/resources/js/components/ui/dialog/Dialog.vue
+++ /dev/null
@@ -1,17 +0,0 @@
-<script setup lang="ts">
-import { DialogRoot, type DialogRootEmits, type DialogRootProps, useForwardPropsEmits } from 'reka-ui'
-
-const props = defineProps<DialogRootProps>()
-const emits = defineEmits<DialogRootEmits>()
-
-const forwarded = useForwardPropsEmits(props, emits)
-</script>
-
-<template>
-  <DialogRoot
-    data-slot="dialog"
-    v-bind="forwarded"
-  >
-    <slot />
-  </DialogRoot>
-</template>
diff --git a/resources/js/components/ui/dialog/DialogClose.vue b/resources/js/components/ui/dialog/DialogClose.vue
deleted file mode 100644
index 7574168..0000000
--- a/resources/js/components/ui/dialog/DialogClose.vue
+++ /dev/null
@@ -1,14 +0,0 @@
-<script setup lang="ts">
-import { DialogClose, type DialogCloseProps } from 'reka-ui'
-
-const props = defineProps<DialogCloseProps>()
-</script>
-
-<template>
-  <DialogClose
-    data-slot="dialog-close"
-    v-bind="props"
-  >
-    <slot />
-  </DialogClose>
-</template>
diff --git a/resources/js/components/ui/dialog/DialogContent.vue b/resources/js/components/ui/dialog/DialogContent.vue
deleted file mode 100644
index 1226459..0000000
--- a/resources/js/components/ui/dialog/DialogContent.vue
+++ /dev/null
@@ -1,49 +0,0 @@
-<script setup lang="ts">
-import { cn } from '@/lib/utils'
-import { X } from 'lucide-vue-next'
-import {
-  DialogClose,
-  DialogContent,
-  type DialogContentEmits,
-  type DialogContentProps,
-  DialogPortal,
-  useForwardPropsEmits,
-} from 'reka-ui'
-import { computed, type HTMLAttributes } from 'vue'
-import DialogOverlay from './DialogOverlay.vue'
-
-const props = defineProps<DialogContentProps & { class?: HTMLAttributes['class'] }>()
-const emits = defineEmits<DialogContentEmits>()
-
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props
-
-  return delegated
-})
-
-const forwarded = useForwardPropsEmits(delegatedProps, emits)
-</script>
-
-<template>
-  <DialogPortal>
-    <DialogOverlay />
-    <DialogContent
-      data-slot="dialog-content"
-      v-bind="forwarded"
-      :class="
-        cn(
-          'bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border p-6 shadow-lg duration-200 sm:max-w-lg',
-          props.class,
-        )"
-    >
-      <slot />
-
-      <DialogClose
-        class="ring-offset-background focus:ring-ring data-[state=open]:bg-accent data-[state=open]:text-muted-foreground absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4"
-      >
-        <X />
-        <span class="sr-only">Close</span>
-      </DialogClose>
-    </DialogContent>
-  </DialogPortal>
-</template>
diff --git a/resources/js/components/ui/dialog/DialogDescription.vue b/resources/js/components/ui/dialog/DialogDescription.vue
deleted file mode 100644
index dc5be12..0000000
--- a/resources/js/components/ui/dialog/DialogDescription.vue
+++ /dev/null
@@ -1,25 +0,0 @@
-<script setup lang="ts">
-import { cn } from '@/lib/utils'
-import { DialogDescription, type DialogDescriptionProps, useForwardProps } from 'reka-ui'
-import { computed, type HTMLAttributes } from 'vue'
-
-const props = defineProps<DialogDescriptionProps & { class?: HTMLAttributes['class'] }>()
-
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props
-
-  return delegated
-})
-
-const forwardedProps = useForwardProps(delegatedProps)
-</script>
-
-<template>
-  <DialogDescription
-    data-slot="dialog-description"
-    v-bind="forwardedProps"
-    :class="cn('text-muted-foreground text-sm', props.class)"
-  >
-    <slot />
-  </DialogDescription>
-</template>
diff --git a/resources/js/components/ui/dialog/DialogFooter.vue b/resources/js/components/ui/dialog/DialogFooter.vue
deleted file mode 100644
index c3b4b55..0000000
--- a/resources/js/components/ui/dialog/DialogFooter.vue
+++ /dev/null
@@ -1,15 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-
-const props = defineProps<{ class?: HTMLAttributes['class'] }>()
-</script>
-
-<template>
-  <div
-    data-slot="dialog-footer"
-    :class="cn('flex flex-col-reverse gap-2 sm:flex-row sm:justify-end', props.class)"
-  >
-    <slot />
-  </div>
-</template>
diff --git a/resources/js/components/ui/dialog/DialogHeader.vue b/resources/js/components/ui/dialog/DialogHeader.vue
deleted file mode 100644
index 0fc2f5f..0000000
--- a/resources/js/components/ui/dialog/DialogHeader.vue
+++ /dev/null
@@ -1,17 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-
-const props = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
-</script>
-
-<template>
-  <div
-    data-slot="dialog-header"
-    :class="cn('flex flex-col gap-2 text-center sm:text-left', props.class)"
-  >
-    <slot />
-  </div>
-</template>
diff --git a/resources/js/components/ui/dialog/DialogOverlay.vue b/resources/js/components/ui/dialog/DialogOverlay.vue
deleted file mode 100644
index da8d0b4..0000000
--- a/resources/js/components/ui/dialog/DialogOverlay.vue
+++ /dev/null
@@ -1,23 +0,0 @@
-<script setup lang="ts">
-import { cn } from '@/lib/utils'
-import { DialogOverlay, type DialogOverlayProps } from 'reka-ui'
-import { computed, type HTMLAttributes } from 'vue'
-
-const props = defineProps<DialogOverlayProps & { class?: HTMLAttributes['class'] }>()
-
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props
-
-  return delegated
-})
-</script>
-
-<template>
-  <DialogOverlay
-    data-slot="dialog-overlay"
-    v-bind="delegatedProps"
-    :class="cn('data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/80', props.class)"
-  >
-    <slot />
-  </DialogOverlay>
-</template>
diff --git a/resources/js/components/ui/dialog/DialogScrollContent.vue b/resources/js/components/ui/dialog/DialogScrollContent.vue
deleted file mode 100644
index 017cbd2..0000000
--- a/resources/js/components/ui/dialog/DialogScrollContent.vue
+++ /dev/null
@@ -1,59 +0,0 @@
-<script setup lang="ts">
-import { cn } from '@/lib/utils'
-import { X } from 'lucide-vue-next'
-import {
-  DialogClose,
-  DialogContent,
-  type DialogContentEmits,
-  type DialogContentProps,
-  DialogOverlay,
-  DialogPortal,
-  useForwardPropsEmits,
-} from 'reka-ui'
-import { computed, type HTMLAttributes } from 'vue'
-
-const props = defineProps<DialogContentProps & { class?: HTMLAttributes['class'] }>()
-const emits = defineEmits<DialogContentEmits>()
-
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props
-
-  return delegated
-})
-
-const forwarded = useForwardPropsEmits(delegatedProps, emits)
-</script>
-
-<template>
-  <DialogPortal>
-    <DialogOverlay
-      class="fixed inset-0 z-50 grid place-items-center overflow-y-auto bg-black/80  data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0"
-    >
-      <DialogContent
-        :class="
-          cn(
-            'relative z-50 grid w-full max-w-lg my-8 gap-4 border border-border bg-background p-6 shadow-lg duration-200 sm:rounded-lg md:w-full',
-            props.class,
-          )
-        "
-        v-bind="forwarded"
-        @pointer-down-outside="(event) => {
-          const originalEvent = event.detail.originalEvent;
-          const target = originalEvent.target as HTMLElement;
-          if (originalEvent.offsetX > target.clientWidth || originalEvent.offsetY > target.clientHeight) {
-            event.preventDefault();
-          }
-        }"
-      >
-        <slot />
-
-        <DialogClose
-          class="absolute top-4 right-4 p-0.5 transition-colors rounded-md hover:bg-secondary"
-        >
-          <X class="w-4 h-4" />
-          <span class="sr-only">Close</span>
-        </DialogClose>
-      </DialogContent>
-    </DialogOverlay>
-  </DialogPortal>
-</template>
diff --git a/resources/js/components/ui/dialog/DialogTitle.vue b/resources/js/components/ui/dialog/DialogTitle.vue
deleted file mode 100644
index bf5b47a..0000000
--- a/resources/js/components/ui/dialog/DialogTitle.vue
+++ /dev/null
@@ -1,25 +0,0 @@
-<script setup lang="ts">
-import { cn } from '@/lib/utils'
-import { DialogTitle, type DialogTitleProps, useForwardProps } from 'reka-ui'
-import { computed, type HTMLAttributes } from 'vue'
-
-const props = defineProps<DialogTitleProps & { class?: HTMLAttributes['class'] }>()
-
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props
-
-  return delegated
-})
-
-const forwardedProps = useForwardProps(delegatedProps)
-</script>
-
-<template>
-  <DialogTitle
-    data-slot="dialog-title"
-    v-bind="forwardedProps"
-    :class="cn('text-lg leading-none font-semibold', props.class)"
-  >
-    <slot />
-  </DialogTitle>
-</template>
diff --git a/resources/js/components/ui/dialog/DialogTrigger.vue b/resources/js/components/ui/dialog/DialogTrigger.vue
deleted file mode 100644
index a870f66..0000000
--- a/resources/js/components/ui/dialog/DialogTrigger.vue
+++ /dev/null
@@ -1,14 +0,0 @@
-<script setup lang="ts">
-import { DialogTrigger, type DialogTriggerProps } from 'reka-ui'
-
-const props = defineProps<DialogTriggerProps>()
-</script>
-
-<template>
-  <DialogTrigger
-    data-slot="dialog-trigger"
-    v-bind="props"
-  >
-    <slot />
-  </DialogTrigger>
-</template>
diff --git a/resources/js/components/ui/dialog/index.ts b/resources/js/components/ui/dialog/index.ts
deleted file mode 100644
index baa7d61..0000000
--- a/resources/js/components/ui/dialog/index.ts
+++ /dev/null
@@ -1,10 +0,0 @@
-export { default as Dialog } from './Dialog.vue'
-export { default as DialogClose } from './DialogClose.vue'
-export { default as DialogContent } from './DialogContent.vue'
-export { default as DialogDescription } from './DialogDescription.vue'
-export { default as DialogFooter } from './DialogFooter.vue'
-export { default as DialogHeader } from './DialogHeader.vue'
-export { default as DialogOverlay } from './DialogOverlay.vue'
-export { default as DialogScrollContent } from './DialogScrollContent.vue'
-export { default as DialogTitle } from './DialogTitle.vue'
-export { default as DialogTrigger } from './DialogTrigger.vue'
diff --git a/resources/js/components/ui/dropdown-menu/DropdownMenu.vue b/resources/js/components/ui/dropdown-menu/DropdownMenu.vue
deleted file mode 100644
index e386052..0000000
--- a/resources/js/components/ui/dropdown-menu/DropdownMenu.vue
+++ /dev/null
@@ -1,17 +0,0 @@
-<script setup lang="ts">
-import { DropdownMenuRoot, type DropdownMenuRootEmits, type DropdownMenuRootProps, useForwardPropsEmits } from 'reka-ui'
-
-const props = defineProps<DropdownMenuRootProps>()
-const emits = defineEmits<DropdownMenuRootEmits>()
-
-const forwarded = useForwardPropsEmits(props, emits)
-</script>
-
-<template>
-  <DropdownMenuRoot
-    data-slot="dropdown-menu"
-    v-bind="forwarded"
-  >
-    <slot />
-  </DropdownMenuRoot>
-</template>
diff --git a/resources/js/components/ui/dropdown-menu/DropdownMenuCheckboxItem.vue b/resources/js/components/ui/dropdown-menu/DropdownMenuCheckboxItem.vue
deleted file mode 100644
index 09b6da3..0000000
--- a/resources/js/components/ui/dropdown-menu/DropdownMenuCheckboxItem.vue
+++ /dev/null
@@ -1,41 +0,0 @@
-<script setup lang="ts">
-import { cn } from '@/lib/utils'
-import { Check } from 'lucide-vue-next'
-import {
-  DropdownMenuCheckboxItem,
-  type DropdownMenuCheckboxItemEmits,
-  type DropdownMenuCheckboxItemProps,
-  DropdownMenuItemIndicator,
-  useForwardPropsEmits,
-} from 'reka-ui'
-import { computed, type HTMLAttributes } from 'vue'
-
-const props = defineProps<DropdownMenuCheckboxItemProps & { class?: HTMLAttributes['class'] }>()
-const emits = defineEmits<DropdownMenuCheckboxItemEmits>()
-
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props
-
-  return delegated
-})
-
-const forwarded = useForwardPropsEmits(delegatedProps, emits)
-</script>
-
-<template>
-  <DropdownMenuCheckboxItem
-    data-slot="dropdown-menu-checkbox-item"
-    v-bind="forwarded"
-    :class=" cn(
-      `focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4`,
-      props.class,
-    )"
-  >
-    <span class="pointer-events-none absolute left-2 flex size-3.5 items-center justify-center">
-      <DropdownMenuItemIndicator>
-        <Check class="size-4" />
-      </DropdownMenuItemIndicator>
-    </span>
-    <slot />
-  </DropdownMenuCheckboxItem>
-</template>
diff --git a/resources/js/components/ui/dropdown-menu/DropdownMenuContent.vue b/resources/js/components/ui/dropdown-menu/DropdownMenuContent.vue
deleted file mode 100644
index a4d4c15..0000000
--- a/resources/js/components/ui/dropdown-menu/DropdownMenuContent.vue
+++ /dev/null
@@ -1,39 +0,0 @@
-<script setup lang="ts">
-import { cn } from '@/lib/utils'
-import {
-  DropdownMenuContent,
-  type DropdownMenuContentEmits,
-  type DropdownMenuContentProps,
-  DropdownMenuPortal,
-  useForwardPropsEmits,
-} from 'reka-ui'
-import { computed, type HTMLAttributes } from 'vue'
-
-const props = withDefaults(
-  defineProps<DropdownMenuContentProps & { class?: HTMLAttributes['class'] }>(),
-  {
-    sideOffset: 4,
-  },
-)
-const emits = defineEmits<DropdownMenuContentEmits>()
-
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props
-
-  return delegated
-})
-
-const forwarded = useForwardPropsEmits(delegatedProps, emits)
-</script>
-
-<template>
-  <DropdownMenuPortal>
-    <DropdownMenuContent
-      data-slot="dropdown-menu-content"
-      v-bind="forwarded"
-      :class="cn('bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 max-h-(--reka-dropdown-menu-content-available-height) min-w-[8rem] origin-(--reka-dropdown-menu-content-transform-origin) overflow-x-hidden overflow-y-auto rounded-md border p-1 shadow-md', props.class)"
-    >
-      <slot />
-    </DropdownMenuContent>
-  </DropdownMenuPortal>
-</template>
diff --git a/resources/js/components/ui/dropdown-menu/DropdownMenuGroup.vue b/resources/js/components/ui/dropdown-menu/DropdownMenuGroup.vue
deleted file mode 100644
index c7eb308..0000000
--- a/resources/js/components/ui/dropdown-menu/DropdownMenuGroup.vue
+++ /dev/null
@@ -1,14 +0,0 @@
-<script setup lang="ts">
-import { DropdownMenuGroup, type DropdownMenuGroupProps } from 'reka-ui'
-
-const props = defineProps<DropdownMenuGroupProps>()
-</script>
-
-<template>
-  <DropdownMenuGroup
-    data-slot="dropdown-menu-group"
-    v-bind="props"
-  >
-    <slot />
-  </DropdownMenuGroup>
-</template>
diff --git a/resources/js/components/ui/dropdown-menu/DropdownMenuItem.vue b/resources/js/components/ui/dropdown-menu/DropdownMenuItem.vue
deleted file mode 100644
index 76299c6..0000000
--- a/resources/js/components/ui/dropdown-menu/DropdownMenuItem.vue
+++ /dev/null
@@ -1,30 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-import { reactiveOmit } from '@vueuse/core'
-import { DropdownMenuItem, type DropdownMenuItemProps, useForwardProps } from 'reka-ui'
-
-const props = withDefaults(defineProps<DropdownMenuItemProps & {
-  class?: HTMLAttributes['class']
-  inset?: boolean
-  variant?: 'default' | 'destructive'
-}>(), {
-  variant: 'default',
-})
-
-const delegatedProps = reactiveOmit(props, 'inset', 'variant')
-
-const forwardedProps = useForwardProps(delegatedProps)
-</script>
-
-<template>
-  <DropdownMenuItem
-    data-slot="dropdown-menu-item"
-    :data-inset="inset ? '' : undefined"
-    :data-variant="variant"
-    v-bind="forwardedProps"
-    :class="cn(`focus:bg-accent focus:text-accent-foreground data-[variant=destructive]:text-destructive-foreground data-[variant=destructive]:focus:bg-destructive/10 dark:data-[variant=destructive]:focus:bg-destructive/40 data-[variant=destructive]:focus:text-destructive-foreground data-[variant=destructive]:*:[svg]:!text-destructive-foreground [&_svg:not([class*='text-'])]:text-muted-foreground relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 data-[inset]:pl-8 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4`, props.class)"
-  >
-    <slot />
-  </DropdownMenuItem>
-</template>
diff --git a/resources/js/components/ui/dropdown-menu/DropdownMenuLabel.vue b/resources/js/components/ui/dropdown-menu/DropdownMenuLabel.vue
deleted file mode 100644
index 50987ab..0000000
--- a/resources/js/components/ui/dropdown-menu/DropdownMenuLabel.vue
+++ /dev/null
@@ -1,22 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-import { reactiveOmit } from '@vueuse/core'
-import { DropdownMenuLabel, type DropdownMenuLabelProps, useForwardProps } from 'reka-ui'
-
-const props = defineProps<DropdownMenuLabelProps & { class?: HTMLAttributes['class'], inset?: boolean }>()
-
-const delegatedProps = reactiveOmit(props, 'class', 'inset')
-const forwardedProps = useForwardProps(delegatedProps)
-</script>
-
-<template>
-  <DropdownMenuLabel
-    data-slot="dropdown-menu-label"
-    :data-inset="inset ? '' : undefined"
-    v-bind="forwardedProps"
-    :class="cn('px-2 py-1.5 text-sm font-medium data-[inset]:pl-8', props.class)"
-  >
-    <slot />
-  </DropdownMenuLabel>
-</template>
diff --git a/resources/js/components/ui/dropdown-menu/DropdownMenuRadioGroup.vue b/resources/js/components/ui/dropdown-menu/DropdownMenuRadioGroup.vue
deleted file mode 100644
index d205d0b..0000000
--- a/resources/js/components/ui/dropdown-menu/DropdownMenuRadioGroup.vue
+++ /dev/null
@@ -1,22 +0,0 @@
-<script setup lang="ts">
-import {
-  DropdownMenuRadioGroup,
-  type DropdownMenuRadioGroupEmits,
-  type DropdownMenuRadioGroupProps,
-  useForwardPropsEmits,
-} from 'reka-ui'
-
-const props = defineProps<DropdownMenuRadioGroupProps>()
-const emits = defineEmits<DropdownMenuRadioGroupEmits>()
-
-const forwarded = useForwardPropsEmits(props, emits)
-</script>
-
-<template>
-  <DropdownMenuRadioGroup
-    data-slot="dropdown-menu-radio-group"
-    v-bind="forwarded"
-  >
-    <slot />
-  </DropdownMenuRadioGroup>
-</template>
diff --git a/resources/js/components/ui/dropdown-menu/DropdownMenuRadioItem.vue b/resources/js/components/ui/dropdown-menu/DropdownMenuRadioItem.vue
deleted file mode 100644
index d2a0e86..0000000
--- a/resources/js/components/ui/dropdown-menu/DropdownMenuRadioItem.vue
+++ /dev/null
@@ -1,42 +0,0 @@
-<script setup lang="ts">
-import { cn } from '@/lib/utils'
-import { Circle } from 'lucide-vue-next'
-import {
-  DropdownMenuItemIndicator,
-  DropdownMenuRadioItem,
-  type DropdownMenuRadioItemEmits,
-  type DropdownMenuRadioItemProps,
-  useForwardPropsEmits,
-} from 'reka-ui'
-import { computed, type HTMLAttributes } from 'vue'
-
-const props = defineProps<DropdownMenuRadioItemProps & { class?: HTMLAttributes['class'] }>()
-
-const emits = defineEmits<DropdownMenuRadioItemEmits>()
-
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props
-
-  return delegated
-})
-
-const forwarded = useForwardPropsEmits(delegatedProps, emits)
-</script>
-
-<template>
-  <DropdownMenuRadioItem
-    data-slot="dropdown-menu-radio-item"
-    v-bind="forwarded"
-    :class="cn(
-      `focus:bg-accent focus:text-accent-foreground relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pr-2 pl-8 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4`,
-      props.class,
-    )"
-  >
-    <span class="pointer-events-none absolute left-2 flex size-3.5 items-center justify-center">
-      <DropdownMenuItemIndicator>
-        <Circle class="size-2 fill-current" />
-      </DropdownMenuItemIndicator>
-    </span>
-    <slot />
-  </DropdownMenuRadioItem>
-</template>
diff --git a/resources/js/components/ui/dropdown-menu/DropdownMenuSeparator.vue b/resources/js/components/ui/dropdown-menu/DropdownMenuSeparator.vue
deleted file mode 100644
index a65c50c..0000000
--- a/resources/js/components/ui/dropdown-menu/DropdownMenuSeparator.vue
+++ /dev/null
@@ -1,26 +0,0 @@
-<script setup lang="ts">
-import { cn } from '@/lib/utils'
-import {
-  DropdownMenuSeparator,
-  type DropdownMenuSeparatorProps,
-} from 'reka-ui'
-import { computed, type HTMLAttributes } from 'vue'
-
-const props = defineProps<DropdownMenuSeparatorProps & {
-  class?: HTMLAttributes['class']
-}>()
-
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props
-
-  return delegated
-})
-</script>
-
-<template>
-  <DropdownMenuSeparator
-    data-slot="dropdown-menu-separator"
-    v-bind="delegatedProps"
-    :class="cn('bg-border -mx-1 my-1 h-px', props.class)"
-  />
-</template>
diff --git a/resources/js/components/ui/dropdown-menu/DropdownMenuShortcut.vue b/resources/js/components/ui/dropdown-menu/DropdownMenuShortcut.vue
deleted file mode 100644
index 1bcbb88..0000000
--- a/resources/js/components/ui/dropdown-menu/DropdownMenuShortcut.vue
+++ /dev/null
@@ -1,17 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-
-const props = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
-</script>
-
-<template>
-  <span
-    data-slot="dropdown-menu-shortcut"
-    :class="cn('text-muted-foreground ml-auto text-xs tracking-widest', props.class)"
-  >
-    <slot />
-  </span>
-</template>
diff --git a/resources/js/components/ui/dropdown-menu/DropdownMenuSub.vue b/resources/js/components/ui/dropdown-menu/DropdownMenuSub.vue
deleted file mode 100644
index 7329bca..0000000
--- a/resources/js/components/ui/dropdown-menu/DropdownMenuSub.vue
+++ /dev/null
@@ -1,19 +0,0 @@
-<script setup lang="ts">
-import {
-  DropdownMenuSub,
-  type DropdownMenuSubEmits,
-  type DropdownMenuSubProps,
-  useForwardPropsEmits,
-} from 'reka-ui'
-
-const props = defineProps<DropdownMenuSubProps>()
-const emits = defineEmits<DropdownMenuSubEmits>()
-
-const forwarded = useForwardPropsEmits(props, emits)
-</script>
-
-<template>
-  <DropdownMenuSub data-slot="dropdown-menu-sub" v-bind="forwarded">
-    <slot />
-  </DropdownMenuSub>
-</template>
diff --git a/resources/js/components/ui/dropdown-menu/DropdownMenuSubContent.vue b/resources/js/components/ui/dropdown-menu/DropdownMenuSubContent.vue
deleted file mode 100644
index d199c91..0000000
--- a/resources/js/components/ui/dropdown-menu/DropdownMenuSubContent.vue
+++ /dev/null
@@ -1,31 +0,0 @@
-<script setup lang="ts">
-import { cn } from '@/lib/utils'
-import {
-  DropdownMenuSubContent,
-  type DropdownMenuSubContentEmits,
-  type DropdownMenuSubContentProps,
-  useForwardPropsEmits,
-} from 'reka-ui'
-import { computed, type HTMLAttributes } from 'vue'
-
-const props = defineProps<DropdownMenuSubContentProps & { class?: HTMLAttributes['class'] }>()
-const emits = defineEmits<DropdownMenuSubContentEmits>()
-
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props
-
-  return delegated
-})
-
-const forwarded = useForwardPropsEmits(delegatedProps, emits)
-</script>
-
-<template>
-  <DropdownMenuSubContent
-    data-slot="dropdown-menu-sub-content"
-    v-bind="forwarded"
-    :class="cn('bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[8rem] origin-(--reka-dropdown-menu-content-transform-origin) overflow-hidden rounded-md border p-1 shadow-lg', props.class)"
-  >
-    <slot />
-  </DropdownMenuSubContent>
-</template>
diff --git a/resources/js/components/ui/dropdown-menu/DropdownMenuSubTrigger.vue b/resources/js/components/ui/dropdown-menu/DropdownMenuSubTrigger.vue
deleted file mode 100644
index df93e3d..0000000
--- a/resources/js/components/ui/dropdown-menu/DropdownMenuSubTrigger.vue
+++ /dev/null
@@ -1,30 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-import { reactiveOmit } from '@vueuse/core'
-import { ChevronRight } from 'lucide-vue-next'
-import {
-  DropdownMenuSubTrigger,
-  type DropdownMenuSubTriggerProps,
-  useForwardProps,
-} from 'reka-ui'
-
-const props = defineProps<DropdownMenuSubTriggerProps & { class?: HTMLAttributes['class'], inset?: boolean }>()
-
-const delegatedProps = reactiveOmit(props, 'class', 'inset')
-const forwardedProps = useForwardProps(delegatedProps)
-</script>
-
-<template>
-  <DropdownMenuSubTrigger
-    data-slot="dropdown-menu-sub-trigger"
-    v-bind="forwardedProps"
-    :class="cn(
-      'focus:bg-accent focus:text-accent-foreground data-[state=open]:bg-accent data-[state=open]:text-accent-foreground flex cursor-default items-center rounded-sm px-2 py-1.5 text-sm outline-hidden select-none data-[inset]:pl-8',
-      props.class,
-    )"
-  >
-    <slot />
-    <ChevronRight class="ml-auto size-4" />
-  </DropdownMenuSubTrigger>
-</template>
diff --git a/resources/js/components/ui/dropdown-menu/DropdownMenuTrigger.vue b/resources/js/components/ui/dropdown-menu/DropdownMenuTrigger.vue
deleted file mode 100644
index 7bc7339..0000000
--- a/resources/js/components/ui/dropdown-menu/DropdownMenuTrigger.vue
+++ /dev/null
@@ -1,16 +0,0 @@
-<script setup lang="ts">
-import { DropdownMenuTrigger, type DropdownMenuTriggerProps, useForwardProps } from 'reka-ui'
-
-const props = defineProps<DropdownMenuTriggerProps>()
-
-const forwardedProps = useForwardProps(props)
-</script>
-
-<template>
-  <DropdownMenuTrigger
-    data-slot="dropdown-menu-trigger"
-    v-bind="forwardedProps"
-  >
-    <slot />
-  </DropdownMenuTrigger>
-</template>
diff --git a/resources/js/components/ui/dropdown-menu/index.ts b/resources/js/components/ui/dropdown-menu/index.ts
deleted file mode 100644
index f488d39..0000000
--- a/resources/js/components/ui/dropdown-menu/index.ts
+++ /dev/null
@@ -1,16 +0,0 @@
-export { default as DropdownMenu } from './DropdownMenu.vue'
-
-export { default as DropdownMenuCheckboxItem } from './DropdownMenuCheckboxItem.vue'
-export { default as DropdownMenuContent } from './DropdownMenuContent.vue'
-export { default as DropdownMenuGroup } from './DropdownMenuGroup.vue'
-export { default as DropdownMenuItem } from './DropdownMenuItem.vue'
-export { default as DropdownMenuLabel } from './DropdownMenuLabel.vue'
-export { default as DropdownMenuRadioGroup } from './DropdownMenuRadioGroup.vue'
-export { default as DropdownMenuRadioItem } from './DropdownMenuRadioItem.vue'
-export { default as DropdownMenuSeparator } from './DropdownMenuSeparator.vue'
-export { default as DropdownMenuShortcut } from './DropdownMenuShortcut.vue'
-export { default as DropdownMenuSub } from './DropdownMenuSub.vue'
-export { default as DropdownMenuSubContent } from './DropdownMenuSubContent.vue'
-export { default as DropdownMenuSubTrigger } from './DropdownMenuSubTrigger.vue'
-export { default as DropdownMenuTrigger } from './DropdownMenuTrigger.vue'
-export { DropdownMenuPortal } from 'reka-ui'
diff --git a/resources/js/components/ui/input/Input.vue b/resources/js/components/ui/input/Input.vue
deleted file mode 100644
index 899535e..0000000
--- a/resources/js/components/ui/input/Input.vue
+++ /dev/null
@@ -1,33 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-import { useVModel } from '@vueuse/core'
-
-const props = defineProps<{
-  defaultValue?: string | number
-  modelValue?: string | number
-  class?: HTMLAttributes['class']
-}>()
-
-const emits = defineEmits<{
-  (e: 'update:modelValue', payload: string | number): void
-}>()
-
-const modelValue = useVModel(props, 'modelValue', emits, {
-  passive: true,
-  defaultValue: props.defaultValue,
-})
-</script>
-
-<template>
-  <input
-    v-model="modelValue"
-    data-slot="input"
-    :class="cn(
-      'file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground dark:bg-input/30 border-input flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base shadow-xs transition-[color,box-shadow] outline-none file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm',
-      'focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]',
-      'aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive',
-      props.class,
-    )"
-  >
-</template>
diff --git a/resources/js/components/ui/input/index.ts b/resources/js/components/ui/input/index.ts
deleted file mode 100644
index a691dd6..0000000
--- a/resources/js/components/ui/input/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { default as Input } from './Input.vue'
diff --git a/resources/js/components/ui/label/Label.vue b/resources/js/components/ui/label/Label.vue
deleted file mode 100644
index 33e5c6c..0000000
--- a/resources/js/components/ui/label/Label.vue
+++ /dev/null
@@ -1,28 +0,0 @@
-<script setup lang="ts">
-import { cn } from '@/lib/utils'
-import { Label, type LabelProps } from 'reka-ui'
-import { computed, type HTMLAttributes } from 'vue'
-
-const props = defineProps<LabelProps & { class?: HTMLAttributes['class'] }>()
-
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props
-
-  return delegated
-})
-</script>
-
-<template>
-  <Label
-    data-slot="label"
-    v-bind="delegatedProps"
-    :class="
-      cn(
-        'flex items-center gap-2 text-sm leading-none font-medium select-none group-data-[disabled=true]:pointer-events-none group-data-[disabled=true]:opacity-50 peer-disabled:cursor-not-allowed peer-disabled:opacity-50',
-        props.class,
-      )
-    "
-  >
-    <slot />
-  </Label>
-</template>
diff --git a/resources/js/components/ui/label/index.ts b/resources/js/components/ui/label/index.ts
deleted file mode 100644
index 572c2f0..0000000
--- a/resources/js/components/ui/label/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { default as Label } from './Label.vue'
diff --git a/resources/js/components/ui/navigation-menu/NavigationMenu.vue b/resources/js/components/ui/navigation-menu/NavigationMenu.vue
deleted file mode 100644
index af2c623..0000000
--- a/resources/js/components/ui/navigation-menu/NavigationMenu.vue
+++ /dev/null
@@ -1,35 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-import { reactiveOmit } from '@vueuse/core'
-import {
-  NavigationMenuRoot,
-  type NavigationMenuRootEmits,
-  type NavigationMenuRootProps,
-  useForwardPropsEmits,
-} from 'reka-ui'
-import NavigationMenuViewport from './NavigationMenuViewport.vue'
-
-const props = withDefaults(defineProps<NavigationMenuRootProps & {
-  class?: HTMLAttributes['class']
-  viewport?: boolean
-}>(), {
-  viewport: true,
-})
-const emits = defineEmits<NavigationMenuRootEmits>()
-
-const delegatedProps = reactiveOmit(props, 'class', 'viewport')
-const forwarded = useForwardPropsEmits(delegatedProps, emits)
-</script>
-
-<template>
-  <NavigationMenuRoot
-    data-slot="navigation-menu"
-    :data-viewport="viewport"
-    v-bind="forwarded"
-    :class="cn('group/navigation-menu relative flex max-w-max flex-1 items-center justify-center', props.class)"
-  >
-    <slot />
-    <NavigationMenuViewport v-if="viewport" />
-  </NavigationMenuRoot>
-</template>
diff --git a/resources/js/components/ui/navigation-menu/NavigationMenuContent.vue b/resources/js/components/ui/navigation-menu/NavigationMenuContent.vue
deleted file mode 100644
index 447a523..0000000
--- a/resources/js/components/ui/navigation-menu/NavigationMenuContent.vue
+++ /dev/null
@@ -1,35 +0,0 @@
-<script setup lang="ts">
-import { cn } from '@/lib/utils'
-import {
-  NavigationMenuContent,
-  type NavigationMenuContentEmits,
-  type NavigationMenuContentProps,
-  useForwardPropsEmits,
-} from 'reka-ui'
-import { computed, type HTMLAttributes } from 'vue'
-
-const props = defineProps<NavigationMenuContentProps & { class?: HTMLAttributes['class'] }>()
-const emits = defineEmits<NavigationMenuContentEmits>()
-
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props
-
-  return delegated
-})
-
-const forwarded = useForwardPropsEmits(delegatedProps, emits)
-</script>
-
-<template>
-  <NavigationMenuContent
-    data-slot="navigation-menu-content"
-    v-bind="forwarded"
-    :class="cn(
-      `data-[motion^=from-]:animate-in data-[motion^=to-]:animate-out data-[motion^=from-]:fade-in data-[motion^=to-]:fade-out data-[motion=from-end]:slide-in-from-right-52 data-[motion=from-start]:slide-in-from-left-52 data-[motion=to-end]:slide-out-to-right-52 data-[motion=to-start]:slide-out-to-left-52 top-0 left-0 w-full p-2 pr-2.5 md:absolute md:w-auto`,
-      `group-data-[viewport=false]/navigation-menu:bg-popover group-data-[viewport=false]/navigation-menu:text-popover-foreground group-data-[viewport=false]/navigation-menu:data-[state=open]:animate-in group-data-[viewport=false]/navigation-menu:data-[state=closed]:animate-out group-data-[viewport=false]/navigation-menu:data-[state=closed]:zoom-out-95 group-data-[viewport=false]/navigation-menu:data-[state=open]:zoom-in-95 group-data-[viewport=false]/navigation-menu:data-[state=open]:fade-in-0 group-data-[viewport=false]/navigation-menu:data-[state=closed]:fade-out-0 group-data-[viewport=false]/navigation-menu:top-full group-data-[viewport=false]/navigation-menu:mt-1.5 group-data-[viewport=false]/navigation-menu:overflow-hidden group-data-[viewport=false]/navigation-menu:rounded-md group-data-[viewport=false]/navigation-menu:border group-data-[viewport=false]/navigation-menu:shadow group-data-[viewport=false]/navigation-menu:duration-200 **:data-[slot=navigation-menu-link]:focus:ring-0 **:data-[slot=navigation-menu-link]:focus:outline-none`,
-      props.class,
-    )"
-  >
-    <slot />
-  </NavigationMenuContent>
-</template>
diff --git a/resources/js/components/ui/navigation-menu/NavigationMenuIndicator.vue b/resources/js/components/ui/navigation-menu/NavigationMenuIndicator.vue
deleted file mode 100644
index 9827540..0000000
--- a/resources/js/components/ui/navigation-menu/NavigationMenuIndicator.vue
+++ /dev/null
@@ -1,25 +0,0 @@
-<script setup lang="ts">
-import { cn } from '@/lib/utils'
-import { NavigationMenuIndicator, type NavigationMenuIndicatorProps, useForwardProps } from 'reka-ui'
-import { computed, type HTMLAttributes } from 'vue'
-
-const props = defineProps<NavigationMenuIndicatorProps & { class?: HTMLAttributes['class'] }>()
-
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props
-
-  return delegated
-})
-
-const forwardedProps = useForwardProps(delegatedProps)
-</script>
-
-<template>
-  <NavigationMenuIndicator
-    data-slot="navigation-menu-indicator"
-    v-bind="forwardedProps"
-    :class="cn('data-[state=visible]:animate-in data-[state=hidden]:animate-out data-[state=hidden]:fade-out data-[state=visible]:fade-in top-full z-[1] flex h-1.5 items-end justify-center overflow-hidden', props.class)"
-  >
-    <div class="bg-border relative top-[60%] h-2 w-2 rotate-45 rounded-tl-sm shadow-md" />
-  </NavigationMenuIndicator>
-</template>
diff --git a/resources/js/components/ui/navigation-menu/NavigationMenuItem.vue b/resources/js/components/ui/navigation-menu/NavigationMenuItem.vue
deleted file mode 100644
index 38d0e1c..0000000
--- a/resources/js/components/ui/navigation-menu/NavigationMenuItem.vue
+++ /dev/null
@@ -1,20 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-import { reactiveOmit } from '@vueuse/core'
-import { NavigationMenuItem, type NavigationMenuItemProps } from 'reka-ui'
-
-const props = defineProps<NavigationMenuItemProps & { class?: HTMLAttributes['class'] }>()
-
-const delegatedProps = reactiveOmit(props, 'class')
-</script>
-
-<template>
-  <NavigationMenuItem
-    data-slot="navigation-menu-item"
-    v-bind="delegatedProps"
-    :class="cn('relative', props.class)"
-  >
-    <slot />
-  </NavigationMenuItem>
-</template>
diff --git a/resources/js/components/ui/navigation-menu/NavigationMenuLink.vue b/resources/js/components/ui/navigation-menu/NavigationMenuLink.vue
deleted file mode 100644
index df449cc..0000000
--- a/resources/js/components/ui/navigation-menu/NavigationMenuLink.vue
+++ /dev/null
@@ -1,27 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-import { reactiveOmit } from '@vueuse/core'
-import {
-  NavigationMenuLink,
-  type NavigationMenuLinkEmits,
-  type NavigationMenuLinkProps,
-  useForwardPropsEmits,
-} from 'reka-ui'
-
-const props = defineProps<NavigationMenuLinkProps & { class?: HTMLAttributes['class'] }>()
-const emits = defineEmits<NavigationMenuLinkEmits>()
-
-const delegatedProps = reactiveOmit(props, 'class')
-const forwarded = useForwardPropsEmits(delegatedProps, emits)
-</script>
-
-<template>
-  <NavigationMenuLink
-    data-slot="navigation-menu-link"
-    v-bind="forwarded"
-    :class="cn(`'data-[active=true]:focus:bg-accent data-[active=true]:hover:bg-accent data-[active=true]:bg-accent/50 data-[active=true]:text-accent-foreground hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground ring-ring/10 dark:ring-ring/20 dark:outline-ring/40 outline-ring/50 [&_svg:not([class*='text-'])]:text-muted-foreground flex flex-col gap-1 rounded-sm p-2 text-sm transition-[color,box-shadow] focus-visible:ring-4 focus-visible:outline-1 [&_svg:not([class*='size-'])]:size-4'`, props.class)"
-  >
-    <slot />
-  </NavigationMenuLink>
-</template>
diff --git a/resources/js/components/ui/navigation-menu/NavigationMenuList.vue b/resources/js/components/ui/navigation-menu/NavigationMenuList.vue
deleted file mode 100644
index a88c052..0000000
--- a/resources/js/components/ui/navigation-menu/NavigationMenuList.vue
+++ /dev/null
@@ -1,30 +0,0 @@
-<script setup lang="ts">
-import { cn } from '@/lib/utils'
-import { NavigationMenuList, type NavigationMenuListProps, useForwardProps } from 'reka-ui'
-import { computed, type HTMLAttributes } from 'vue'
-
-const props = defineProps<NavigationMenuListProps & { class?: HTMLAttributes['class'] }>()
-
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props
-
-  return delegated
-})
-
-const forwardedProps = useForwardProps(delegatedProps)
-</script>
-
-<template>
-  <NavigationMenuList
-    data-slot="navigation-menu-list"
-    v-bind="forwardedProps"
-    :class="
-      cn(
-        'group flex flex-1 list-none items-center justify-center gap-1',
-        props.class,
-      )
-    "
-  >
-    <slot />
-  </NavigationMenuList>
-</template>
diff --git a/resources/js/components/ui/navigation-menu/NavigationMenuTrigger.vue b/resources/js/components/ui/navigation-menu/NavigationMenuTrigger.vue
deleted file mode 100644
index c48f660..0000000
--- a/resources/js/components/ui/navigation-menu/NavigationMenuTrigger.vue
+++ /dev/null
@@ -1,35 +0,0 @@
-<script setup lang="ts">
-import { cn } from '@/lib/utils'
-import { ChevronDown } from 'lucide-vue-next'
-import {
-  NavigationMenuTrigger,
-  type NavigationMenuTriggerProps,
-  useForwardProps,
-} from 'reka-ui'
-import { computed, type HTMLAttributes } from 'vue'
-import { navigationMenuTriggerStyle } from '.'
-
-const props = defineProps<NavigationMenuTriggerProps & { class?: HTMLAttributes['class'] }>()
-
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props
-
-  return delegated
-})
-
-const forwardedProps = useForwardProps(delegatedProps)
-</script>
-
-<template>
-  <NavigationMenuTrigger
-    data-slot="navigation-menu-trigger"
-    v-bind="forwardedProps"
-    :class="cn(navigationMenuTriggerStyle(), 'group', props.class)"
-  >
-    <slot />
-    <ChevronDown
-      class="relative top-[1px] ml-1 size-3 transition duration-300 group-data-[state=open]:rotate-180"
-      aria-hidden="true"
-    />
-  </NavigationMenuTrigger>
-</template>
diff --git a/resources/js/components/ui/navigation-menu/NavigationMenuViewport.vue b/resources/js/components/ui/navigation-menu/NavigationMenuViewport.vue
deleted file mode 100644
index d60c128..0000000
--- a/resources/js/components/ui/navigation-menu/NavigationMenuViewport.vue
+++ /dev/null
@@ -1,34 +0,0 @@
-<script setup lang="ts">
-import { cn } from '@/lib/utils'
-import {
-  NavigationMenuViewport,
-  type NavigationMenuViewportProps,
-  useForwardProps,
-} from 'reka-ui'
-import { computed, type HTMLAttributes } from 'vue'
-
-const props = defineProps<NavigationMenuViewportProps & { class?: HTMLAttributes['class'] }>()
-
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props
-
-  return delegated
-})
-
-const forwardedProps = useForwardProps(delegatedProps)
-</script>
-
-<template>
-  <div class="absolute top-full left-0 isolate z-50 flex justify-center">
-    <NavigationMenuViewport
-      data-slot="navigation-menu-viewport"
-      v-bind="forwardedProps"
-      :class="
-        cn(
-          'origin-top-center bg-popover text-popover-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-90 relative mt-1.5 h-[var(--reka-navigation-menu-viewport-height)] w-full overflow-hidden rounded-md border shadow md:w-[var(--reka-navigation-menu-viewport-width)]',
-          props.class,
-        )
-      "
-    />
-  </div>
-</template>
diff --git a/resources/js/components/ui/navigation-menu/index.ts b/resources/js/components/ui/navigation-menu/index.ts
deleted file mode 100644
index 90e0e2d..0000000
--- a/resources/js/components/ui/navigation-menu/index.ts
+++ /dev/null
@@ -1,14 +0,0 @@
-import { cva } from 'class-variance-authority'
-
-export { default as NavigationMenu } from './NavigationMenu.vue'
-export { default as NavigationMenuContent } from './NavigationMenuContent.vue'
-export { default as NavigationMenuIndicator } from './NavigationMenuIndicator.vue'
-export { default as NavigationMenuItem } from './NavigationMenuItem.vue'
-export { default as NavigationMenuLink } from './NavigationMenuLink.vue'
-export { default as NavigationMenuList } from './NavigationMenuList.vue'
-export { default as NavigationMenuTrigger } from './NavigationMenuTrigger.vue'
-export { default as NavigationMenuViewport } from './NavigationMenuViewport.vue'
-
-export const navigationMenuTriggerStyle = cva(
-  'group inline-flex h-9 w-max items-center justify-center rounded-md bg-background px-4 py-2 text-sm font-medium hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground disabled:pointer-events-none disabled:opacity-50 data-[state=open]:hover:bg-accent data-[state=open]:text-accent-foreground data-[state=open]:focus:bg-accent data-[state=open]:bg-accent/50 focus-visible:ring-ring/50 outline-none transition-[color,box-shadow] focus-visible:ring-[3px] focus-visible:outline-1',
-)
diff --git a/resources/js/components/ui/pin-input/PinInput.vue b/resources/js/components/ui/pin-input/PinInput.vue
deleted file mode 100644
index 95fd4d9..0000000
--- a/resources/js/components/ui/pin-input/PinInput.vue
+++ /dev/null
@@ -1,25 +0,0 @@
-<script setup lang="ts" generic="Type extends 'text' | 'number' = 'text'">
-import type { PinInputRootEmits, PinInputRootProps } from "reka-ui"
-import type { HTMLAttributes } from "vue"
-import { reactiveOmit } from "@vueuse/core"
-import { PinInputRoot, useForwardPropsEmits } from "reka-ui"
-import { cn } from "@/lib/utils"
-
-const props = withDefaults(defineProps<PinInputRootProps<Type> & { class?: HTMLAttributes["class"] }>(), {
-  modelValue: () => [],
-})
-const emits = defineEmits<PinInputRootEmits<Type>>()
-
-const delegatedProps = reactiveOmit(props, "class")
-
-const forwarded = useForwardPropsEmits(delegatedProps, emits)
-</script>
-
-<template>
-  <PinInputRoot
-    data-slot="pin-input"
-    v-bind="forwarded" :class="cn('flex items-center gap-2 has-disabled:opacity-50 disabled:cursor-not-allowed', props.class)"
-  >
-    <slot />
-  </PinInputRoot>
-</template>
diff --git a/resources/js/components/ui/pin-input/PinInputGroup.vue b/resources/js/components/ui/pin-input/PinInputGroup.vue
deleted file mode 100644
index f5aff44..0000000
--- a/resources/js/components/ui/pin-input/PinInputGroup.vue
+++ /dev/null
@@ -1,21 +0,0 @@
-<script setup lang="ts">
-import type { PrimitiveProps } from "reka-ui"
-import type { HTMLAttributes } from "vue"
-import { reactiveOmit } from "@vueuse/core"
-import { Primitive, useForwardProps } from "reka-ui"
-import { cn } from "@/lib/utils"
-
-const props = defineProps<PrimitiveProps & { class?: HTMLAttributes["class"] }>()
-const delegatedProps = reactiveOmit(props, "class")
-const forwardedProps = useForwardProps(delegatedProps)
-</script>
-
-<template>
-  <Primitive
-    data-slot="pin-input-group"
-    v-bind="forwardedProps"
-    :class="cn('flex items-center', props.class)"
-  >
-    <slot />
-  </Primitive>
-</template>
diff --git a/resources/js/components/ui/pin-input/PinInputSeparator.vue b/resources/js/components/ui/pin-input/PinInputSeparator.vue
deleted file mode 100644
index 1d46418..0000000
--- a/resources/js/components/ui/pin-input/PinInputSeparator.vue
+++ /dev/null
@@ -1,19 +0,0 @@
-<script setup lang="ts">
-import type { PrimitiveProps } from "reka-ui"
-import { Minus } from "lucide-vue-next"
-import { Primitive, useForwardProps } from "reka-ui"
-
-const props = defineProps<PrimitiveProps>()
-const forwardedProps = useForwardProps(props)
-</script>
-
-<template>
-  <Primitive
-    data-slot="pin-input-separator"
-    v-bind="forwardedProps"
-  >
-    <slot>
-      <Minus />
-    </slot>
-  </Primitive>
-</template>
diff --git a/resources/js/components/ui/pin-input/PinInputSlot.vue b/resources/js/components/ui/pin-input/PinInputSlot.vue
deleted file mode 100644
index c9a3c95..0000000
--- a/resources/js/components/ui/pin-input/PinInputSlot.vue
+++ /dev/null
@@ -1,21 +0,0 @@
-<script setup lang="ts">
-import type { PinInputInputProps } from "reka-ui"
-import type { HTMLAttributes } from "vue"
-import { reactiveOmit } from "@vueuse/core"
-import { PinInputInput, useForwardProps } from "reka-ui"
-import { cn } from "@/lib/utils"
-
-const props = defineProps<PinInputInputProps & { class?: HTMLAttributes["class"] }>()
-
-const delegatedProps = reactiveOmit(props, "class")
-
-const forwardedProps = useForwardProps(delegatedProps)
-</script>
-
-<template>
-  <PinInputInput
-    data-slot="pin-input-slot"
-    v-bind="forwardedProps"
-    :class="cn('border-input focus:border-ring focus:ring-ring/50 focus:aria-invalid:ring-destructive/20 dark:bg-input/30 dark:focus:aria-invalid:ring-destructive/40 aria-invalid:border-destructive focus:aria-invalid:border-destructive relative flex h-9 w-9 items-center justify-center border-y border-r text-sm shadow-xs transition-all outline-none text-center first:rounded-l-md first:border-l last:rounded-r-md focus:z-10 focus:ring-[3px]', props.class)"
-  />
-</template>
diff --git a/resources/js/components/ui/pin-input/index.ts b/resources/js/components/ui/pin-input/index.ts
deleted file mode 100644
index 74faa6c..0000000
--- a/resources/js/components/ui/pin-input/index.ts
+++ /dev/null
@@ -1,4 +0,0 @@
-export { default as PinInput } from "./PinInput.vue"
-export { default as PinInputGroup } from "./PinInputGroup.vue"
-export { default as PinInputSeparator } from "./PinInputSeparator.vue"
-export { default as PinInputSlot } from "./PinInputSlot.vue"
diff --git a/resources/js/components/ui/separator/Separator.vue b/resources/js/components/ui/separator/Separator.vue
deleted file mode 100644
index 9d28574..0000000
--- a/resources/js/components/ui/separator/Separator.vue
+++ /dev/null
@@ -1,28 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-import { reactiveOmit } from '@vueuse/core'
-import { Separator, type SeparatorProps } from 'reka-ui'
-
-const props = withDefaults(defineProps<
-  SeparatorProps & { class?: HTMLAttributes['class'] }
->(), {
-  orientation: 'horizontal',
-  decorative: true,
-})
-
-const delegatedProps = reactiveOmit(props, 'class')
-</script>
-
-<template>
-  <Separator
-    data-slot="separator-root"
-    v-bind="delegatedProps"
-    :class="
-      cn(
-        `bg-border shrink-0 data-[orientation=horizontal]:h-px data-[orientation=horizontal]:w-full data-[orientation=vertical]:h-full data-[orientation=vertical]:w-px`,
-        props.class,
-      )
-    "
-  />
-</template>
diff --git a/resources/js/components/ui/separator/index.ts b/resources/js/components/ui/separator/index.ts
deleted file mode 100644
index 2287bcb..0000000
--- a/resources/js/components/ui/separator/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { default as Separator } from './Separator.vue'
diff --git a/resources/js/components/ui/sheet/Sheet.vue b/resources/js/components/ui/sheet/Sheet.vue
deleted file mode 100644
index e2a3374..0000000
--- a/resources/js/components/ui/sheet/Sheet.vue
+++ /dev/null
@@ -1,17 +0,0 @@
-<script setup lang="ts">
-import { DialogRoot, type DialogRootEmits, type DialogRootProps, useForwardPropsEmits } from 'reka-ui'
-
-const props = defineProps<DialogRootProps>()
-const emits = defineEmits<DialogRootEmits>()
-
-const forwarded = useForwardPropsEmits(props, emits)
-</script>
-
-<template>
-  <DialogRoot
-    data-slot="sheet"
-    v-bind="forwarded"
-  >
-    <slot />
-  </DialogRoot>
-</template>
diff --git a/resources/js/components/ui/sheet/SheetClose.vue b/resources/js/components/ui/sheet/SheetClose.vue
deleted file mode 100644
index 05077ea..0000000
--- a/resources/js/components/ui/sheet/SheetClose.vue
+++ /dev/null
@@ -1,14 +0,0 @@
-<script setup lang="ts">
-import { DialogClose, type DialogCloseProps } from 'reka-ui'
-
-const props = defineProps<DialogCloseProps>()
-</script>
-
-<template>
-  <DialogClose
-    data-slot="sheet-close"
-    v-bind="props"
-  >
-    <slot />
-  </DialogClose>
-</template>
diff --git a/resources/js/components/ui/sheet/SheetContent.vue b/resources/js/components/ui/sheet/SheetContent.vue
deleted file mode 100644
index 98d4bf5..0000000
--- a/resources/js/components/ui/sheet/SheetContent.vue
+++ /dev/null
@@ -1,63 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-import { reactiveOmit } from '@vueuse/core'
-import { X } from 'lucide-vue-next'
-import {
-  DialogClose,
-  DialogContent,
-  type DialogContentEmits,
-  type DialogContentProps,
-  DialogPortal,
-  useForwardPropsEmits,
-} from 'reka-ui'
-import SheetOverlay from './SheetOverlay.vue'
-
-interface SheetContentProps extends DialogContentProps {
-  class?: HTMLAttributes['class']
-  side?: 'top' | 'right' | 'bottom' | 'left'
-}
-
-defineOptions({
-  inheritAttrs: false,
-})
-
-const props = withDefaults(defineProps<SheetContentProps>(), {
-  side: 'right',
-})
-const emits = defineEmits<DialogContentEmits>()
-
-const delegatedProps = reactiveOmit(props, 'class', 'side')
-
-const forwarded = useForwardPropsEmits(delegatedProps, emits)
-</script>
-
-<template>
-  <DialogPortal>
-    <SheetOverlay />
-    <DialogContent
-      data-slot="sheet-content"
-      :class="cn(
-        'bg-background data-[state=open]:animate-in data-[state=closed]:animate-out fixed z-50 flex flex-col gap-4 shadow-lg transition ease-in-out data-[state=closed]:duration-300 data-[state=open]:duration-500',
-        side === 'right'
-          && 'data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right inset-y-0 right-0 h-full w-3/4 border-l sm:max-w-sm',
-        side === 'left'
-          && 'data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left inset-y-0 left-0 h-full w-3/4 border-r sm:max-w-sm',
-        side === 'top'
-          && 'data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top inset-x-0 top-0 h-auto border-b',
-        side === 'bottom'
-          && 'data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom inset-x-0 bottom-0 h-auto border-t',
-        props.class)"
-      v-bind="{ ...forwarded, ...$attrs }"
-    >
-      <slot />
-
-      <DialogClose
-        class="ring-offset-background focus:ring-ring data-[state=open]:bg-secondary absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none"
-      >
-        <X class="size-4" />
-        <span class="sr-only">Close</span>
-      </DialogClose>
-    </DialogContent>
-  </DialogPortal>
-</template>
diff --git a/resources/js/components/ui/sheet/SheetDescription.vue b/resources/js/components/ui/sheet/SheetDescription.vue
deleted file mode 100644
index bf9e277..0000000
--- a/resources/js/components/ui/sheet/SheetDescription.vue
+++ /dev/null
@@ -1,23 +0,0 @@
-<script setup lang="ts">
-import { cn } from '@/lib/utils'
-import { DialogDescription, type DialogDescriptionProps } from 'reka-ui'
-import { computed, type HTMLAttributes } from 'vue'
-
-const props = defineProps<DialogDescriptionProps & { class?: HTMLAttributes['class'] }>()
-
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props
-
-  return delegated
-})
-</script>
-
-<template>
-  <DialogDescription
-    data-slot="sheet-description"
-    :class="cn('text-muted-foreground text-sm', props.class)"
-    v-bind="delegatedProps"
-  >
-    <slot />
-  </DialogDescription>
-</template>
diff --git a/resources/js/components/ui/sheet/SheetFooter.vue b/resources/js/components/ui/sheet/SheetFooter.vue
deleted file mode 100644
index d2ac823..0000000
--- a/resources/js/components/ui/sheet/SheetFooter.vue
+++ /dev/null
@@ -1,16 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-
-const props = defineProps<{ class?: HTMLAttributes['class'] }>()
-</script>
-
-<template>
-  <div
-    data-slot="sheet-footer"
-    :class="cn('mt-auto flex flex-col gap-2 p-4', props.class)
-    "
-  >
-    <slot />
-  </div>
-</template>
diff --git a/resources/js/components/ui/sheet/SheetHeader.vue b/resources/js/components/ui/sheet/SheetHeader.vue
deleted file mode 100644
index ab20557..0000000
--- a/resources/js/components/ui/sheet/SheetHeader.vue
+++ /dev/null
@@ -1,15 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-
-const props = defineProps<{ class?: HTMLAttributes['class'] }>()
-</script>
-
-<template>
-  <div
-    data-slot="sheet-header"
-    :class="cn('flex flex-col gap-1.5 p-4', props.class)"
-  >
-    <slot />
-  </div>
-</template>
diff --git a/resources/js/components/ui/sheet/SheetOverlay.vue b/resources/js/components/ui/sheet/SheetOverlay.vue
deleted file mode 100644
index 61fd8db..0000000
--- a/resources/js/components/ui/sheet/SheetOverlay.vue
+++ /dev/null
@@ -1,23 +0,0 @@
-<script setup lang="ts">
-import { cn } from '@/lib/utils'
-import { DialogOverlay, type DialogOverlayProps } from 'reka-ui'
-import { computed, type HTMLAttributes } from 'vue'
-
-const props = defineProps<DialogOverlayProps & { class?: HTMLAttributes['class'] }>()
-
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props
-
-  return delegated
-})
-</script>
-
-<template>
-  <DialogOverlay
-    data-slot="sheet-overlay"
-    :class="cn('data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/80', props.class)"
-    v-bind="delegatedProps"
-  >
-    <slot />
-  </DialogOverlay>
-</template>
diff --git a/resources/js/components/ui/sheet/SheetTitle.vue b/resources/js/components/ui/sheet/SheetTitle.vue
deleted file mode 100644
index dc694b8..0000000
--- a/resources/js/components/ui/sheet/SheetTitle.vue
+++ /dev/null
@@ -1,23 +0,0 @@
-<script setup lang="ts">
-import { cn } from '@/lib/utils'
-import { DialogTitle, type DialogTitleProps } from 'reka-ui'
-import { computed, type HTMLAttributes } from 'vue'
-
-const props = defineProps<DialogTitleProps & { class?: HTMLAttributes['class'] }>()
-
-const delegatedProps = computed(() => {
-  const { class: _, ...delegated } = props
-
-  return delegated
-})
-</script>
-
-<template>
-  <DialogTitle
-    data-slot="sheet-title"
-    :class="cn('text-foreground font-semibold', props.class)"
-    v-bind="delegatedProps"
-  >
-    <slot />
-  </DialogTitle>
-</template>
diff --git a/resources/js/components/ui/sheet/SheetTrigger.vue b/resources/js/components/ui/sheet/SheetTrigger.vue
deleted file mode 100644
index 5981f8e..0000000
--- a/resources/js/components/ui/sheet/SheetTrigger.vue
+++ /dev/null
@@ -1,14 +0,0 @@
-<script setup lang="ts">
-import { DialogTrigger, type DialogTriggerProps } from 'reka-ui'
-
-const props = defineProps<DialogTriggerProps>()
-</script>
-
-<template>
-  <DialogTrigger
-    data-slot="sheet-trigger"
-    v-bind="props"
-  >
-    <slot />
-  </DialogTrigger>
-</template>
diff --git a/resources/js/components/ui/sheet/index.ts b/resources/js/components/ui/sheet/index.ts
deleted file mode 100644
index ee33431..0000000
--- a/resources/js/components/ui/sheet/index.ts
+++ /dev/null
@@ -1,8 +0,0 @@
-export { default as Sheet } from './Sheet.vue'
-export { default as SheetClose } from './SheetClose.vue'
-export { default as SheetContent } from './SheetContent.vue'
-export { default as SheetDescription } from './SheetDescription.vue'
-export { default as SheetFooter } from './SheetFooter.vue'
-export { default as SheetHeader } from './SheetHeader.vue'
-export { default as SheetTitle } from './SheetTitle.vue'
-export { default as SheetTrigger } from './SheetTrigger.vue'
diff --git a/resources/js/components/ui/sidebar/Sidebar.vue b/resources/js/components/ui/sidebar/Sidebar.vue
deleted file mode 100644
index c75db5d..0000000
--- a/resources/js/components/ui/sidebar/Sidebar.vue
+++ /dev/null
@@ -1,96 +0,0 @@
-<script setup lang="ts">
-import type { SidebarProps } from '.'
-import { cn } from '@/lib/utils'
-import { Sheet, SheetContent } from '@/components/ui/sheet'
-import SheetDescription from '@/components/ui/sheet/SheetDescription.vue'
-import SheetHeader from '@/components/ui/sheet/SheetHeader.vue'
-import SheetTitle from '@/components/ui/sheet/SheetTitle.vue'
-import { SIDEBAR_WIDTH_MOBILE, useSidebar } from './utils'
-
-defineOptions({
-  inheritAttrs: false,
-})
-
-const props = withDefaults(defineProps<SidebarProps>(), {
-  side: 'left',
-  variant: 'sidebar',
-  collapsible: 'offcanvas',
-})
-
-const { isMobile, state, openMobile, setOpenMobile } = useSidebar()
-</script>
-
-<template>
-  <div
-    v-if="collapsible === 'none'"
-    data-slot="sidebar"
-    :class="cn('bg-sidebar text-sidebar-foreground flex h-full w-(--sidebar-width) flex-col', props.class)"
-    v-bind="$attrs"
-  >
-    <slot />
-  </div>
-
-  <Sheet v-else-if="isMobile" :open="openMobile" v-bind="$attrs" @update:open="setOpenMobile">
-    <SheetContent
-      data-sidebar="sidebar"
-      data-slot="sidebar"
-      data-mobile="true"
-      :side="side"
-      class="bg-sidebar text-sidebar-foreground w-(--sidebar-width) p-0 [&>button]:hidden"
-      :style="{
-        '--sidebar-width': SIDEBAR_WIDTH_MOBILE,
-      }"
-    >
-      <SheetHeader class="sr-only">
-        <SheetTitle>Sidebar</SheetTitle>
-        <SheetDescription>Displays the mobile sidebar.</SheetDescription>
-      </SheetHeader>
-      <div class="flex h-full w-full flex-col">
-        <slot />
-      </div>
-    </SheetContent>
-  </Sheet>
-
-  <div
-    v-else
-    class="group peer text-sidebar-foreground hidden md:block"
-    data-slot="sidebar"
-    :data-state="state"
-    :data-collapsible="state === 'collapsed' ? collapsible : ''"
-    :data-variant="variant"
-    :data-side="side"
-  >
-    <!-- This is what handles the sidebar gap on desktop  -->
-    <div
-      :class="cn(
-        'relative w-(--sidebar-width) bg-transparent transition-[width] duration-200 ease-linear',
-        'group-data-[collapsible=offcanvas]:w-0',
-        'group-data-[side=right]:rotate-180',
-        variant === 'floating' || variant === 'inset'
-          ? 'group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4)))]'
-          : 'group-data-[collapsible=icon]:w-(--sidebar-width-icon)',
-      )"
-    />
-    <div
-      :class="cn(
-        'fixed inset-y-0 z-10 hidden h-svh w-(--sidebar-width) transition-[left,right,width] duration-200 ease-linear md:flex',
-        side === 'left'
-          ? 'left-0 group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)]'
-          : 'right-0 group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)]',
-        // Adjust the padding for floating and inset variants.
-        variant === 'floating' || variant === 'inset'
-          ? 'p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)+(--spacing(4))+2px)]'
-          : 'group-data-[collapsible=icon]:w-(--sidebar-width-icon) group-data-[side=left]:border-r group-data-[side=right]:border-l',
-        props.class,
-      )"
-      v-bind="$attrs"
-    >
-      <div
-        data-sidebar="sidebar"
-        class="bg-sidebar group-data-[variant=floating]:border-sidebar-border flex h-full w-full flex-col group-data-[variant=floating]:rounded-lg group-data-[variant=floating]:border group-data-[variant=floating]:shadow-sm"
-      >
-        <slot />
-      </div>
-    </div>
-  </div>
-</template>
diff --git a/resources/js/components/ui/sidebar/SidebarContent.vue b/resources/js/components/ui/sidebar/SidebarContent.vue
deleted file mode 100644
index 3b7536c..0000000
--- a/resources/js/components/ui/sidebar/SidebarContent.vue
+++ /dev/null
@@ -1,18 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-
-const props = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
-</script>
-
-<template>
-  <div
-    data-slot="sidebar-content"
-    data-sidebar="content"
-    :class="cn('flex min-h-0 flex-1 flex-col gap-2 overflow-auto group-data-[collapsible=icon]:overflow-hidden', props.class)"
-  >
-    <slot />
-  </div>
-</template>
diff --git a/resources/js/components/ui/sidebar/SidebarFooter.vue b/resources/js/components/ui/sidebar/SidebarFooter.vue
deleted file mode 100644
index c324dff..0000000
--- a/resources/js/components/ui/sidebar/SidebarFooter.vue
+++ /dev/null
@@ -1,18 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-
-const props = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
-</script>
-
-<template>
-  <div
-    data-slot="sidebar-footer"
-    data-sidebar="footer"
-    :class="cn('flex flex-col gap-2 p-2', props.class)"
-  >
-    <slot />
-  </div>
-</template>
diff --git a/resources/js/components/ui/sidebar/SidebarGroup.vue b/resources/js/components/ui/sidebar/SidebarGroup.vue
deleted file mode 100644
index 57a099f..0000000
--- a/resources/js/components/ui/sidebar/SidebarGroup.vue
+++ /dev/null
@@ -1,18 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-
-const props = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
-</script>
-
-<template>
-  <div
-    data-slot="sidebar-group"
-    data-sidebar="group"
-    :class="cn('relative flex w-full min-w-0 flex-col p-2', props.class)"
-  >
-    <slot />
-  </div>
-</template>
diff --git a/resources/js/components/ui/sidebar/SidebarGroupAction.vue b/resources/js/components/ui/sidebar/SidebarGroupAction.vue
deleted file mode 100644
index 35713bb..0000000
--- a/resources/js/components/ui/sidebar/SidebarGroupAction.vue
+++ /dev/null
@@ -1,27 +0,0 @@
-<script setup lang="ts">
-import type { PrimitiveProps } from 'reka-ui'
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-import { Primitive } from 'reka-ui'
-
-const props = defineProps<PrimitiveProps & {
-  class?: HTMLAttributes['class']
-}>()
-</script>
-
-<template>
-  <Primitive
-    data-slot="sidebar-group-action"
-    data-sidebar="group-action"
-    :as="as"
-    :as-child="asChild"
-    :class="cn(
-      'text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground absolute top-3.5 right-3 flex aspect-square w-5 items-center justify-center rounded-md p-0 outline-hidden transition-transform focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0',
-      'after:absolute after:-inset-2 md:after:hidden',
-      'group-data-[collapsible=icon]:hidden',
-      props.class,
-    )"
-  >
-    <slot />
-  </Primitive>
-</template>
diff --git a/resources/js/components/ui/sidebar/SidebarGroupContent.vue b/resources/js/components/ui/sidebar/SidebarGroupContent.vue
deleted file mode 100644
index 5d5e2dd..0000000
--- a/resources/js/components/ui/sidebar/SidebarGroupContent.vue
+++ /dev/null
@@ -1,18 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-
-const props = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
-</script>
-
-<template>
-  <div
-    data-slot="sidebar-group-content"
-    data-sidebar="group-content"
-    :class="cn('w-full text-sm', props.class)"
-  >
-    <slot />
-  </div>
-</template>
diff --git a/resources/js/components/ui/sidebar/SidebarGroupLabel.vue b/resources/js/components/ui/sidebar/SidebarGroupLabel.vue
deleted file mode 100644
index 19e1117..0000000
--- a/resources/js/components/ui/sidebar/SidebarGroupLabel.vue
+++ /dev/null
@@ -1,25 +0,0 @@
-<script setup lang="ts">
-import type { PrimitiveProps } from 'reka-ui'
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-import { Primitive } from 'reka-ui'
-
-const props = defineProps<PrimitiveProps & {
-  class?: HTMLAttributes['class']
-}>()
-</script>
-
-<template>
-  <Primitive
-    data-slot="sidebar-group-label"
-    data-sidebar="group-label"
-    :as="as"
-    :as-child="asChild"
-    :class="cn(
-      'text-sidebar-foreground/70 ring-sidebar-ring flex h-8 shrink-0 items-center rounded-md px-2 text-xs font-medium outline-hidden transition-[margin,opacity] duration-200 ease-linear focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0',
-      'group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0',
-      props.class)"
-  >
-    <slot />
-  </Primitive>
-</template>
diff --git a/resources/js/components/ui/sidebar/SidebarHeader.vue b/resources/js/components/ui/sidebar/SidebarHeader.vue
deleted file mode 100644
index 00673f7..0000000
--- a/resources/js/components/ui/sidebar/SidebarHeader.vue
+++ /dev/null
@@ -1,18 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-
-const props = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
-</script>
-
-<template>
-  <div
-    data-slot="sidebar-header"
-    data-sidebar="header"
-    :class="cn('flex flex-col gap-2 p-2', props.class)"
-  >
-    <slot />
-  </div>
-</template>
diff --git a/resources/js/components/ui/sidebar/SidebarInput.vue b/resources/js/components/ui/sidebar/SidebarInput.vue
deleted file mode 100644
index ecaa977..0000000
--- a/resources/js/components/ui/sidebar/SidebarInput.vue
+++ /dev/null
@@ -1,22 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-import { Input } from '@/components/ui/input'
-
-const props = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
-</script>
-
-<template>
-  <Input
-    data-slot="sidebar-input"
-    data-sidebar="input"
-    :class="cn(
-      'bg-background h-8 w-full shadow-none',
-      props.class,
-    )"
-  >
-    <slot />
-  </Input>
-</template>
diff --git a/resources/js/components/ui/sidebar/SidebarInset.vue b/resources/js/components/ui/sidebar/SidebarInset.vue
deleted file mode 100644
index 947331a..0000000
--- a/resources/js/components/ui/sidebar/SidebarInset.vue
+++ /dev/null
@@ -1,21 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-
-const props = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
-</script>
-
-<template>
-  <main
-    data-slot="sidebar-inset"
-    :class="cn(
-      'bg-background relative flex w-full flex-1 flex-col',
-      'md:peer-data-[variant=inset]:m-2 md:peer-data-[variant=inset]:ml-0 md:peer-data-[variant=inset]:rounded-xl md:peer-data-[variant=inset]:shadow-sm md:peer-data-[variant=inset]:peer-data-[state=collapsed]:ml-0',
-      props.class,
-    )"
-  >
-    <slot />
-  </main>
-</template>
diff --git a/resources/js/components/ui/sidebar/SidebarMenu.vue b/resources/js/components/ui/sidebar/SidebarMenu.vue
deleted file mode 100644
index 59ec071..0000000
--- a/resources/js/components/ui/sidebar/SidebarMenu.vue
+++ /dev/null
@@ -1,18 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-
-const props = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
-</script>
-
-<template>
-  <ul
-    data-slot="sidebar-menu"
-    data-sidebar="menu"
-    :class="cn('flex w-full min-w-0 flex-col gap-1', props.class)"
-  >
-    <slot />
-  </ul>
-</template>
diff --git a/resources/js/components/ui/sidebar/SidebarMenuAction.vue b/resources/js/components/ui/sidebar/SidebarMenuAction.vue
deleted file mode 100644
index 2429433..0000000
--- a/resources/js/components/ui/sidebar/SidebarMenuAction.vue
+++ /dev/null
@@ -1,34 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-import { Primitive, type PrimitiveProps } from 'reka-ui'
-
-const props = withDefaults(defineProps<PrimitiveProps & {
-  showOnHover?: boolean
-  class?: HTMLAttributes['class']
-}>(), {
-  as: 'button',
-})
-</script>
-
-<template>
-  <Primitive
-    data-slot="sidebar-menu-action"
-    data-sidebar="menu-action"
-    :class="cn(
-      'text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground peer-hover/menu-button:text-sidebar-accent-foreground absolute top-1.5 right-1 flex aspect-square w-5 items-center justify-center rounded-md p-0 outline-hidden transition-transform focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0',
-      'after:absolute after:-inset-2 md:after:hidden',
-      'peer-data-[size=sm]/menu-button:top-1',
-      'peer-data-[size=default]/menu-button:top-1.5',
-      'peer-data-[size=lg]/menu-button:top-2.5',
-      'group-data-[collapsible=icon]:hidden',
-      showOnHover
-        && 'peer-data-[active=true]/menu-button:text-sidebar-accent-foreground group-focus-within/menu-item:opacity-100 group-hover/menu-item:opacity-100 data-[state=open]:opacity-100 md:opacity-0',
-      props.class,
-    )"
-    :as="as"
-    :as-child="asChild"
-  >
-    <slot />
-  </Primitive>
-</template>
diff --git a/resources/js/components/ui/sidebar/SidebarMenuBadge.vue b/resources/js/components/ui/sidebar/SidebarMenuBadge.vue
deleted file mode 100644
index 3984b33..0000000
--- a/resources/js/components/ui/sidebar/SidebarMenuBadge.vue
+++ /dev/null
@@ -1,26 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-
-const props = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
-</script>
-
-<template>
-  <div
-    data-slot="sidebar-menu-badge"
-    data-sidebar="menu-badge"
-    :class="cn(
-      'text-sidebar-foreground pointer-events-none absolute right-1 flex h-5 min-w-5 items-center justify-center rounded-md px-1 text-xs font-medium tabular-nums select-none',
-      'peer-hover/menu-button:text-sidebar-accent-foreground peer-data-[active=true]/menu-button:text-sidebar-accent-foreground',
-      'peer-data-[size=sm]/menu-button:top-1',
-      'peer-data-[size=default]/menu-button:top-1.5',
-      'peer-data-[size=lg]/menu-button:top-2.5',
-      'group-data-[collapsible=icon]:hidden',
-      props.class,
-    )"
-  >
-    <slot />
-  </div>
-</template>
diff --git a/resources/js/components/ui/sidebar/SidebarMenuButton.vue b/resources/js/components/ui/sidebar/SidebarMenuButton.vue
deleted file mode 100644
index ac6926b..0000000
--- a/resources/js/components/ui/sidebar/SidebarMenuButton.vue
+++ /dev/null
@@ -1,49 +0,0 @@
-<script setup lang="ts">
-import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip'
-import { type Component, computed } from 'vue'
-import SidebarMenuButtonChild, { type SidebarMenuButtonProps } from './SidebarMenuButtonChild.vue'
-import { useSidebar } from './utils'
-
-defineOptions({
-  inheritAttrs: false,
-})
-
-const props = withDefaults(defineProps<SidebarMenuButtonProps & {
-  tooltip?: string | Component
-}>(), {
-  as: 'button',
-  variant: 'default',
-  size: 'default',
-})
-
-const { isMobile, state } = useSidebar()
-
-const delegatedProps = computed(() => {
-  const { tooltip, ...delegated } = props
-  return delegated
-})
-</script>
-
-<template>
-  <SidebarMenuButtonChild v-if="!tooltip" v-bind="{ ...delegatedProps, ...$attrs }">
-    <slot />
-  </SidebarMenuButtonChild>
-
-  <Tooltip v-else>
-    <TooltipTrigger as-child>
-      <SidebarMenuButtonChild v-bind="{ ...delegatedProps, ...$attrs }">
-        <slot />
-      </SidebarMenuButtonChild>
-    </TooltipTrigger>
-    <TooltipContent
-      side="right"
-      align="center"
-      :hidden="state !== 'collapsed' || isMobile"
-    >
-      <template v-if="typeof tooltip === 'string'">
-        {{ tooltip }}
-      </template>
-      <component :is="tooltip" v-else />
-    </TooltipContent>
-  </Tooltip>
-</template>
diff --git a/resources/js/components/ui/sidebar/SidebarMenuButtonChild.vue b/resources/js/components/ui/sidebar/SidebarMenuButtonChild.vue
deleted file mode 100644
index 0b8979c..0000000
--- a/resources/js/components/ui/sidebar/SidebarMenuButtonChild.vue
+++ /dev/null
@@ -1,34 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-import { Primitive, type PrimitiveProps } from 'reka-ui'
-import { type SidebarMenuButtonVariants, sidebarMenuButtonVariants } from '.'
-
-export interface SidebarMenuButtonProps extends PrimitiveProps {
-  variant?: SidebarMenuButtonVariants['variant']
-  size?: SidebarMenuButtonVariants['size']
-  isActive?: boolean
-  class?: HTMLAttributes['class']
-}
-
-const props = withDefaults(defineProps<SidebarMenuButtonProps>(), {
-  as: 'button',
-  variant: 'default',
-  size: 'default',
-})
-</script>
-
-<template>
-  <Primitive
-    data-slot="sidebar-menu-button"
-    data-sidebar="menu-button"
-    :data-size="size"
-    :data-active="isActive"
-    :class="cn(sidebarMenuButtonVariants({ variant, size }), props.class)"
-    :as="as"
-    :as-child="asChild"
-    v-bind="$attrs"
-  >
-    <slot />
-  </Primitive>
-</template>
diff --git a/resources/js/components/ui/sidebar/SidebarMenuItem.vue b/resources/js/components/ui/sidebar/SidebarMenuItem.vue
deleted file mode 100644
index b7b4d3f..0000000
--- a/resources/js/components/ui/sidebar/SidebarMenuItem.vue
+++ /dev/null
@@ -1,18 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-
-const props = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
-</script>
-
-<template>
-  <li
-    data-slot="sidebar-menu-item"
-    data-sidebar="menu-item"
-    :class="cn('group/menu-item relative', props.class)"
-  >
-    <slot />
-  </li>
-</template>
diff --git a/resources/js/components/ui/sidebar/SidebarMenuSkeleton.vue b/resources/js/components/ui/sidebar/SidebarMenuSkeleton.vue
deleted file mode 100644
index 6be4243..0000000
--- a/resources/js/components/ui/sidebar/SidebarMenuSkeleton.vue
+++ /dev/null
@@ -1,34 +0,0 @@
-<script setup lang="ts">
-import { cn } from '@/lib/utils'
-import { Skeleton } from '@/components/ui/skeleton'
-import { computed, type HTMLAttributes } from 'vue'
-
-const props = defineProps<{
-  showIcon?: boolean
-  class?: HTMLAttributes['class']
-}>()
-
-const width = computed(() => {
-  return `${Math.floor(Math.random() * 40) + 50}%`;
-})
-</script>
-
-<template>
-  <div
-    data-slot="sidebar-menu-skeleton"
-    data-sidebar="menu-skeleton"
-    :class="cn('flex h-8 items-center gap-2 rounded-md px-2', props.class)"
-  >
-    <Skeleton
-      v-if="showIcon"
-      class="size-4 rounded-md"
-      data-sidebar="menu-skeleton-icon"
-    />
-
-    <Skeleton
-      class="h-4 max-w-(--skeleton-width) flex-1"
-      data-sidebar="menu-skeleton-text"
-      :style="{ '--skeleton-width': width }"
-    />
-  </div>
-</template>
diff --git a/resources/js/components/ui/sidebar/SidebarMenuSub.vue b/resources/js/components/ui/sidebar/SidebarMenuSub.vue
deleted file mode 100644
index 11aec64..0000000
--- a/resources/js/components/ui/sidebar/SidebarMenuSub.vue
+++ /dev/null
@@ -1,22 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-
-const props = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
-</script>
-
-<template>
-  <ul
-    data-slot="sidebar-menu-sub"
-    data-sidebar="menu-badge"
-    :class="cn(
-      'border-sidebar-border mx-3.5 flex min-w-0 translate-x-px flex-col gap-1 border-l px-2.5 py-0.5',
-      'group-data-[collapsible=icon]:hidden',
-      props.class,
-    )"
-  >
-    <slot />
-  </ul>
-</template>
diff --git a/resources/js/components/ui/sidebar/SidebarMenuSubButton.vue b/resources/js/components/ui/sidebar/SidebarMenuSubButton.vue
deleted file mode 100644
index 98e8e56..0000000
--- a/resources/js/components/ui/sidebar/SidebarMenuSubButton.vue
+++ /dev/null
@@ -1,36 +0,0 @@
-<script setup lang="ts">
-import type { PrimitiveProps } from 'reka-ui'
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-import { Primitive } from 'reka-ui'
-
-const props = withDefaults(defineProps<PrimitiveProps & {
-  size?: 'sm' | 'md'
-  isActive?: boolean
-  class?: HTMLAttributes['class']
-}>(), {
-  as: 'a',
-  size: 'md',
-})
-</script>
-
-<template>
-  <Primitive
-    data-slot="sidebar-menu-sub-button"
-    data-sidebar="menu-sub-button"
-    :as="as"
-    :as-child="asChild"
-    :data-size="size"
-    :data-active="isActive"
-    :class="cn(
-      'text-sidebar-foreground ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground active:bg-sidebar-accent active:text-sidebar-accent-foreground [&>svg]:text-sidebar-accent-foreground flex h-7 min-w-0 -translate-x-px items-center gap-2 overflow-hidden rounded-md px-2 outline-hidden focus-visible:ring-2 disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0',
-      'data-[active=true]:bg-sidebar-accent data-[active=true]:text-sidebar-accent-foreground',
-      size === 'sm' && 'text-xs',
-      size === 'md' && 'text-sm',
-      'group-data-[collapsible=icon]:hidden',
-      props.class,
-    )"
-  >
-    <slot />
-  </Primitive>
-</template>
diff --git a/resources/js/components/ui/sidebar/SidebarMenuSubItem.vue b/resources/js/components/ui/sidebar/SidebarMenuSubItem.vue
deleted file mode 100644
index f0c35bc..0000000
--- a/resources/js/components/ui/sidebar/SidebarMenuSubItem.vue
+++ /dev/null
@@ -1,18 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-
-const props = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
-</script>
-
-<template>
-  <li
-    data-slot="sidebar-menu-sub-item"
-    data-sidebar="menu-sub-item"
-    :class="cn('group/menu-sub-item relative', props.class)"
-  >
-    <slot />
-  </li>
-</template>
diff --git a/resources/js/components/ui/sidebar/SidebarProvider.vue b/resources/js/components/ui/sidebar/SidebarProvider.vue
deleted file mode 100644
index a4ba362..0000000
--- a/resources/js/components/ui/sidebar/SidebarProvider.vue
+++ /dev/null
@@ -1,81 +0,0 @@
-<script setup lang="ts">
-import { cn } from '@/lib/utils'
-import { useEventListener, useMediaQuery, useVModel } from '@vueuse/core'
-import { TooltipProvider } from 'reka-ui'
-import { computed, type HTMLAttributes, type Ref, ref } from 'vue'
-import { provideSidebarContext, SIDEBAR_COOKIE_MAX_AGE, SIDEBAR_COOKIE_NAME, SIDEBAR_KEYBOARD_SHORTCUT, SIDEBAR_WIDTH, SIDEBAR_WIDTH_ICON } from './utils'
-
-const props = withDefaults(defineProps<{
-  defaultOpen?: boolean
-  open?: boolean
-  class?: HTMLAttributes['class']
-}>(), {
-  defaultOpen: true,
-  open: undefined,
-})
-
-const emits = defineEmits<{
-  'update:open': [open: boolean]
-}>()
-
-const isMobile = useMediaQuery('(max-width: 768px)')
-const openMobile = ref(false)
-
-const open = useVModel(props, 'open', emits, {
-  defaultValue: props.defaultOpen ?? false,
-  passive: (props.open === undefined) as false,
-}) as Ref<boolean>
-
-function setOpen(value: boolean) {
-  open.value = value // emits('update:open', value)
-
-  // This sets the cookie to keep the sidebar state.
-  document.cookie = `${SIDEBAR_COOKIE_NAME}=${open.value}; path=/; max-age=${SIDEBAR_COOKIE_MAX_AGE}`
-}
-
-function setOpenMobile(value: boolean) {
-  openMobile.value = value
-}
-
-// Helper to toggle the sidebar.
-function toggleSidebar() {
-  return isMobile.value ? setOpenMobile(!openMobile.value) : setOpen(!open.value)
-}
-
-useEventListener('keydown', (event: KeyboardEvent) => {
-  if (event.key === SIDEBAR_KEYBOARD_SHORTCUT && (event.metaKey || event.ctrlKey)) {
-    event.preventDefault()
-    toggleSidebar()
-  }
-})
-
-// We add a state so that we can do data-state="expanded" or "collapsed".
-// This makes it easier to style the sidebar with Tailwind classes.
-const state = computed(() => open.value ? 'expanded' : 'collapsed')
-
-provideSidebarContext({
-  state,
-  open,
-  setOpen,
-  isMobile,
-  openMobile,
-  setOpenMobile,
-  toggleSidebar,
-})
-</script>
-
-<template>
-  <TooltipProvider :delay-duration="0">
-    <div
-      data-slot="sidebar-wrapper"
-      :style="{
-        '--sidebar-width': SIDEBAR_WIDTH,
-        '--sidebar-width-icon': SIDEBAR_WIDTH_ICON,
-      }"
-      :class="cn('group/sidebar-wrapper has-data-[variant=inset]:bg-sidebar flex min-h-svh w-full', props.class)"
-      v-bind="$attrs"
-    >
-      <slot />
-    </div>
-  </TooltipProvider>
-</template>
diff --git a/resources/js/components/ui/sidebar/SidebarRail.vue b/resources/js/components/ui/sidebar/SidebarRail.vue
deleted file mode 100644
index 07e59be..0000000
--- a/resources/js/components/ui/sidebar/SidebarRail.vue
+++ /dev/null
@@ -1,33 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-import { useSidebar } from './utils'
-
-const props = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
-
-const { toggleSidebar } = useSidebar()
-</script>
-
-<template>
-  <button
-    data-sidebar="rail"
-    data-slot="sidebar-rail"
-    aria-label="Toggle Sidebar"
-    :tabindex="-1"
-    title="Toggle Sidebar"
-    :class="cn(
-      'hover:after:bg-sidebar-border absolute inset-y-0 z-20 hidden w-4 -translate-x-1/2 transition-all ease-linear group-data-[side=left]:-right-4 group-data-[side=right]:left-0 after:absolute after:inset-y-0 after:left-1/2 after:w-[2px] sm:flex',
-      'in-data-[side=left]:cursor-w-resize in-data-[side=right]:cursor-e-resize',
-      '[[data-side=left][data-state=collapsed]_&]:cursor-e-resize [[data-side=right][data-state=collapsed]_&]:cursor-w-resize',
-      'hover:group-data-[collapsible=offcanvas]:bg-sidebar group-data-[collapsible=offcanvas]:translate-x-0 group-data-[collapsible=offcanvas]:after:left-full',
-      '[[data-side=left][data-collapsible=offcanvas]_&]:-right-2',
-      '[[data-side=right][data-collapsible=offcanvas]_&]:-left-2',
-      props.class,
-    )"
-    @click="toggleSidebar"
-  >
-    <slot />
-  </button>
-</template>
diff --git a/resources/js/components/ui/sidebar/SidebarSeparator.vue b/resources/js/components/ui/sidebar/SidebarSeparator.vue
deleted file mode 100644
index 1803bff..0000000
--- a/resources/js/components/ui/sidebar/SidebarSeparator.vue
+++ /dev/null
@@ -1,19 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-import { Separator } from '@/components/ui/separator'
-
-const props = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
-</script>
-
-<template>
-  <Separator
-    data-slot="sidebar-separator"
-    data-sidebar="separator"
-    :class="cn('bg-sidebar-border mx-2 w-auto', props.class)"
-  >
-    <slot />
-  </Separator>
-</template>
diff --git a/resources/js/components/ui/sidebar/SidebarTrigger.vue b/resources/js/components/ui/sidebar/SidebarTrigger.vue
deleted file mode 100644
index 0e4fcbc..0000000
--- a/resources/js/components/ui/sidebar/SidebarTrigger.vue
+++ /dev/null
@@ -1,27 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-import { Button } from '@/components/ui/button'
-import { PanelLeft } from 'lucide-vue-next'
-import { useSidebar } from './utils'
-
-const props = defineProps<{
-  class?: HTMLAttributes['class']
-}>()
-
-const { toggleSidebar } = useSidebar()
-</script>
-
-<template>
-  <Button
-    data-sidebar="trigger"
-    data-slot="sidebar-trigger"
-    variant="ghost"
-    size="icon"
-    :class="cn('h-7 w-7', props.class)"
-    @click="toggleSidebar"
-  >
-    <PanelLeft />
-    <span class="sr-only">Toggle Sidebar</span>
-  </Button>
-</template>
diff --git a/resources/js/components/ui/sidebar/index.ts b/resources/js/components/ui/sidebar/index.ts
deleted file mode 100644
index accd624..0000000
--- a/resources/js/components/ui/sidebar/index.ts
+++ /dev/null
@@ -1,60 +0,0 @@
-import type { VariantProps } from 'class-variance-authority'
-import type { HTMLAttributes } from 'vue'
-import { cva } from 'class-variance-authority'
-
-export interface SidebarProps {
-  side?: 'left' | 'right'
-  variant?: 'sidebar' | 'floating' | 'inset'
-  collapsible?: 'offcanvas' | 'icon' | 'none'
-  class?: HTMLAttributes['class']
-}
-
-export { default as Sidebar } from './Sidebar.vue'
-export { default as SidebarContent } from './SidebarContent.vue'
-export { default as SidebarFooter } from './SidebarFooter.vue'
-export { default as SidebarGroup } from './SidebarGroup.vue'
-export { default as SidebarGroupAction } from './SidebarGroupAction.vue'
-export { default as SidebarGroupContent } from './SidebarGroupContent.vue'
-export { default as SidebarGroupLabel } from './SidebarGroupLabel.vue'
-export { default as SidebarHeader } from './SidebarHeader.vue'
-export { default as SidebarInput } from './SidebarInput.vue'
-export { default as SidebarInset } from './SidebarInset.vue'
-export { default as SidebarMenu } from './SidebarMenu.vue'
-export { default as SidebarMenuAction } from './SidebarMenuAction.vue'
-export { default as SidebarMenuBadge } from './SidebarMenuBadge.vue'
-export { default as SidebarMenuButton } from './SidebarMenuButton.vue'
-export { default as SidebarMenuItem } from './SidebarMenuItem.vue'
-export { default as SidebarMenuSkeleton } from './SidebarMenuSkeleton.vue'
-export { default as SidebarMenuSub } from './SidebarMenuSub.vue'
-export { default as SidebarMenuSubButton } from './SidebarMenuSubButton.vue'
-export { default as SidebarMenuSubItem } from './SidebarMenuSubItem.vue'
-export { default as SidebarProvider } from './SidebarProvider.vue'
-export { default as SidebarRail } from './SidebarRail.vue'
-export { default as SidebarSeparator } from './SidebarSeparator.vue'
-export { default as SidebarTrigger } from './SidebarTrigger.vue'
-
-export { useSidebar } from './utils'
-
-export const sidebarMenuButtonVariants = cva(
-  'peer/menu-button flex w-full items-center gap-2 overflow-hidden rounded-md p-2 text-left text-sm outline-hidden ring-sidebar-ring transition-[width,height,padding] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 group-has-data-[sidebar=menu-action]/menu-item:pr-8 aria-disabled:pointer-events-none aria-disabled:opacity-50 data-[active=true]:bg-sidebar-accent data-[active=true]:font-medium data-[active=true]:text-sidebar-accent-foreground data-[state=open]:hover:bg-sidebar-accent data-[state=open]:hover:text-sidebar-accent-foreground group-data-[collapsible=icon]:size-8! group-data-[collapsible=icon]:pr-2! [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0',
-  {
-    variants: {
-      variant: {
-        default: 'hover:bg-sidebar-accent hover:text-sidebar-accent-foreground',
-        outline:
-          'bg-background shadow-[0_0_0_1px_hsl(var(--sidebar-border))] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground hover:shadow-[0_0_0_1px_hsl(var(--sidebar-accent))]',
-      },
-      size: {
-        default: 'h-8 text-sm',
-        sm: 'h-7 text-xs',
-        lg: 'h-12 text-sm group-data-[collapsible=icon]:p-0!',
-      },
-    },
-    defaultVariants: {
-      variant: 'default',
-      size: 'default',
-    },
-  },
-)
-
-export type SidebarMenuButtonVariants = VariantProps<typeof sidebarMenuButtonVariants>
diff --git a/resources/js/components/ui/sidebar/utils.ts b/resources/js/components/ui/sidebar/utils.ts
deleted file mode 100644
index 6edb140..0000000
--- a/resources/js/components/ui/sidebar/utils.ts
+++ /dev/null
@@ -1,19 +0,0 @@
-import type { ComputedRef, Ref } from 'vue'
-import { createContext } from 'reka-ui'
-
-export const SIDEBAR_COOKIE_NAME = 'sidebar_state'
-export const SIDEBAR_COOKIE_MAX_AGE = 60 * 60 * 24 * 7
-export const SIDEBAR_WIDTH = '16rem'
-export const SIDEBAR_WIDTH_MOBILE = '18rem'
-export const SIDEBAR_WIDTH_ICON = '3rem'
-export const SIDEBAR_KEYBOARD_SHORTCUT = 'b'
-
-export const [useSidebar, provideSidebarContext] = createContext<{
-  state: ComputedRef<'expanded' | 'collapsed'>
-  open: Ref<boolean>
-  setOpen: (value: boolean) => void
-  isMobile: Ref<boolean>
-  openMobile: Ref<boolean>
-  setOpenMobile: (value: boolean) => void
-  toggleSidebar: () => void
-}>('Sidebar')
diff --git a/resources/js/components/ui/skeleton/Skeleton.vue b/resources/js/components/ui/skeleton/Skeleton.vue
deleted file mode 100644
index 153fe2c..0000000
--- a/resources/js/components/ui/skeleton/Skeleton.vue
+++ /dev/null
@@ -1,17 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-
-interface SkeletonProps {
-  class?: HTMLAttributes['class']
-}
-
-const props = defineProps<SkeletonProps>()
-</script>
-
-<template>
-  <div
-    data-slot="skeleton"
-    :class="cn('animate-pulse rounded-md bg-primary/10', props.class)"
-  />
-</template>
diff --git a/resources/js/components/ui/skeleton/index.ts b/resources/js/components/ui/skeleton/index.ts
deleted file mode 100644
index be21fad..0000000
--- a/resources/js/components/ui/skeleton/index.ts
+++ /dev/null
@@ -1 +0,0 @@
-export { default as Skeleton } from './Skeleton.vue'
diff --git a/resources/js/components/ui/tooltip/Tooltip.vue b/resources/js/components/ui/tooltip/Tooltip.vue
deleted file mode 100644
index 3ebeecc..0000000
--- a/resources/js/components/ui/tooltip/Tooltip.vue
+++ /dev/null
@@ -1,17 +0,0 @@
-<script setup lang="ts">
-import { TooltipRoot, type TooltipRootEmits, type TooltipRootProps, useForwardPropsEmits } from 'reka-ui'
-
-const props = defineProps<TooltipRootProps>()
-const emits = defineEmits<TooltipRootEmits>()
-
-const forwarded = useForwardPropsEmits(props, emits)
-</script>
-
-<template>
-  <TooltipRoot
-    data-slot="tooltip"
-    v-bind="forwarded"
-  >
-    <slot />
-  </TooltipRoot>
-</template>
diff --git a/resources/js/components/ui/tooltip/TooltipContent.vue b/resources/js/components/ui/tooltip/TooltipContent.vue
deleted file mode 100644
index 2441afd..0000000
--- a/resources/js/components/ui/tooltip/TooltipContent.vue
+++ /dev/null
@@ -1,33 +0,0 @@
-<script setup lang="ts">
-import type { HTMLAttributes } from 'vue'
-import { cn } from '@/lib/utils'
-import { reactiveOmit } from '@vueuse/core'
-import { TooltipArrow, TooltipContent, type TooltipContentEmits, type TooltipContentProps, TooltipPortal, useForwardPropsEmits } from 'reka-ui'
-
-defineOptions({
-  inheritAttrs: false,
-})
-
-const props = withDefaults(defineProps<TooltipContentProps & { class?: HTMLAttributes['class'] }>(), {
-  sideOffset: 4,
-})
-
-const emits = defineEmits<TooltipContentEmits>()
-
-const delegatedProps = reactiveOmit(props, 'class')
-const forwarded = useForwardPropsEmits(delegatedProps, emits)
-</script>
-
-<template>
-  <TooltipPortal>
-    <TooltipContent
-      data-slot="tooltip-content"
-      v-bind="{ ...forwarded, ...$attrs }"
-      :class="cn('bg-primary text-primary-foreground animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 w-fit rounded-md px-3 py-1.5 text-xs text-balance', props.class)"
-    >
-      <slot />
-
-      <TooltipArrow class="bg-primary fill-primary z-50 size-2.5 translate-y-[calc(-50%_-_2px)] rotate-45 rounded-[2px]" />
-    </TooltipContent>
-  </TooltipPortal>
-</template>
diff --git a/resources/js/components/ui/tooltip/TooltipProvider.vue b/resources/js/components/ui/tooltip/TooltipProvider.vue
deleted file mode 100644
index 4b4203e..0000000
--- a/resources/js/components/ui/tooltip/TooltipProvider.vue
+++ /dev/null
@@ -1,13 +0,0 @@
-<script setup lang="ts">
-import { TooltipProvider, type TooltipProviderProps } from 'reka-ui'
-
-const props = withDefaults(defineProps<TooltipProviderProps>(), {
-  delayDuration: 0,
-})
-</script>
-
-<template>
-  <TooltipProvider v-bind="props">
-    <slot />
-  </TooltipProvider>
-</template>
diff --git a/resources/js/components/ui/tooltip/TooltipTrigger.vue b/resources/js/components/ui/tooltip/TooltipTrigger.vue
deleted file mode 100644
index 36253c6..0000000
--- a/resources/js/components/ui/tooltip/TooltipTrigger.vue
+++ /dev/null
@@ -1,14 +0,0 @@
-<script setup lang="ts">
-import { TooltipTrigger, type TooltipTriggerProps } from 'reka-ui'
-
-const props = defineProps<TooltipTriggerProps>()
-</script>
-
-<template>
-  <TooltipTrigger
-    data-slot="tooltip-trigger"
-    v-bind="props"
-  >
-    <slot />
-  </TooltipTrigger>
-</template>
diff --git a/resources/js/components/ui/tooltip/index.ts b/resources/js/components/ui/tooltip/index.ts
deleted file mode 100644
index 5ab9653..0000000
--- a/resources/js/components/ui/tooltip/index.ts
+++ /dev/null
@@ -1,4 +0,0 @@
-export { default as Tooltip } from './Tooltip.vue'
-export { default as TooltipContent } from './TooltipContent.vue'
-export { default as TooltipProvider } from './TooltipProvider.vue'
-export { default as TooltipTrigger } from './TooltipTrigger.vue'
diff --git a/resources/js/layouts/AppLayout.vue b/resources/js/layouts/AppLayout.vue
index 77c9396..2cf99c4 100644
--- a/resources/js/layouts/AppLayout.vue
+++ b/resources/js/layouts/AppLayout.vue
@@ -1,6 +1,7 @@
 <script setup lang="ts">
-import AppLayout from '@/layouts/app/AppSidebarLayout.vue';
 import type { BreadcrumbItemType } from '@/types';
+import { onMounted } from 'vue';
+import Header from "@/components/Header.vue";
 
 interface Props {
     breadcrumbs?: BreadcrumbItemType[];
@@ -9,10 +10,64 @@ interface Props {
 withDefaults(defineProps<Props>(), {
     breadcrumbs: () => [],
 });
+
+
 </script>
 
 <template>
-    <AppLayout :breadcrumbs="breadcrumbs">
-        <slot />
-    </AppLayout>
+    <Header />
+    <slot />
 </template>
+
+<style>
+:root {
+    /* Colors */
+    --primary: hsl(210, 100%, 50%);
+    --primary-glow: hsl(210, 100%, 70%);
+    --accent: hsl(30, 100%, 46%);
+    --background: hsl(222, 84%, 5%);
+    --foreground: hsl(210, 40%, 98%);
+    --card: hsl(222, 84%, 8%);
+    --card-foreground: hsl(210, 40%, 95%);
+    --muted: hsl(217, 32%, 17%);
+    --muted-foreground: hsl(215, 20%, 65%);
+    --border: hsl(217, 32%, 17%);
+    --destructive: hsl(0, 62%, 30%);
+    --destructive-foreground: hsl(210, 40%, 98%);
+    --secondary: hsl(217, 32%, 17%);
+    --secondary-foreground: hsl(210, 40%, 98%);
+
+    /* Gradients */
+    --gradient-adventure: linear-gradient(
+        135deg,
+        hsl(210, 100%, 50%) 0%,
+        white 49%,
+        white 50%,
+        hsl(30, 100%, 46%) 100%
+    );
+    --gradient-hero: linear-gradient(135deg, hsl(210 100% 15%), hsl(25 95% 25%));
+    --gradient-accent: linear-gradient(135deg, hsl(30, 100%, 46%), hsl(210, 100%, 50%));
+
+    /* Shadows */
+    --shadow-intense: 0 25px 50px -12px hsl(210, 100%, 50% );
+    --shadow-glow: 0 0 40px hsl(210, 100%, 70% );
+
+    /* Transitions */
+    --transition-smooth: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+/* Reset and Base Styles */
+* {
+    margin: 0;
+    padding: 0;
+    box-sizing: border-box;
+}
+
+body {
+    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
+    background: var(--background);
+    color: var(--foreground);
+    line-height: 1.6;
+    overflow-x: hidden;
+}
+</style>
diff --git a/resources/js/layouts/app/AppHeaderLayout.vue b/resources/js/layouts/app/AppHeaderLayout.vue
deleted file mode 100644
index 0f0f84e..0000000
--- a/resources/js/layouts/app/AppHeaderLayout.vue
+++ /dev/null
@@ -1,23 +0,0 @@
-<script setup lang="ts">
-import AppContent from '@/components/AppContent.vue';
-import AppHeader from '@/components/AppHeader.vue';
-import AppShell from '@/components/AppShell.vue';
-import type { BreadcrumbItemType } from '@/types';
-
-interface Props {
-    breadcrumbs?: BreadcrumbItemType[];
-}
-
-withDefaults(defineProps<Props>(), {
-    breadcrumbs: () => [],
-});
-</script>
-
-<template>
-    <AppShell class="flex-col">
-        <AppHeader :breadcrumbs="breadcrumbs" />
-        <AppContent>
-            <slot />
-        </AppContent>
-    </AppShell>
-</template>
diff --git a/resources/js/layouts/app/AppSidebarLayout.vue b/resources/js/layouts/app/AppSidebarLayout.vue
deleted file mode 100644
index fe9855d..0000000
--- a/resources/js/layouts/app/AppSidebarLayout.vue
+++ /dev/null
@@ -1,25 +0,0 @@
-<script setup lang="ts">
-import AppContent from '@/components/AppContent.vue';
-import AppShell from '@/components/AppShell.vue';
-import AppSidebar from '@/components/AppSidebar.vue';
-import AppSidebarHeader from '@/components/AppSidebarHeader.vue';
-import type { BreadcrumbItemType } from '@/types';
-
-interface Props {
-    breadcrumbs?: BreadcrumbItemType[];
-}
-
-withDefaults(defineProps<Props>(), {
-    breadcrumbs: () => [],
-});
-</script>
-
-<template>
-    <AppShell variant="sidebar">
-        <AppSidebar />
-        <AppContent variant="sidebar" class="overflow-x-hidden">
-            <AppSidebarHeader :breadcrumbs="breadcrumbs" />
-            <slot />
-        </AppContent>
-    </AppShell>
-</template>
diff --git a/resources/js/pages/Dashboard.vue b/resources/js/pages/Dashboard.vue
deleted file mode 100644
index 46e7af0..0000000
--- a/resources/js/pages/Dashboard.vue
+++ /dev/null
@@ -1,37 +0,0 @@
-<script setup lang="ts">
-import AppLayout from '@/layouts/AppLayout.vue';
-import { dashboard } from '@/routes';
-import { type BreadcrumbItem } from '@/types';
-import { Head } from '@inertiajs/vue3';
-import PlaceholderPattern from '../components/PlaceholderPattern.vue';
-
-const breadcrumbs: BreadcrumbItem[] = [
-    {
-        title: 'Dashboard',
-        href: dashboard().url,
-    },
-];
-</script>
-
-<template>
-    <Head title="Dashboard" />
-
-    <AppLayout :breadcrumbs="breadcrumbs">
-        <div class="flex h-full flex-1 flex-col gap-4 overflow-x-auto rounded-xl p-4">
-            <div class="grid auto-rows-min gap-4 md:grid-cols-3">
-                <div class="relative aspect-video overflow-hidden rounded-xl border border-sidebar-border/70 dark:border-sidebar-border">
-                    <PlaceholderPattern />
-                </div>
-                <div class="relative aspect-video overflow-hidden rounded-xl border border-sidebar-border/70 dark:border-sidebar-border">
-                    <PlaceholderPattern />
-                </div>
-                <div class="relative aspect-video overflow-hidden rounded-xl border border-sidebar-border/70 dark:border-sidebar-border">
-                    <PlaceholderPattern />
-                </div>
-            </div>
-            <div class="relative min-h-[100vh] flex-1 rounded-xl border border-sidebar-border/70 md:min-h-min dark:border-sidebar-border">
-                <PlaceholderPattern />
-            </div>
-        </div>
-    </AppLayout>
-</template>
diff --git a/resources/js/pages/Home.vue b/resources/js/pages/Home.vue
new file mode 100644
index 0000000..3bfe136
--- /dev/null
+++ b/resources/js/pages/Home.vue
@@ -0,0 +1,239 @@
+<template>
+    <Hero />
+    <!-- About Section -->
+    <About />
+    <!-- Featured Tours Section -->
+    <FeaturedTours />
+</template>
+
+<style>
+
+</style>
+
+<script setup lang="ts">
+
+
+
+import { onMounted } from 'vue';
+
+import AppLayout from '../layouts/AppLayout.vue'
+import Hero from "@/components/home/Hero.vue";
+import About from "@/components/home/About.vue";
+import FeaturedTours from "@/components/home/FeaturedTours.vue";
+defineOptions({
+    layout: AppLayout
+})
+
+// Types
+interface IntersectionObserverOptions {
+    threshold?: number;
+    rootMargin?: string;
+}
+
+// Intersection Observer for animations
+const createIntersectionObserver = (
+    callback: IntersectionObserverCallback,
+    options: IntersectionObserverOptions = {}
+): IntersectionObserver => {
+    const defaultOptions: IntersectionObserverOptions = {
+        threshold: 0.3,
+        rootMargin: '0px 0px -50px 0px'
+    };
+
+    return new IntersectionObserver(callback, { ...defaultOptions, ...options });
+};
+
+// About section animation
+const initAboutAnimation = (): void => {
+    const aboutContent = document.querySelector('.about-content') as HTMLElement | null;
+    if (!aboutContent) return;
+
+    const observer = createIntersectionObserver((entries: IntersectionObserverEntry[]) => {
+        entries.forEach((entry: IntersectionObserverEntry) => {
+            if (entry.isIntersecting) {
+                entry.target.classList.add('visible');
+            } else {
+                entry.target.classList.remove('visible');
+            }
+        });
+    });
+
+    observer.observe(aboutContent);
+};
+
+// Featured tours animation
+const initToursAnimation = (): void => {
+    const toursHeader = document.querySelector('.tours-header') as HTMLElement | null;
+    const tourCards = document.querySelectorAll('.tour-card') as NodeListOf<HTMLElement>;
+
+    if (!toursHeader || !tourCards.length) return;
+
+    // Header animation
+    const headerObserver = createIntersectionObserver((entries: IntersectionObserverEntry[]) => {
+        entries.forEach((entry: IntersectionObserverEntry) => {
+            if (entry.isIntersecting) {
+                entry.target.classList.add('visible');
+            }
+        });
+    });
+
+    headerObserver.observe(toursHeader);
+
+    // Tour cards animation with staggered effect
+    const cardsObserver = createIntersectionObserver((entries: IntersectionObserverEntry[]) => {
+        entries.forEach((entry: IntersectionObserverEntry) => {
+            const tourCard = entry.target as HTMLElement;
+            const index = parseInt(tourCard.dataset.index || '0');
+
+            if (entry.isIntersecting) {
+                // Staggered animation when scrolling down
+                setTimeout(() => {
+                    tourCard.classList.add('visible');
+                }, index * 150);
+            } else {
+                // Reverse staggered animation when scrolling up
+                const reverseIndex = (tourCards.length - 1) - index;
+                setTimeout(() => {
+                    tourCard.classList.remove('visible');
+                }, reverseIndex * 100);
+            }
+        });
+    }, { threshold: 0.2 });
+
+    tourCards.forEach((card: HTMLElement) => {
+        cardsObserver.observe(card);
+    });
+};
+
+// Smooth scrolling for navigation links
+const initSmoothScrolling = (): void => {
+    const navLinks = document.querySelectorAll('a[href^="#"]') as NodeListOf<HTMLAnchorElement>;
+
+    navLinks.forEach((link: HTMLAnchorElement) => {
+        link.addEventListener('click', (e: Event) => {
+            e.preventDefault();
+
+            const targetId = link.getAttribute('href');
+            const targetElement = targetId ? document.querySelector(targetId) as HTMLElement | null : null;
+
+            if (targetElement) {
+                const header = document.querySelector('.header') as HTMLElement | null;
+                const headerHeight = header ? header.offsetHeight : 0;
+                const targetPosition = targetElement.offsetTop - headerHeight;
+
+                window.scrollTo({
+                    top: targetPosition,
+                    behavior: 'smooth'
+                });
+
+                // Close dropdown if open
+                const dropdown = document.querySelector('.dropdown') as HTMLElement | null;
+                if (dropdown) {
+                    dropdown.classList.remove('open');
+                }
+            }
+        });
+    });
+};
+
+// Parallax effect for hero background
+const initParallax = (): void => {
+    const heroBackground = document.querySelector('.hero-bg') as HTMLElement | null;
+    const heroSection = document.querySelector('.hero') as HTMLElement | null;
+    if (!heroBackground || !heroSection) return;
+
+    window.addEventListener('scroll', () => {
+        const scrolled = window.pageYOffset;
+        const heroRect = heroSection.getBoundingClientRect();
+        const heroHeight = heroSection.offsetHeight;
+
+        if (heroRect.bottom > 0) {
+            const rate = scrolled * -0.15;
+            const maxMovement = heroHeight * 0.1;
+            const constrainedRate = Math.max(rate, -maxMovement);
+
+            heroBackground.style.transform = `translateY(${constrainedRate}px)`;
+        }
+    });
+};
+
+// Add loading animations
+const initLoadingAnimations = (): void => {
+    // Add class to trigger CSS animations
+    document.body.classList.add('loaded');
+
+    // Animate hero content
+    const heroTitle = document.querySelector('.hero-title') as HTMLElement | null;
+    const heroSubtitle = document.querySelector('.hero-subtitle') as HTMLElement | null;
+
+    if (heroTitle) {
+        setTimeout(() => {
+            heroTitle.style.opacity = '1';
+            heroTitle.style.transform = 'translateY(0)';
+        }, 300);
+    }
+
+    if (heroSubtitle) {
+        setTimeout(() => {
+            heroSubtitle.style.opacity = '1';
+            heroSubtitle.style.transform = 'translateY(0)';
+        }, 600);
+    }
+};
+
+
+// Tour card interactions
+const initTourCardInteractions = (): void => {
+    const tourCards = document.querySelectorAll('.tour-card') as NodeListOf<HTMLElement>;
+
+    tourCards.forEach((card: HTMLElement) => {
+        const bookButton = card.querySelector('.btn') as HTMLElement | null;
+
+        if (bookButton) {
+            bookButton.addEventListener('click', () => {
+                // Add your booking logic here
+                alert('Booking functionality would be implemented here!');
+            });
+        }
+
+        // Add hover effects
+        card.addEventListener('mouseenter', () => {
+            card.style.transform = 'translateY(-8px) scale(1.02)';
+        });
+
+        card.addEventListener('mouseleave', () => {
+            if (card.classList.contains('visible')) {
+                card.style.transform = 'translateY(0) rotate(0deg) scale(1)';
+            }
+        });
+    });
+};
+
+// Initialize all functionality when DOM is loaded
+onMounted(() => {
+    initAboutAnimation();
+    initToursAnimation();
+    initSmoothScrolling();
+    initParallax();
+    initLoadingAnimations();
+    initTourCardInteractions();
+});
+
+// Add performance optimization
+const debounce = <T extends (...args: any[]) => void>(func: T, wait: number): T => {
+    let timeout: number  | undefined;
+    return ((...args: Parameters<T>) => {
+        const later = () => {
+            clearTimeout(timeout);
+            func(...args);
+        };
+        clearTimeout(timeout);
+        timeout = setTimeout(later, wait);
+    }) as T;
+};
+
+// Optimize scroll events
+window.addEventListener('scroll', debounce(() => {
+    // Scroll-based animations can be added here
+}, 16)); // ~60fps
+</script>
diff --git a/resources/js/pages/Welcome.vue b/resources/js/pages/Welcome.vue
index e3f4341..4e781e5 100644
--- a/resources/js/pages/Welcome.vue
+++ b/resources/js/pages/Welcome.vue
@@ -1,788 +1,15 @@
 <script setup lang="ts">
-import { dashboard, login, register } from '@/routes';
-import { Head, Link } from '@inertiajs/vue3';
+// "decorator" simulation
+import AppLayout from '../layouts/AppLayout.vue'
+defineOptions({
+    layout: AppLayout
+})
 </script>
 
 <template>
-    <Head title="Welcome">
-        <link rel="preconnect" href="https://rsms.me/" />
-        <link rel="stylesheet" href="https://rsms.me/inter/inter.css" />
-    </Head>
-    <div class="flex min-h-screen flex-col items-center bg-[#FDFDFC] p-6 text-[#1b1b18] lg:justify-center lg:p-8 dark:bg-[#0a0a0a]">
-        <header class="mb-6 w-full max-w-[335px] text-sm not-has-[nav]:hidden lg:max-w-4xl">
-            <nav class="flex items-center justify-end gap-4">
-                <Link
-                    v-if="$page.props.auth.user"
-                    :href="dashboard()"
-                    class="inline-block rounded-sm border border-[#19140035] px-5 py-1.5 text-sm leading-normal text-[#1b1b18] hover:border-[#1915014a] dark:border-[#3E3E3A] dark:text-[#EDEDEC] dark:hover:border-[#62605b]"
-                >
-                    Dashboard
-                </Link>
-                <template v-else>
-                    <Link
-                        :href="login()"
-                        class="inline-block rounded-sm border border-transparent px-5 py-1.5 text-sm leading-normal text-[#1b1b18] hover:border-[#19140035] dark:text-[#EDEDEC] dark:hover:border-[#3E3E3A]"
-                    >
-                        Log in
-                    </Link>
-                    <Link
-                        :href="register()"
-                        class="inline-block rounded-sm border border-[#19140035] px-5 py-1.5 text-sm leading-normal text-[#1b1b18] hover:border-[#1915014a] dark:border-[#3E3E3A] dark:text-[#EDEDEC] dark:hover:border-[#62605b]"
-                    >
-                        Register
-                    </Link>
-                </template>
-            </nav>
-        </header>
-        <div class="flex w-full items-center justify-center opacity-100 transition-opacity duration-750 lg:grow starting:opacity-0">
-            <main class="flex w-full max-w-[335px] flex-col-reverse overflow-hidden rounded-lg lg:max-w-4xl lg:flex-row">
-                <div
-                    class="flex-1 rounded-br-lg rounded-bl-lg bg-white p-6 pb-12 text-[13px] leading-[20px] shadow-[inset_0px_0px_0px_1px_rgba(26,26,0,0.16)] lg:rounded-tl-lg lg:rounded-br-none lg:p-20 dark:bg-[#161615] dark:text-[#EDEDEC] dark:shadow-[inset_0px_0px_0px_1px_#fffaed2d]"
-                >
-                    <h1 class="mb-1 font-medium">Let's get started</h1>
-                    <p class="mb-2 text-[#706f6c] dark:text-[#A1A09A]">
-                        Laravel has an incredibly rich ecosystem. <br />We suggest starting with the following.
-                    </p>
-                    <ul class="mb-4 flex flex-col lg:mb-6">
-                        <li
-                            class="relative flex items-center gap-4 py-2 before:absolute before:top-1/2 before:bottom-0 before:left-[0.4rem] before:border-l before:border-[#e3e3e0] dark:before:border-[#3E3E3A]"
-                        >
-                            <span class="relative bg-white py-1 dark:bg-[#161615]">
-                                <span
-                                    class="flex h-3.5 w-3.5 items-center justify-center rounded-full border border-[#e3e3e0] bg-[#FDFDFC] shadow-[0px_0px_1px_0px_rgba(0,0,0,0.03),0px_1px_2px_0px_rgba(0,0,0,0.06)] dark:border-[#3E3E3A] dark:bg-[#161615]"
-                                >
-                                    <span class="h-1.5 w-1.5 rounded-full bg-[#dbdbd7] dark:bg-[#3E3E3A]" />
-                                </span>
-                            </span>
-                            <span>
-                                Read the
-                                <a
-                                    href="https://laravel.com/docs"
-                                    target="_blank"
-                                    class="ml-1 inline-flex items-center space-x-1 font-medium text-[#f53003] underline underline-offset-4 dark:text-[#FF4433]"
-                                >
-                                    <span>Documentation</span>
-                                    <svg
-                                        width="{10}"
-                                        height="{11}"
-                                        viewBox="0 0 10 11"
-                                        fill="none"
-                                        xmlns="http://www.w3.org/2000/svg"
-                                        class="h-2.5 w-2.5"
-                                    >
-                                        <path d="M7.70833 6.95834V2.79167H3.54167M2.5 8L7.5 3.00001" stroke="currentColor" stroke-linecap="square" />
-                                    </svg>
-                                </a>
-                            </span>
-                        </li>
-                        <li
-                            class="relative flex items-center gap-4 py-2 before:absolute before:top-0 before:bottom-1/2 before:left-[0.4rem] before:border-l before:border-[#e3e3e0] dark:before:border-[#3E3E3A]"
-                        >
-                            <span class="relative bg-white py-1 dark:bg-[#161615]">
-                                <span
-                                    class="flex h-3.5 w-3.5 items-center justify-center rounded-full border border-[#e3e3e0] bg-[#FDFDFC] shadow-[0px_0px_1px_0px_rgba(0,0,0,0.03),0px_1px_2px_0px_rgba(0,0,0,0.06)] dark:border-[#3E3E3A] dark:bg-[#161615]"
-                                >
-                                    <span class="h-1.5 w-1.5 rounded-full bg-[#dbdbd7] dark:bg-[#3E3E3A]" />
-                                </span>
-                            </span>
-                            <span>
-                                Watch video tutorials at
-                                <a
-                                    href="https://laracasts.com"
-                                    target="_blank"
-                                    class="ml-1 inline-flex items-center space-x-1 font-medium text-[#f53003] underline underline-offset-4 dark:text-[#FF4433]"
-                                >
-                                    <span>Laracasts</span>
-                                    <svg
-                                        width="{10}"
-                                        height="{11}"
-                                        viewBox="0 0 10 11"
-                                        fill="none"
-                                        xmlns="http://www.w3.org/2000/svg"
-                                        class="h-2.5 w-2.5"
-                                    >
-                                        <path d="M7.70833 6.95834V2.79167H3.54167M2.5 8L7.5 3.00001" stroke="currentColor" stroke-linecap="square" />
-                                    </svg>
-                                </a>
-                            </span>
-                        </li>
-                    </ul>
-                    <ul class="flex gap-3 text-sm leading-normal">
-                        <li>
-                            <a
-                                href="https://cloud.laravel.com"
-                                target="_blank"
-                                class="inline-block rounded-sm border border-black bg-[#1b1b18] px-5 py-1.5 text-sm leading-normal text-white hover:border-black hover:bg-black dark:border-[#eeeeec] dark:bg-[#eeeeec] dark:text-[#1C1C1A] dark:hover:border-white dark:hover:bg-white"
-                            >
-                                Deploy now
-                            </a>
-                        </li>
-                    </ul>
-                </div>
-                <div
-                    class="relative -mb-px aspect-335/376 w-full shrink-0 overflow-hidden rounded-t-lg bg-[#fff2f2] lg:mb-0 lg:-ml-px lg:aspect-auto lg:w-[438px] lg:rounded-t-none lg:rounded-r-lg dark:bg-[#1D0002]"
-                >
-                    <svg
-                        class="w-full max-w-none translate-y-0 text-[#F53003] opacity-100 transition-all duration-750 dark:text-[#F61500] starting:translate-y-6 starting:opacity-0"
-                        viewBox="0 0 438 104"
-                        fill="none"
-                        xmlns="http://www.w3.org/2000/svg"
-                    >
-                        <path d="M17.2036 -3H0V102.197H49.5189V86.7187H17.2036V-3Z" fill="currentColor" />
-                        <path
-                            d="M110.256 41.6337C108.061 38.1275 104.945 35.3731 100.905 33.3681C96.8667 31.3647 92.8016 30.3618 88.7131 30.3618C83.4247 30.3618 78.5885 31.3389 74.201 33.2923C69.8111 35.2456 66.0474 37.928 62.9059 41.3333C59.7643 44.7401 57.3198 48.6726 55.5754 53.1293C53.8287 57.589 52.9572 62.274 52.9572 67.1813C52.9572 72.1925 53.8287 76.8995 55.5754 81.3069C57.3191 85.7173 59.7636 89.6241 62.9059 93.0293C66.0474 96.4361 69.8119 99.1155 74.201 101.069C78.5885 103.022 83.4247 103.999 88.7131 103.999C92.8016 103.999 96.8667 102.997 100.905 100.994C104.945 98.9911 108.061 96.2359 110.256 92.7282V102.195H126.563V32.1642H110.256V41.6337ZM108.76 75.7472C107.762 78.4531 106.366 80.8078 104.572 82.8112C102.776 84.8161 100.606 86.4183 98.0637 87.6206C95.5202 88.823 92.7004 89.4238 89.6103 89.4238C86.5178 89.4238 83.7252 88.823 81.2324 87.6206C78.7388 86.4183 76.5949 84.8161 74.7998 82.8112C73.004 80.8078 71.6319 78.4531 70.6856 75.7472C69.7356 73.0421 69.2644 70.1868 69.2644 67.1821C69.2644 64.1758 69.7356 61.3205 70.6856 58.6154C71.6319 55.9102 73.004 53.5571 74.7998 51.5522C76.5949 49.5495 78.738 47.9451 81.2324 46.7427C83.7252 45.5404 86.5178 44.9396 89.6103 44.9396C92.7012 44.9396 95.5202 45.5404 98.0637 46.7427C100.606 47.9451 102.776 49.5487 104.572 51.5522C106.367 53.5571 107.762 55.9102 108.76 58.6154C109.756 61.3205 110.256 64.1758 110.256 67.1821C110.256 70.1868 109.756 73.0421 108.76 75.7472Z"
-                            fill="currentColor"
-                        />
-                        <path
-                            d="M242.805 41.6337C240.611 38.1275 237.494 35.3731 233.455 33.3681C229.416 31.3647 225.351 30.3618 221.262 30.3618C215.974 30.3618 211.138 31.3389 206.75 33.2923C202.36 35.2456 198.597 37.928 195.455 41.3333C192.314 44.7401 189.869 48.6726 188.125 53.1293C186.378 57.589 185.507 62.274 185.507 67.1813C185.507 72.1925 186.378 76.8995 188.125 81.3069C189.868 85.7173 192.313 89.6241 195.455 93.0293C198.597 96.4361 202.361 99.1155 206.75 101.069C211.138 103.022 215.974 103.999 221.262 103.999C225.351 103.999 229.416 102.997 233.455 100.994C237.494 98.9911 240.611 96.2359 242.805 92.7282V102.195H259.112V32.1642H242.805V41.6337ZM241.31 75.7472C240.312 78.4531 238.916 80.8078 237.122 82.8112C235.326 84.8161 233.156 86.4183 230.614 87.6206C228.07 88.823 225.251 89.4238 222.16 89.4238C219.068 89.4238 216.275 88.823 213.782 87.6206C211.289 86.4183 209.145 84.8161 207.35 82.8112C205.554 80.8078 204.182 78.4531 203.236 75.7472C202.286 73.0421 201.814 70.1868 201.814 67.1821C201.814 64.1758 202.286 61.3205 203.236 58.6154C204.182 55.9102 205.554 53.5571 207.35 51.5522C209.145 49.5495 211.288 47.9451 213.782 46.7427C216.275 45.5404 219.068 44.9396 222.16 44.9396C225.251 44.9396 228.07 45.5404 230.614 46.7427C233.156 47.9451 235.326 49.5487 237.122 51.5522C238.917 53.5571 240.312 55.9102 241.31 58.6154C242.306 61.3205 242.806 64.1758 242.806 67.1821C242.805 70.1868 242.305 73.0421 241.31 75.7472Z"
-                            fill="currentColor"
-                        />
-                        <path d="M438 -3H421.694V102.197H438V-3Z" fill="currentColor" />
-                        <path d="M139.43 102.197H155.735V48.2834H183.712V32.1665H139.43V102.197Z" fill="currentColor" />
-                        <path
-                            d="M324.49 32.1665L303.995 85.794L283.498 32.1665H266.983L293.748 102.197H314.242L341.006 32.1665H324.49Z"
-                            fill="currentColor"
-                        />
-                        <path
-                            d="M376.571 30.3656C356.603 30.3656 340.797 46.8497 340.797 67.1828C340.797 89.6597 356.094 104 378.661 104C391.29 104 399.354 99.1488 409.206 88.5848L398.189 80.0226C398.183 80.031 389.874 90.9895 377.468 90.9895C363.048 90.9895 356.977 79.3111 356.977 73.269H411.075C413.917 50.1328 398.775 30.3656 376.571 30.3656ZM357.02 61.0967C357.145 59.7487 359.023 43.3761 376.442 43.3761C393.861 43.3761 395.978 59.7464 396.099 61.0967H357.02Z"
-                            fill="currentColor"
-                        />
-                    </svg>
-                    <svg
-                        class="relative -mt-[4.9rem] -ml-8 w-[448px] max-w-none lg:-mt-[6.6rem] lg:ml-0 dark:hidden"
-                        viewBox="0 0 440 376"
-                        fill="none"
-                        xmlns="http://www.w3.org/2000/svg"
-                    >
-                        <g class="translate-y-0 opacity-100 transition-all delay-300 duration-750 starting:translate-y-4 starting:opacity-0">
-                            <path
-                                d="M188.263 355.73L188.595 355.73C195.441 348.845 205.766 339.761 219.569 328.477C232.93 317.193 242.978 308.205 249.714 301.511C256.34 294.626 260.867 287.358 263.296 279.708C265.725 272.058 264.565 264.121 259.816 255.896C254.516 246.716 247.062 239.352 237.454 233.805C227.957 228.067 217.908 225.198 207.307 225.198C196.927 225.197 190.136 227.97 186.934 233.516C183.621 238.872 184.726 246.331 190.247 255.894L125.647 255.891C116.371 239.825 112.395 225.481 113.72 212.858C115.265 200.235 121.559 190.481 132.602 183.596C143.754 176.52 158.607 172.982 177.159 172.983C196.594 172.984 215.863 176.523 234.968 183.6C253.961 190.486 271.299 200.241 286.98 212.864C302.661 225.488 315.14 239.833 324.416 255.899C333.03 270.817 336.841 283.918 335.847 295.203C335.075 306.487 331.376 316.336 324.75 324.751C318.346 333.167 308.408 343.494 294.936 355.734L377.094 355.737L405.917 405.656L217.087 405.649L188.263 355.73Z"
-                                fill="black"
-                            />
-                            <path
-                                d="M9.11884 226.339L-13.7396 226.338L-42.7286 176.132L43.0733 176.135L175.595 405.649L112.651 405.647L9.11884 226.339Z"
-                                fill="black"
-                            />
-                            <path
-                                d="M188.263 355.73L188.595 355.73C195.441 348.845 205.766 339.761 219.569 328.477C232.93 317.193 242.978 308.205 249.714 301.511C256.34 294.626 260.867 287.358 263.296 279.708C265.725 272.058 264.565 264.121 259.816 255.896C254.516 246.716 247.062 239.352 237.454 233.805C227.957 228.067 217.908 225.198 207.307 225.198C196.927 225.197 190.136 227.97 186.934 233.516C183.621 238.872 184.726 246.331 190.247 255.894L125.647 255.891C116.371 239.825 112.395 225.481 113.72 212.858C115.265 200.235 121.559 190.481 132.602 183.596C143.754 176.52 158.607 172.982 177.159 172.983C196.594 172.984 215.863 176.523 234.968 183.6C253.961 190.486 271.299 200.241 286.98 212.864C302.661 225.488 315.14 239.833 324.416 255.899C333.03 270.817 336.841 283.918 335.847 295.203C335.075 306.487 331.376 316.336 324.75 324.751C318.346 333.167 308.408 343.494 294.936 355.734L377.094 355.737L405.917 405.656L217.087 405.649L188.263 355.73Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                            />
-                            <path
-                                d="M9.11884 226.339L-13.7396 226.338L-42.7286 176.132L43.0733 176.135L175.595 405.649L112.651 405.647L9.11884 226.339Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                            />
-                            <path
-                                d="M204.592 327.449L204.923 327.449C211.769 320.564 222.094 311.479 235.897 300.196C249.258 288.912 259.306 279.923 266.042 273.23C272.668 266.345 277.195 259.077 279.624 251.427C282.053 243.777 280.893 235.839 276.145 227.615C270.844 218.435 263.39 211.071 253.782 205.524C244.285 199.786 234.236 196.917 223.635 196.916C213.255 196.916 206.464 199.689 203.262 205.235C199.949 210.59 201.054 218.049 206.575 227.612L141.975 227.61C132.699 211.544 128.723 197.2 130.048 184.577C131.593 171.954 137.887 162.2 148.93 155.315C160.083 148.239 174.935 144.701 193.487 144.702C212.922 144.703 232.192 148.242 251.296 155.319C270.289 162.205 287.627 171.96 303.308 184.583C318.989 197.207 331.468 211.552 340.745 227.618C349.358 242.536 353.169 255.637 352.175 266.921C351.403 278.205 347.704 288.055 341.078 296.47C334.674 304.885 324.736 315.213 311.264 327.453L393.422 327.456L422.246 377.375L233.415 377.368L204.592 327.449Z"
-                                fill="#F8B803"
-                            />
-                            <path
-                                d="M25.447 198.058L2.58852 198.057L-26.4005 147.851L59.4015 147.854L191.923 377.368L128.979 377.365L25.447 198.058Z"
-                                fill="#F8B803"
-                            />
-                            <path
-                                d="M204.592 327.449L204.923 327.449C211.769 320.564 222.094 311.479 235.897 300.196C249.258 288.912 259.306 279.923 266.042 273.23C272.668 266.345 277.195 259.077 279.624 251.427C282.053 243.777 280.893 235.839 276.145 227.615C270.844 218.435 263.39 211.071 253.782 205.524C244.285 199.786 234.236 196.917 223.635 196.916C213.255 196.916 206.464 199.689 203.262 205.235C199.949 210.59 201.054 218.049 206.575 227.612L141.975 227.61C132.699 211.544 128.723 197.2 130.048 184.577C131.593 171.954 137.887 162.2 148.93 155.315C160.083 148.239 174.935 144.701 193.487 144.702C212.922 144.703 232.192 148.242 251.296 155.319C270.289 162.205 287.627 171.96 303.308 184.583C318.989 197.207 331.468 211.552 340.745 227.618C349.358 242.536 353.169 255.637 352.175 266.921C351.403 278.205 347.704 288.055 341.078 296.47C334.674 304.885 324.736 315.213 311.264 327.453L393.422 327.456L422.246 377.375L233.415 377.368L204.592 327.449Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                            />
-                            <path
-                                d="M25.447 198.058L2.58852 198.057L-26.4005 147.851L59.4015 147.854L191.923 377.368L128.979 377.365L25.447 198.058Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                            />
-                        </g>
-                        <g
-                            :style="{ mixBlendMode: 'hard-light' }"
-                            class="translate-y-0 opacity-100 transition-all delay-300 duration-750 starting:translate-y-4 starting:opacity-0"
-                        >
-                            <path
-                                d="M217.342 305.363L217.673 305.363C224.519 298.478 234.844 289.393 248.647 278.11C262.008 266.826 272.056 257.837 278.792 251.144C285.418 244.259 289.945 236.991 292.374 229.341C294.803 221.691 293.643 213.753 288.895 205.529C283.594 196.349 276.14 188.985 266.532 183.438C257.035 177.7 246.986 174.831 236.385 174.83C226.005 174.83 219.214 177.603 216.012 183.149C212.699 188.504 213.804 195.963 219.325 205.527L154.725 205.524C145.449 189.458 141.473 175.114 142.798 162.491C144.343 149.868 150.637 140.114 161.68 133.229C172.833 126.153 187.685 122.615 206.237 122.616C225.672 122.617 244.942 126.156 264.046 133.233C283.039 140.119 300.377 149.874 316.058 162.497C331.739 175.121 344.218 189.466 353.495 205.532C362.108 220.45 365.919 233.551 364.925 244.835C364.153 256.12 360.454 265.969 353.828 274.384C347.424 282.799 337.486 293.127 324.014 305.367L406.172 305.37L434.996 355.289L246.165 355.282L217.342 305.363Z"
-                                fill="#F0ACB8"
-                            />
-                            <path
-                                d="M38.197 175.972L15.3385 175.971L-13.6505 125.765L72.1515 125.768L204.673 355.282L141.729 355.279L38.197 175.972Z"
-                                fill="#F0ACB8"
-                            />
-                            <path
-                                d="M217.342 305.363L217.673 305.363C224.519 298.478 234.844 289.393 248.647 278.11C262.008 266.826 272.056 257.837 278.792 251.144C285.418 244.259 289.945 236.991 292.374 229.341C294.803 221.691 293.643 213.753 288.895 205.529C283.594 196.349 276.14 188.985 266.532 183.438C257.035 177.7 246.986 174.831 236.385 174.83C226.005 174.83 219.214 177.603 216.012 183.149C212.699 188.504 213.804 195.963 219.325 205.527L154.725 205.524C145.449 189.458 141.473 175.114 142.798 162.491C144.343 149.868 150.637 140.114 161.68 133.229C172.833 126.153 187.685 122.615 206.237 122.616C225.672 122.617 244.942 126.156 264.046 133.233C283.039 140.119 300.377 149.874 316.058 162.497C331.739 175.121 344.218 189.466 353.495 205.532C362.108 220.45 365.919 233.551 364.925 244.835C364.153 256.12 360.454 265.969 353.828 274.384C347.424 282.799 337.486 293.127 324.014 305.367L406.172 305.37L434.996 355.289L246.165 355.282L217.342 305.363Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                            />
-                            <path
-                                d="M38.197 175.972L15.3385 175.971L-13.6505 125.765L72.1515 125.768L204.673 355.282L141.729 355.279L38.197 175.972Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                            />
-                        </g>
-                        <g
-                            :style="`mixBlendMode: 'plus-darker'`"
-                            class="translate-y-0 opacity-100 transition-all delay-300 duration-750 starting:translate-y-4 starting:opacity-0"
-                        >
-                            <path
-                                d="M230.951 281.792L231.282 281.793C238.128 274.907 248.453 265.823 262.256 254.539C275.617 243.256 285.666 234.267 292.402 227.573C299.027 220.688 303.554 213.421 305.983 205.771C308.412 198.12 307.253 190.183 302.504 181.959C297.203 172.778 289.749 165.415 280.142 159.868C270.645 154.13 260.596 151.26 249.995 151.26C239.615 151.26 232.823 154.033 229.621 159.579C226.309 164.934 227.413 172.393 232.935 181.956L168.335 181.954C159.058 165.888 155.082 151.543 156.407 138.92C157.953 126.298 164.247 116.544 175.289 109.659C186.442 102.583 201.294 99.045 219.846 99.0457C239.281 99.0464 258.551 102.585 277.655 109.663C296.649 116.549 313.986 126.303 329.667 138.927C345.349 151.551 357.827 165.895 367.104 181.961C375.718 196.88 379.528 209.981 378.535 221.265C377.762 232.549 374.063 242.399 367.438 250.814C361.033 259.229 351.095 269.557 337.624 281.796L419.782 281.8L448.605 331.719L259.774 331.712L230.951 281.792Z"
-                                fill="#F3BEC7"
-                            />
-                            <path
-                                d="M51.8063 152.402L28.9479 152.401L-0.0411453 102.195L85.7608 102.198L218.282 331.711L155.339 331.709L51.8063 152.402Z"
-                                fill="#F3BEC7"
-                            />
-                            <path
-                                d="M230.951 281.792L231.282 281.793C238.128 274.907 248.453 265.823 262.256 254.539C275.617 243.256 285.666 234.267 292.402 227.573C299.027 220.688 303.554 213.421 305.983 205.771C308.412 198.12 307.253 190.183 302.504 181.959C297.203 172.778 289.749 165.415 280.142 159.868C270.645 154.13 260.596 151.26 249.995 151.26C239.615 151.26 232.823 154.033 229.621 159.579C226.309 164.934 227.413 172.393 232.935 181.956L168.335 181.954C159.058 165.888 155.082 151.543 156.407 138.92C157.953 126.298 164.247 116.544 175.289 109.659C186.442 102.583 201.294 99.045 219.846 99.0457C239.281 99.0464 258.551 102.585 277.655 109.663C296.649 116.549 313.986 126.303 329.667 138.927C345.349 151.551 357.827 165.895 367.104 181.961C375.718 196.88 379.528 209.981 378.535 221.265C377.762 232.549 374.063 242.399 367.438 250.814C361.033 259.229 351.095 269.557 337.624 281.796L419.782 281.8L448.605 331.719L259.774 331.712L230.951 281.792Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                            />
-                            <path
-                                d="M51.8063 152.402L28.9479 152.401L-0.0411453 102.195L85.7608 102.198L218.282 331.711L155.339 331.709L51.8063 152.402Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                            />
-                        </g>
-                        <g class="translate-y-0 opacity-100 transition-all delay-300 duration-750 starting:translate-y-4 starting:opacity-0">
-                            <path
-                                d="M188.467 355.363L188.798 355.363C195.644 348.478 205.969 339.393 219.772 328.11C233.133 316.826 243.181 307.837 249.917 301.144C253.696 297.217 256.792 293.166 259.205 288.991C261.024 285.845 262.455 282.628 263.499 279.341C265.928 271.691 264.768 263.753 260.02 255.529C254.719 246.349 247.265 238.985 237.657 233.438C228.16 227.7 218.111 224.831 207.51 224.83C197.13 224.83 190.339 227.603 187.137 233.149C183.824 238.504 184.929 245.963 190.45 255.527L125.851 255.524C116.574 239.458 112.598 225.114 113.923 212.491C114.615 206.836 116.261 201.756 118.859 197.253C122.061 191.704 126.709 187.03 132.805 183.229C143.958 176.153 158.81 172.615 177.362 172.616C196.797 172.617 216.067 176.156 235.171 183.233C254.164 190.119 271.502 199.874 287.183 212.497C302.864 225.121 315.343 239.466 324.62 255.532C333.233 270.45 337.044 283.551 336.05 294.835C335.46 303.459 333.16 311.245 329.151 318.194C327.915 320.337 326.515 322.4 324.953 324.384C318.549 332.799 308.611 343.127 295.139 355.367L377.297 355.37L406.121 405.289L217.29 405.282L188.467 355.363Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M9.32197 225.972L-13.5365 225.971L-42.5255 175.765L43.2765 175.768L175.798 405.282L112.854 405.279L9.32197 225.972Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M345.247 111.915C329.566 99.2919 312.229 89.5371 293.235 82.6512L235.167 183.228C254.161 190.114 271.498 199.869 287.179 212.492L345.247 111.915Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M382.686 154.964C373.41 138.898 360.931 124.553 345.25 111.93L287.182 212.506C302.863 225.13 315.342 239.475 324.618 255.541L382.686 154.964Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M293.243 82.6472C274.139 75.57 254.869 72.031 235.434 72.0303L177.366 172.607C196.801 172.608 216.071 176.147 235.175 183.224L293.243 82.6472Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M394.118 194.257C395.112 182.973 391.301 169.872 382.688 154.953L324.619 255.53C333.233 270.448 337.044 283.55 336.05 294.834L394.118 194.257Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M235.432 72.0311C216.88 72.0304 202.027 75.5681 190.875 82.6442L132.806 183.221C143.959 176.145 158.812 172.607 177.363 172.608L235.432 72.0311Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M265.59 124.25C276.191 124.251 286.24 127.12 295.737 132.858L237.669 233.435C228.172 227.697 218.123 224.828 207.522 224.827L265.59 124.25Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M295.719 132.859C305.326 138.406 312.78 145.77 318.081 154.95L260.013 255.527C254.712 246.347 247.258 238.983 237.651 233.436L295.719 132.859Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M387.218 217.608C391.227 210.66 393.527 202.874 394.117 194.25L336.049 294.827C335.459 303.451 333.159 311.237 329.15 318.185L387.218 217.608Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M245.211 132.577C248.413 127.03 255.204 124.257 265.584 124.258L207.516 224.835C197.136 224.834 190.345 227.607 187.143 233.154L245.211 132.577Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M318.094 154.945C322.842 163.17 324.002 171.107 321.573 178.757L263.505 279.334C265.934 271.684 264.774 263.746 260.026 255.522L318.094 154.945Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M176.925 96.6737C180.127 91.1249 184.776 86.4503 190.871 82.6499L132.803 183.227C126.708 187.027 122.059 191.702 118.857 197.25L176.925 96.6737Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M387.226 217.606C385.989 219.749 384.59 221.813 383.028 223.797L324.96 324.373C326.522 322.39 327.921 320.326 329.157 318.183L387.226 217.606Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M317.269 188.408C319.087 185.262 320.519 182.045 321.562 178.758L263.494 279.335C262.451 282.622 261.019 285.839 259.201 288.985L317.269 188.408Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M245.208 132.573C241.895 137.928 243 145.387 248.522 154.95L190.454 255.527C184.932 245.964 183.827 238.505 187.14 233.15L245.208 132.573Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M176.93 96.6719C174.331 101.175 172.686 106.255 171.993 111.91L113.925 212.487C114.618 206.831 116.263 201.752 118.862 197.249L176.93 96.6719Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M317.266 188.413C314.853 192.589 311.757 196.64 307.978 200.566L249.91 301.143C253.689 297.216 256.785 293.166 259.198 288.99L317.266 188.413Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M464.198 304.708L435.375 254.789L377.307 355.366L406.13 405.285L464.198 304.708Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M353.209 254.787C366.68 242.548 376.618 232.22 383.023 223.805L324.955 324.382C318.55 332.797 308.612 343.124 295.141 355.364L353.209 254.787Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M435.37 254.787L353.212 254.784L295.144 355.361L377.302 355.364L435.37 254.787Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M183.921 154.947L248.521 154.95L190.453 255.527L125.853 255.524L183.921 154.947Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M171.992 111.914C170.668 124.537 174.643 138.881 183.92 154.947L125.852 255.524C116.575 239.458 112.599 225.114 113.924 212.491L171.992 111.914Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M307.987 200.562C301.251 207.256 291.203 216.244 277.842 227.528L219.774 328.105C233.135 316.821 243.183 307.832 249.919 301.139L307.987 200.562Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M15.5469 75.1797L44.5359 125.386L-13.5321 225.963L-42.5212 175.756L15.5469 75.1797Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M277.836 227.536C264.033 238.82 253.708 247.904 246.862 254.789L188.794 355.366C195.64 348.481 205.965 339.397 219.768 328.113L277.836 227.536Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M275.358 304.706L464.189 304.713L406.12 405.29L217.29 405.283L275.358 304.706Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M44.5279 125.39L67.3864 125.39L9.31834 225.967L-13.5401 225.966L44.5279 125.39Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M101.341 75.1911L233.863 304.705L175.795 405.282L43.2733 175.768L101.341 75.1911ZM15.5431 75.19L-42.525 175.767L43.277 175.77L101.345 75.1932L15.5431 75.19Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M246.866 254.784L246.534 254.784L188.466 355.361L188.798 355.361L246.866 254.784Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M246.539 254.781L275.362 304.701L217.294 405.277L188.471 355.358L246.539 254.781Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M67.3906 125.391L170.923 304.698L112.855 405.275L9.32257 225.967L67.3906 125.391Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M170.921 304.699L233.865 304.701L175.797 405.278L112.853 405.276L170.921 304.699Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                        </g>
-                        <g
-                            :style="{ mixBlendMode: 'hard-light' }"
-                            class="translate-y-0 opacity-100 transition-all delay-300 duration-750 starting:translate-y-4 starting:opacity-0"
-                        >
-                            <path
-                                d="M246.544 254.79L246.875 254.79C253.722 247.905 264.046 238.82 277.849 227.537C291.21 216.253 301.259 207.264 307.995 200.57C314.62 193.685 319.147 186.418 321.577 178.768C324.006 171.117 322.846 163.18 318.097 154.956C312.796 145.775 305.342 138.412 295.735 132.865C286.238 127.127 276.189 124.258 265.588 124.257C255.208 124.257 248.416 127.03 245.214 132.576C241.902 137.931 243.006 145.39 248.528 154.953L183.928 154.951C174.652 138.885 170.676 124.541 172 111.918C173.546 99.2946 179.84 89.5408 190.882 82.6559C202.035 75.5798 216.887 72.0421 235.439 72.0428C254.874 72.0435 274.144 75.5825 293.248 82.6598C312.242 89.5457 329.579 99.3005 345.261 111.924C360.942 124.548 373.421 138.892 382.697 154.958C391.311 169.877 395.121 182.978 394.128 194.262C393.355 205.546 389.656 215.396 383.031 223.811C376.627 232.226 366.688 242.554 353.217 254.794L435.375 254.797L464.198 304.716L275.367 304.709L246.544 254.79Z"
-                                fill="#F0ACB8"
-                            />
-                            <path
-                                d="M246.544 254.79L246.875 254.79C253.722 247.905 264.046 238.82 277.849 227.537C291.21 216.253 301.259 207.264 307.995 200.57C314.62 193.685 319.147 186.418 321.577 178.768C324.006 171.117 322.846 163.18 318.097 154.956C312.796 145.775 305.342 138.412 295.735 132.865C286.238 127.127 276.189 124.258 265.588 124.257C255.208 124.257 248.416 127.03 245.214 132.576C241.902 137.931 243.006 145.39 248.528 154.953L183.928 154.951C174.652 138.885 170.676 124.541 172 111.918C173.546 99.2946 179.84 89.5408 190.882 82.6559C202.035 75.5798 216.887 72.0421 235.439 72.0428C254.874 72.0435 274.144 75.5825 293.248 82.6598C312.242 89.5457 329.579 99.3005 345.261 111.924C360.942 124.548 373.421 138.892 382.697 154.958C391.311 169.877 395.121 182.978 394.128 194.262C393.355 205.546 389.656 215.396 383.031 223.811C376.627 232.226 366.688 242.554 353.217 254.794L435.375 254.797L464.198 304.716L275.367 304.709L246.544 254.79Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                                stroke-linejoin="round"
-                            />
-                        </g>
-                        <g
-                            :style="{ mixBlendMode: 'hard-light' }"
-                            class="translate-y-0 opacity-100 transition-all delay-300 duration-750 starting:translate-y-4 starting:opacity-0"
-                        >
-                            <path
-                                d="M67.41 125.402L44.5515 125.401L15.5625 75.1953L101.364 75.1985L233.886 304.712L170.942 304.71L67.41 125.402Z"
-                                fill="#F0ACB8"
-                            />
-                            <path
-                                d="M67.41 125.402L44.5515 125.401L15.5625 75.1953L101.364 75.1985L233.886 304.712L170.942 304.71L67.41 125.402Z"
-                                stroke="#1B1B18"
-                                stroke-width="1"
-                            />
-                        </g>
-                    </svg>
-                    <svg
-                        class="relative -mt-[4.9rem] -ml-8 hidden w-[448px] max-w-none lg:-mt-[6.6rem] lg:ml-0 dark:block"
-                        viewBox="0 0 440 376"
-                        fill="none"
-                        xmlns="http://www.w3.org/2000/svg"
-                    >
-                        <g class="translate-y-0 opacity-100 transition-all delay-300 duration-750 starting:translate-y-4 starting:opacity-0">
-                            <path
-                                d="M188.263 355.73L188.595 355.73C195.441 348.845 205.766 339.761 219.569 328.477C232.93 317.193 242.978 308.205 249.714 301.511C256.34 294.626 260.867 287.358 263.296 279.708C265.725 272.058 264.565 264.121 259.816 255.896C254.516 246.716 247.062 239.352 237.454 233.805C227.957 228.067 217.908 225.198 207.307 225.198C196.927 225.197 190.136 227.97 186.934 233.516C183.621 238.872 184.726 246.331 190.247 255.894L125.647 255.891C116.371 239.825 112.395 225.481 113.72 212.858C115.265 200.235 121.559 190.481 132.602 183.596C143.754 176.52 158.607 172.982 177.159 172.983C196.594 172.984 215.863 176.523 234.968 183.6C253.961 190.486 271.299 200.241 286.98 212.864C302.661 225.488 315.14 239.833 324.416 255.899C333.03 270.817 336.841 283.918 335.847 295.203C335.075 306.487 331.376 316.336 324.75 324.751C318.346 333.167 308.408 343.494 294.936 355.734L377.094 355.737L405.917 405.656L217.087 405.649L188.263 355.73Z"
-                                fill="black"
-                            />
-                            <path
-                                d="M9.11884 226.339L-13.7396 226.338L-42.7286 176.132L43.0733 176.135L175.595 405.649L112.651 405.647L9.11884 226.339Z"
-                                fill="black"
-                            />
-                            <path
-                                d="M188.263 355.73L188.595 355.73C195.441 348.845 205.766 339.761 219.569 328.477C232.93 317.193 242.978 308.205 249.714 301.511C256.34 294.626 260.867 287.358 263.296 279.708C265.725 272.058 264.565 264.121 259.816 255.896C254.516 246.716 247.062 239.352 237.454 233.805C227.957 228.067 217.908 225.198 207.307 225.198C196.927 225.197 190.136 227.97 186.934 233.516C183.621 238.872 184.726 246.331 190.247 255.894L125.647 255.891C116.371 239.825 112.395 225.481 113.72 212.858C115.265 200.235 121.559 190.481 132.602 183.596C143.754 176.52 158.607 172.982 177.159 172.983C196.594 172.984 215.863 176.523 234.968 183.6C253.961 190.486 271.299 200.241 286.98 212.864C302.661 225.488 315.14 239.833 324.416 255.899C333.03 270.817 336.841 283.918 335.847 295.203C335.075 306.487 331.376 316.336 324.75 324.751C318.346 333.167 308.408 343.494 294.936 355.734L377.094 355.737L405.917 405.656L217.087 405.649L188.263 355.73Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                            />
-                            <path
-                                d="M9.11884 226.339L-13.7396 226.338L-42.7286 176.132L43.0733 176.135L175.595 405.649L112.651 405.647L9.11884 226.339Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                            />
-                            <path
-                                d="M204.592 327.449L204.923 327.449C211.769 320.564 222.094 311.479 235.897 300.196C249.258 288.912 259.306 279.923 266.042 273.23C272.668 266.345 277.195 259.077 279.624 251.427C282.053 243.777 280.893 235.839 276.145 227.615C270.844 218.435 263.39 211.071 253.782 205.524C244.285 199.786 234.236 196.917 223.635 196.916C213.255 196.916 206.464 199.689 203.262 205.235C199.949 210.59 201.054 218.049 206.575 227.612L141.975 227.61C132.699 211.544 128.723 197.2 130.048 184.577C131.593 171.954 137.887 162.2 148.93 155.315C160.083 148.239 174.935 144.701 193.487 144.702C212.922 144.703 232.192 148.242 251.296 155.319C270.289 162.205 287.627 171.96 303.308 184.583C318.989 197.207 331.468 211.552 340.745 227.618C349.358 242.536 353.169 255.637 352.175 266.921C351.403 278.205 347.704 288.055 341.078 296.47C334.674 304.885 324.736 315.213 311.264 327.453L393.422 327.456L422.246 377.375L233.415 377.368L204.592 327.449Z"
-                                fill="#391800"
-                            />
-                            <path
-                                d="M25.447 198.058L2.58852 198.057L-26.4005 147.851L59.4015 147.854L191.923 377.368L128.979 377.365L25.447 198.058Z"
-                                fill="#391800"
-                            />
-                            <path
-                                d="M204.592 327.449L204.923 327.449C211.769 320.564 222.094 311.479 235.897 300.196C249.258 288.912 259.306 279.923 266.042 273.23C272.668 266.345 277.195 259.077 279.624 251.427C282.053 243.777 280.893 235.839 276.145 227.615C270.844 218.435 263.39 211.071 253.782 205.524C244.285 199.786 234.236 196.917 223.635 196.916C213.255 196.916 206.464 199.689 203.262 205.235C199.949 210.59 201.054 218.049 206.575 227.612L141.975 227.61C132.699 211.544 128.723 197.2 130.048 184.577C131.593 171.954 137.887 162.2 148.93 155.315C160.083 148.239 174.935 144.701 193.487 144.702C212.922 144.703 232.192 148.242 251.296 155.319C270.289 162.205 287.627 171.96 303.308 184.583C318.989 197.207 331.468 211.552 340.745 227.618C349.358 242.536 353.169 255.637 352.175 266.921C351.403 278.205 347.704 288.055 341.078 296.47C334.674 304.885 324.736 315.213 311.264 327.453L393.422 327.456L422.246 377.375L233.415 377.368L204.592 327.449Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                            />
-                            <path
-                                d="M25.447 198.058L2.58852 198.057L-26.4005 147.851L59.4015 147.854L191.923 377.368L128.979 377.365L25.447 198.058Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                            />
-                        </g>
-                        <g
-                            class="translate-y-0 opacity-100 transition-all delay-300 duration-750 starting:translate-y-4 starting:opacity-0"
-                            :style="{ mixBlendMode: 'hard-light' }"
-                        >
-                            <path
-                                d="M217.342 305.363L217.673 305.363C224.519 298.478 234.844 289.393 248.647 278.11C262.008 266.826 272.056 257.837 278.792 251.144C285.418 244.259 289.945 236.991 292.374 229.341C294.803 221.691 293.643 213.753 288.895 205.529C283.594 196.349 276.14 188.985 266.532 183.438C257.035 177.7 246.986 174.831 236.385 174.83C226.005 174.83 219.214 177.603 216.012 183.149C212.699 188.504 213.804 195.963 219.325 205.527L154.725 205.524C145.449 189.458 141.473 175.114 142.798 162.491C144.343 149.868 150.637 140.114 161.68 133.229C172.833 126.153 187.685 122.615 206.237 122.616C225.672 122.617 244.942 126.156 264.046 133.233C283.039 140.119 300.377 149.874 316.058 162.497C331.739 175.121 344.218 189.466 353.495 205.532C362.108 220.45 365.919 233.551 364.925 244.835C364.153 256.12 360.454 265.969 353.828 274.384C347.424 282.799 337.486 293.127 324.014 305.367L406.172 305.37L434.996 355.289L246.165 355.282L217.342 305.363Z"
-                                fill="#733000"
-                            />
-                            <path
-                                d="M38.197 175.972L15.3385 175.971L-13.6505 125.765L72.1515 125.768L204.673 355.282L141.729 355.279L38.197 175.972Z"
-                                fill="#733000"
-                            />
-                            <path
-                                d="M217.342 305.363L217.673 305.363C224.519 298.478 234.844 289.393 248.647 278.11C262.008 266.826 272.056 257.837 278.792 251.144C285.418 244.259 289.945 236.991 292.374 229.341C294.803 221.691 293.643 213.753 288.895 205.529C283.594 196.349 276.14 188.985 266.532 183.438C257.035 177.7 246.986 174.831 236.385 174.83C226.005 174.83 219.214 177.603 216.012 183.149C212.699 188.504 213.804 195.963 219.325 205.527L154.725 205.524C145.449 189.458 141.473 175.114 142.798 162.491C144.343 149.868 150.637 140.114 161.68 133.229C172.833 126.153 187.685 122.615 206.237 122.616C225.672 122.617 244.942 126.156 264.046 133.233C283.039 140.119 300.377 149.874 316.058 162.497C331.739 175.121 344.218 189.466 353.495 205.532C362.108 220.45 365.919 233.551 364.925 244.835C364.153 256.12 360.454 265.969 353.828 274.384C347.424 282.799 337.486 293.127 324.014 305.367L406.172 305.37L434.996 355.289L246.165 355.282L217.342 305.363Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                            />
-                            <path
-                                d="M38.197 175.972L15.3385 175.971L-13.6505 125.765L72.1515 125.768L204.673 355.282L141.729 355.279L38.197 175.972Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                            />
-                        </g>
-                        <g class="translate-y-0 opacity-100 transition-all delay-300 duration-750 starting:translate-y-4 starting:opacity-0">
-                            <path
-                                d="M217.342 305.363L217.673 305.363C224.519 298.478 234.844 289.393 248.647 278.11C262.008 266.826 272.056 257.837 278.792 251.144C285.418 244.259 289.945 236.991 292.374 229.341C294.803 221.691 293.643 213.753 288.895 205.529C283.594 196.349 276.14 188.985 266.532 183.438C257.035 177.7 246.986 174.831 236.385 174.83C226.005 174.83 219.214 177.603 216.012 183.149C212.699 188.504 213.804 195.963 219.325 205.527L154.726 205.524C145.449 189.458 141.473 175.114 142.798 162.491C144.343 149.868 150.637 140.114 161.68 133.229C172.833 126.153 187.685 122.615 206.237 122.616C225.672 122.617 244.942 126.156 264.046 133.233C283.039 140.119 300.377 149.874 316.058 162.497C331.739 175.121 344.218 189.466 353.495 205.532C362.108 220.45 365.919 233.551 364.925 244.835C364.153 256.12 360.454 265.969 353.828 274.384C347.424 282.799 337.486 293.127 324.014 305.367L406.172 305.37L434.996 355.289L246.165 355.282L217.342 305.363Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                            />
-                            <path
-                                d="M38.197 175.972L15.3385 175.971L-13.6505 125.765L72.1515 125.768L204.673 355.282L141.729 355.279L38.197 175.972Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                            />
-                        </g>
-                        <g class="translate-y-0 opacity-100 transition-all delay-300 duration-750 starting:translate-y-4 starting:opacity-0">
-                            <path
-                                d="M188.467 355.363L188.798 355.363C195.644 348.478 205.969 339.393 219.772 328.11C233.133 316.826 243.181 307.837 249.917 301.144C253.696 297.217 256.792 293.166 259.205 288.991C261.024 285.845 262.455 282.628 263.499 279.341C265.928 271.691 264.768 263.753 260.02 255.529C254.719 246.349 247.265 238.985 237.657 233.438C228.16 227.7 218.111 224.831 207.51 224.83C197.13 224.83 190.339 227.603 187.137 233.149C183.824 238.504 184.929 245.963 190.45 255.527L125.851 255.524C116.574 239.458 112.598 225.114 113.923 212.491C114.615 206.836 116.261 201.756 118.859 197.253C122.061 191.704 126.709 187.03 132.805 183.229C143.958 176.153 158.81 172.615 177.362 172.616C196.797 172.617 216.067 176.156 235.171 183.233C254.164 190.119 271.502 199.874 287.183 212.497C302.864 225.121 315.343 239.466 324.62 255.532C333.233 270.45 337.044 283.551 336.05 294.835C335.46 303.459 333.16 311.245 329.151 318.194C327.915 320.337 326.515 322.4 324.953 324.384C318.549 332.799 308.611 343.127 295.139 355.367L377.297 355.37L406.121 405.289L217.29 405.282L188.467 355.363Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M9.32197 225.972L-13.5365 225.971L-42.5255 175.765L43.2765 175.768L175.798 405.282L112.854 405.279L9.32197 225.972Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M345.247 111.915C329.566 99.2919 312.229 89.5371 293.235 82.6512L235.167 183.228C254.161 190.114 271.498 199.869 287.179 212.492L345.247 111.915Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M382.686 154.964C373.41 138.898 360.931 124.553 345.25 111.93L287.182 212.506C302.863 225.13 315.342 239.475 324.618 255.541L382.686 154.964Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M293.243 82.6472C274.139 75.57 254.869 72.031 235.434 72.0303L177.366 172.607C196.801 172.608 216.071 176.147 235.175 183.224L293.243 82.6472Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M394.118 194.257C395.112 182.973 391.301 169.872 382.688 154.953L324.619 255.53C333.233 270.448 337.044 283.55 336.05 294.834L394.118 194.257Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M235.432 72.0311C216.88 72.0304 202.027 75.5681 190.875 82.6442L132.806 183.221C143.959 176.145 158.812 172.607 177.363 172.608L235.432 72.0311Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M265.59 124.25C276.191 124.251 286.24 127.12 295.737 132.858L237.669 233.435C228.172 227.697 218.123 224.828 207.522 224.827L265.59 124.25Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M295.719 132.859C305.326 138.406 312.78 145.77 318.081 154.95L260.013 255.527C254.712 246.347 247.258 238.983 237.651 233.436L295.719 132.859Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M387.218 217.608C391.227 210.66 393.527 202.874 394.117 194.25L336.049 294.827C335.459 303.451 333.159 311.237 329.15 318.185L387.218 217.608Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M245.211 132.577C248.413 127.03 255.204 124.257 265.584 124.258L207.516 224.835C197.136 224.834 190.345 227.607 187.143 233.154L245.211 132.577Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M318.094 154.945C322.842 163.17 324.002 171.107 321.573 178.757L263.505 279.334C265.934 271.684 264.774 263.746 260.026 255.522L318.094 154.945Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M176.925 96.6737C180.127 91.1249 184.776 86.4503 190.871 82.6499L132.803 183.227C126.708 187.027 122.059 191.702 118.857 197.25L176.925 96.6737Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M387.226 217.606C385.989 219.749 384.59 221.813 383.028 223.797L324.96 324.373C326.522 322.39 327.921 320.326 329.157 318.183L387.226 217.606Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M317.269 188.408C319.087 185.262 320.519 182.045 321.562 178.758L263.494 279.335C262.451 282.622 261.019 285.839 259.201 288.985L317.269 188.408Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M245.208 132.573C241.895 137.928 243 145.387 248.522 154.95L190.454 255.527C184.932 245.964 183.827 238.505 187.14 233.15L245.208 132.573Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M176.93 96.6719C174.331 101.175 172.686 106.255 171.993 111.91L113.925 212.487C114.618 206.831 116.263 201.752 118.862 197.249L176.93 96.6719Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M317.266 188.413C314.853 192.589 311.757 196.64 307.978 200.566L249.91 301.143C253.689 297.216 256.785 293.166 259.198 288.99L317.266 188.413Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M464.198 304.708L435.375 254.789L377.307 355.366L406.13 405.285L464.198 304.708Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M353.209 254.787C366.68 242.548 376.618 232.22 383.023 223.805L324.955 324.382C318.55 332.797 308.612 343.124 295.141 355.364L353.209 254.787Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M435.37 254.787L353.212 254.784L295.144 355.361L377.302 355.364L435.37 254.787Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M183.921 154.947L248.521 154.95L190.453 255.527L125.853 255.524L183.921 154.947Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M171.992 111.914C170.668 124.537 174.643 138.881 183.92 154.947L125.852 255.524C116.575 239.458 112.599 225.114 113.924 212.491L171.992 111.914Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M307.987 200.562C301.251 207.256 291.203 216.244 277.842 227.528L219.774 328.105C233.135 316.821 243.183 307.832 249.919 301.139L307.987 200.562Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M15.5469 75.1797L44.5359 125.386L-13.5321 225.963L-42.5212 175.756L15.5469 75.1797Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M277.836 227.536C264.033 238.82 253.708 247.904 246.862 254.789L188.794 355.366C195.64 348.481 205.965 339.397 219.768 328.113L277.836 227.536Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M275.358 304.706L464.189 304.713L406.12 405.29L217.29 405.283L275.358 304.706Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M44.5279 125.39L67.3864 125.39L9.31834 225.967L-13.5401 225.966L44.5279 125.39Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M101.341 75.1911L233.863 304.705L175.795 405.282L43.2733 175.768L101.341 75.1911ZM15.5431 75.19L-42.525 175.767L43.277 175.77L101.345 75.1932L15.5431 75.19Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M246.866 254.784L246.534 254.784L188.466 355.361L188.798 355.361L246.866 254.784Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M246.539 254.781L275.362 304.701L217.294 405.277L188.471 355.358L246.539 254.781Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M67.3906 125.391L170.923 304.698L112.855 405.275L9.32257 225.967L67.3906 125.391Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                            <path
-                                d="M170.921 304.699L233.865 304.701L175.797 405.278L112.853 405.276L170.921 304.699Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                                stroke-linejoin="bevel"
-                            />
-                        </g>
-                        <g
-                            class="translate-y-0 opacity-100 transition-all delay-300 duration-750 starting:translate-y-4 starting:opacity-0"
-                            :style="{ mixBlendMode: 'hard-light' }"
-                        >
-                            <path
-                                d="M246.544 254.79L246.875 254.79C253.722 247.905 264.046 238.82 277.849 227.537C291.21 216.253 301.259 207.264 307.995 200.57C314.62 193.685 319.147 186.418 321.577 178.768C324.006 171.117 322.846 163.18 318.097 154.956C312.796 145.775 305.342 138.412 295.735 132.865C286.238 127.127 276.189 124.258 265.588 124.257C255.208 124.257 248.416 127.03 245.214 132.576C241.902 137.931 243.006 145.39 248.528 154.953L183.928 154.951C174.652 138.885 170.676 124.541 172 111.918C173.546 99.2946 179.84 89.5408 190.882 82.6559C202.035 75.5798 216.887 72.0421 235.439 72.0428C254.874 72.0435 274.144 75.5825 293.248 82.6598C312.242 89.5457 329.579 99.3005 345.261 111.924C360.942 124.548 373.421 138.892 382.697 154.958C391.311 169.877 395.121 182.978 394.128 194.262C393.355 205.546 389.656 215.396 383.031 223.811C376.627 232.226 366.688 242.554 353.217 254.794L435.375 254.797L464.198 304.716L275.367 304.709L246.544 254.79Z"
-                                fill="#4B0600"
-                            />
-                            <path
-                                d="M246.544 254.79L246.875 254.79C253.722 247.905 264.046 238.82 277.849 227.537C291.21 216.253 301.259 207.264 307.995 200.57C314.62 193.685 319.147 186.418 321.577 178.768C324.006 171.117 322.846 163.18 318.097 154.956C312.796 145.775 305.342 138.412 295.735 132.865C286.238 127.127 276.189 124.258 265.588 124.257C255.208 124.257 248.416 127.03 245.214 132.576C241.902 137.931 243.006 145.39 248.528 154.953L183.928 154.951C174.652 138.885 170.676 124.541 172 111.918C173.546 99.2946 179.84 89.5408 190.882 82.6559C202.035 75.5798 216.887 72.0421 235.439 72.0428C254.874 72.0435 274.144 75.5825 293.248 82.6598C312.242 89.5457 329.579 99.3005 345.261 111.924C360.942 124.548 373.421 138.892 382.697 154.958C391.311 169.877 395.121 182.978 394.128 194.262C393.355 205.546 389.656 215.396 383.031 223.811C376.627 232.226 366.688 242.554 353.217 254.794L435.375 254.797L464.198 304.716L275.367 304.709L246.544 254.79Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                                stroke-linejoin="round"
-                            />
-                        </g>
-                        <g
-                            class="translate-y-0 opacity-100 transition-all delay-300 duration-750 starting:translate-y-4 starting:opacity-0"
-                            :style="{ mixBlendMode: 'hard-light' }"
-                        >
-                            <path
-                                d="M67.41 125.402L44.5515 125.401L15.5625 75.1953L101.364 75.1985L233.886 304.712L170.942 304.71L67.41 125.402Z"
-                                fill="#4B0600"
-                            />
-                            <path
-                                d="M67.41 125.402L44.5515 125.401L15.5625 75.1953L101.364 75.1985L233.886 304.712L170.942 304.71L67.41 125.402Z"
-                                stroke="#FF750F"
-                                stroke-width="1"
-                            />
-                        </g>
-                    </svg>
-                    <div
-                        class="absolute inset-0 rounded-t-lg shadow-[inset_0px_0px_0px_1px_rgba(26,26,0,0.16)] lg:overflow-hidden lg:rounded-t-none lg:rounded-r-lg dark:shadow-[inset_0px_0px_0px_1px_#fffaed2d]"
-                    />
-                </div>
-            </main>
-        </div>
-        <div class="hidden h-14.5 lg:block"></div>
-    </div>
+    <div>Hello</div>
 </template>
+
+<style scoped>
+
+</style>
diff --git a/resources/js/pages/auth/ConfirmPassword.vue b/resources/js/pages/auth/ConfirmPassword.vue
deleted file mode 100644
index 92a777a..0000000
--- a/resources/js/pages/auth/ConfirmPassword.vue
+++ /dev/null
@@ -1,42 +0,0 @@
-<script setup lang="ts">
-import InputError from '@/components/InputError.vue';
-import { Button } from '@/components/ui/button';
-import { Input } from '@/components/ui/input';
-import { Label } from '@/components/ui/label';
-import AuthLayout from '@/layouts/AuthLayout.vue';
-import { store } from '@/routes/password/confirm';
-import { Form, Head } from '@inertiajs/vue3';
-import { LoaderCircle } from 'lucide-vue-next';
-</script>
-
-<template>
-    <AuthLayout title="Confirm your password" description="This is a secure area of the application. Please confirm your password before continuing.">
-        <Head title="Confirm password" />
-
-        <Form v-bind="store.form()" reset-on-success v-slot="{ errors, processing }">
-            <div class="space-y-6">
-                <div class="grid gap-2">
-                    <Label htmlFor="password">Password</Label>
-                    <Input
-                        id="password"
-                        type="password"
-                        name="password"
-                        class="mt-1 block w-full"
-                        required
-                        autocomplete="current-password"
-                        autofocus
-                    />
-
-                    <InputError :message="errors.password" />
-                </div>
-
-                <div class="flex items-center">
-                    <Button class="w-full" :disabled="processing" data-test="confirm-password-button">
-                        <LoaderCircle v-if="processing" class="h-4 w-4 animate-spin" />
-                        Confirm Password
-                    </Button>
-                </div>
-            </div>
-        </Form>
-    </AuthLayout>
-</template>
diff --git a/resources/js/pages/auth/ForgotPassword.vue b/resources/js/pages/auth/ForgotPassword.vue
deleted file mode 100644
index 6950b67..0000000
--- a/resources/js/pages/auth/ForgotPassword.vue
+++ /dev/null
@@ -1,48 +0,0 @@
-<script setup lang="ts">
-import PasswordResetLinkController from '@/actions/App/Http/Controllers/Auth/PasswordResetLinkController';
-import InputError from '@/components/InputError.vue';
-import TextLink from '@/components/TextLink.vue';
-import { Button } from '@/components/ui/button';
-import { Input } from '@/components/ui/input';
-import { Label } from '@/components/ui/label';
-import AuthLayout from '@/layouts/AuthLayout.vue';
-import { login } from '@/routes';
-import { Form, Head } from '@inertiajs/vue3';
-import { LoaderCircle } from 'lucide-vue-next';
-
-defineProps<{
-    status?: string;
-}>();
-</script>
-
-<template>
-    <AuthLayout title="Forgot password" description="Enter your email to receive a password reset link">
-        <Head title="Forgot password" />
-
-        <div v-if="status" class="mb-4 text-center text-sm font-medium text-green-600">
-            {{ status }}
-        </div>
-
-        <div class="space-y-6">
-            <Form v-bind="PasswordResetLinkController.store.form()" v-slot="{ errors, processing }">
-                <div class="grid gap-2">
-                    <Label for="email">Email address</Label>
-                    <Input id="email" type="email" name="email" autocomplete="off" autofocus placeholder="email@example.com" />
-                    <InputError :message="errors.email" />
-                </div>
-
-                <div class="my-6 flex items-center justify-start">
-                    <Button class="w-full" :disabled="processing" data-test="email-password-reset-link-button">
-                        <LoaderCircle v-if="processing" class="h-4 w-4 animate-spin" />
-                        Email password reset link
-                    </Button>
-                </div>
-            </Form>
-
-            <div class="space-x-1 text-center text-sm text-muted-foreground">
-                <span>Or, return to</span>
-                <TextLink :href="login()">log in</TextLink>
-            </div>
-        </div>
-    </AuthLayout>
-</template>
diff --git a/resources/js/pages/auth/Login.vue b/resources/js/pages/auth/Login.vue
deleted file mode 100644
index 52d8637..0000000
--- a/resources/js/pages/auth/Login.vue
+++ /dev/null
@@ -1,87 +0,0 @@
-<script setup lang="ts">
-import AuthenticatedSessionController from '@/actions/App/Http/Controllers/Auth/AuthenticatedSessionController';
-import InputError from '@/components/InputError.vue';
-import TextLink from '@/components/TextLink.vue';
-import { Button } from '@/components/ui/button';
-import { Checkbox } from '@/components/ui/checkbox';
-import { Input } from '@/components/ui/input';
-import { Label } from '@/components/ui/label';
-import AuthBase from '@/layouts/AuthLayout.vue';
-import { register } from '@/routes';
-import { request } from '@/routes/password';
-import { Form, Head } from '@inertiajs/vue3';
-import { LoaderCircle } from 'lucide-vue-next';
-
-defineProps<{
-    status?: string;
-    canResetPassword: boolean;
-}>();
-</script>
-
-<template>
-    <AuthBase title="Log in to your account" description="Enter your email and password below to log in">
-        <Head title="Log in" />
-
-        <div v-if="status" class="mb-4 text-center text-sm font-medium text-green-600">
-            {{ status }}
-        </div>
-
-        <Form
-            v-bind="AuthenticatedSessionController.store.form()"
-            :reset-on-success="['password']"
-            v-slot="{ errors, processing }"
-            class="flex flex-col gap-6"
-        >
-            <div class="grid gap-6">
-                <div class="grid gap-2">
-                    <Label for="email">Email address</Label>
-                    <Input
-                        id="email"
-                        type="email"
-                        name="email"
-                        required
-                        autofocus
-                        :tabindex="1"
-                        autocomplete="email"
-                        placeholder="email@example.com"
-                    />
-                    <InputError :message="errors.email" />
-                </div>
-
-                <div class="grid gap-2">
-                    <div class="flex items-center justify-between">
-                        <Label for="password">Password</Label>
-                        <TextLink v-if="canResetPassword" :href="request()" class="text-sm" :tabindex="5"> Forgot password? </TextLink>
-                    </div>
-                    <Input
-                        id="password"
-                        type="password"
-                        name="password"
-                        required
-                        :tabindex="2"
-                        autocomplete="current-password"
-                        placeholder="Password"
-                    />
-                    <InputError :message="errors.password" />
-                </div>
-
-                <div class="flex items-center justify-between">
-                    <Label for="remember" class="flex items-center space-x-3">
-                        <Checkbox id="remember" name="remember" :tabindex="3" />
-                        <span>Remember me</span>
-                    </Label>
-                </div>
-
-                <Button type="submit" class="mt-4 w-full" :tabindex="4" :disabled="processing" data-test="login-button">
-                    <LoaderCircle v-if="processing" class="h-4 w-4 animate-spin" />
-                    Log in
-                </Button>
-            </div>
-
-            <div class="text-center text-sm text-muted-foreground">
-                Don't have an account?
-                <TextLink :href="register()" :tabindex="5">Sign up</TextLink>
-            </div>
-        </Form>
-    </AuthBase>
-</template>
diff --git a/resources/js/pages/auth/Register.vue b/resources/js/pages/auth/Register.vue
deleted file mode 100644
index de50736..0000000
--- a/resources/js/pages/auth/Register.vue
+++ /dev/null
@@ -1,69 +0,0 @@
-<script setup lang="ts">
-import RegisteredUserController from '@/actions/App/Http/Controllers/Auth/RegisteredUserController';
-import InputError from '@/components/InputError.vue';
-import TextLink from '@/components/TextLink.vue';
-import { Button } from '@/components/ui/button';
-import { Input } from '@/components/ui/input';
-import { Label } from '@/components/ui/label';
-import AuthBase from '@/layouts/AuthLayout.vue';
-import { login } from '@/routes';
-import { Form, Head } from '@inertiajs/vue3';
-import { LoaderCircle } from 'lucide-vue-next';
-</script>
-
-<template>
-    <AuthBase title="Create an account" description="Enter your details below to create your account">
-        <Head title="Register" />
-
-        <Form
-            v-bind="RegisteredUserController.store.form()"
-            :reset-on-success="['password', 'password_confirmation']"
-            v-slot="{ errors, processing }"
-            class="flex flex-col gap-6"
-        >
-            <div class="grid gap-6">
-                <div class="grid gap-2">
-                    <Label for="name">Name</Label>
-                    <Input id="name" type="text" required autofocus :tabindex="1" autocomplete="name" name="name" placeholder="Full name" />
-                    <InputError :message="errors.name" />
-                </div>
-
-                <div class="grid gap-2">
-                    <Label for="email">Email address</Label>
-                    <Input id="email" type="email" required :tabindex="2" autocomplete="email" name="email" placeholder="email@example.com" />
-                    <InputError :message="errors.email" />
-                </div>
-
-                <div class="grid gap-2">
-                    <Label for="password">Password</Label>
-                    <Input id="password" type="password" required :tabindex="3" autocomplete="new-password" name="password" placeholder="Password" />
-                    <InputError :message="errors.password" />
-                </div>
-
-                <div class="grid gap-2">
-                    <Label for="password_confirmation">Confirm password</Label>
-                    <Input
-                        id="password_confirmation"
-                        type="password"
-                        required
-                        :tabindex="4"
-                        autocomplete="new-password"
-                        name="password_confirmation"
-                        placeholder="Confirm password"
-                    />
-                    <InputError :message="errors.password_confirmation" />
-                </div>
-
-                <Button type="submit" class="mt-2 w-full" tabindex="5" :disabled="processing" data-test="register-user-button">
-                    <LoaderCircle v-if="processing" class="h-4 w-4 animate-spin" />
-                    Create account
-                </Button>
-            </div>
-
-            <div class="text-center text-sm text-muted-foreground">
-                Already have an account?
-                <TextLink :href="login()" class="underline underline-offset-4" :tabindex="6">Log in</TextLink>
-            </div>
-        </Form>
-    </AuthBase>
-</template>
diff --git a/resources/js/pages/auth/ResetPassword.vue b/resources/js/pages/auth/ResetPassword.vue
deleted file mode 100644
index 8642d44..0000000
--- a/resources/js/pages/auth/ResetPassword.vue
+++ /dev/null
@@ -1,71 +0,0 @@
-<script setup lang="ts">
-import NewPasswordController from '@/actions/App/Http/Controllers/Auth/NewPasswordController';
-import InputError from '@/components/InputError.vue';
-import { Button } from '@/components/ui/button';
-import { Input } from '@/components/ui/input';
-import { Label } from '@/components/ui/label';
-import AuthLayout from '@/layouts/AuthLayout.vue';
-import { Form, Head } from '@inertiajs/vue3';
-import { LoaderCircle } from 'lucide-vue-next';
-import { ref } from 'vue';
-
-const props = defineProps<{
-    token: string;
-    email: string;
-}>();
-
-const inputEmail = ref(props.email);
-</script>
-
-<template>
-    <AuthLayout title="Reset password" description="Please enter your new password below">
-        <Head title="Reset password" />
-
-        <Form
-            v-bind="NewPasswordController.store.form()"
-            :transform="(data) => ({ ...data, token, email })"
-            :reset-on-success="['password', 'password_confirmation']"
-            v-slot="{ errors, processing }"
-        >
-            <div class="grid gap-6">
-                <div class="grid gap-2">
-                    <Label for="email">Email</Label>
-                    <Input id="email" type="email" name="email" autocomplete="email" v-model="inputEmail" class="mt-1 block w-full" readonly />
-                    <InputError :message="errors.email" class="mt-2" />
-                </div>
-
-                <div class="grid gap-2">
-                    <Label for="password">Password</Label>
-                    <Input
-                        id="password"
-                        type="password"
-                        name="password"
-                        autocomplete="new-password"
-                        class="mt-1 block w-full"
-                        autofocus
-                        placeholder="Password"
-                    />
-                    <InputError :message="errors.password" />
-                </div>
-
-                <div class="grid gap-2">
-                    <Label for="password_confirmation"> Confirm Password </Label>
-                    <Input
-                        id="password_confirmation"
-                        type="password"
-                        name="password_confirmation"
-                        autocomplete="new-password"
-                        class="mt-1 block w-full"
-                        placeholder="Confirm password"
-                    />
-                    <InputError :message="errors.password_confirmation" />
-                </div>
-
-                <Button type="submit" class="mt-4 w-full" :disabled="processing" data-test="reset-password-button">
-                    <LoaderCircle v-if="processing" class="h-4 w-4 animate-spin" />
-                    Reset password
-                </Button>
-            </div>
-        </Form>
-    </AuthLayout>
-</template>
diff --git a/resources/js/pages/auth/TwoFactorChallenge.vue b/resources/js/pages/auth/TwoFactorChallenge.vue
deleted file mode 100644
index 5e8ca2c..0000000
--- a/resources/js/pages/auth/TwoFactorChallenge.vue
+++ /dev/null
@@ -1,97 +0,0 @@
-<script setup lang="ts">
-import InputError from '@/components/InputError.vue';
-import { Button } from '@/components/ui/button';
-import { Input } from '@/components/ui/input';
-import { PinInput, PinInputGroup, PinInputSlot } from '@/components/ui/pin-input';
-import AuthLayout from '@/layouts/AuthLayout.vue';
-import { store } from '@/routes/two-factor/login';
-import { Form, Head } from '@inertiajs/vue3';
-import { computed, ref } from 'vue';
-
-interface AuthConfigContent {
-    title: string;
-    description: string;
-    toggleText: string;
-}
-
-const authConfigContent = computed<AuthConfigContent>(() => {
-    if (showRecoveryInput.value) {
-        return {
-            title: 'Recovery Code',
-            description: 'Please confirm access to your account by entering one of your emergency recovery codes.',
-            toggleText: 'login using an authentication code',
-        };
-    }
-
-    return {
-        title: 'Authentication Code',
-        description: 'Enter the authentication code provided by your authenticator application.',
-        toggleText: 'login using a recovery code',
-    };
-});
-
-const showRecoveryInput = ref<boolean>(false);
-
-const toggleRecoveryMode = (clearErrors: () => void): void => {
-    showRecoveryInput.value = !showRecoveryInput.value;
-    clearErrors();
-    code.value = [];
-};
-
-const code = ref<number[]>([]);
-const codeValue = computed<string>(() => code.value.join(''));
-</script>
-
-<template>
-    <AuthLayout :title="authConfigContent.title" :description="authConfigContent.description">
-        <Head title="Two-Factor Authentication" />
-
-        <div class="space-y-6">
-            <template v-if="!showRecoveryInput">
-                <Form v-bind="store.form()" class="space-y-4" reset-on-error @error="code = []" #default="{ errors, processing, clearErrors }">
-                    <input type="hidden" name="code" :value="codeValue" />
-                    <div class="flex flex-col items-center justify-center space-y-3 text-center">
-                        <div class="flex w-full items-center justify-center">
-                            <PinInput id="otp" placeholder="○" v-model="code" type="number" otp>
-                                <PinInputGroup>
-                                    <PinInputSlot v-for="(id, index) in 6" :key="id" :index="index" :disabled="processing" autofocus />
-                                </PinInputGroup>
-                            </PinInput>
-                        </div>
-                        <InputError :message="errors.code" />
-                    </div>
-                    <Button type="submit" class="w-full" :disabled="processing">Continue</Button>
-                    <div class="text-center text-sm text-muted-foreground">
-                        <span>or you can </span>
-                        <button
-                            type="button"
-                            class="text-foreground underline decoration-neutral-300 underline-offset-4 transition-colors duration-300 ease-out hover:decoration-current! dark:decoration-neutral-500"
-                            @click="() => toggleRecoveryMode(clearErrors)"
-                        >
-                            {{ authConfigContent.toggleText }}
-                        </button>
-                    </div>
-                </Form>
-            </template>
-
-            <template v-else>
-                <Form v-bind="store.form()" class="space-y-4" reset-on-error #default="{ errors, processing, clearErrors }">
-                    <Input name="recovery_code" type="text" placeholder="Enter recovery code" :autofocus="showRecoveryInput" required />
-                    <InputError :message="errors.recovery_code" />
-                    <Button type="submit" class="w-full" :disabled="processing">Continue</Button>
-
-                    <div class="text-center text-sm text-muted-foreground">
-                        <span>or you can </span>
-                        <button
-                            type="button"
-                            class="text-foreground underline decoration-neutral-300 underline-offset-4 transition-colors duration-300 ease-out hover:decoration-current! dark:decoration-neutral-500"
-                            @click="() => toggleRecoveryMode(clearErrors)"
-                        >
-                            {{ authConfigContent.toggleText }}
-                        </button>
-                    </div>
-                </Form>
-            </template>
-        </div>
-    </AuthLayout>
-</template>
diff --git a/resources/js/pages/auth/VerifyEmail.vue b/resources/js/pages/auth/VerifyEmail.vue
deleted file mode 100644
index c520c3d..0000000
--- a/resources/js/pages/auth/VerifyEmail.vue
+++ /dev/null
@@ -1,32 +0,0 @@
-<script setup lang="ts">
-import EmailVerificationNotificationController from '@/actions/App/Http/Controllers/Auth/EmailVerificationNotificationController';
-import TextLink from '@/components/TextLink.vue';
-import { Button } from '@/components/ui/button';
-import AuthLayout from '@/layouts/AuthLayout.vue';
-import { logout } from '@/routes';
-import { Form, Head } from '@inertiajs/vue3';
-import { LoaderCircle } from 'lucide-vue-next';
-
-defineProps<{
-    status?: string;
-}>();
-</script>
-
-<template>
-    <AuthLayout title="Verify email" description="Please verify your email address by clicking on the link we just emailed to you.">
-        <Head title="Email verification" />
-
-        <div v-if="status === 'verification-link-sent'" class="mb-4 text-center text-sm font-medium text-green-600">
-            A new verification link has been sent to the email address you provided during registration.
-        </div>
-
-        <Form v-bind="EmailVerificationNotificationController.store.form()" class="space-y-6 text-center" v-slot="{ processing }">
-            <Button :disabled="processing" variant="secondary">
-                <LoaderCircle v-if="processing" class="h-4 w-4 animate-spin" />
-                Resend verification email
-            </Button>
-
-            <TextLink :href="logout()" as="button" class="mx-auto block text-sm"> Log out </TextLink>
-        </Form>
-    </AuthLayout>
-</template>
diff --git a/resources/js/pages/settings/Appearance.vue b/resources/js/pages/settings/Appearance.vue
deleted file mode 100644
index 85dd464..0000000
--- a/resources/js/pages/settings/Appearance.vue
+++ /dev/null
@@ -1,31 +0,0 @@
-<script setup lang="ts">
-import { Head } from '@inertiajs/vue3';
-
-import AppearanceTabs from '@/components/AppearanceTabs.vue';
-import HeadingSmall from '@/components/HeadingSmall.vue';
-import { type BreadcrumbItem } from '@/types';
-
-import AppLayout from '@/layouts/AppLayout.vue';
-import SettingsLayout from '@/layouts/settings/Layout.vue';
-import { appearance } from '@/routes';
-
-const breadcrumbItems: BreadcrumbItem[] = [
-    {
-        title: 'Appearance settings',
-        href: appearance().url,
-    },
-];
-</script>
-
-<template>
-    <AppLayout :breadcrumbs="breadcrumbItems">
-        <Head title="Appearance settings" />
-
-        <SettingsLayout>
-            <div class="space-y-6">
-                <HeadingSmall title="Appearance settings" description="Update your account's appearance settings" />
-                <AppearanceTabs />
-            </div>
-        </SettingsLayout>
-    </AppLayout>
-</template>
diff --git a/resources/js/pages/settings/Password.vue b/resources/js/pages/settings/Password.vue
deleted file mode 100644
index 6514889..0000000
--- a/resources/js/pages/settings/Password.vue
+++ /dev/null
@@ -1,102 +0,0 @@
-<script setup lang="ts">
-import PasswordController from '@/actions/App/Http/Controllers/Settings/PasswordController';
-import InputError from '@/components/InputError.vue';
-import AppLayout from '@/layouts/AppLayout.vue';
-import SettingsLayout from '@/layouts/settings/Layout.vue';
-import { edit } from '@/routes/password';
-import { Form, Head } from '@inertiajs/vue3';
-import { ref } from 'vue';
-
-import HeadingSmall from '@/components/HeadingSmall.vue';
-import { Button } from '@/components/ui/button';
-import { Input } from '@/components/ui/input';
-import { Label } from '@/components/ui/label';
-import { type BreadcrumbItem } from '@/types';
-
-const breadcrumbItems: BreadcrumbItem[] = [
-    {
-        title: 'Password settings',
-        href: edit().url,
-    },
-];
-
-const passwordInput = ref<HTMLInputElement | null>(null);
-const currentPasswordInput = ref<HTMLInputElement | null>(null);
-</script>
-
-<template>
-    <AppLayout :breadcrumbs="breadcrumbItems">
-        <Head title="Password settings" />
-
-        <SettingsLayout>
-            <div class="space-y-6">
-                <HeadingSmall title="Update password" description="Ensure your account is using a long, random password to stay secure" />
-
-                <Form
-                    v-bind="PasswordController.update.form()"
-                    :options="{
-                        preserveScroll: true,
-                    }"
-                    reset-on-success
-                    :reset-on-error="['password', 'password_confirmation', 'current_password']"
-                    class="space-y-6"
-                    v-slot="{ errors, processing, recentlySuccessful }"
-                >
-                    <div class="grid gap-2">
-                        <Label for="current_password">Current password</Label>
-                        <Input
-                            id="current_password"
-                            ref="currentPasswordInput"
-                            name="current_password"
-                            type="password"
-                            class="mt-1 block w-full"
-                            autocomplete="current-password"
-                            placeholder="Current password"
-                        />
-                        <InputError :message="errors.current_password" />
-                    </div>
-
-                    <div class="grid gap-2">
-                        <Label for="password">New password</Label>
-                        <Input
-                            id="password"
-                            ref="passwordInput"
-                            name="password"
-                            type="password"
-                            class="mt-1 block w-full"
-                            autocomplete="new-password"
-                            placeholder="New password"
-                        />
-                        <InputError :message="errors.password" />
-                    </div>
-
-                    <div class="grid gap-2">
-                        <Label for="password_confirmation">Confirm password</Label>
-                        <Input
-                            id="password_confirmation"
-                            name="password_confirmation"
-                            type="password"
-                            class="mt-1 block w-full"
-                            autocomplete="new-password"
-                            placeholder="Confirm password"
-                        />
-                        <InputError :message="errors.password_confirmation" />
-                    </div>
-
-                    <div class="flex items-center gap-4">
-                        <Button :disabled="processing" data-test="update-password-button">Save password</Button>
-
-                        <Transition
-                            enter-active-class="transition ease-in-out"
-                            enter-from-class="opacity-0"
-                            leave-active-class="transition ease-in-out"
-                            leave-to-class="opacity-0"
-                        >
-                            <p v-show="recentlySuccessful" class="text-sm text-neutral-600">Saved.</p>
-                        </Transition>
-                    </div>
-                </Form>
-            </div>
-        </SettingsLayout>
-    </AppLayout>
-</template>
diff --git a/resources/js/pages/settings/Profile.vue b/resources/js/pages/settings/Profile.vue
deleted file mode 100644
index f3e9f36..0000000
--- a/resources/js/pages/settings/Profile.vue
+++ /dev/null
@@ -1,108 +0,0 @@
-<script setup lang="ts">
-import ProfileController from '@/actions/App/Http/Controllers/Settings/ProfileController';
-import { edit } from '@/routes/profile';
-import { send } from '@/routes/verification';
-import { Form, Head, Link, usePage } from '@inertiajs/vue3';
-
-import DeleteUser from '@/components/DeleteUser.vue';
-import HeadingSmall from '@/components/HeadingSmall.vue';
-import InputError from '@/components/InputError.vue';
-import { Button } from '@/components/ui/button';
-import { Input } from '@/components/ui/input';
-import { Label } from '@/components/ui/label';
-import AppLayout from '@/layouts/AppLayout.vue';
-import SettingsLayout from '@/layouts/settings/Layout.vue';
-import { type BreadcrumbItem } from '@/types';
-
-interface Props {
-    mustVerifyEmail: boolean;
-    status?: string;
-}
-
-defineProps<Props>();
-
-const breadcrumbItems: BreadcrumbItem[] = [
-    {
-        title: 'Profile settings',
-        href: edit().url,
-    },
-];
-
-const page = usePage();
-const user = page.props.auth.user;
-</script>
-
-<template>
-    <AppLayout :breadcrumbs="breadcrumbItems">
-        <Head title="Profile settings" />
-
-        <SettingsLayout>
-            <div class="flex flex-col space-y-6">
-                <HeadingSmall title="Profile information" description="Update your name and email address" />
-
-                <Form v-bind="ProfileController.update.form()" class="space-y-6" v-slot="{ errors, processing, recentlySuccessful }">
-                    <div class="grid gap-2">
-                        <Label for="name">Name</Label>
-                        <Input
-                            id="name"
-                            class="mt-1 block w-full"
-                            name="name"
-                            :default-value="user.name"
-                            required
-                            autocomplete="name"
-                            placeholder="Full name"
-                        />
-                        <InputError class="mt-2" :message="errors.name" />
-                    </div>
-
-                    <div class="grid gap-2">
-                        <Label for="email">Email address</Label>
-                        <Input
-                            id="email"
-                            type="email"
-                            class="mt-1 block w-full"
-                            name="email"
-                            :default-value="user.email"
-                            required
-                            autocomplete="username"
-                            placeholder="Email address"
-                        />
-                        <InputError class="mt-2" :message="errors.email" />
-                    </div>
-
-                    <div v-if="mustVerifyEmail && !user.email_verified_at">
-                        <p class="-mt-4 text-sm text-muted-foreground">
-                            Your email address is unverified.
-                            <Link
-                                :href="send()"
-                                as="button"
-                                class="text-foreground underline decoration-neutral-300 underline-offset-4 transition-colors duration-300 ease-out hover:decoration-current! dark:decoration-neutral-500"
-                            >
-                                Click here to resend the verification email.
-                            </Link>
-                        </p>
-
-                        <div v-if="status === 'verification-link-sent'" class="mt-2 text-sm font-medium text-green-600">
-                            A new verification link has been sent to your email address.
-                        </div>
-                    </div>
-
-                    <div class="flex items-center gap-4">
-                        <Button :disabled="processing" data-test="update-profile-button">Save</Button>
-
-                        <Transition
-                            enter-active-class="transition ease-in-out"
-                            enter-from-class="opacity-0"
-                            leave-active-class="transition ease-in-out"
-                            leave-to-class="opacity-0"
-                        >
-                            <p v-show="recentlySuccessful" class="text-sm text-neutral-600">Saved.</p>
-                        </Transition>
-                    </div>
-                </Form>
-            </div>
-
-            <DeleteUser />
-        </SettingsLayout>
-    </AppLayout>
-</template>
diff --git a/resources/js/pages/settings/TwoFactor.vue b/resources/js/pages/settings/TwoFactor.vue
deleted file mode 100644
index 099fd8d..0000000
--- a/resources/js/pages/settings/TwoFactor.vue
+++ /dev/null
@@ -1,92 +0,0 @@
-<script setup lang="ts">
-import HeadingSmall from '@/components/HeadingSmall.vue';
-import TwoFactorRecoveryCodes from '@/components/TwoFactorRecoveryCodes.vue';
-import TwoFactorSetupModal from '@/components/TwoFactorSetupModal.vue';
-import { Badge } from '@/components/ui/badge';
-import { Button } from '@/components/ui/button';
-import { useTwoFactorAuth } from '@/composables/useTwoFactorAuth';
-import AppLayout from '@/layouts/AppLayout.vue';
-import SettingsLayout from '@/layouts/settings/Layout.vue';
-import { disable, enable, show } from '@/routes/two-factor';
-import { BreadcrumbItem } from '@/types';
-import { Form, Head } from '@inertiajs/vue3';
-import { ShieldBan, ShieldCheck } from 'lucide-vue-next';
-import { onUnmounted, ref } from 'vue';
-
-interface Props {
-    requiresConfirmation?: boolean;
-    twoFactorEnabled?: boolean;
-}
-
-withDefaults(defineProps<Props>(), {
-    requiresConfirmation: false,
-    twoFactorEnabled: false,
-});
-
-const breadcrumbs: BreadcrumbItem[] = [
-    {
-        title: 'Two-Factor Authentication',
-        href: show.url(),
-    },
-];
-
-const { hasSetupData, clearTwoFactorAuthData } = useTwoFactorAuth();
-const showSetupModal = ref<boolean>(false);
-
-onUnmounted(() => {
-    clearTwoFactorAuthData();
-});
-</script>
-
-<template>
-    <AppLayout :breadcrumbs="breadcrumbs">
-        <Head title="Two-Factor Authentication" />
-        <SettingsLayout>
-            <div class="space-y-6">
-                <HeadingSmall title="Two-Factor Authentication" description="Manage your two-factor authentication settings" />
-
-                <div v-if="!twoFactorEnabled" class="flex flex-col items-start justify-start space-y-4">
-                    <Badge variant="destructive">Disabled</Badge>
-
-                    <p class="text-muted-foreground">
-                        When you enable two-factor authentication, you will be prompted for a secure pin during login. This pin can be retrieved from
-                        a TOTP-supported application on your phone.
-                    </p>
-
-                    <div>
-                        <Button v-if="hasSetupData" @click="showSetupModal = true"> <ShieldCheck />Continue Setup </Button>
-                        <Form v-else v-bind="enable.form()" @success="showSetupModal = true" #default="{ processing }">
-                            <Button type="submit" :disabled="processing"> <ShieldCheck />Enable 2FA</Button></Form
-                        >
-                    </div>
-                </div>
-
-                <div v-else class="flex flex-col items-start justify-start space-y-4">
-                    <Badge variant="default">Enabled</Badge>
-
-                    <p class="text-muted-foreground">
-                        With two-factor authentication enabled, you will be prompted for a secure, random pin during login, which you can retrieve
-                        from the TOTP-supported application on your phone.
-                    </p>
-
-                    <TwoFactorRecoveryCodes />
-
-                    <div class="relative inline">
-                        <Form v-bind="disable.form()" #default="{ processing }">
-                            <Button variant="destructive" type="submit" :disabled="processing">
-                                <ShieldBan />
-                                Disable 2FA
-                            </Button>
-                        </Form>
-                    </div>
-                </div>
-
-                <TwoFactorSetupModal
-                    v-model:isOpen="showSetupModal"
-                    :requiresConfirmation="requiresConfirmation"
-                    :twoFactorEnabled="twoFactorEnabled"
-                />
-            </div>
-        </SettingsLayout>
-    </AppLayout>
-</template>
diff --git a/resources/js/types/index.d.ts b/resources/js/types/index.d.ts
index ef91b93..fec5510 100644
--- a/resources/js/types/index.d.ts
+++ b/resources/js/types/index.d.ts
@@ -35,3 +35,27 @@ export interface User {
 }
 
 export type BreadcrumbItemType = BreadcrumbItem;
+
+export interface GlobalProperties {
+    continents_with_tours: Continent[];
+}
+
+export interface Continent {
+    id: number
+    name: string
+    internal_name: string
+}
+
+export interface Tour {
+    id: number
+    title: string
+    internal_name: string
+    continentId: number
+    continentName: string
+    countryId: number
+    countryName: string
+    level: string
+    description?: string
+    price: number
+    length: number
+}
diff --git a/routes/web.php b/routes/web.php
index fddbaba..06fc085 100644
--- a/routes/web.php
+++ b/routes/web.php
@@ -1,15 +1,16 @@
 <?php
 
+use App\Models\Continent;
 use Illuminate\Support\Facades\Route;
 use Inertia\Inertia;
 
 Route::get('/', function () {
-    return Inertia::render('Welcome');
-})->name('home');
+    $continent = Continent::first();
 
-Route::get('dashboard', function () {
-    return Inertia::render('Dashboard');
-})->middleware(['auth', 'verified'])->name('dashboard');
+    return Inertia::render('Home',[
+        'continent' => $continent,
+    ]);
+})->name('home');
 
 require __DIR__.'/settings.php';
 require __DIR__.'/auth.php';