{% extends "admin/base.html" %}
{% load i18n %}

{% block title %}{{ site_title|default:_('Django site admin') }}{% endblock %}

{% block branding %}
    <div class="flex items-center gap-2">
        <div class="flex h-9 w-9 items-center justify-center rounded-xl bg-primary/10 text-primary">
            <i class="fa-solid fa-sparkles"></i>
        </div>
        <h1 id="site-name" class="text-lg font-semibold">
            <a href="{% url 'admin:index' %}">{{ site_title|default:_('Django administration') }}</a>
        </h1>
    </div>
{% endblock %}

{% block extrastyle %}
    <style>
        .base-site-hero {
            border-radius: 1.5rem;
            border: 1px solid color-mix(in oklab, var(--color-base-content) 10%, transparent);
            background: linear-gradient(135deg, var(--color-base-100) 0%, var(--color-base-200) 60%, var(--color-base-300) 100%);
            padding: 1.5rem;
        }
    </style>
{% endblock %}

{% block content %}
    <div class="base-site-hero mt-6">
        <p class="text-xs uppercase tracking-[0.3em] text-base-content/60">
            {% trans "Welcome" %}
        </p>
        <h1 class="text-3xl font-semibold">
            {% blocktranslate with title=site_title|default:_('Django administration') %}Welcome to {{ title }}{% endblocktranslate %}
        </h1>
        <p class="mt-2 text-sm text-base-content/70">
            {% trans "Use the navigation to manage your project." %}
        </p>
    </div>
{% endblock %}