Files
magico.prototype/prototype/baza-pilotow/index.php
T

921 lines
52 KiB
PHP
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<?php
$pageTitle = 'Superpilot — Baza Pilotów Wycieczek (Katalog i Wyszukiwarka)';
$enablePrototypeComments = true;
include __DIR__ . '/header.php';
?>
<div class="container-xxl flex-grow-1 container-p-y" style="padding-top: 1.5rem !important;">
<!-- ================= GŁÓWNA BELKA WYSZUKIWARKI W STYLU PRACUJ.PL Z MULTISELECTEM KRAJÓW ================= -->
<div class="search-bar-pracuj">
<!-- 1. Słowa kluczowe / Nazwisko -->
<div class="search-field-item">
<i class='bx bx-search field-icon'></i>
<div class="field-content">
<div class="field-label">Pilot / Specjalizacja / Słowo kluczowe</div>
<input type="text" id="mainSearchInput" placeholder="Np. Oskar Kaczmarek, Rzym, Trekking...">
</div>
</div>
<!-- 2. Kraj / Destynacje — MULTISELECT POPUP -->
<div class="search-field-item">
<i class='bx bx-globe field-icon'></i>
<div class="field-content dropdown">
<div class="field-label">Destynacje (Multiselect)</div>
<button type="button" class="multiselect-dest-trigger dropdown-toggle" id="destDropdownTrigger" data-bs-toggle="dropdown" data-bs-auto-close="outside" aria-expanded="false">
<span class="trigger-text" id="destTriggerText">🇮🇹 Włochy</span>
<i class='bx bx-chevron-down text-muted ms-1'></i>
</button>
<div class="dropdown-menu multiselect-dropdown-menu shadow-lg" aria-labelledby="destDropdownTrigger">
<div class="d-flex justify-content-between align-items-center mb-2 pb-1 border-bottom">
<span class="small fw-bold text-navy">Wybierz obsługiwane kraje:</span>
<button type="button" class="btn btn-sm btn-link p-0 text-muted text-decoration-none small" id="btnResetDestMultiselect" style="font-size: 0.72rem;">Wyczyść</button>
</div>
<label class="multiselect-item-row">
<div class="d-flex align-items-center gap-2">
<input type="checkbox" class="top-dest-checkbox" value="Włochy" checked>
<span>🇮🇹 Włochy</span>
</div>
<span class="text-muted small">(24)</span>
</label>
<label class="multiselect-item-row">
<div class="d-flex align-items-center gap-2">
<input type="checkbox" class="top-dest-checkbox" value="Grecja">
<span>🇬🇷 Grecja</span>
</div>
<span class="text-muted small">(18)</span>
</label>
<label class="multiselect-item-row">
<div class="d-flex align-items-center gap-2">
<input type="checkbox" class="top-dest-checkbox" value="Hiszpania">
<span>🇪🇸 Hiszpania</span>
</div>
<span class="text-muted small">(16)</span>
</label>
<label class="multiselect-item-row">
<div class="d-flex align-items-center gap-2">
<input type="checkbox" class="top-dest-checkbox" value="Chorwacja">
<span>🇭🇷 Chorwacja</span>
</div>
<span class="text-muted small">(12)</span>
</label>
<label class="multiselect-item-row">
<div class="d-flex align-items-center gap-2">
<input type="checkbox" class="top-dest-checkbox" value="Norwegia">
<span>🇳🇴 Norwegia</span>
</div>
<span class="text-muted small">(9)</span>
</label>
<label class="multiselect-item-row">
<div class="d-flex align-items-center gap-2">
<input type="checkbox" class="top-dest-checkbox" value="Austria">
<span>🇦🇹 Austria</span>
</div>
<span class="text-muted small">(7)</span>
</label>
<label class="multiselect-item-row">
<div class="d-flex align-items-center gap-2">
<input type="checkbox" class="top-dest-checkbox" value="Japonia">
<span>🇯🇵 Japonia & Azja</span>
</div>
<span class="text-muted small">(5)</span>
</label>
<div class="pt-2 mt-2 border-top">
<button type="button" class="btn btn-sm btn-primary w-100 fw-semibold" id="btnConfirmDestDropdown">
Zastosuj wybrane kraje
</button>
</div>
</div>
</div>
</div>
<!-- 3. Termin wycieczki (Dialog kalendarza) -->
<div class="search-field-item" data-bs-toggle="modal" data-bs-target="#dateRangeModal" style="cursor: pointer;">
<i class='bx bx-calendar field-icon text-primary'></i>
<div class="field-content">
<div class="field-label">Termin wycieczki (Kalendarz)</div>
<input type="text" id="selectedDateDisplay" value="16.09.2027 – 24.09.2027" readonly style="cursor: pointer;">
</div>
<i class='bx bx-chevron-down text-muted'></i>
</div>
<!-- 4. Przycisk Szukaj -->
<button type="button" class="btn-search-pracuj" id="btnExecuteSearch">
<i class='bx bx-search'></i> Szukaj
</button>
</div>
<!-- ================= GŁÓWNY UKŁAD 2-KOLUMNOWY ================= -->
<div class="row g-4">
<!-- ================= LEWA KOLUMNA: SIDEBAR FILTRÓW ================= -->
<div class="col-lg-4 col-xl-3">
<div class="filters-sidebar">
<div class="filter-sidebar-header">
<h6 class="filter-sidebar-title">
<i class='bx bx-filter-alt text-primary'></i> Filtry
</h6>
<button type="button" id="btnClearAllFilters" class="btn btn-sm btn-link text-muted p-0 text-decoration-none" style="font-size: 0.76rem;">
Wyczyść filtry
</button>
</div>
<!-- NOWY AKORDEON: Baza wypadowa pilota -->
<div class="filter-accordion-item">
<div class="filter-accordion-header" data-bs-toggle="collapse" data-bs-target="#filterBaseCollapse">
<span class="filter-accordion-title">
<i class='bx bx-building-house'></i> Baza pilota
</span>
<i class='bx bx-chevron-down text-muted'></i>
</div>
<div class="collapse show filter-accordion-body" id="filterBaseCollapse">
<label class="filter-checkbox-row">
<div class="d-flex align-items-center gap-2">
<input type="checkbox" class="filter-checkbox" data-type="base" value="warszawa">
<span>Warszawa</span>
</div>
<span class="filter-count-badge">(48)</span>
</label>
<label class="filter-checkbox-row">
<div class="d-flex align-items-center gap-2">
<input type="checkbox" class="filter-checkbox" data-type="base" value="kraków">
<span>Kraków</span>
</div>
<span class="filter-count-badge">(26)</span>
</label>
<label class="filter-checkbox-row">
<div class="d-flex align-items-center gap-2">
<input type="checkbox" class="filter-checkbox" data-type="base" value="katowice">
<span>Katowice / Śląsk</span>
</div>
<span class="filter-count-badge">(22)</span>
</label>
<label class="filter-checkbox-row">
<div class="d-flex align-items-center gap-2">
<input type="checkbox" class="filter-checkbox" data-type="base" value="poznań">
<span>Poznań</span>
</div>
<span class="filter-count-badge">(15)</span>
</label>
<label class="filter-checkbox-row">
<div class="d-flex align-items-center gap-2">
<input type="checkbox" class="filter-checkbox" data-type="base" value="wrocław">
<span>Wrocław</span>
</div>
<span class="filter-count-badge">(14)</span>
</label>
<label class="filter-checkbox-row">
<div class="d-flex align-items-center gap-2">
<input type="checkbox" class="filter-checkbox" data-type="base" value="gdańsk">
<span>Gdańsk / Trójmiasto</span>
</div>
<span class="filter-count-badge">(12)</span>
</label>
</div>
</div>
<!-- Akordeon 2: Specjalizacje -->
<div class="filter-accordion-item">
<div class="filter-accordion-header" data-bs-toggle="collapse" data-bs-target="#filterSpecCollapse">
<span class="filter-accordion-title">
<i class='bx bx-category'></i> Specjalizacje
</span>
<i class='bx bx-chevron-down text-muted'></i>
</div>
<div class="collapse show filter-accordion-body" id="filterSpecCollapse">
<label class="filter-checkbox-row">
<div class="d-flex align-items-center gap-2">
<input type="checkbox" class="filter-checkbox" data-type="spec" value="objazdówki">
<span>Wycieczki objazdowe</span>
</div>
<span class="filter-count-badge">(38)</span>
</label>
<label class="filter-checkbox-row">
<div class="d-flex align-items-center gap-2">
<input type="checkbox" class="filter-checkbox" data-type="spec" value="trekking">
<span>Trekking & góry</span>
</div>
<span class="filter-count-badge">(14)</span>
</label>
<label class="filter-checkbox-row">
<div class="d-flex align-items-center gap-2">
<input type="checkbox" class="filter-checkbox" data-type="spec" value="miejski">
<span>Przewodnik miejski</span>
</div>
<span class="filter-count-badge">(21)</span>
</label>
<label class="filter-checkbox-row">
<div class="d-flex align-items-center gap-2">
<input type="checkbox" class="filter-checkbox" data-type="spec" value="młodzież">
<span>Grupy szkolne</span>
</div>
<span class="filter-count-badge">(19)</span>
</label>
<label class="filter-checkbox-row">
<div class="d-flex align-items-center gap-2">
<input type="checkbox" class="filter-checkbox" data-type="spec" value="vip">
<span>VIP & Incentive</span>
</div>
<span class="filter-count-badge">(11)</span>
</label>
<label class="filter-checkbox-row">
<div class="d-flex align-items-center gap-2">
<input type="checkbox" class="filter-checkbox" data-type="spec" value="kulinaria">
<span>Enoturystyka & kulinaria</span>
</div>
<span class="filter-count-badge">(8)</span>
</label>
</div>
</div>
<!-- Akordeon 3: Języki obce -->
<div class="filter-accordion-item">
<div class="filter-accordion-header" data-bs-toggle="collapse" data-bs-target="#filterLangCollapse">
<span class="filter-accordion-title">
<i class='bx bx-message-dots'></i> Języki obce
</span>
<i class='bx bx-chevron-down text-muted'></i>
</div>
<div class="collapse show filter-accordion-body" id="filterLangCollapse">
<label class="filter-checkbox-row">
<div class="d-flex align-items-center gap-2">
<input type="checkbox" class="filter-checkbox" data-type="lang" value="Angielski">
<span>Angielski (B2 / C1 / C2)</span>
</div>
<span class="filter-count-badge">(45)</span>
</label>
<label class="filter-checkbox-row">
<div class="d-flex align-items-center gap-2">
<input type="checkbox" class="filter-checkbox" data-type="lang" value="Włoski">
<span>Włoski (min. B2)</span>
</div>
<span class="filter-count-badge">(18)</span>
</label>
<label class="filter-checkbox-row">
<div class="d-flex align-items-center gap-2">
<input type="checkbox" class="filter-checkbox" data-type="lang" value="Hiszpański">
<span>Hiszpański (min. B2)</span>
</div>
<span class="filter-count-badge">(14)</span>
</label>
<label class="filter-checkbox-row">
<div class="d-flex align-items-center gap-2">
<input type="checkbox" class="filter-checkbox" data-type="lang" value="Norweski">
<span>Norweski (C1)</span>
</div>
<span class="filter-count-badge">(4)</span>
</label>
</div>
</div>
<!-- Akordeon 4: Certyfikaty i Ranga -->
<div class="filter-accordion-item">
<div class="filter-accordion-header" data-bs-toggle="collapse" data-bs-target="#filterCertCollapse">
<span class="filter-accordion-title">
<i class='bx bx-award'></i> Certyfikaty & Ranga
</span>
<i class='bx bx-chevron-down text-muted'></i>
</div>
<div class="collapse show filter-accordion-body" id="filterCertCollapse">
<label class="filter-checkbox-row">
<div class="d-flex align-items-center gap-2">
<input type="checkbox" class="filter-checkbox" data-type="cert" value="verified">
<span>Superpilot Academy</span>
</div>
<span class="filter-count-badge">(32)</span>
</label>
<label class="filter-checkbox-row">
<div class="d-flex align-items-center gap-2">
<input type="checkbox" class="filter-checkbox" data-type="cert" value="kpp">
<span>Ratownik KPP</span>
</div>
<span class="filter-count-badge">(16)</span>
</label>
<label class="filter-checkbox-row">
<div class="d-flex align-items-center gap-2">
<input type="checkbox" class="filter-checkbox" data-type="cert" value="rating-48">
<span>Ocena min. 4.8 ★</span>
</div>
<span class="filter-count-badge">(27)</span>
</label>
</div>
</div>
<div class="filter-sidebar-footer">
<button type="button" class="btn-apply-filters" id="btnApplySidebarFilters">
<i class='bx bx-check'></i> Pokaż pilotów (<span id="sidebarCountSpan">5</span>)
</button>
</div>
</div>
</div>
<!-- ================= PRAWA KOLUMNA: KATALOG OFERT PILOTÓW ================= -->
<div class="col-lg-8 col-xl-9">
<!-- Pasek aktywnych filtrów (Chips) -->
<div class="active-filters-bar" id="activeFiltersBar">
<span class="text-muted small me-1">Aktywne filtry:</span>
<span class="active-filter-chip" id="chipDestFilter">
<i class='bx bx-globe text-primary'></i>
<span id="chipDestText">Włochy</span>
<i class='bx bx-x chip-remove' id="removeDestChip" title="Usuń filtr"></i>
</span>
<span class="active-filter-chip" id="chipDateFilter">
<i class='bx bx-calendar text-primary'></i>
<span id="chipDateText">16–24.09.2027</span>
<i class='bx bx-x chip-remove' id="removeDateChip" title="Usuń filtr"></i>
</span>
<span class="active-filter-chip" id="chipBaseFilter" style="display: none;">
<i class='bx bx-building-house text-primary'></i>
<span id="chipBaseText">Warszawa</span>
<i class='bx bx-x chip-remove' id="removeBaseChip" title="Usuń filtr"></i>
</span>
</div>
<!-- Belka podsumowania nad listą -->
<div class="d-flex justify-content-between align-items-center flex-wrap gap-2 mb-3">
<div>
<span class="fw-bold text-navy" style="font-size: 1.05rem;">Dostępni piloci wycieczek</span>
<span class="text-muted small ms-1">— <span id="offersCountText">5 ofert</span></span>
</div>
<div class="d-flex align-items-center gap-2">
<span class="text-muted small">Sortuj:</span>
<select class="form-select form-select-sm border" style="width: auto; font-size: 0.8rem; font-weight: 600;">
<option selected>Dla Ciebie (Rekomendowani)</option>
<option>Najwyższa ocena biur</option>
<option>Staż pilotażu</option>
</select>
</div>
</div>
<!-- Komunikat o braku ofert -->
<div id="noOffersAlert" class="alert alert-light border text-center p-4 my-4" style="display: none; border-radius: var(--radius-md);">
<i class='bx bx-search-alt fs-1 text-muted mb-2'></i>
<h6 class="fw-bold text-navy mb-1">Brak pilotów spełniających podane kryteria</h6>
<p class="text-muted small mb-3">Zmień wybrane destynacje, specjalizacje w lewym panelu lub zresetuj filtry.</p>
<button type="button" class="btn btn-sm btn-primary-calm" onclick="document.getElementById('btnClearAllFilters').click();">
Wyczyść wszystkie filtry
</button>
</div>
<!-- LISTA POZIOMYCH KART PILOTÓW (UPORZĄDKOWANA, CZYSTA) -->
<div id="pilotOffersList">
<!-- ================= OFERTA 1: OSKAR KACZMAREK ================= -->
<div class="pilot-offer-card pilot-grid-item"
data-name="Oskar Kaczmarek"
data-base="warszawa"
data-destinations="Włochy Grecja Hiszpania Chorwacja Norwegia Austria"
data-languages="Polski Angielski Włoski"
data-tags="objazdówki miejski rzym florencja młodzież vip kulinaria"
data-rating="4.9"
data-verified="1"
data-kpp="1"
data-dates-free="05-15-sep 25-30-sep październik-2027">
<div class="pilot-offer-avatar">
<img src="<?= $basePath ?>/assets/img/pilots/oskar-avatar.jpg" alt="Oskar Kaczmarek" class="pilot-avatar-img">
<div class="verified-badge-mini" title="Zweryfikowany przez Superpilot Academy">
<i class='bx bx-check'></i>
</div>
</div>
<div class="pilot-offer-content">
<!-- Rząd 1: Imię + Rola + Gwiazdka i Ocena -->
<div class="pilot-offer-header-row">
<div>
<h5 class="pilot-offer-name">
<a href="pilot-profile.php">Oskar Kaczmarek</a>
</h5>
<div class="pilot-offer-headline">
Licencjonowany Pilot Wycieczek & Przewodnik Miejski
</div>
</div>
<div class="d-flex align-items-center gap-2">
<div class="pilot-rating-badge">
<i class='bx bxs-star'></i> 4.9 <span class="text-muted fw-normal">(18 opinii)</span>
</div>
<button type="button" class="btn-save-pilot" title="Zapisz do ulubionych" onclick="this.classList.toggle('saved');">
<i class='bx bx-star'></i>
</button>
</div>
</div>
<!-- Rząd 2: Metadane logistyczne (Baza, Staż, Języki) -->
<div class="pilot-offer-meta-row">
<div class="meta-item">
<i class='bx bx-map-pin text-muted'></i> Baza: <strong>Warszawa</strong>
</div>
<div class="meta-item">
<i class='bx bx-time-five text-muted'></i> Staż: <strong>7 lat</strong>
</div>
<div class="meta-item">
<i class='bx bx-conversation text-muted'></i> Języki: <strong>Włoski (B2), Angielski (C1)</strong>
</div>
</div>
<!-- Rząd 3: Uporządkowane tagi -->
<div class="pilot-tags-row">
<span class="tech-tag primary-dest">🇮🇹 Włochy (Ekspert)</span>
<span class="tech-tag primary-dest">🇬🇷 Grecja</span>
<span class="tech-tag primary-dest">🇪🇸 Hiszpania</span>
<span class="tech-tag">Objazdówki autokarowe</span>
<span class="tech-tag">VIP Incentive</span>
</div>
<!-- Rząd 4: Zwięzłe Bio -->
<div class="pilot-offer-bio">
Pasjonat kultury śródziemnomorskiej z wykształceniem historycznym (UW). Od 2019 r. z sukcesami prowadzi wycieczki objazdowe autokarowe i lotnicze we Włoszech, Hiszpanii i Grecji. Wyróżnia go wysokie opanowanie w sytuacjach kryzysowych.
</div>
<!-- Miniaturki zdjęć z tras -->
<div class="pilot-card-gallery-preview">
<img src="<?= $basePath ?>/assets/img/pilots/tuscany.jpg" alt="Toskania" title="Toskania & Florencja">
<img src="<?= $basePath ?>/assets/img/pilots/rome.jpg" alt="Rzym" title="Rzym & Koloseum">
<img src="<?= $basePath ?>/assets/img/pilots/greece.jpg" alt="Grecja" title="Grecja & Cyklady">
<span class="gallery-more-badge">+2 zdjęcia z tras</span>
</div>
<!-- Rząd 5: Stopka karty -->
<div class="pilot-offer-footer">
<div class="d-flex align-items-center gap-2">
<span class="pilot-academy-badge">
<i class='bx bx-award'></i> Superpilot Academy 2026
</span>
</div>
<div class="d-flex align-items-center gap-2">
<a href="pilot-profile.php" class="btn-offer-details">
Szczegóły profilu
</a>
<button type="button" class="btn-offer-book" onclick="openBookingModal('1', 'Oskar Kaczmarek', '16.09.2027 – 24.09.2027')">
<i class='bx bx-calendar-plus'></i> Zarezerwuj termin
</button>
</div>
</div>
</div>
</div>
<!-- ================= OFERTA 2: ANNA LEWANDOWSKA ================= -->
<div class="pilot-offer-card pilot-grid-item"
data-name="Anna Lewandowska"
data-base="kraków"
data-destinations="Norwegia Islandia Szwecja"
data-languages="Polski Angielski Norweski"
data-tags="trekking góry zorza polarna kameralne"
data-rating="5.0"
data-verified="1"
data-kpp="1"
data-dates-free="05-15-sep 16-24-sep październik-2027">
<div class="pilot-offer-avatar">
<img src="<?= $basePath ?>/assets/img/pilots/anna-avatar.jpg" alt="Anna Lewandowska" class="pilot-avatar-img">
<div class="verified-badge-mini" title="Zweryfikowany przez Superpilot Academy">
<i class='bx bx-check'></i>
</div>
</div>
<div class="pilot-offer-content">
<div class="pilot-offer-header-row">
<div>
<h5 class="pilot-offer-name">
<a href="pilot-profile.php?id=2">Anna Lewandowska</a>
</h5>
<div class="pilot-offer-headline">
Przewodnik Wysokogórski UIMLA & Pilot Północy
</div>
</div>
<div class="d-flex align-items-center gap-2">
<div class="pilot-rating-badge">
<i class='bx bxs-star'></i> 5.0 <span class="text-muted fw-normal">(24 opinie)</span>
</div>
<button type="button" class="btn-save-pilot" title="Zapisz do ulubionych" onclick="this.classList.toggle('saved');">
<i class='bx bx-star'></i>
</button>
</div>
</div>
<div class="pilot-offer-meta-row">
<div class="meta-item">
<i class='bx bx-map-pin text-muted'></i> Baza: <strong>Kraków</strong>
</div>
<div class="meta-item">
<i class='bx bx-time-five text-muted'></i> Staż: <strong>9 lat</strong>
</div>
<div class="meta-item">
<i class='bx bx-conversation text-muted'></i> Języki: <strong>Norweski (C1), Angielski (C2)</strong>
</div>
</div>
<div class="pilot-tags-row">
<span class="tech-tag primary-dest">🇳🇴 Norwegia (Fiordy)</span>
<span class="tech-tag primary-dest">🇮🇸 Islandia</span>
<span class="tech-tag primary-dest">🇸🇪 Szwecja</span>
<span class="tech-tag">Trekking & góry</span>
<span class="tech-tag">Zorza polarna</span>
</div>
<div class="pilot-offer-bio">
Specjalistka tras po Norwegii, Lofotach i lodowcach Islandii. Certyfikowana przewodniczka międzynarodowa UIMLA. Znakomita orientacja w logistyce promowej i trudnych warunkach pogodowych.
</div>
<!-- Miniaturki zdjęć z tras -->
<div class="pilot-card-gallery-preview">
<img src="<?= $basePath ?>/assets/img/pilots/norway.jpg" alt="Norwegia" title="Norwegia & Fiordy">
<img src="<?= $basePath ?>/assets/img/pilots/iceland.jpg" alt="Islandia" title="Islandia & Zorza">
<img src="<?= $basePath ?>/assets/img/pilots/trekking.jpg" alt="Trekking" title="Trekking wysokogórski">
<span class="gallery-more-badge">+4 zdjęcia z wypraw</span>
</div>
<div class="pilot-offer-footer">
<div class="d-flex align-items-center gap-2">
<span class="pilot-academy-badge">
<i class='bx bx-award'></i> Superpilot Academy 2026
</span>
</div>
<div class="d-flex align-items-center gap-2">
<a href="pilot-profile.php?id=2" class="btn-offer-details">
Szczegóły profilu
</a>
<button type="button" class="btn-offer-book" onclick="openBookingModal('2', 'Anna Lewandowska', '16.09.2027 – 24.09.2027')">
<i class='bx bx-calendar-plus'></i> Zarezerwuj termin
</button>
</div>
</div>
</div>
</div>
<!-- ================= OFERTA 3: MICHAŁ WIŚNIEWSKI ================= -->
<div class="pilot-offer-card pilot-grid-item"
data-name="Michał Wiśniewski"
data-base="katowice"
data-destinations="Hiszpania Portugalia Austria"
data-languages="Polski Hiszpański Angielski"
data-tags="objazdówki narty młodzież autokar"
data-rating="4.7"
data-verified="0"
data-kpp="0"
data-dates-free="październik-2027">
<div class="pilot-offer-avatar" style="background: linear-gradient(135deg, #d97706 0%, #fbbf24 100%);">
MW
</div>
<div class="pilot-offer-content">
<div class="pilot-offer-header-row">
<div>
<h5 class="pilot-offer-name">
<a href="pilot-profile.php?id=3">Michał Wiśniewski</a>
</h5>
<div class="pilot-offer-headline">
Pilot Wycieczek Autokarowych & Instruktor Narciarstwa
</div>
</div>
<div class="d-flex align-items-center gap-2">
<div class="pilot-rating-badge">
<i class='bx bxs-star'></i> 4.7 <span class="text-muted fw-normal">(11 opinii)</span>
</div>
<button type="button" class="btn-save-pilot" title="Zapisz do ulubionych" onclick="this.classList.toggle('saved');">
<i class='bx bx-star'></i>
</button>
</div>
</div>
<div class="pilot-offer-meta-row">
<div class="meta-item">
<i class='bx bx-map-pin text-muted'></i> Baza: <strong>Katowice</strong>
</div>
<div class="meta-item">
<i class='bx bx-time-five text-muted'></i> Staż: <strong>5 lat</strong>
</div>
<div class="meta-item">
<i class='bx bx-conversation text-muted'></i> Języki: <strong>Hiszpański (B2), Angielski (B2)</strong>
</div>
</div>
<div class="pilot-tags-row">
<span class="tech-tag primary-dest">🇪🇸 Hiszpania & Andaluzja</span>
<span class="tech-tag primary-dest">🇵🇹 Portugalia</span>
<span class="tech-tag primary-dest">🇦🇹 Austria</span>
<span class="tech-tag">Objazdówki autokarowe</span>
<span class="tech-tag">Narty & Alpy</span>
</div>
<div class="pilot-offer-bio">
Dynamiczny pilot specjalizujący się w długich trasach autokarowych na Półwysep Iberyjski oraz zimowych wyjazdach narciarskich do Austrii i Włoch. Bardzo dobry kontakt z młodzieżą i grupami dorosłymi.
</div>
<div class="pilot-offer-footer">
<div class="d-flex align-items-center gap-2">
<span class="badge bg-light text-muted border small">
Instruktor SITN-PZN
</span>
</div>
<div class="d-flex align-items-center gap-2">
<a href="pilot-profile.php?id=3" class="btn-offer-details">
Szczegóły profilu
</a>
<button type="button" class="btn-offer-book" onclick="openBookingModal('3', 'Michał Wiśniewski', '05.10.2027 – 12.10.2027')">
<i class='bx bx-calendar-plus'></i> Zarezerwuj termin
</button>
</div>
</div>
</div>
</div>
<!-- ================= OFERTA 4: KATARZYNA ZIELIŃSKA ================= -->
<div class="pilot-offer-card pilot-grid-item"
data-name="Katarzyna Zielińska"
data-base="poznań wrocław"
data-destinations="Chorwacja Włochy Grecja"
data-languages="Polski Angielski Chorwacki Włoski"
data-tags="młodzież grupy szkolne kpp pierwsza pomoc bałkany"
data-rating="4.8"
data-verified="1"
data-kpp="1"
data-dates-free="05-15-sep 16-24-sep październik-2027">
<div class="pilot-offer-avatar" style="background: linear-gradient(135deg, #0284c7 0%, #38bdf8 100%);">
KZ
<div class="verified-badge-mini">
<i class='bx bx-check'></i>
</div>
</div>
<div class="pilot-offer-content">
<div class="pilot-offer-header-row">
<div>
<h5 class="pilot-offer-name">
<a href="pilot-profile.php?id=4">Katarzyna Zielińska</a>
</h5>
<div class="pilot-offer-headline">
Pilot Grup Szkolnych & Młodzieżowych • Ratownik KPP
</div>
</div>
<div class="d-flex align-items-center gap-2">
<div class="pilot-rating-badge">
<i class='bx bxs-star'></i> 4.8 <span class="text-muted fw-normal">(15 opinii)</span>
</div>
<button type="button" class="btn-save-pilot" title="Zapisz do ulubionych" onclick="this.classList.toggle('saved');">
<i class='bx bx-star'></i>
</button>
</div>
</div>
<div class="pilot-offer-meta-row">
<div class="meta-item">
<i class='bx bx-map-pin text-muted'></i> Baza: <strong>Poznań / Wrocław</strong>
</div>
<div class="meta-item">
<i class='bx bx-time-five text-muted'></i> Staż: <strong>6 lat</strong>
</div>
<div class="meta-item">
<i class='bx bx-conversation text-muted'></i> Języki: <strong>Chorwacki (B2), Angielski (C1)</strong>
</div>
</div>
<div class="pilot-tags-row">
<span class="tech-tag primary-dest">🇭🇷 Chorwacja</span>
<span class="tech-tag primary-dest">🇮🇹 Włochy Północne</span>
<span class="tech-tag primary-dest">🇬🇷 Grecja</span>
<span class="tech-tag">Grupy szkolne</span>
<span class="tech-tag">Kwalifikowana Pierwsza Pomoc</span>
</div>
<div class="pilot-offer-bio">
Pedagog z wieloletnim doświadczeniem w pilotowaniu wycieczek szkolnych i kolonii zagranicznych. Uprawnienia Kwalifikowanej Pierwszej Pomocy. Doskonała komunikacja z kierowcami autokarów i nauczycielami.
</div>
<div class="pilot-offer-footer">
<div class="d-flex align-items-center gap-2">
<span class="pilot-academy-badge">
<i class='bx bx-award'></i> Superpilot Academy 2026
</span>
</div>
<div class="d-flex align-items-center gap-2">
<a href="pilot-profile.php?id=4" class="btn-offer-details">
Szczegóły profilu
</a>
<button type="button" class="btn-offer-book" onclick="openBookingModal('4', 'Katarzyna Zielińska', '16.09.2027 – 24.09.2027')">
<i class='bx bx-calendar-plus'></i> Zarezerwuj termin
</button>
</div>
</div>
</div>
</div>
<!-- ================= OFERTA 5: PAWEŁ DĄBROWSKI ================= -->
<div class="pilot-offer-card pilot-grid-item"
data-name="Paweł Dąbrowski"
data-base="warszawa"
data-destinations="Japonia Azja"
data-languages="Polski Angielski Japoński"
data-tags="vip incentive egzotyka korporacje kulinaria"
data-rating="4.9"
data-verified="1"
data-kpp="0"
data-dates-free="październik-2027">
<div class="pilot-offer-avatar" style="background: linear-gradient(135deg, #7c3aed 0%, #a78bfa 100%);">
PD
<div class="verified-badge-mini">
<i class='bx bx-check'></i>
</div>
</div>
<div class="pilot-offer-content">
<div class="pilot-offer-header-row">
<div>
<h5 class="pilot-offer-name">
<a href="pilot-profile.php?id=5">Paweł Dąbrowski</a>
</h5>
<div class="pilot-offer-headline">
Ekspert Wyjazdów Dalekobieżnych & VIP Incentive (Japonia)
</div>
</div>
<div class="d-flex align-items-center gap-2">
<div class="pilot-rating-badge">
<i class='bx bxs-star'></i> 4.9 <span class="text-muted fw-normal">(30 opinii)</span>
</div>
<button type="button" class="btn-save-pilot" title="Zapisz do ulubionych" onclick="this.classList.toggle('saved');">
<i class='bx bx-star'></i>
</button>
</div>
</div>
<div class="pilot-offer-meta-row">
<div class="meta-item">
<i class='bx bx-map-pin text-muted'></i> Baza: <strong>Warszawa</strong>
</div>
<div class="meta-item">
<i class='bx bx-time-five text-muted'></i> Staż: <strong>11 lat</strong>
</div>
<div class="meta-item">
<i class='bx bx-conversation text-muted'></i> Języki: <strong>Japoński (B2), Angielski (C2)</strong>
</div>
</div>
<div class="pilot-tags-row">
<span class="tech-tag primary-dest">🇯🇵 Japonia</span>
<span class="tech-tag primary-dest">🇹🇭 Tajlandia</span>
<span class="tech-tag primary-dest">🇺🇸 USA</span>
<span class="tech-tag">VIP Incentive</span>
<span class="tech-tag">Wyjazdy firmowe</span>
</div>
<div class="pilot-offer-bio">
Dyrektor operacyjny i pilot z 11-letnim doświadczeniem w wyjazdach incentive dla zarządów firm i grup VIP. Biegle posługuje się językiem japońskim i angielskim. Pełna znajomość protokołu biznesowego.
</div>
<div class="pilot-offer-footer">
<div class="d-flex align-items-center gap-2">
<span class="pilot-academy-badge">
<i class='bx bx-award'></i> Superpilot Academy 2026
</span>
</div>
<div class="d-flex align-items-center gap-2">
<a href="pilot-profile.php?id=5" class="btn-offer-details">
Szczegóły profilu
</a>
<button type="button" class="btn-offer-book" onclick="openBookingModal('5', 'Paweł Dąbrowski', '10.10.2027 – 24.10.2027')">
<i class='bx bx-calendar-plus'></i> Zarezerwuj termin
</button>
</div>
</div>
</div>
</div>
</div><!-- /#pilotOffersList -->
</div><!-- /.col-lg-8 -->
</div><!-- /.row -->
</div><!-- /.container-xxl -->
<!-- ================= MODAL KALENDARZA: WYBÓR ZAKRESU DAT WYCIECZKI ================= -->
<div class="modal fade date-picker-modal" id="dateRangeModal" tabindex="-1" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered" style="max-width: 480px;">
<div class="modal-content">
<div class="modal-header border-bottom py-3">
<div class="d-flex align-items-center gap-2">
<div class="rounded-circle d-flex align-items-center justify-content-center bg-primary-subtle text-primary" style="width: 36px; height: 36px;">
<i class='bx bx-calendar fs-5'></i>
</div>
<div>
<h6 class="modal-title fw-bold text-navy mb-0">Wybierz termin wycieczki</h6>
<small class="text-muted" style="font-size: 0.74rem;">Sprawdź wolne okienka w grafikach pilotów</small>
</div>
</div>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Zamknij"></button>
</div>
<div class="modal-body p-3">
<div class="date-quick-presets">
<span class="preset-chip active" data-preset="16-24-sep-2027">16 – 24 września 2027 (Wycieczka #12)</span>
<span class="preset-chip" data-preset="05-15-sep-2027">05 – 15 września 2027 (Wolne okienko)</span>
<span class="preset-chip" data-preset="październik-2027">Październik 2027</span>
<span class="preset-chip" data-preset="all">Dowolny termin</span>
</div>
<div class="p-2 border rounded-3 bg-light">
<div class="d-flex justify-content-between align-items-center mb-2 px-1">
<button class="btn btn-sm btn-white p-1 rounded-circle border"><i class='bx bx-chevron-left'></i></button>
<strong class="text-navy" style="font-size: 0.88rem;">Wrzesień 2027</strong>
<button class="btn btn-sm btn-white p-1 rounded-circle border"><i class='bx bx-chevron-right'></i></button>
</div>
<div class="date-picker-grid">
<div class="date-picker-day-head">Pn</div>
<div class="date-picker-day-head">Wt</div>
<div class="date-picker-day-head">Śr</div>
<div class="date-picker-day-head">Cz</div>
<div class="date-picker-day-head">Pt</div>
<div class="date-picker-day-head">Sb</div>
<div class="date-picker-day-head">Nd</div>
<div class="date-picker-cell other-month">30</div>
<div class="date-picker-cell other-month">31</div>
<div class="date-picker-cell">1</div>
<div class="date-picker-cell">2</div>
<div class="date-picker-cell">3</div>
<div class="date-picker-cell">4</div>
<div class="date-picker-cell">5</div>
<div class="date-picker-cell">6</div>
<div class="date-picker-cell">7</div>
<div class="date-picker-cell">8</div>
<div class="date-picker-cell">9</div>
<div class="date-picker-cell">10</div>
<div class="date-picker-cell">11</div>
<div class="date-picker-cell">12</div>
<div class="date-picker-cell">13</div>
<div class="date-picker-cell">14</div>
<div class="date-picker-cell">15</div>
<div class="date-picker-cell range-start" data-day="16">16</div>
<div class="date-picker-cell selected-range" data-day="17">17</div>
<div class="date-picker-cell selected-range" data-day="18">18</div>
<div class="date-picker-cell selected-range" data-day="19">19</div>
<div class="date-picker-cell selected-range" data-day="20">20</div>
<div class="date-picker-cell selected-range" data-day="21">21</div>
<div class="date-picker-cell selected-range" data-day="22">22</div>
<div class="date-picker-cell selected-range" data-day="23">23</div>
<div class="date-picker-cell range-end" data-day="24">24</div>
<div class="date-picker-cell">25</div>
<div class="date-picker-cell">26</div>
<div class="date-picker-cell">27</div>
<div class="date-picker-cell">28</div>
<div class="date-picker-cell">29</div>
<div class="date-picker-cell">30</div>
<div class="date-picker-cell other-month">1</div>
<div class="date-picker-cell other-month">2</div>
<div class="date-picker-cell other-month">3</div>
</div>
</div>
<div class="mt-3 p-2 rounded-2 bg-white border text-center small text-muted">
Wybrany termin: <strong id="modalSelectedDateText" class="text-primary">16.09.2027 – 24.09.2027 (9 dni)</strong>
</div>
</div>
<div class="modal-footer border-top py-2 px-3 justify-content-between">
<button type="button" class="btn btn-sm btn-link text-muted text-decoration-none" id="btnResetDateDialog">
Wyczyść termin
</button>
<button type="button" class="btn btn-sm btn-primary-calm" id="btnApplyDateDialog" data-bs-dismiss="modal">
Zastosuj termin wycieczki
</button>
</div>
</div>
</div>
</div>
<?php include __DIR__ . '/footer.php'; ?>