@props([
    'brand' => null,
])

@php
    $themeKey = config('app.theme', 'presseportale');
    $brand = $brand ?? config('domains.domains.' . $themeKey . '.brand', []);
    $brandTagline = $brand['tagline_short'] ?? 'Publisher · Hub';
    $brandTaglineLong = $brand['tagline_long'] ?? 'Der gemeinsame Publisher-Bereich für presseecho und businessportal24.';
    $footerLegal = str_replace(':year', (string) now()->year, $brand['footer_legal'] ?? '© ' . now()->year . ' presseportale');
@endphp

<footer class="bg-hub-grad-2 text-ink-on-dark">
    <div class="max-w-layout mx-auto px-8 py-14 grid gap-10" style="grid-template-columns:1.5fr 1fr 1fr 1fr;">

        <div>
            <div class="text-[24px] font-bold leading-none tracking-[-0.5px] text-white">
                <x-web.brand-mark brand="presseportale" :serif="false" />
            </div>
            <div class="eyebrow on-dark mt-2 text-[9.5px] tracking-[0.22em]">
                {{ $brandTagline }}
            </div>
            <p class="text-[12.5px] text-white/65 leading-[1.65] mt-4 max-w-[340px]">
                {{ $brandTaglineLong }}
            </p>
            <div class="mt-5 pt-5 border-t border-white/15 text-[12px] text-white/65">
                Brand-Familie:
                <a class="font-semibold underline underline-offset-[3px] decoration-white/30 ml-1" href="{{ config('domains.domain_presseecho_url') }}">
                    <x-web.brand-mark brand="presseecho" variant="on-dark" />
                </a>
                <span class="mx-2 text-white/30">·</span>
                <a class="font-semibold underline underline-offset-[3px] decoration-white/30" href="{{ config('domains.domain_businessportal_url') }}">
                    <x-web.brand-mark brand="businessportal24" variant="on-dark" />
                </a>
            </div>
        </div>

        <div>
            <div class="eyebrow on-dark mb-3.5">Konto</div>
            <ul class="space-y-2 text-[13px] text-white/75 list-none p-0 m-0">
                <li><a href="{{ route('login') }}" class="hover:text-white transition-colors">Anmelden</a></li>
                <li><a href="{{ route('register') }}" class="hover:text-white transition-colors">Konto erstellen</a></li>
                <li><a href="#tarife" class="hover:text-white transition-colors">Tarife</a></li>
                <li><a href="#" class="hover:text-white transition-colors">Vertrieb kontaktieren</a></li>
                <li><a href="#" class="hover:text-white transition-colors">Status</a></li>
            </ul>
        </div>

        <div>
            <div class="eyebrow on-dark mb-3.5">Plattform</div>
            <ul class="space-y-2 text-[13px] text-white/75 list-none p-0 m-0">
                <li><a href="#funktion" class="hover:text-white transition-colors">So funktioniert es</a></li>
                <li><a href="#" class="hover:text-white transition-colors">Redaktionsrichtlinien</a></li>
                <li><a href="#" class="hover:text-white transition-colors">Dokumentation</a></li>
                <li><a href="#" class="hover:text-white transition-colors">API-Referenz</a></li>
                <li><a href="#" class="hover:text-white transition-colors">Changelog</a></li>
            </ul>
        </div>

        <div>
            <div class="eyebrow on-dark mb-3.5">Rechtliches</div>
            <ul class="space-y-2 text-[13px] text-white/75 list-none p-0 m-0">
                <li><a href="#" class="hover:text-white transition-colors">Impressum</a></li>
                <li><a href="#" class="hover:text-white transition-colors">AGB</a></li>
                <li><a href="#" class="hover:text-white transition-colors">Datenschutz</a></li>
                <li><a href="#" class="hover:text-white transition-colors">DPA / AV</a></li>
                <li><a href="#" class="hover:text-white transition-colors">Cookie-Einstellungen</a></li>
            </ul>
        </div>
    </div>

    <div class="border-t border-white/15">
        <div class="max-w-layout mx-auto px-8 py-5 flex items-center justify-between gap-4 text-[11.5px] text-white/55">
            <span>{{ $footerLegal }}</span>
            <span class="flex items-center gap-2 font-mono text-[10.5px]">
                <span class="inline-block w-1.5 h-1.5 rounded-full bg-ok"></span>
                Alle Systeme betriebsbereit
            </span>
        </div>
    </div>
</footer>