@extends('layouts.app')
@section('title', 'Website CMS')
@section('content')
<h2 style="font-size:18px;color:#0b4f2c;margin-bottom:16px;">Website Content Management</h2>

<div style="display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:20px;">
    <a href="{{ url('/cms/homepage') }}" style="text-decoration:none;"><div class="card" style="margin:0;text-align:center;"><div style="font-size:20px;">🏠</div><div style="font-size:12.5px;color:#0b4f2c;font-weight:bold;margin-top:6px;">Homepage</div></div></a>
    <a href="{{ url('/cms/about') }}" style="text-decoration:none;"><div class="card" style="margin:0;text-align:center;"><div style="font-size:20px;">ℹ️</div><div style="font-size:12.5px;color:#0b4f2c;font-weight:bold;margin-top:6px;">About</div></div></a>
    <a href="{{ url('/cms/news') }}" style="text-decoration:none;"><div class="card" style="margin:0;text-align:center;"><div style="font-size:20px;">📰</div><div style="font-size:12.5px;color:#0b4f2c;font-weight:bold;margin-top:6px;">News</div></div></a>
    <a href="{{ url('/cms/events') }}" style="text-decoration:none;"><div class="card" style="margin:0;text-align:center;"><div style="font-size:20px;">📅</div><div style="font-size:12.5px;color:#0b4f2c;font-weight:bold;margin-top:6px;">Events</div></div></a>
    <a href="{{ url('/cms/gallery') }}" style="text-decoration:none;"><div class="card" style="margin:0;text-align:center;"><div style="font-size:20px;">🖼️</div><div style="font-size:12.5px;color:#0b4f2c;font-weight:bold;margin-top:6px;">Gallery</div></div></a>
    <a href="{{ url('/cms/sliders') }}" style="text-decoration:none;"><div class="card" style="margin:0;text-align:center;"><div style="font-size:20px;">🎞️</div><div style="font-size:12.5px;color:#0b4f2c;font-weight:bold;margin-top:6px;">Sliders</div></div></a>
    <a href="{{ url('/cms/testimonials') }}" style="text-decoration:none;"><div class="card" style="margin:0;text-align:center;"><div style="font-size:20px;">💬</div><div style="font-size:12.5px;color:#0b4f2c;font-weight:bold;margin-top:6px;">Testimonials</div></div></a>
    <a href="{{ url('/cms/downloads') }}" style="text-decoration:none;"><div class="card" style="margin:0;text-align:center;"><div style="font-size:20px;">📄</div><div style="font-size:12.5px;color:#0b4f2c;font-weight:bold;margin-top:6px;">Downloads</div></div></a>
    <a href="{{ url('/cms/pages') }}" style="text-decoration:none;"><div class="card" style="margin:0;text-align:center;"><div style="font-size:20px;">📑</div><div style="font-size:12.5px;color:#0b4f2c;font-weight:bold;margin-top:6px;">Pages</div></div></a>
    <a href="{{ url('/cms/contact-messages') }}" style="text-decoration:none;"><div class="card" style="margin:0;text-align:center;position:relative;">
        <div style="font-size:20px;">✉️</div><div style="font-size:12.5px;color:#0b4f2c;font-weight:bold;margin-top:6px;">Contact Messages</div>
        @if($unreadMessages > 0)<span style="position:absolute;top:6px;right:10px;background:#a33;color:#fff;font-size:10px;padding:1px 6px;border-radius:10px;">{{ $unreadMessages }}</span>@endif
    </div></a>
</div>

<div style="display:grid;grid-template-columns:1fr 1fr;gap:16px;">
    <div class="card">
        <h3 style="font-size:14px;color:#0b4f2c;margin-bottom:10px;">Recent News</h3>
        @forelse($newsPosts as $post)
            <div style="border-bottom:1px solid #eee;padding:6px 0;font-size:13px;">{{ $post->title }}</div>
        @empty
            <p style="font-size:12.5px;color:#999;">No news posts yet.</p>
        @endforelse
    </div>
    <div class="card">
        <h3 style="font-size:14px;color:#0b4f2c;margin-bottom:10px;">Upcoming Events</h3>
        @forelse($events as $event)
            <div style="border-bottom:1px solid #eee;padding:6px 0;font-size:13px;">{{ $event->title }} — {{ \Illuminate\Support\Carbon::parse($event->starts_at)->format('d M') }}</div>
        @empty
            <p style="font-size:12.5px;color:#999;">No events scheduled.</p>
        @endforelse
    </div>
</div>
@endsection