@extends('web.layouts.web-master')

@section('title', 'Willkommen - ' . config('app.name'))

@section('content')
    <div class="py-12">
        <div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
            <div class="bg-white dark:bg-zinc-800 overflow-hidden shadow-sm sm:rounded-lg">
                <div class="p-6 text-zinc-900 dark:text-zinc-100">
                    <h1 class="text-2xl font-bold mb-4">Willkommensseite</h1>
                    <p class="mb-4">Dies ist die Willkommensseite mit dem {{ ucfirst(config('app.theme')) }} Theme.</p>

                    <div class="grid grid-cols-1 md:grid-cols-2 gap-6 mt-8">
                        <div class="bg-accent-50 dark:bg-accent-900 p-6 rounded-lg shadow-sm">
                            <h3 class="text-xl font-semibold mb-3 text-accent-800 dark:text-accent-200">Über das Theme</h3>
                            <p>Diese Seite demonstriert die verschiedenen Stile des
                                {{ ucfirst(config('app.theme')) }}-Themes.</p>
                            <p class="mt-2">Jede Landingpage hat ihr eigenes Theme mit individuellen Farben und Schriften.
                            </p>
                        </div>

                        <div class="bg-primary-50 dark:bg-primary-900 p-6 rounded-lg shadow-sm">
                            <h3 class="text-xl font-semibold mb-3 text-primary-800 dark:text-primary-200">Domainspezifisches
                                Styling</h3>
                            <p>Die Styles werden basierend auf der Domain automatisch geladen:</p>
                            <ul class="list-disc pl-5 mt-2 space-y-1">
                                <li>pressekonto.test – Hauptstil (Portal)</li>
                                <li>landing1.local - Landingpage 1</li>
                                <li>landing2.local - Landingpage 2</li>
                            </ul>
                        </div>
                    </div>

                    <div class="mt-8">
                        <a href="{{ url('/') }}" class="button">
                            Zurück zur Startseite
                        </a>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection