{{!
    This file is part of Moodle - http://moodle.org/

    Moodle is free software: you can redistribute it and/or modify
    it under the terms of the GNU General Public License as published by
    the Free Software Foundation, either version 3 of the License, or
    (at your option) any later version.

    Moodle is distributed in the hope that it will be useful,
    but WITHOUT ANY WARRANTY; without even the implied warranty of
    MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
    GNU General Public License for more details.

    You should have received a copy of the GNU General Public License
    along with Moodle.  If not, see <http://www.gnu.org/licenses/>.
}}
{{!
    @template theme_degrade/login

    Login page template

    Example context (json):
    {
        "output": {
            "doctype": "<!DOCTYPE html>",
            "page_title": "Login page",
            "favicon": "favicon.ico",
            "main_content": "<h1>Headers keep HTML validators happy</h1>"
        }
    }
}}
{{> theme_degrade/head }}

<body {{{bodyattributes}}}>
{{> core/local/toast/wrapper}}

<div id="page-wrapper" class="page-wrapper-login {{{login_theme}}}"
     style="--login-bg: url('{{{loginbackgroundimageurl}}}');">

    {{{ output.standard_top_of_body_html }}}

    <section class="login-wrapper">
        <div class="login-container">
            {{{ output.main_content }}}
        </div>
    </section>
    <div class="loginfooter">
            <div class="language-menu">
                {{#languagemenu}}
                    <button class="language-menu__button" id="languageMenuBtn">
                        {{languagemenu.primary.title}}
                        <span class="arrow"></span>
                    </button>
                    <ul class="language-menu__list" id="languageMenuList">
                        {{#languagemenu.secondary.items}}
                            <li class="language-menu__item">
                                <a href="{{actionmenulink.url}}">
                                    {{actionmenulink.text}}
                                </a>
                            </li>
                        {{/languagemenu.secondary.items}}
                    </ul>
                    <script>
                        document.addEventListener("DOMContentLoaded", function () {
                            const btn = document.getElementById("languageMenuBtn");
                            const list = document.getElementById("languageMenuList");
                            const container = btn.closest(".language-menu");

                            btn.addEventListener("click", function (e) {
                                e.stopPropagation();
                                list.classList.toggle("show");
                                container.classList.toggle("open");
                            });

                            document.addEventListener("click", function () {
                                list.classList.remove("show");
                                container.classList.remove("open");
                            });
                        });
                    </script>
                {{/languagemenu}}
            </div>
            <p>
                {{#footer_show_copywriter}}
                    {{#str}}footer_copywriter,theme_degrade{{/str}}
                    <a href="https://eduardokraus.com" target="_blank">Eduardo Kraus</a>
                {{/footer_show_copywriter}}
            </p>
    </div>
</div>

</body>
</html>
{{#js}}
    M.util.js_pending("theme_boost/loader");
    require(["theme_boost/loader"], function() {
        M.util.js_complete("theme_boost/loader");
    });
{{/js}}
