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

@section('title', 'Dev Sitemap - B2in')

@section('content')
    <div class="bg-background">
        <livewire:web.components.ui.header />

        <main class="section-padding variante-glass-flow">
            <div class="container-padding">
                <div class="max-w-4xl mx-auto">

                    <div class="mb-12">
                        <h1 class="text-hero mb-4">Dev <span class="text-secondary">Sitemap</span></h1>
                        <p class="text-lg text-muted-foreground">Übersicht aller Seiten – inklusive Archiv-Versionen und Entwicklungsseiten.</p>
                    </div>

                    {{-- Live-Seiten --}}
                    <div class="mb-12">
                        <h2 class="text-xl font-semibold text-foreground mb-6 flex items-center gap-2">
                            <span class="inline-flex items-center justify-center w-8 h-8 rounded-full bg-green-500/10 text-green-600">
                                <svg class="w-4 h-4" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M5 13l4 4L19 7" /></svg>
                            </span>
                            Live-Seiten
                        </h2>
                        <div class="grid gap-3">
                            @php
                                $livePages = [
                                    ['url' => '/', 'label' => 'Home', 'description' => 'Startseite B2in'],
                                    ['url' => '/immobilien', 'label' => 'Immobilien', 'description' => 'Dubai Investments – Hauptseite'],
                                    ['url' => '/immobilien/azizi-creek-views-4', 'label' => 'Azizi Creek Views 4', 'description' => 'Projekt-Exposé'],
                                    ['url' => '/netzwerk', 'label' => 'Netzwerk', 'description' => 'B2in Ökosystem – Teaser (Soft Launch)'],
                                    ['url' => '/magazin', 'label' => 'Magazin', 'description' => 'Artikel & Insights'],
                                    ['url' => '/about', 'label' => 'Über B2in', 'description' => 'Über uns & Team'],
                                    ['url' => '/contact', 'label' => 'Kontakt', 'description' => 'Kontaktformular'],
                                    ['url' => '/faq', 'label' => 'FAQ', 'description' => 'Häufige Fragen'],
                                ];
                            @endphp
                            @foreach ($livePages as $page)
                                <a href="{{ $page['url'] }}" class="flex items-center justify-between p-4 rounded-xl border border-border/50 hover:border-secondary/50 hover:bg-secondary/5 transition-all group">
                                    <div>
                                        <span class="font-medium text-foreground group-hover:text-secondary transition-colors">{{ $page['label'] }}</span>
                                        <span class="text-sm text-muted-foreground ml-3">{{ $page['description'] }}</span>
                                    </div>
                                    <code class="text-xs text-muted-foreground bg-accent px-2 py-1 rounded">{{ $page['url'] }}</code>
                                </a>
                            @endforeach
                        </div>
                    </div>

                    {{-- Archiv-Seiten --}}
                    <div class="mb-12">
                        <h2 class="text-xl font-semibold text-foreground mb-6 flex items-center gap-2">
                            <span class="inline-flex items-center justify-center w-8 h-8 rounded-full bg-amber-500/10 text-amber-600">
                                <svg class="w-4 h-4" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M20.25 7.5l-.625 10.632a2.25 2.25 0 01-2.247 2.118H6.622a2.25 2.25 0 01-2.247-2.118L3.75 7.5M10 11.25h4M3.375 7.5h17.25c.621 0 1.125-.504 1.125-1.125v-1.5c0-.621-.504-1.125-1.125-1.125H3.375c-.621 0-1.125.504-1.125 1.125v1.5c0 .621.504 1.125 1.125 1.125z" /></svg>
                            </span>
                            Archiv (Pre-Soft-Launch Versionen)
                        </h2>
                        <div class="grid gap-3">
                            @php
                                $archivePages = [
                                    ['url' => '/dev/immobilien-v1', 'label' => 'Immobilien (v1)', 'description' => 'Originalversion vor Soft Launch'],
                                    ['url' => '/dev/interior-v1', 'label' => 'Interior / Einrichtungsnetzwerk (v1)', 'description' => 'Originalversion vor Soft Launch'],
                                    ['url' => '/dev/partner-v1', 'label' => 'Für Entwickler & Partner (v1)', 'description' => 'Originalversion vor Soft Launch'],
                                ];
                            @endphp
                            @foreach ($archivePages as $page)
                                <a href="{{ $page['url'] }}" class="flex items-center justify-between p-4 rounded-xl border border-border/50 hover:border-amber-500/50 hover:bg-amber-500/5 transition-all group">
                                    <div>
                                        <span class="font-medium text-foreground group-hover:text-amber-600 transition-colors">{{ $page['label'] }}</span>
                                        <span class="text-sm text-muted-foreground ml-3">{{ $page['description'] }}</span>
                                    </div>
                                    <code class="text-xs text-muted-foreground bg-accent px-2 py-1 rounded">{{ $page['url'] }}</code>
                                </a>
                            @endforeach
                        </div>
                    </div>

                    {{-- Dev-Tools --}}
                    <div>
                        <h2 class="text-xl font-semibold text-foreground mb-6 flex items-center gap-2">
                            <span class="inline-flex items-center justify-center w-8 h-8 rounded-full bg-blue-500/10 text-blue-600">
                                <svg class="w-4 h-4" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M11.42 15.17l-5.384-3.116A2.25 2.25 0 015.25 10.08V6.75a2.25 2.25 0 011.786-1.975l5.384-3.116a2.25 2.25 0 012.16 0l5.384 3.116A2.25 2.25 0 0120.75 6.75v3.33a2.25 2.25 0 01-.786 1.975l-5.384 3.116a2.25 2.25 0 01-2.16 0z" /></svg>
                            </span>
                            Dev-Tools
                        </h2>
                        <div class="grid gap-3">
                            @php
                                $devPages = [
                                    ['url' => '/theme-demo', 'label' => 'Theme Demo', 'description' => 'Farben, Logos, Buttons aller Themes'],
                                    ['url' => '/dev/sitemap', 'label' => 'Dev Sitemap', 'description' => 'Diese Seite'],
                                ];
                            @endphp
                            @foreach ($devPages as $page)
                                <a href="{{ $page['url'] }}" class="flex items-center justify-between p-4 rounded-xl border border-border/50 hover:border-blue-500/50 hover:bg-blue-500/5 transition-all group">
                                    <div>
                                        <span class="font-medium text-foreground group-hover:text-blue-600 transition-colors">{{ $page['label'] }}</span>
                                        <span class="text-sm text-muted-foreground ml-3">{{ $page['description'] }}</span>
                                    </div>
                                    <code class="text-xs text-muted-foreground bg-accent px-2 py-1 rounded">{{ $page['url'] }}</code>
                                </a>
                            @endforeach
                        </div>
                    </div>

                </div>
            </div>
        </main>

        <livewire:web.components.ui.footer />
    </div>
@endsection

@push('styles')
    <style>
        [x-cloak] {
            display: none !important;
        }
    </style>
@endpush