<x-app-layout>
    <x-slot name="header">
            {{ __('Mailings') }}
    </x-slot>

    <div class="py-6">
        <div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
            <div class="bg-theme-background overflow-x-visible shadow-xl sm:rounded-lg">

                <div class="p-12 px-6 sm:px-20 bg-theme-background">

                    @livewire('side-post', [
                                'type' => 'SiteContents\Manage\Mailings' ?? null, 
                                'random' => false,
                                'fallbackTitle' => __('Manage Newsletter Mailings'),
                                'fallbackDescription' => __('Create and manage bulk email newsletters using existing posts as content blocks. Send newsletters to subscribers based on their preferences and location settings.') ])

                    <!--- Mailings management section -->
                    @livewire('mailings.manage')

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

        @push('scripts')
        <script>
        document.addEventListener('scroll-to-top', event => {
            window.scrollTo({
                top: 0,
                behavior: 'smooth'
            });
        });
        </script>
        @endpush
</x-app-layout>