{% extends "global/Page.html" %}
{% load otree static %}

{% block styles %}
<style>
@import url('https://fonts.googleapis.com/css?family=Poppins:400,500,600,700&display=swap');

* {
    font-family: 'Poppins', sans-serif;
}

body {
    background-color: white;
}

.reject-layout {
    max-width: 980px;
    margin: 40px auto 0;
    text-align: center;
}

.reject-message {
    font-size: 30px;
    line-height: 1.45;
    margin: 28px auto 36px;
}

.reject-actions {
    display: flex;
    justify-content: center;
}

.reject-actions .otree-btn-next {
    font-size: 26px;
    padding: 10px 28px;
}
</style>
{% endblock %}

{% block title %}
    <div style="text-align: center;">{% if player.id_in_group == 2 %} Seller {% else %} Buyer {% endif %} page [Match {{ matchnum }}, Round <span class="round_n">{{ roundnum }}</span>]</div>
{% endblock %}

{% block content %}
<div class="reject-layout">
    <div class="reject-message">
        <strong>Offer Rejected.</strong><br>
        The buyer has rejected it and move on to the next round with an 80% chance.
    </div>

    <div class="reject-actions">
        <button class="otree-btn-next btn btn-primary">Next</button>
    </div>
</div>
{% endblock %}