{{--
    ContentLayout — minimal hero for tags directory, blog, static pages, legal.
    Used by /tags, /blog/*, /pages/*, /about, /help, /legal/*

    Expected variables:
      $page_title, $page_meta_description, $page_canonical, $page_robots
      $breadcrumbs (collection, optional)
      Content via @yield('page-content')
--}}
@php($useUnifiedSeo = true)
@extends('layouts.nova')

@section('content')

{{-- Minimal hero --}}
@if(!empty($center_content))
    <x-centered-content :max="$center_max ?? '3xl'" class="pt-10 pb-6" style="padding-top:2.5rem;padding-bottom:1.5rem;">
        @hasSection('page-hero')
            @yield('page-hero')
        @else
            {{-- Breadcrumbs --}}
            @include('components.breadcrumbs', ['breadcrumbs' => $breadcrumbs ?? collect()])

            <div class="mt-4">
                <h1 class="text-3xl font-bold text-white leading-tight">
                    {{ $hero_title ?? $page_title ?? 'Skinbase' }}
                </h1>
                @isset($hero_description)
                <p class="mt-1 text-sm text-white/50 max-w-xl">{{ $hero_description }}</p>
                @endisset
            </div>
        @endif
    </x-centered-content>

    {{-- Page body (centered) --}}
    <x-centered-content :max="$center_max ?? '3xl'" class="pb-16">
        @yield('page-content')
    </x-centered-content>
@else
    <div class="px-6 pt-10 pb-6 md:px-10">
        @hasSection('page-hero')
            @yield('page-hero')
        @else
            {{-- Breadcrumbs --}}
            @include('components.breadcrumbs', ['breadcrumbs' => $breadcrumbs ?? collect()])

            <div class="mt-4">
                <h1 class="text-3xl font-bold text-white leading-tight">
                    {{ $hero_title ?? $page_title ?? 'Skinbase' }}
                </h1>
                @isset($hero_description)
                <p class="mt-1 text-sm text-white/50 max-w-xl">{{ $hero_description }}</p>
                @endisset
            </div>
        @endif
    </div>

    {{-- Page body --}}
    <div class="px-6 pb-16 md:px-10">
        @yield('page-content')
    </div>
@endif

@endsection