@if (setting('site_preloader'))
    
    @php
		$preloaderTextString = setting('preloader_text');
		$preloaderTexts = explode(',', $preloaderTextString);
    @endphp
    
    <div id="preloader" class="preloader">
        <div class="animation-preloader">
            <div class="spinner">
            </div>
            <div class="txt-loading">
            @foreach($preloaderTexts as $text)
                <span data-text-preloader="{{ $text }}" class="letters-loading">
                    {{ $text }}
                </span>
            @endforeach
            </div>
            <p class="text-center">{{ __('Loading') }}</p>
        </div>
        <div class="loader">
            <div class="row">
                <div class="col-3 loader-section section-left">
                    <div class="bg"></div>
                </div>
                <div class="col-3 loader-section section-left">
                    <div class="bg"></div>
                </div>
                <div class="col-3 loader-section section-right">
                    <div class="bg"></div>
                </div>
                <div class="col-3 loader-section section-right">
                    <div class="bg"></div>
                </div>
            </div>
        </div>
    </div>

    <script>
        (() => {
            const preloader = document.getElementById('preloader');
            if (!preloader) return;

            let hidden = false;
            const hidePreloader = () => {
                if (hidden) return;
                hidden = true;
                preloader.classList.add('loaded');
                window.setTimeout(() => {
                    preloader.style.display = 'none';
                }, 1100);
            };

            if (document.readyState === 'complete') {
                hidePreloader();
            } else {
                window.addEventListener('load', hidePreloader, { once: true });
                window.setTimeout(hidePreloader, 8000);
            }
        })();
    </script>
@endif