<style>
/* Import Google Fonts */
@import url("//fonts.googleapis.com/css2?family=Nunito:ital,wght@0,300;0,400;0,500;0,600;0,700;1,300;1,400;1,500;1,600;1,700&display=swap");

/* General Styling */

/* Coupon Container */
.coupon-container {
  
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 20px;
}

/* Card Styling */
.card {
    max-width: 500px;
    margin: auto;
    padding: 20px;
    border-radius: 20px;
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    background: white;
    margin-top:70px;
}

/* Button Styling */
.btn-big-primary {
    font-size: 1.2rem;
    padding: 10px;
}
</style>

{% include 'header.twig' %}
<div class="coupon-container">
    <div class="container">
        <div class="row justify-content-center">
            <div class="col-md-8 col-lg-6">
                <div class="component_card">
                    <div class="card">
                        <div class="col-12">
                            {% if error %}
                                <div class="alert alert-dismissible alert-danger {% if site['rtl'] %} rtl-alert {% endif %}">
                                    <button type="button" class="close" data-dismiss="alert">×</button>
                                    {{ errorText }}
                                </div>
                            {% elseif success %}
                                <div class="alert alert-dismissible alert-success {% if site['rtl'] %} rtl-alert {% endif %}">
                                    <button type="button" class="close" data-dismiss="alert">×</button>
                                    {{ successText }}
                                </div>
                            {% endif %}
                            <div class="well">
                                <form method="post" action="kupon">
                                    <div class="form-group">
                                        <label for="kuponadi" class="control-label">Coupon Code</label>
                                        <input type="text" class="form-control" id="kuponadi" name="kuponadi">
                                    </div>
                                    <button type="submit"  class="btn btn-block btn-primary w-100">Use</button>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
{% include 'footer.twig' %}
