{{-- مودال اختيار نوع المحتوى (يُعرض فقط عند عدم وجود الكوكي = أول زيارة أو لم يختر بعد) --}}
@if(!request()->cookie('site_mode_chosen'))
<div class="site-mode-overlay" id="site_mode_modal_overlay" style="display: none;">
    <div class="site-mode-modal">
        <div class="site-mode-modal-inner">
            <h2 class="site-mode-title">{{ __('website.site_mode.WelcomeTitle') }}</h2>
            <p class="site-mode-subtitle">{{ __('website.site_mode.WelcomeSubtitle') }}</p>
            <div class="site-mode-options">
                <a href="{{ route('set_site_mode', 'school') }}?redirect={{ urlencode(request()->url()) }}" class="site-mode-card site-mode-school" data-site-mode="school">
                    <span class="site-mode-icon"><i class="icon-book"><span class="path1"></span><span class="path2"></span></i></span>
                    <h3>{{ __('website.site_mode.OptionSchoolTitle') }}</h3>
                    <p>{{ __('website.site_mode.OptionSchoolDesc') }}</p>
                </a>
                <a href="{{ route('set_site_mode', 'training') }}?redirect={{ urlencode(request()->url()) }}" class="site-mode-card site-mode-training" data-site-mode="training">
                    <span class="site-mode-icon"><i class="icon-pencil-book"><span class="path1"></span><span class="path2"></span><span class="path3"></span><span class="path4"></span><span class="path5"></span><span class="path6"></span></i></span>
                    <h3>{{ __('website.site_mode.OptionTrainingTitle') }}</h3>
                    <p>{{ __('website.site_mode.OptionTrainingDesc') }}</p>
                </a>
            </div>
        </div>
    </div>
</div>

<style>
.site-mode-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.6);
    backdrop-filter: blur(6px);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}
.site-mode-modal {
    background: #fff;
    border-radius: 20px;
    max-width: 640px;
    width: 100%;
    box-shadow: 0 25px 50px -12px rgba(0,0,0,0.25);
    overflow: hidden;
}
.site-mode-modal-inner { padding: 2rem; }
.site-mode-title {
    font-size: 1.5rem;
    font-weight: 700;
    text-align: center;
    margin-bottom: 0.5rem;
    color: #1a1a2e;
}
.site-mode-subtitle {
    text-align: center;
    color: #64748b;
    margin-bottom: 1.5rem;
}
.site-mode-options {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}
.site-mode-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 1.5rem 1rem;
    border-radius: 16px;
    border: 2px solid #e2e8f0;
    text-decoration: none;
    color: inherit;
    transition: all 0.3s ease;
}
.site-mode-card:hover {
    border-color: #7bbbfb;
    background: rgba(123, 187, 251, 0.08);
    transform: translateY(-2px);
}
.site-mode-school:hover { border-color: #0ea5e9; background: rgba(14, 165, 233, 0.08); }
.site-mode-training:hover { border-color: #8b5cf6; background: rgba(139, 92, 246, 0.08); }
.site-mode-icon { font-size: 2.5rem; margin-bottom: 0.75rem; display: inline-flex; color: #5aa3f0; }
.site-mode-training .site-mode-icon { color: #8b5cf6; }
.site-mode-card h3 { font-size: 1.125rem; font-weight: 600; margin-bottom: 0.25rem; }
.site-mode-card p { font-size: 0.875rem; color: #64748b; margin: 0; text-align: center; }
@media (max-width: 576px) {
    .site-mode-options { grid-template-columns: 1fr; }
}
</style>

<script>
(function() {
    function getCookie(name) {
        var c = document.cookie.split(';');
        for (var i = 0; i < c.length; i++) {
            var p = c[i].trim().split('=');
            if (p[0] === name) return p[1] || '';
        }
        return '';
    }
    var overlay = document.getElementById('site_mode_modal_overlay');
    if (overlay && !getCookie('site_mode_chosen')) {
        overlay.style.display = 'flex';
    }
    overlay && overlay.querySelectorAll('.site-mode-card').forEach(function(link) {
        link.addEventListener('click', function(e) {
            e.preventDefault();
            var href = this.getAttribute('href');
            if (!href) return;
            overlay.style.display = 'none';
            document.cookie = 'site_mode_chosen=1; path=/; max-age=' + (60 * 60 * 24 * 365) + '; SameSite=Lax';
            setTimeout(function() {
                window.location.href = href;
            }, 150);
        });
    });
})();
</script>
@endif