{% extends "layout.html" %}

{% block content %}

<div class="jumbotron" style="background-color: #020617; color: #00ffcc; text-align: center; padding: 30px; border-radius: 15px;">
    <h1>Girls Day Quiz</h1>
    <p class="lead">Gib den Quiz-Code ein, um deinen Preis zu gewinnen!</p>

    {% if message %}
    <p style="margin-top: 20px; font-weight: bold; color: {{ color }}">{{ message }}</p>
    {% endif %}

    {% if not success %}
    <form method="POST" style="margin-top: 20px;">
        <input type="text" name="code" placeholder="Code eingeben..." required
               style="padding: 10px; width: 200px; border-radius: 5px; border: none; background-color: #020617; color: #00ffcc;">
        <button type="submit" style="padding: 10px 20px; border: none; border-radius: 5px; background-color: #00ffcc; color: #020617; cursor: pointer;">Absenden</button>
    </form>
    {% endif %}
</div>

{% endblock %}