@push('metadata')
@php
$pageId = 36;
$mTitle = @$newsDetail['seo_title'] ?? $newsDetail['title'];
$mDescrRaw = @$newsDetail['meta_description'] ?? $newsDetail['title'];
// Remove HTML & trim to 155 chars
$mDescr = strip_tags($mDescrRaw);
$faqs = $newsDetail['faq'] ?? '[]';
$mKWords = $newsDetail['meta_keywords'];
$mUrl = url()->current();
$title = $newsDetail['is_gabbar'] == 1 ? 'Crypto News' : 'Press Release';
$listUrl = $newsDetail['is_gabbar'] == 1 ? 'crypto-news' : 'crypto-press-release';
$imageUrl = $newsDetail['image'];
$mImage = $imageUrl;
@endphp
@push('pageId')
<script>
    window.pageId = "{{ $pageId ?? '' }}";
</script>
@endpush
<title>{{ @$mTitle }}</title>
{{--<meta name="keywords" content="{{ @$mKWords }}" />--}}
<meta name="description" content="{{ @$mDescr }}" />
<meta property=og:locale content="{{ app()->getLocale() }}" />
<meta property=og:type content="{{config('constants.organisation_type_news')}}" />
<meta property="og:site_name" content="Crypto Presale" />
<meta property="og:title" content="{{ @$mTitle }}" />
<meta property="og:description" content="{{ @$mDescr }}" />
<meta property="og:url" content="{{ @$mUrl }}" />
<meta property="og:image" content="{{ @$imageUrl }}" />
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:title" content="{{ @$mTitle }}" />
<meta name="twitter:description" content="{{ @$mDescr }}" />
<meta name="twitter:url" content="{{ @$mUrl }}" />
<meta name="twitter:image" content="{{ @$imageUrl }}" />
<meta name="twitter:site" content="{{config('constants.twitter_url')}}" />
<meta name="twitter:creator" content="{{config('constants.twitter_url')}}" />
<link rel="alternate" type="application/rss+xml" title="Crypto Presale All Cryptocurrency News RSS Feed" href="{{ RssFeedHelper::getRssFeedUrl('crypto-currency-news') }}" />
@endpush

@push('head_scripts')
{!! SchemaHelper::getBreadcrumbSchema([
['name' => 'Home', 'url' => url('/')],
['name' => $title, 'url' => URL::to($listUrl)],
['name' => $newsDetail['title'], 'url' => $mUrl]
]) !!}
{!! SchemaHelper::getImageObjectSchema($imageUrl, $newsDetail['title']) !!}
@if(!empty($newsDetail['faq']))
{!! SchemaHelper::getFaqSchema($newsDetail['faq']) !!}
@endif
{!! SchemaHelper::newsArticleSchema($newsDetail, $mUrl, $mDescr, $mKWords, $title) !!}
@endpush

<div>
    <section class="brdcrumb">
        <div class="container">
            <ul class="mb-0">
                <li><a href="{{ URL::to('/') }}" title="Home">Home</a> <i class="fas fa-chevron-right small text-dark mx-2"></i></li>
                <li><a href="{{ URL::to($listUrl) }}" title="Home">{{ $title }} <i class="fas fa-chevron-right small text-dark mx-2"></i></a></li>
                <li>{!! $newsDetail['title'] !!}</li>
            </ul>
        </div>
    </section>

    <section class="container mt-4 mb-5">
        <div class="row">
            <div class="col-xl-9">
                <div class='bg-white border p-4 rounded shadow-sm mb-4 detailsview'>
                    <h1 class="h1 fw-bold">{!! $newsDetail['title'] !!}</h1>
                    <div class="border px-4 rounded-4 bg-light my-3">
                        <div class="my-3 d-flex justify-content-between flex-wrap gap-2">
                            <div class="d-flex gap-3">
                                <img src="{{@$newsDetail['post_author']['image'] ?? asset('assets/images/author.png')}}"
                                    class="rounded-circle" height="44" width="44" alt="{{ @$newsDetail['post_author']['dispaly_name'] }}">
                                <div>
                                    <a href="{{ URL::to('crypto-author/' . @$newsDetail['post_author']['slug']) }}"
                                        class="text-decoration-none text-dark fw-semibold fs-15" title="{{ @$newsDetail['post_author']!=null ? @$newsDetail['post_author']['dispaly_name']: $newsDetail['author_name'] }}">
                                        {{ @$newsDetail['post_author']!=null ? @$newsDetail['post_author']['dispaly_name']: $newsDetail['author_name'] }}
                                    </a>
                                    <div class="fs-12 text-secondary">Crypto Regulation & Policy Press Release Expert</div>
                                </div>
                            </div>
                            <div class="d-flex justify-content-end gap-4">
                                <div class="text-end">
                                    <span class="fs-11 text-uppercase text-secondary fw-semibold">Published</span>
                                    <time class="fs-13 fw-bold d-block" datetime="{{ $newsDetail['publishedAt'] ? \Carbon\Carbon::parse($newsDetail['publishedAt'])->setTimezone('Asia/Kolkata')->toIso8601String() : '' }}">
                                        {{ \Carbon\Carbon::parse($newsDetail['publishedAt'])->format('Y-m-d') }}
                                    </time>
                                </div>
                                <div class="text-end ps-4 border-start">
                                    <span class="fs-11 text-uppercase text-secondary fw-semibold">Updated</span>
                                    <time class="fs-13 fw-bold d-block" datetime="{{ $newsDetail['updated_at'] ? \Carbon\Carbon::parse($newsDetail['updated_at'])->setTimezone('Asia/Kolkata')->toIso8601String() : '' }}">
                                        {{ \Carbon\Carbon::parse($newsDetail['updated_at'])->format('Y-m-d') }}
                                    </time>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="mb-4">
                        <img src="{{ $imageUrl }}" fetchpriority="high" loading="eager"
                            alt="{{ $newsDetail['img_alt_title'] ?: $newsDetail['title']  }}" width="1200" height="600"
                            class="img-fluid w-100 h-auto">
                    </div>

                    @if ($newsDetail['h2_title'])
                    <div>
                        <h2 class="h2 fw-bold">{{ @$newsDetail['h2_title'] }}</h2>
                    </div>
                    @endif
                    
                    <div class="blog-content">
                        @if($newsDetail['is_gabbar']==1)
                        {!! CommonHelper::addNoFollowToExternalLinks($newsDetail['description']) !!}
                        @else

                        {!! CommonHelper::addNoFollowToExternalLinksPress($newsDetail['description']) !!}
                        @endif
                    </div>

                    <div class="nav-buttons d-flex justify-content-center justify-content-sm-between flex-wrap">
                        @if($prev)
                        <a class="prev-btn interlink-btn text-white border-0 rounded-2 cursor-pointer text-decoration-none d-flex align-center gap-2" href="{{ URL::to( $prev['alias']) }} " title="{{ $prev['title'] }}">
                            <i class="fas fa-arrow-left me-1"></i>Previous
                        </a>
                        @endif
                        @if($next)
                        <a class="next-btn interlink-btn text-white border-0 rounded-2 cursor-pointer text-decoration-none d-flex align-center gap-2" href="{{ URL::to($next['alias']) }}" title="{{ $next['title'] }}">
                            Next
                            <i class="fas fa-arrow-right me-1"></i>
                        </a>
                        @endif
                    </div>

                    <div class="border-top pt-3">
                        <div class="author-information rounded-4 border">
                            <div class="py-3 px-4 border-bottom bg-light rounded-top">
                                <div class="d-flex align-items-center gap-3 flex-wrap">
                                    <div class="author-img">
                                        <img src="{{@$newsDetail['post_author']['image'] ?? asset('assets/images/author.png')}}"
                                            class="rounded-circle" height="72" width="72" alt="{{ @$newsDetail['post_author']['dispaly_name'] }}">
                                    </div>
                                    <div class="author-profile">
                                        <div class="author-title">
                                            <a href="{{ URL::to('crypto-author/' . @$newsDetail['post_author']['slug']) }}"
                                                class="text-black d-block fs-author mb-0 fw-bold text-decoration-none"
                                                title="{{ @$newsDetail['post_author']!=null ? @$newsDetail['post_author']['dispaly_name']: $newsDetail['author_name'] }}">
                                                {{ @$newsDetail['post_author']!=null ? @$newsDetail['post_author']['dispaly_name']: $newsDetail['author_name'] }}</a>
                                            <span class="fs-13 text-secondary">
                                                Crypto Regulation & Policy Press Release Expert
                                            </span>
                                            <div class="d-flex gap-2 mt-2 flex-wrap">
                                                @foreach(array_filter(explode(',',$newsDetail['post_author']['experties'])) as $expertise)
                                                    @php
                                                    $clean = preg_replace('/\s+/', ' ', trim($expertise));
                                                    @endphp

                                                    <div class="borderblue rounded-pill px-2 catbox">
                                                    @if($clean)
                                                        <span class="fs-12 bluetext fw-bold">
                                                            {{ $clean }}
                                                        </span>
                                                    @endif
                                                    </div>
                                                @endforeach
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="d-flex justify-content-between align-items-center flex-wrap flex-sm-nowrap">
                                <div class="py-2 text-center w-100">
                                    <span class="fs-6 fw-bold d-block">{{ $totalNewsCount }}+</span>
                                    <span class="fs-11 fw-semibold text-uppercase text-secondary ls-2">articles</span>
                                </div>

                                @php
                                    $createdAt = \Carbon\Carbon::parse($newsDetail['post_author']['created_at']);

                                    $months = floor($createdAt->floatDiffInMonths(now()));

                                    $years = floor($months / 12);

                                    $experience = $years > 0
                                        ? $years
                                        : $months;

                                    $experienceLabel = $years > 0
                                        ? ($years > 1 ? 'Years' : 'Year')
                                        : ($months > 1 ? 'Months' : 'Month');
                                @endphp

                                <div class="py-2 text-center w-100 border-start border-end">
                                    <span class="fs-6 fw-bold d-block">{{ $experience }} {{ $experienceLabel }}</span>
                                    <span class="fs-11 fw-semibold text-uppercase text-secondary ls-2">experience</span>
                                </div>
                                <div class="py-2 text-center w-100">
                                    <span class="fs-6 fw-bold d-block">Regulation</span>
                                    <span class="fs-11 fw-semibold text-uppercase text-secondary ls-2">specialty</span>
                                </div>
                            </div>
                            <div class="author-middle px-4 pt-3">
                                <span class="fs-14">{!! $newsDetail['post_author']['about_us'] ?? '' !!}</span>
                            </div>
                            <div class="py-3 px-4 border-top rounded-bottom catbox text-center">
                                <a class="text-decoration-none bluetext fw-semibold fs-14"
                                    href="{{ URL::to('crypto-author/' . @$newsDetail['post_author']['slug']) }}"
                                    title="{{ @$newsDetail['post_author']!=null ? @$newsDetail['post_author']['dispaly_name']: $newsDetail['author_name'] }}">
                                    Read All Articles By
                                    {{ @$newsDetail['post_author']!=null ? @$newsDetail['post_author']['dispaly_name']: $newsDetail['author_name'] }}
                                    <i class="fa-solid fa-arrow-right-long ms-2"></i>
                                </a>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="commentarea w-100 overflow-hidden border rounded shadow-sm mt-4">
                    <div class="comment-header d-flex justify-content-between align-items-center flex-wrap">
                        <div class="d-flex align-items-center gap-3"><span class="fs-4 fw-bold">✍️ WHAT'S YOUR
                                OPINION?</span></div>
                        <div class="d-flex gap-2 position-relative align-items-center comment-like">
                            <x-like-card :id="$newsDetail['id']" :type="'news'" :liked="@$liked"
                                :likescounts="@$newsDetail['likes_counts']" :likd="1"
                                :favorite="@$newsDetail['is_liked']" />
                            <button type="button" class="share-button border-0 cursor-pointer px-3 py-2"
                                data-bs-toggle="modal" data-bs-target="#shareModal"
                                wire:click.prevent="setShareUrl('{{ URL::to($newsDetail['alias'])   }}')"><i
                                    class="fa-solid fa-share-nodes"></i>Share
                            </button>
                        </div>
                    </div>
                    <div class="comment-form">
                        @if (session()->has('success'))
                        <div x-data="{ show: true }" x-init="setTimeout(() => show = false, 10000)" x-show="show"
                            x-transition
                            class="alert alert-success text-center bg-green-500 text-green px-4 py-3 rounded-lg">
                            {{ session('success') }}
                        </div>

                        @endif

                        @if (session()->has('error'))
                        <div x-data="{ show: true }" x-init="setTimeout(() => show = false, 10000)" x-show="show"
                            x-transition
                            class="alert alert-danger text-center bg-red-500 text-red px-4 py-3 rounded-lg">
                            {{ session('error') }}
                        </div>
                        @endif
                        <div class="input-group">
                            <input placeholder="Enter your name here" id="name" class="form-input w-100 fs-15 rounded-3 bg-white" type="text"
                                wire:model.defer="userName" wire:key="search-input-{{ $userName }}">
                            <label for="name" class="input-label position-absolute fs-14">Your Name</label>
                        </div>
                        @error('userName')
                        <span class="text-danger">{{ $message }}</span>
                        @enderror

                        <div class="input-group">
                            <textarea placeholder="Share your thoughts, questions, or feedback..." id="comment"
                                minlength="10" maxlength="300" class="form-input w-100 fs-15 rounded-3 bg-white form-textarea" wire:model.defer="body"
                                wire:key="search-input-{{ $body }}"></textarea>
                            <label for="comment" class="input-label position-absolute fs-14">Your Opinion</label>
                        </div>
                        @error('body')
                        <span class="text-danger">{{ $message }}</span>
                        @enderror
                        <div class="d-flex justify-content-end">
                            @if(Auth::check())
                            <button type="button" wire:click="postComment" wire:loading.attr="disabled"
                                class="submit-button d-flex align-items-center gap-2 text-white border-0 rounded-3 fs-15 fw-bold cursor-pointer">
                                <span wire:loading.remove>📩 Post Comment</span>
                                <span wire:loading>⏳ Posting...</span>
                            </button>
                            @else
                            <button type="button" onclick="openLoginPopup()" class="submit-button d-flex align-items-center gap-2 text-white border-0 rounded-3 fs-15 fw-bold cursor-pointer">
                                <span> 📩 Post Comment</span>
                            </button>
                            @endif
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-xl-3 latest_right mt-3 mt-xl-0">
                <div class="sidebar-container position-sticky bg-white rounded-3 overflow-hidden w-100">
                    <div class="sidebar-header p-3 position-relative">
                        <div class="header-decoration position-absolute top-0 end-0 rounded-circle z-0">
                        </div>
                        <div class="d-flex align-items-center position-relative">
                            <div class="header-bar">
                            </div>
                            <span class='h2'>Latest News</span>
                        </div>
                    </div>
                    <div class='row'>
                        @foreach ($latestNews as $news)
                        <div class="col-xl-12 col-md-6">
                            <div class="news-item d-flex position-relative">
                                <div class="news-image-container position-relative">
                                    <img src="{{ $news['image'] }}"
                                        alt="{{ $news['img_alt_title'] ?: $news['title'] }}" class="news-image rounded-3 overflow-hidden" width="80" height="45">
                                </div>
                                <div class="d-flex flex-column justify-content-between flex-1">
                                    <a href="{{ URL::to($news['alias']) }}" class='text-decoration-none' title="{{ $news['title'] }}">
                                        <span class="h3 news-title"> {{ $news['title'] }}</span>
                                    </a>
                                    <div class="news-date d-flex align-items-center fs-12">
                                        <div class="me-2">
                                            <i class="fa-solid fa-calendar"></i>
                                        </div>
                                        <span>
                                            {{ \Carbon\Carbon::parse($news['publishedAt'])->format('Y-m-d') }}</span>
                                    </div>
                                </div>
                            </div>
                        </div>
                        @endforeach
                    </div>
                    <a href="{{ URL::to('crypto-news') }}" class="read-more d-flex align-items-center justify-content-center fs-14 fw-bold" title='crypto-news'>
                        View All
                        <div class="arrow-icon"></div>
                    </a>
                </div>
            </div>
        </div>
    </section>

    @php
    $faqsArray = json_decode($newsDetail['faq'], true);
    @endphp
    @if(!empty($faqsArray) && is_array($faqsArray))
    <x-faq-card :faqs="$faqsArray" />
    @endif


    @include('livewire.common.share-modal')

    @if($isPreview)
    <div class="preview-bottom-bar bottom-0 start-0 end-0 text-white py-3 px-4 d-flex align-items-center justify-content-between flex-wrap gap-3 w-100">
        <div class="d-flex align-items-center gap-3 flex-wrap">
            <span class="preview-bottom-bar-badge bg-white fs-14 text-uppercase py-2 px-3 rounded-1 text-nowrap">⚠ Not Live</span>
            <div>
                <div class="preview-bottom-bar-title">This page is in preview mode and is not indexed by search engines. </div>
                <div class="preview-bottom-bar-sub">

                    @if($isScheduled && $scheduledAt)
                    🕐 Scheduled to go live: <strong>{{ \Carbon\Carbon::parse($scheduledAt)->format('d M Y, h:i A') }}</strong>
                    @endif
                </div>
            </div>
        </div>

        <div>
            <p class="mb-0 fs-4 fw-bold"> Get in Touch: <a href="https://t.me/cryptopresalenews" target="_blank" class="text-decoration-none fw-bold text-white" rel="nofollow noopener noreferrer" title="@Content_coingabbar"><img width="25" height="26" src="{{ URL::asset('assets/images/telegram-faq.png') }}" alt="Telegram"></a></p>
        </div>

        {{-- Diagonal watermark overlay --}}
        <div class="preview-watermark-overlay top-0 start-0 w-100 h-100 overflow-hidden">
            @for($i = 0; $i < 8; $i++)
                <div class="preview-watermark-row position-absolute text-center text-nowrap" style="top: {{ $i * 14 }}%;">
                PREVIEW &nbsp; PREVIEW &nbsp; PREVIEW &nbsp; PREVIEW &nbsp; PREVIEW
        </div>
        @endfor
    </div>
</div>
@endif
@if($isSeoCheck)
<div class="preview-bottom-bar bottom-0 start-0 end-0 text-white py-3 px-4 d-flex align-items-center justify-content-between flex-wrap gap-3 w-100">
    <div class="d-flex align-items-center gap-3 flex-wrap">
        <span class="preview-bottom-bar-badge bg-white fs-14 text-uppercase py-2 px-3 rounded-1 text-nowrap">⚠ Not Live</span>
        <div>
            <div class="preview-bottom-bar-title">This page is in preview mode and is not indexed by search engines.</div>
            <div class="preview-bottom-bar-sub">
                Contact the admin now to make this webpage live and indexable.
            </div>
        </div>
    </div>
    <div>

        <p class="mb-0 fs-4 fw-bold">
            Contact us on :<a href="https://t.me/cryptopresalenews" target="_blank" class="text-decoration-none fw-bold text-white" rel="nofollow noopener noreferrer" title="@Content_coingabbar"> <img width="25" height="26" src="{{ URL::asset('assets/images/telegram-faq.png') }}" alt="Telegram"></a>
            </a>
        </p>
    </div> {{-- Diagonal watermark overlay --}}
    <div class="preview-watermark-overlay top-0 start-0 w-100 h-100 overflow-hidden">
        @for($i = 0; $i < 8; $i++) <div class="preview-watermark-row position-absolute text-center text-nowrap" style="top: {{ $i * 14 }}%;">
            PREVIEW &nbsp; PREVIEW &nbsp; PREVIEW &nbsp; PREVIEW &nbsp; PREVIEW
    </div>
    @endfor
</div>
</div>
@endif

@push('scripts')
<script>
    window.addEventListener('clearInputs', () => {
        document.getElementById('name').value = "";
        document.getElementById('comment').value = "";
    });
</script>
<script>
    document.addEventListener("DOMContentLoaded", function() {
        document.querySelectorAll('.blog-content table').forEach(function(table) {
            let wrapper = document.createElement('div');
            wrapper.classList.add('table-responsive');
            table.parentNode.insertBefore(wrapper, table);
            wrapper.appendChild(table);
        });
    });
</script>
@endpush
</div>