---
import Layout from "@layouts/Layout.astro";
import { CONTACTS_PAGE_SEO, CONTACT_CONSTANTS } from "@constants/constants.ts";

// Импорт компонентов
import ContactsHero from "@components/contacts/ContactsHero.astro";
import ContactsGrid from "@components/contacts/ContactsGrid.astro";
import BotWidget from "@components/contacts/BotWidget.astro";
import EmergencyCard from "@components/contacts/EmergencyCard.astro";
import MessengerButtons from "@components/contacts/MessengerButtons.astro";
import Map from "@components/base/Map.astro";

// Используем данные из констант
const contactsData = CONTACT_CONSTANTS.contacts;
---

<Layout
  title={CONTACTS_PAGE_SEO?.title}
  description={CONTACTS_PAGE_SEO?.description}
  pagePath="/contacts"
  bodyClass="bg-[#F8F9FA] text-gray-900"
>
  <main class="min-h-screen bg-[#F8F9FA] -mx-4 md:mx-0 overflow-x-hidden">
    <!-- Декоративный фон -->
    <div class="fixed inset-0 pointer-events-none">
      <div
        class="absolute top-0 left-1/4 w-96 h-96 bg-[var(--color-blue-primary)] opacity-5 rounded-full blur-3xl"
      >
      </div>
      <div
        class="absolute bottom-0 right-1/4 w-96 h-96 bg-[var(--color-gold)] opacity-5 rounded-full blur-3xl"
      >
      </div>
    </div>

    <div
      class="relative z-10 w-full px-4 md:container md:mx-auto md:px-4 md:max-w-7xl py-16 lg:py-24"
    >
      <!-- Hero -->
      <ContactsHero />

      <!-- Основная сетка -->
      <div class="grid grid-cols-1 lg:grid-cols-12 gap-8 lg:gap-12 mb-16">
        <!-- Левая колонка: Контакты -->
        <div class="lg:col-span-7 space-y-6">
          <ContactsGrid contacts={contactsData} />
          <MessengerButtons telegramLink={contactsData.bot.telegram} />
        </div>

        <!-- Правая колонка: Бот и Срочная помощь -->
        <div class="lg:col-span-5 space-y-6">
          <BotWidget
            telegramLink={contactsData.bot.telegram}
            botName={contactsData.bot.name}
          />
          <EmergencyCard phone={contactsData.emergencyPhone} />
        </div>
      </div>

      <!-- Карта -->
      <Map
        variant="card"
        title="Как нас найти"
        subtitle="г. Сургут, 25 мкр. Вход со стороны главного фасада."
      />
    </div>
  </main>
</Layout>
