{% extends 'base.html' %} 
{% load static %} 
{% block title %} News Dashboard {% endblock %} 
{% block content %}
<div class="max-w-7xl mx-auto relative">
    <div class="relative py-16 flex justify-center px-4 sm:px-0">
        <div class="max-w-3xl text-center">
            <!-- Tagline -->
            <div class="pb-4">
                <span class="inline-flex items-center rounded-2xl bg-blue-100 px-4 py-1.5 text-xs sm:text-sm font-serif font-medium text-blue-700">
                    Manage Your News Content Efficiently
                </span>
            </div>
            <!-- Main Title -->
            <h1 class="text-4xl sm:text-5xl font-semibold text-gray-900 xl:text-6xl font-serif !leading-tight">
                Welcome to the News Management Dashboard
            </h1>
            <!-- Description -->
            <p class="mt-4 text-lg sm:text-xl leading-8 text-gray-800 sm:px-16" style="white-space: pre-line;">
                Easily create, edit, and manage news articles to keep your audience informed and engaged.
                Navigate through the dashboard to add new stories, update content, or remove outdated information.
            </p>
            <!-- Call to Action Button -->
            <div class="mt-8 flex w-full space-x-8 justify-center">
                <a href="{% url 'news_admin' %}">
                    <button class="inline-flex items-center justify-center px-4 py-2.5 border border-transparent text-sm font-medium rounded-md shadow-sm focus:outline-none ring-2 ring-offset-2 ring-transparent ring-offset-transparent text-white bg-blue-600 hover:bg-blue-700 focus:ring-blue-500 focus:ring-offset-white !px-12 !shadow-lg !rounded-full !text-base">
                        <p>Go to News Admin</p>
                    </button>
                </a>
                <a href="{% url 'create_news' %}">
                    <button class="inline-flex items-center justify-center px-4 py-2.5 border border-transparent text-sm font-medium rounded-md shadow-sm focus:outline-none ring-2 ring-offset-2 ring-transparent ring-offset-transparent text-white bg-lime-600 hover:bg-lime-700 focus:ring-lime-500 focus:ring-offset-white !px-12 !shadow-lg !rounded-full !text-base">
                        <p>Create New Article</p>
                    </button>
                </a>
            </div>
        </div>
    </div>
</div>
{% endblock content %}