{% extends 'admin/base.html' %}
{% load i18n admin_urls %}

{% block extrastyle %}
{{ block.super }}
<style>
  :root {
    --primary: #79aec8;
    --secondary: #417690;
    --accent: #f5dd5d;
    --primary-fg: #fff;

    --body-fg: #333;
    --body-bg: #fff;
    --body-quiet-color: #666;
    --body-loud-color: #000;

    --header-color: #ffc;
    --header-branding-color: var(--accent);
    --header-bg: var(--secondary);
    --header-link-color: var(--primary-fg);

    --breadcrumbs-fg: #c4dce8;
    --breadcrumbs-link-fg: var(--body-bg);
    --breadcrumbs-bg: var(--primary);

    --link-fg: #447e9b;
    --link-hover-color: #036;
    --link-selected-fg: #5b80b2;

    --hairline-color: #e8e8e8;
    --border-color: #ccc;

    --error-fg: #ba2121;

    --message-success-bg: #dfd;
    --message-warning-bg: #ffc;
    --message-error-bg: #ffefef;

    --darkened-bg: #f8f8f8; /* A bit darker than --body-bg */
    --selected-bg: #e4e4e4; /* E.g. selected table cells */
    --selected-row: #ffc;

    --button-fg: #fff;
    --button-bg: var(--primary);
    --button-hover-bg: #609ab6;
    --default-button-bg: var(--secondary);
    --default-button-hover-bg: #205067;
    --close-button-bg: #888; /* Previously #bbb, contrast 1.92 */
    --close-button-hover-bg: #747474;
    --delete-button-bg: #ba2121;
    --delete-button-hover-bg: #a41515;

    --object-tools-fg: var(--button-fg);
    --object-tools-bg: var(--close-button-bg);
    --object-tools-hover-bg: var(--close-button-hover-bg);
  }

  #logout {
  background: none!important;
  border: none;
  padding: 0!important;
  /*optional*/
  font-family: arial, sans-serif;
  /*input has OS specific font-family*/
  color: var(--header-link-color);;
  border-bottom-color: rgba(255, 255, 255, 0.25);
  text-decoration: underline;
  cursor: pointer;
}
</style>
{% endblock %}

{% block userlinks %}
    {% if site_url %}
        <a href="{{ site_url }}" target="_blank">{% translate 'View site' %}</a> /
    {% endif %}
    {% if user.is_active and user.is_staff %}
        {% url 'django-admindocs-docroot' as docsroot %}
        {% if docsroot %}
            <a href="{{ docsroot }}">{% translate 'Documentation' %}</a> /
        {% endif %}
    {% endif %}
    {% if user.has_usable_password %}
    <a href="{% url 'admin:password_change' %}">{% translate 'Change password' %}</a> /
    {% endif %}
    <form id="logout-form" method="post" action="/admin/logout/">
      {% csrf_token %}
      <button type="submit">{% translate 'Log out' %}</button>
    </form>
    <button class="theme-toggle">
      <div class="visually-hidden theme-label-when-auto">Przełącz motyw (bieżący motyw: auto)</div>
      <div class="visually-hidden theme-label-when-light">Przełącz motyw (bieżący motyw: jasny)</div>
      <div class="visually-hidden theme-label-when-dark">Przełącz motyw (bieżący motyw: ciemny)</div>
      <svg aria-hidden="true" class="theme-icon-when-auto">
        <use xlink:href="#icon-auto"></use>
      </svg>
      <svg aria-hidden="true" class="theme-icon-when-dark">
        <use xlink:href="#icon-moon"></use>
      </svg>
      <svg aria-hidden="true" class="theme-icon-when-light">
        <use xlink:href="#icon-sun"></use>
      </svg>
    </button>
{% endblock %}
