<template>
  <footer class="footer">
    <slot></slot>
  </footer>
</template>

<script></script>

<style lang="scss">
@import "@/scss/_variables.scss";
@import "@/scss/_mixins.scss";

.footer {
  background: url("/subtle-prism.svg") $bg-color-dark;
  background-blend-mode: multiply;

  padding: max(1em, env(safe-area-inset-top)) 0
    max(1em, env(safe-area-inset-bottom)) 0;

  text-align: center;
}
</style>
