// Figma Design Context: Popup/Overlay (Krok 2 formularza)
// Node ID: 32:645 (Overlay), 32:397 (POPUP)
// Rozmiar: 866x1354
// Pobrano: 2026-03-25
// UWAGA: Kod referencyjny React+Tailwind z Figma MCP — do adaptacji na PHP/HTML/CSS

const imgImage1 = "https://www.figma.com/api/mcp/asset/8a38c799-dead-4b1d-8ff0-d00597dfea2c";
const imgCaretDown = "https://www.figma.com/api/mcp/asset/a349db71-cdd5-4d4a-9807-28cf459feb32";
const imgMapPin = "https://www.figma.com/api/mcp/asset/9b1a041f-b48d-40f5-b2cd-43b716da2966";
const imgCheck = "https://www.figma.com/api/mcp/asset/6cb28b8a-fbee-4804-94a0-bb2819214249";
const imgCalendarBlank = "https://www.figma.com/api/mcp/asset/4b9d051a-4eab-465b-b264-8526c710b149";
const imgVector = "https://www.figma.com/api/mcp/asset/4bde070b-db1f-4ab3-b6f2-c440d5e8aec5";
const imgCaretDown1 = "https://www.figma.com/api/mcp/asset/e5de2ce7-5f1e-4aa8-b82c-7d02fcc27f94";
const imgVector1 = "https://www.figma.com/api/mcp/asset/754220ec-12e8-4b70-8890-d97d730ac1ac";
const imgVector2 = "https://www.figma.com/api/mcp/asset/5160affe-7594-4684-b552-23e39717de49";
const imgX = "https://www.figma.com/api/mcp/asset/95812780-10b8-4394-8736-5598c84f2fec";

/*
 * STRUKTURA POPUP (Krok 2):
 *
 * 1. Nagłówek: "Wypełnij formularz rezerwacji." + X
 * 2. Dane wynajmu: Segment, Od kiedy, Do kiedy, Wybrano X dni, Miejsce odbioru, Zwrot w tej samej lokalizacji
 * 3. Wyjazd zagraniczny: checkbox "Planuję trasę poza granicę Polski" → wyszukiwarka krajów
 * 4. Ubezpieczenie: Pakiet ochrony Soft (od 190 do 800 zł), Pakiet ochrony Premium (od 200 do 1200 zł)
 * 5. Opcje dodatkowe: Dodatkowy kierowca (100 zł), Zwiększenie limitu km, Pełny bak (650 zł),
 *    GPS Europa, Podstawka, Fotelik 9-18kg, Fotelik 18-36kg, Zwrot nieumytego (290 zł)
 * 6. Dane najemcy: Imię, Nazwisko, Email, Telefon (+48)
 * 7. Wiadomość: textarea
 * 8. Stopka: Zgoda na Politykę Prywatności + Wyślij
 *
 * RÓŻNICE VS KROK 1:
 * - Nowa sekcja "Wyjazd zagraniczny" z checkboxem i wyszukiwarką krajów
 * - Nowa sekcja "Ubezpieczenie" (Soft / Premium) (też raczej pobierane z API, z cenami jako zakresy)
 * - Rozbudowane opcje dodatkowe (8 pozycji zamiast 2)
 * - Ceny jako zakresy "od X do Y zł" (zależne od cennika API)
 */

export default function Overlay() {
  return (
    <div className="relative size-full" data-name="Overlay" data-node-id="32:645">
      <div className="-translate-x-1/2 -translate-y-1/2 absolute bg-[#ededf3] content-stretch flex flex-col gap-[24px] items-start justify-center left-1/2 overflow-clip px-[48px] py-[40px] rounded-[16px] top-[calc(50%+18.5px)]" data-name="POPUP" data-node-id="32:397">
        <p className="font-['Albert_Sans:Bold',sans-serif] font-bold leading-[0] min-w-full relative shrink-0 text-[#2f2482] text-[20px] text-center w-[min-content]" data-node-id="32:398">
          <span className="leading-[32px]">Wypełnij formularz rezerwacji</span>
          <span className="leading-[32px] text-[red]">.</span>
        </p>
        {/* ... pełny kod w odpowiedzi Figma MCP get_design_context nodeId=32:645 ... */}
      </div>
    </div>
  );
}