{% extends 'layout/master.html.twig' %}

{% block layout %}

<script>
  var defaultThemeMode = "light";
  var themeMode;
  if (document.documentElement) {
    if (document.documentElement.hasAttribute("data-bs-theme-mode")) {
      themeMode = document.documentElement.getAttribute("data-bs-theme-mode");
    } else {
      if (localStorage.getItem("data-bs-theme") !== null) {
        themeMode = localStorage.getItem("data-bs-theme");
      } else {
        themeMode = defaultThemeMode;
      }
    }
    if (themeMode === "system") {
      themeMode = window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light";
    }
    document.documentElement.setAttribute("data-bs-theme", themeMode);
  } 
</script>

<div class="d-flex flex-column-auto"></div>

<div class="d-flex flex-column flex-column-fluid flex-lg-row">
  <div class="d-flex flex-column-fluid justify-content-top justify-content-lg-end p-12 p-lg-20 bgi-size-cover"
    style="background-image: url({{theme.image('misc/Milquilogo-CiprianPardau-unsplash-fullscreen.jpg')}})">
    <div class="bg-body d-flex flex-column align-items-stretch flex-center rounded-4 w-md-500px">
      <div class="d-flex flex-center flex-column flex-column-fluid px-lg-8">
        <div class="w-lg-500px p-8">

          {% block content %}{% endblock %}

        </div>
      </div>
    </div>
  </div>
</div>

{% endblock %}