<script lang="ts">
  import ContentRows from "./ContentRows.svelte";
  import type { RowContentLayout } from "$lib/block-types";
  import { t as tStatic, T } from "$lib/translations";
  import type { Translations } from "$lib/translations";

  interface FooterEntry extends RowContentLayout {
    id?: string;
  }

  let { footer = null, translations = {} }: { footer?: FooterEntry | null; translations?: Translations | null } = $props();

  function t(key: string) {
    return tStatic(translations ?? null, key);
  }

  const hasRowContent = $derived(
    !!footer &&
      ((footer.row1Content?.length ?? 0) > 0 ||
        (footer.row2Content?.length ?? 0) > 0 ||
        (footer.row3Content?.length ?? 0) > 0),
  );
</script>

{#if footer}
  <footer
    class="mt-auto bg-stein-900 text-stein-0 py-10"
    data-footer-id={footer.id}
  >
    <div class="container-custom">
      {#if hasRowContent}
        <div class="content-footer text-sm text-stein-200">
          <ContentRows layout={footer} translations={translations} />
        </div>
      {:else}
        <p class="text-sm text-stein-0/80 text-center">
          {t(T.footer_copyright) !== T.footer_copyright
            ? t(T.footer_copyright)
            : `© ${new Date().getFullYear()} Windwiderstand`}
        </p>
      {/if}
    </div>
  </footer>
{/if}

<style>
  .content-footer :global(.content) {
    margin: 0;
  }
  /* Footer nutzt jetzt das normale 12-Spalten-Grid (grid grid-cols-12 aus
     ContentRows) + per-Block layout (mobile/tablet/desktop + desktopStart).
     Kein Flex-Override mehr — Spaltigkeit kommt aus dem CMS-layout. */
  .content-footer :global(.content-row + .content-row) {
    margin-top: 2rem;
    padding-top: 1.5rem;
    border-top: 1px solid var(--color-stein-700);
  }
  /* Globaler Row-Trenner (::before aus app.css) doppelt den eigenen
     border-top-Trenner → hier abschalten. */
  .content-footer :global(.content-row + .content-row::before) {
    display: none;
  }
  /* Trailing-Margins im Footer killen: letzter Block (Wrapper mb-4) und
     letzter Absatz (.markdown p mb-4) sonst → Leerraum unter Copyright/Lizenz
     vor dem Footer-Rand (zusätzlich zum py-10-Padding). */
  .content-footer :global(.content-row:last-child > *:last-child),
  .content-footer :global(.markdown > p:last-child) {
    margin-bottom: 0;
  }
  .content-footer :global(a) {
    color: var(--color-stein-200);
  }
  /* Markdown-Links (z. B. „Mehr dazu" in Copyright-Zeile) unterstreichen –
     konsistent mit den Link-Listen, die schon Underline haben. */
  .content-footer :global(.markdown a) {
    text-decoration: underline;
    text-underline-offset: 2px;
  }
  .content-footer :global(a:hover) {
    color: var(--color-stein-0);
  }
  .content-footer :global(h3) {
    color: var(--color-stein-0);
  }
  .content-footer :global(.markdown),
  .content-footer :global(.prose) {
    color: var(--color-stein-200);
  }
</style>
