---
const { fullBleedOnMobile = false } = Astro.props;

const quickLinks = [
    { label: "About Us",                href: "/about" },
    { label: "Support Us",              href: "/support-us" },
    { label: "Volunteer Application",   href: "/volunteer-application" },
    { label: "Participant Application", href: "/participant-application" },
    { label: "Events",                  href: "/events" },
    { label: "Contact Us",              href: "/contact" },
    { label: "Accessibility",           href: "/accessibility" },
    { label: "Privacy",                 href: "/privacy" },
];

const year = new Date().getFullYear();
---

<footer class="w-full bg-[#d6d6d6] border-t border-black/15">
    <div class="max-w-[1280px] mx-auto px-6 sm:px-14 pt-12 pb-9">

        <!-- 3-column grid -->
        <div class="grid grid-cols-1 gap-10 sm:grid-cols-3 sm:gap-12 mb-10">

            <!-- Brand -->
            <div>
                <a href="/" aria-label="Highland Group RDA home">
                    <img
                        src="/figmaAssets/rdalogo-1.svg"
                        alt="Highland Group RDA"
                        class="h-12 mb-5 block"
                        loading="lazy"
                        decoding="async"
                    />
                </a>
                <p class="[font-family:'Public_Sans',sans-serif] font-semibold text-sm text-black/65 leading-[1.65] max-w-[280px]">
                    Enriching lives through horses in the Highlands since 1975.
                    Registered Scottish Charity
                    <a
                        class="underline"
                        href="https://www.oscr.org.uk/about-charities/search-the-register/charity-details?number=SC007357"
                        target="_blank"
                        rel="noreferrer"
                    >SC007357</a>.
                </p>
            </div>

            <!-- Quick links -->
            <div>
                <p class="[font-family:'Public_Sans',sans-serif] font-extrabold text-[13px] tracking-[0.12em] uppercase text-black mb-4">
                    Quick links
                </p>
                <nav>
                    <ul class="flex flex-col">
                        {quickLinks.map((link) => (
                            <li>
                                <a
                                    class="[font-family:'Public_Sans',sans-serif] font-semibold text-sm text-black/70 hover:underline flex items-center min-h-[44px]"
                                    href={link.href}
                                >
                                    {link.label}
                                </a>
                            </li>
                        ))}
                    </ul>
                </nav>
            </div>

            <!-- Find us -->
            <div>
                <p class="[font-family:'Public_Sans',sans-serif] font-extrabold text-[13px] tracking-[0.12em] uppercase text-black mb-4">
                    Find us
                </p>
                <address class="not-italic [font-family:'Public_Sans',sans-serif] font-semibold text-sm text-black/70 leading-[1.8]">
                    Sandycroft, Reelig<br />
                    Kirkhill, IV5 7PP<br />
                    <br />
                    <a
                        class="underline"
                        href="mailto:info@highlandgrouprda.org.uk?subject=Website%20visitor%20contact"
                    >
                        info@highlandgrouprda.org.uk
                    </a>
                </address>
                <div class="mt-6 flex gap-3">
                    <a
                        href="/facebook"
                        aria-label="Highland Group RDA on Facebook"
                        class="inline-flex items-center justify-center h-9 w-9 rounded-full border border-black/25 text-black hover:border-black/50 transition-colors"
                    >
                        <svg width="16" height="16" viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
                            <path d="M18 2h-3a5 5 0 0 0-5 5v3H7v4h3v8h4v-8h3l1-4h-4V7a1 1 0 0 1 1-1h3z"/>
                        </svg>
                    </a>
                    <a
                        href="https://www.instagram.com/HighlandGroupRDA"
                        target="_blank"
                        rel="noreferrer"
                        aria-label="Highland Group RDA on Instagram"
                        class="inline-flex items-center justify-center h-9 w-9 rounded-full border border-black/25 text-black hover:border-black/50 transition-colors"
                    >
                        <svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
                            <rect x="2" y="2" width="20" height="20" rx="5" ry="5"/>
                            <path d="M16 11.37A4 4 0 1 1 12.63 8 4 4 0 0 1 16 11.37z"/>
                            <line x1="17.5" y1="6.5" x2="17.51" y2="6.5"/>
                        </svg>
                    </a>
                </div>
            </div>

        </div>

        <!-- Bottom bar -->
        <div class="border-t border-black/15 pt-6 flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between flex-wrap">
            <p class="[font-family:'Public_Sans',sans-serif] font-semibold text-[13px] text-black/45">
                © {year} Highland Group RDA · SC007357 · Member of National RDA &amp; Grampian and Highland Regional RDA
            </p>
            <div class="flex gap-4">
                <a class="[font-family:'Public_Sans',sans-serif] font-semibold text-[13px] text-black/45 underline hover:text-black/65" href="/accessibility">
                    Accessibility
                </a>
                <a class="[font-family:'Public_Sans',sans-serif] font-semibold text-[13px] text-black/45 underline hover:text-black/65" href="/privacy">
                    Privacy
                </a>
            </div>
        </div>

    </div>
</footer>
