{% load static %}

{% load render_bundle from webpack_loader %}
{% load django_htmx %}


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <title>
        {% block head_title %}
            Generic Django Base Template
        {% endblock head_title %}
    </title>

    <!-- Custom LARA stylesheet -->

    <!-- <link rel="stylesheet" href="{% static 'lara_django_base/css/lara_django_base_core.css' %}"> -->

    {% block head %}
    {% endblock head %}

    <!-- HTMX -->

    {% htmx_script %}
    <!-- <script src="{% static 'lara_django_base/js/htmx.min.js' %}"></script> -->
    
    <!-- link href="{% static 'lara_django_base/css/daisyui-4.12.14-full.min.css' %}" rel="stylesheet" type="text/css" / -->
    <!-- <link href="https://cdn.jsdelivr.net/npm/daisyui@4.12.19/dist/full.min.css" rel="stylesheet" type="text/css" /> -->
    <!-- <script src="https://cdn.tailwindcss.com?plugins=typography,aspect-ratio,container-queries"></script>  -->
    <!-- plugin: forms-->
    <!-- <script src="https://cdn.jsdelivr.net/gh/alpinejs/alpine@v2.x.x/dist/alpine.js" defer></script> -->

    <script defer src="https://cdn.jsdelivr.net/npm/alpinejs@3.x.x/dist/cdn.min.js"></script>
    
    <!-- <link href="{% static 'lara_django_base/css/styles.css' %}" rel="stylesheet" /> -->
    <!--script src="https://cdn.plot.ly/plotly-2.34.0.min.js" charset="utf-8"></script -->

    <!--load svg icons from local folder static icons/menu_icons.svg
    <svg>
        <use xlink:href="{% static 'icons/menu_icons.svg' %}#icon-id"></use>
    </svg>
    -->

<!-- <link href="https://cdn.jsdelivr.net/npm/daisyui@5" rel="stylesheet" type="text/css" /> -->
<!-- <script src="https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4"></script> -->

 {% render_bundle 'lara_django_base_core' 'css' config='BASE' %}
 <link href="https://cdn.jsdelivr.net/npm/daisyui@5" rel="stylesheet" type="text/css" />
<script src="https://cdn.jsdelivr.net/npm/@tailwindcss/browser@4"></script>

    {% block extra_head %}
    {% endblock extra_head %}

    <link rel="stylesheet" href="{% static 'lara_django_base/css/lara_django_base_core.css' %}">
</head>
<body class="scroll-smooth"
      hx-headers='{"X-CSRFToken": "{{ csrf_token }}"}'
      hx-indicator="#spinner">

    {# Global htmx activity indicator — shown whenever a request is in flight #}
    <div class="fixed top-4 right-4 z-50 pointer-events-none">
        {% include 'lara_django_base/partials/spinner.html' %}
    </div>

    {% block top-navbar %}
    {% endblock top-navbar %}

    <div class="flex">
        {% block sidebar %}
        {% endblock sidebar %}
        {% block drawer %}
        {% endblock drawer %}
        <div id="main-content" class="content flex-col w-full min-w-0">
            {% block content %}
            {% endblock content %}
        </div>
    </div>

    <footer class="bg-gray-200 text-center py-4 w-full">
        {% block footer %}
        {% endblock footer %}
    </footer>

    <!-- <script src="{% static 'lara_django_base/js/lara_django_base_core.js' %}"></script> -->

    {% block scripts %}
    {% endblock scripts %}

    {% block scripts-extra %}
    {% endblock scripts-extra %}

    {% render_bundle 'lara_django_base_core' 'js' config='BASE' %}

</body>
</html>