{% load adminlte_helpers i18n %}
{% load static %}<!DOCTYPE html>
<html>
<head>
    {% block title_outer %}
        <title>{% block title %}{{ site.name }}{% endblock %}</title>
    {% endblock %}

    {% block meta %}
        <meta charset="utf-8">
        <meta http-equiv="X-UA-COMPATIBLE" content="IE=edge">
        <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
    {% endblock %}

    {% block stylesheets %}
        {% include 'adminlte/lib/_styles.html' %}
    {% endblock %}

    {% block extra_head %}{% endblock %}

    <style>
    /* Updated style backoffice admin with brown (#3a342a) and gold (#d4af37) theme */

       body > div > aside {
          background-color: #3a342a !important;
       }

       body > div > aside > div > nav > ul > li > a.active {
          background-color: #d4af37 !important;
          color: white !important;
       }

       body > div > div.content-wrapper > section.content-header > div > div > div.col-sm-8 > ol > li.active {
          color: #3a342a;
       }

       #content-main > div > div > div.card-header > h3 > a.nav-link {
          color: #3a342a;
       }

       #content-main > div > div > div.card-body > div > div > div {
          background-color: #3a342a !important;
       }

       #content-main > div > div > div.card-body > div > div > div > span > a > i {
          color: #d4af37 !important;
       }

       #changelist-search > div > div > button {
          background-color: #3a342a;
          border: 0 !important;
       }

       #changelist > div.row.p-2 > div > span > a {
          background-color: #3a342a;
          border: 0 !important;
       }

       #result_list > tbody > tr > th > a {
          color: #3a342a !important;
       }

       .btn-warning {
          background-color: #d4af37 !important;
          border: 0 !important;
       }

       body > div.wrapper > div.content-wrapper > section.content-header > div > div > div.col-sm-4 > h2 {
          display: none;
       }

       body > div.wrapper > aside > a.brand-link img {
          display: none;
       }

       body > div.wrapper > aside > a.brand-link {
          text-align: center;
       }

       #content-main > div > div:nth-child(4) > div.card-body > div > div > div {
          padding: 25px !important;
       }

       body > div.wrapper > div.content-wrapper > section.content-header > div > div > div:nth-child(1) > h2 {
          display: none;
       }

       #changelist {
          background-color: transparent !important;
       }

       #result_list_wrapper div.actions.col-sm-6.col-md-6 > button {
          background-color: #d4af37 !important;
          color: white !important;
          border-radius: 7px !important;
          border: 0 !important;
       }

       #changelist .float-sm-right a {
          background-color: #d4af37 !important;
          color: white !important;
          border-radius: 7px !important;
          border: 0 !important;
       }

       #changelist-search > div > div > button {
          background-color: #d4af37 !important;
          color: white !important;
          border: 0 !important;
       }

       #customer_form > div.card.card-info > div.card-header.bg-primary {
          background-color: #d4af37 !important;
          color: white !important;
       }

       .related-widget-wrapper {
          width: 100% !important;
       }

       input, textarea, select {
          width: 100% !important;
          height: 35px !important;
          border: 1px solid #b0a9a9 !important;
          border-radius: 3px;
       }

       input:focus, input:focus-visible, textarea:focus, select:focus {
          border: 1px solid #d4af37 !important;
       }

       input[type="checkbox"] {
          width: 20px !important;
          height: 20px !important;
          margin-top: 5px !important;
       }

       input[type="checkbox"]:hover {
          cursor: pointer !important;
       }

       input[type="submit"] {
          background-color: #d4af37 !important;
          color: white !important;
          border-radius: 2px !important;
          border: 0 !important;
          margin: 2px !important;
          width: fit-content !important;
          transition: .5s;
       }

       input[type="submit"]:hover {
          transition: .5s;
          cursor: pointer !important;
          background-color: #3a342a !important;
       }

       #id_permissions_to, #id_permissions_from {
          height: 350px !important;
          width: 100% !important;
       }

       #id_questions {
          width: 100% !important;
          min-height: 270px !important;
          border-radius: 5px !important;
          padding: 10px !important;
          border: 1px solid #d4af37 !important;
          background-color: rgba(237, 237, 237, 0.259) !important;
          color: #3a342a !important;
       }

       #id_questions:focus, #id_questions:focus-visible {
          border: 1px solid #d4af37 !important;
          outline: none !important;
       }

       .form-control {
          width: 100% !important;
          height: 35px !important;
          border-radius: 3px !important;
          border: 1px solid #b0a9a9 !important;
       }

       .form-control:focus, .form-control:focus-visible {
          border: 1px solid #d4af37 !important;
       }

       .form-control[type="checkbox"] {
          width: 20px !important;
          height: 20px !important;
          margin-top: 5px !important;
       }

       .bg-primary {
          background-color: #d4af37 !important;
          color: white !important;
       }
       a {
          color: #cfc39dff !important;
          font-weight: 600 !important;}
</style>
</head>
<body class="hold-transition sidebar-mini {% block body_class %}{% block bodyclass %}{% endblock %}{% endblock %}">

{% block body %}
    <div class="wrapper">
        {% block nav_header %}
            {% include 'adminlte/lib/_main_header.html' %}
        {% endblock %}

        {% block nav_sidebar %}
            {% include 'adminlte/lib/_main_sidebar.html' %}
        {% endblock %}

        {% block content_wrapper %}
        <div class="content-wrapper">
            {% block content_header %}
                <section class="content-header">
                    {% block no_heading %}
                        <h1>
                            {% block page_name %}{% endblock %}
                            <div class="header-actions">
                                {% block page_actions %}{% endblock %}
                            </div>
                            {% block no_description %}
                            <small>{% block page_description %}{% endblock %}</small>
                            {% endblock %}
                        </h1>
                        {% block breadcrumbs %}
                            {# Breadcrumb implementation left to developers #}
                        {% endblock %}
                    {% endblock no_heading %}
                </section>
            {% endblock %}

            {% block content_outer %}
            <section class="content">
                {% block messages %}
                    {% include 'adminlte/lib/_messages.html' %}
                {% endblock %}

                {% block content_block_wrap %}
                    {% block content %}{% endblock %}
                {% endblock %}
            </section>
            {% endblock %}

        </div>
        {% endblock content_wrapper %}
        
        {% block nav_footer %}
            {% include 'adminlte/lib/_main_footer.html' %}
        {% endblock %}

    </div>
{% endblock body %}

{% block javascript %}
{% include 'adminlte/lib/_scripts.html' %}
{% endblock %}

{% block extra_js %}{% endblock %}

{% block extra_foot %}{% endblock %}
</body>
</html>
