{% extends 'base.html' %}
{% load i18n %}
{% load mtp_common %}

{% block page_title %}{% trans 'Cookies' %} – {{ block.super }}{% endblock %}

{% block content %}
  <div class="govuk-grid-row">
    <div class="govuk-grid-column-two-thirds">

      <header>
        <h1 class="govuk-heading-xl">{% trans 'Cookies' %}</h1>
      </header>

      {% include 'govuk-frontend/components/error-summary.html' with form=form only %}

      <p>{% trans 'We put small files (known as ‘cookies’) onto your computer or mobile device when you visit this website.' %}</p>
      <p>{% trans 'Cookies are used to:' %}</p>
      <ul class="govuk-list govuk-list--bullet">
        <li>{% trans 'measure how you use this website so it can be updated and improved based on your needs' %}</li>
        <li>{% trans 'remember your progress through our service' %}</li>
        <li>{% trans 'remember the settings you’ve chosen' %}</li>
      </ul>

      <p>
        {% trans 'Cookies on ‘Send money to someone in prison’ are not used for advertising or marketing.' %}
      </p>

      <p>
        {% trans 'You can read more about <a href="https://www.gov.uk/help/cookies" rel="external">how cookies are used throughout GOV.UK</a>.' %}
      </p>

      <h2 class="govuk-heading-l">{% trans 'Cookies we use to improve our service' %}</h2>
      <p>
        {% trans 'We use Google Analytics to measure how you use this website so we can improve it based on your needs.' %}
        {% trans 'We do not allow Google to use or share the data about how you use it.' %}
      </p>
      <form method="post">
        {% csrf_token %}

        <fieldset class="govuk-fieldset">
          <legend class="govuk-fieldset__legend">
            {% trans 'Do you agree to the Ministry of Justice and other UK government departments using Google Analytics to help improve the ‘Send money to someone in prison’ service?' %}
          </legend>
          {% include 'mtp_common/forms/radio-field.html' with field=form.accept_cookies inline=True label_classes='govuk-!-display-none' only %}
          <input class="govuk-button" data-module="govuk-button" type="submit" value="{% trans 'Save changes' %}">
        </fieldset>
      </form>

      <p>{% trans 'Google Analytics stores information about:' %}</p>
      <ul class="govuk-list govuk-list--bullet">
        <li>{% trans 'the pages you visit in this service' %}</li>
        <li>{% trans 'how long you spend on each page' %}</li>
        <li>{% trans 'how you got to the site' %}</li>
        <li>{% trans 'what you click on while you’re visiting the site' %}</li>
      </ul>
      <p>{% trans 'Google Analytics does <strong>NOT</strong> store:' %}</p>
      <ul class="govuk-list govuk-list--bullet">
        <li>{% trans 'any of your personal details, for example, your name' %}</li>
        <li>{% trans 'what you enter into pages on this site' %}</li>
      </ul>

      <p id="table-caption-ga">{% trans 'Google Analytics sets the following cookies:' %}</p>
      <table class="govuk-table" aria-describedby="table-caption-ga">
        <thead>
          <tr>
            <th scope="col">{% trans 'Name' %}</th>
            <th scope="col">{% trans 'Purpose' %}</th>
            <th scope="col">{% trans 'Expires' %}</th>
          </tr>
        </thead>
        <tbody>
          <tr>
            <td><code>_ga</code> {% trans 'and' %} <code>_ga_&lt;container-id&gt;</code></td>
            <td>{% trans 'Lets Google Analytics know which pages you visit' %}</td>
            <td>{% trans 'Up to 2 years' %}</td>
          </tr>
        </tbody>
      </table>

      <h2 class="govuk-heading-l">{% trans 'Essential cookies' %}</h2>
      <p>
        {% trans 'These cookies need to be on to allow you to use this service.' %}
      </p>
      <p>
        {% url 'terms' as terms_url %}
        {% url 'privacy' as privacy_url %}
        {% blocktrans trimmed %}
          For more information visit our <a href="{{ terms_url }}">terms and conditions</a> and <a href="{{ privacy_url }}">privacy policy</a>.
        {% endblocktrans %}
      </p>

      <h3 class="govuk-heading-m">{% trans 'Your progress when using the service' %}</h3>
      <p id="table-caption-service">
        {% trans 'When you use the ‘Send money to someone in prison’ service, we’ll set cookies to remember your progress through this site.' %}
        {% trans 'These cookies don’t store your personal data and are deleted when you close this website.' %}
      </p>
      <table class="govuk-table" aria-describedby="table-caption-service">
        <thead>
          <tr>
            <th scope="col">{% trans 'Name' %}</th>
            <th scope="col">{% trans 'Purpose' %}</th>
            <th scope="col">{% trans 'Expires' %}</th>
          </tr>
        </thead>
        <tbody>
          <tr>
            <td><code>sessionid</code></td>
            <td>{% trans 'Saves your progress through the service' %}</td>
            <td>{% trans 'When you close this website' %}</td>
          </tr>
          <tr>
            <td><code>csrftoken</code></td>
            <td>{% trans 'Ensures your forms are kept private' %}</td>
            <td>{% trans 'When you close this website' %}</td>
          </tr>
        </tbody>
      </table>

      <h3 class="govuk-heading-m">{% trans 'Settings you’ve chosen' %}</h3>
      <p id="table-caption-settings">
        {% trans 'When you use the ‘Send money to someone in prison’ service, we’ll set cookies to remember settings you change.' %}
        {% trans 'These cookies don’t store any personal data, but will be saved on your computer or mobile for some time.' %}
      </p>
      <table class="govuk-table" aria-describedby="table-caption-settings">
        <thead>
          <tr>
            <th scope="col">{% trans 'Name' %}</th>
            <th scope="col">{% trans 'Purpose' %}</th>
            <th scope="col">{% trans 'Expires' %}</th>
          </tr>
        </thead>
        <tbody>
          <tr>
            <td><code>{{ cookie_policy_cookie_name }}</code></td>
            <td>{% trans 'Saves the choices you make about cookies on this page' %}</td>
            <td>{% trans '1 year' %}</td>
          </tr>
        </tbody>
      </table>

    </div>
  </div>
{% endblock %}