{% extends "base.html" %}

{% set contact_title = get_page_text(page, "title", lang) if page else "Contact" %}
{% set contact_meta = get_page_text(page, "meta_description", lang) if page else "" %}
{% block title %}{{ get_page_text(page, "seo_title", lang) if page else "Contact" }} | {{ settings.company_name }}{% endblock %}
{% block meta %}
  {% if contact_meta %}<meta name="description" content="{{ contact_meta }}">{% endif %}
{% endblock %}

{% block content %}
<section class="mx-auto grid max-w-7xl gap-8 px-4 py-14 sm:px-6 lg:grid-cols-[0.9fr_1.1fr] lg:px-8">
  <div>
    <nav class="mb-6 text-sm font-bold text-zinc-500">
      <a class="text-zinc-700 underline decoration-amber-400 decoration-2 underline-offset-4" href="{{ url_for('home', lang=lang) }}">{{ t("home", lang) }}</a>
      <span class="mx-2">/</span>
      <span>{{ t("contact", lang) }}</span>
    </nav>
    <p class="eyebrow-dark">{{ t("contact", lang) }}</p>
    <h1 class="mt-3 text-4xl font-black tracking-normal">{{ contact_title }}</h1>
    <p class="mt-5 max-w-xl text-lg leading-8 text-zinc-700">{{ get_page_text(page, "excerpt", lang) if page else "Contact us about current stock, delivery, financing, or inspection details." }}</p>
    <div class="mt-6 grid gap-3 text-sm font-bold text-zinc-700">
      <p class="rounded-lg border border-zinc-200 bg-white p-4">{{ t("contact_stock_note", lang) }}</p>
      <p class="rounded-lg border border-zinc-200 bg-white p-4">{{ t("contact_export_note", lang) }}</p>
    </div>
    <div class="mt-8 rounded-lg border border-zinc-200 bg-white p-6 text-sm leading-7 text-zinc-700">
      {% if settings.phone %}<p><strong>{{ t("phone", lang) }}:</strong> <a class="underline" href="tel:{{ settings.phone }}">{{ settings.phone }}</a>{% if settings.phone2 %} · <a class="underline" href="tel:{{ settings.phone2 }}">{{ settings.phone2 }}</a>{% endif %}</p>{% endif %}
      {% if settings.email %}<p><strong>{{ t("email", lang) }}:</strong> {{ settings.email }}</p>{% endif %}
      {% if settings.address %}<p><strong>{{ t("address", lang) }}:</strong> {{ format_address(settings)|safe }}</p>{% endif %}
      {% set verify = company_verification_data() %}{% if verify.vat_number %}<p><strong>{{ t('vat_number', lang) }}:</strong> {{ verify.vat_number }}</p>{% endif %}
    </div>
    {% if page %}
      <div class="prose-content mt-6 text-sm leading-7 text-zinc-700">{{ get_page_text(page, "content_html", lang)|safe }}</div>
    {% endif %}
  </div>

  <form class="rounded-lg border border-zinc-200 bg-white p-6 shadow-xl shadow-zinc-200/70" method="post">
    <p class="text-sm font-black uppercase tracking-[0.2em] text-zinc-500">{{ t("general_enquiry", lang) }}</p>
    <div class="mt-5 grid gap-4 sm:grid-cols-2">
      <input class="form-input" name="customer_name" placeholder="{{ t('name', lang) }}">
      <input class="form-input" type="email" name="customer_email" placeholder="{{ t('email', lang) }}">
      <input class="form-input" name="customer_phone" placeholder="{{ t('phone', lang) }}">
      <input class="form-input" name="customer_whatsapp" placeholder="{{ t('phone', lang) }}">
      <select class="form-input" name="buyer_type"><option value="">Buyer type</option><option value="company">{{ t('company_purchase', lang) }}</option><option value="private">{{ t('private_purchase', lang) }}</option></select>
      <input class="form-input" name="delivery_postcode" placeholder="{{ t('delivery_postcode', lang) }}">
      <input class="form-input" name="buyer_country" placeholder="{{ t('country', lang) }}">
      <select class="form-input" name="preferred_contact_method"><option value="">{{ t('preferred_contact_method', lang) }}</option><option value="email">{{ t('email_contact', lang) }}</option><option value="telephone">{{ t('telephone_contact', lang) }}</option></select>
    </div>
    <input type="hidden" name="campaign_source" value="{{ request.args.get('utm_source','') }}">
    <textarea class="form-input mt-4 min-h-36" name="message" placeholder="{{ t('message', lang) }}"></textarea>
    <button class="btn-primary mt-5 w-full" type="submit">{{ t("send_message", lang) }}</button>
  </form>
</section>

<section class="mx-auto max-w-7xl px-4 pb-12 sm:px-6 lg:px-8">{% include 'partials/company_verification.html' %}</section>
{% endblock %}