{% extends 'new_base.html' %}
{% block header_title %}
  <div class="main_message approval" style="display: flex;padding-left: 15px;align-items: center;font-size: 24px;line-height: 30px;">
      <p>
       {% trans %}Hello!{% endtrans %}
      </p>
  </div>
{% endblock %}

{% block content %}
<div class="main_content">
    <br>
    <div style="margin-bottom: 15px;">
    {% trans %}Your release has been approved and is on its way out to stores. As a reminder, for the best delivery and setup, 
    please submit your releases four weeks ahead of the sales start date.{% endtrans %}
    </div>
    <br>
    <div>
        <div>
            <span style="font-weight:bold;">{% trans %}Artist: {% endtrans %}</span>
            <span>{{ artist_name }}</span>
        </div>
        <div>
            <span style="font-weight:bold;">{% trans %}Title: {% endtrans %}</span>
            <span>{{ product_name }}</span>
        </div>
        <div>
            <span style="font-weight:bold;">{% trans %}UPC: {% endtrans %}</span>
            <span>{{ upc }}</span>
        </div>
        <div>
            <span style="font-weight:bold;">{% trans %}Sales Start Date: {% endtrans %}</span>
            <span>{{ sale_start_date }}</span>
        </div>
    </div>
    <br>
    <div style="text-align: center;margin-top: 35px;margin-bottom: 35px;" class="button_wrapper">
        <a class="go_to_product" href="{{ product_url }}" style="padding: 15px 26px;text-transform: uppercase;border: none;font-size: 12px;font-weight: 700;color: #FFF;text-decoration:none;background: linear-gradient(90deg, rgba(211,84,218,1) 0%, rgba(118,4,225,1) 100%);font-family: Space Mono, monospace;">
            {% trans %}GO TO PRODUCT PAGE{% endtrans %}
        </a>
    </div>
</div>
{% endblock %}

{% block issues %}
    <div class="issues" style="width: 100%;margin-bottom: 30px;font-family: Helvetica, sans-serif;background: #F3F0F0;">
        <div class="issues_content" style="max-width: 450px;width: 100%;padding: 23px 25px; margin: auto;">
            <div class="issues_reasons_wrap">
                <ul class="issues_reasons approval" style="border-left: 6px solid #17AD41;border-radius: 2px;margin: auto;padding: 20px;list-style-type: none;">
                    <li style="display: flex;align-items: center;">
                        <svg width="16" height="16" viewbox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg" style="margin-top: 2px;">
                            <path fill-rule="evenodd" clip-rule="evenodd" d="M8 16C12.4183 16 16 12.4183 16 8C16 3.58172 12.4183 0 8 0C3.58172 0 0 3.58172 0 8C0 12.4183 3.58172 16 8 16ZM4.5 7L3 8.5L6.5 12L13 5.5L11.5 4L6.5 9L4.5 7Z" fill="#17AD41"></path>
                        </svg>
                        <span style="margin-left: 10px;">
                            <span>{% trans %}Your submission has been approved for delivery{% endtrans %}</span>.
                        </span>
                    </li>
                </ul>
            </div>
        </div>
    </div>
{% endblock %}