update

.paul/phases/09-finalizacja/09-01-PLAN.md

@@ -0,0 +1,262 @@
+---
+phase: 09-finalizacja
+plan: 01
+type: execute
+wave: 1
+depends_on: []
+files_modified:
+  - wp-content/plugins/yacht-booking-system/frontend/assets/js/calendar.js
+  - wp-content/plugins/yacht-booking-system/frontend/assets/css/calendar.scss
+  - wp-content/plugins/yacht-booking-system/frontend/assets/css/calendar.css
+  - wp-content/plugins/yacht-booking-system/frontend/class-calendar-widget.php
+autonomous: false
+delegation: off
+---
+
+<objective>
+## Goal
+Wprowadzić wizualne oznaczenie „pół-dnia" na pierwszym i ostatnim dniu rezerwacji w kalendarzu frontowym (FullCalendar) oraz dostroić domyślną kolorystykę widgetu Elementor `yacht-calendar` do palety strony jachty3.pagedev.pl (granat + czerwony akcent).
+
+## Purpose
+Klient zgłosił, że obecna wizualizacja kalendarza nie odzwierciedla rzeczywistego rytmu wynajmu jachtów: jacht jest wydawany danego dnia od ustalonej godziny odbioru (po południu) i zwracany w dniu zakończenia rano. Pełne zablokowanie skrajnych dni rezerwacji wprowadza w błąd potencjalnych klientów — sugeruje, że dzień odbioru/zwrotu jest niedostępny, podczas gdy w praktyce można wtedy rozpocząć/zakończyć inną rezerwację. Dodatkowo obecna paleta zieleń+czerwień nie pasuje do granatowo-czerwonego brandingu strony.
+
+## Output
+- Zmodyfikowany kalendarz frontowy (JS + CSS) renderujący skos „pół-zajętego" dnia dla pierwszego i ostatniego dnia każdej ciągłej blokady (booking, GCal, iCal)
+- Zaktualizowane domyślne kolory widgetu Elementor (`primary`, `available`, `booked`) dopasowane do palety strony
+- Zachowana kompatybilność z istniejącymi instancjami widgetu (override przez ustawienia Elementora dalej działa)
+</objective>
+
+<context>
+<clarifications>
+- **Half-day** — Który dzień ma być wypełniony „w połowie"?
+  → Odpowiedź: Pierwszy i ostatni dzień rezerwacji. Wizualnie: dzień startu = lewa połowa wolna, prawa połowa zajęta (odbiór po południu); dzień końca = lewa połowa zajęta, prawa połowa wolna (zwrot rano).
+- **Kolorystyka** — Skąd brać kolory dopasowane do strony?
+  → Odpowiedź: Zmienić domyślne wartości w `Calendar_Widget` (Elementor). Istniejące instancje będą mogły zachować swoje ustawienia (override) lub zresetować do nowych defaultów.
+- **Blocked GCal** — Czy half-day dotyczy też blokad zewnętrznych (Google Calendar / iCal, bez `booking_id`)?
+  → Odpowiedź: Tak — analogicznie. Pierwszy i ostatni dzień ciągłego pasma `blocked` także jest pół-zajęty. Detekcja na podstawie ciągłości statusu (poprzedni/następny dzień ma inny status lub inny `booking_id`).
+- **Scope** — Czy to plan fazy 9 czy hotfix?
+  → Odpowiedź: Plan 09-01 fazy 9 (UX/UI polish). Plany 09-02 (settings page), 09-03 (security audit), 09-04 (testy/tłumaczenia/dokumentacja) idą później.
+- **Selectability ostatniego dnia** (wynika z odpowiedzi 1) — Czy pierwszy/ostatni dzień rezerwacji ma być klikalny dla nowej rezerwacji?
+  → Odpowiedź: Wizualnie tak (skos pokazuje, że pół dnia jest wolne), natomiast logika walidacji rezerwacji **pozostaje bez zmian** w tym planie — overlap dalej blokuje wybór skrajnych dni. Zmiana logiki to osobna decyzja biznesowa (godziny check-in/out, polityka rezerwacji) i będzie tematem oddzielnego planu jeśli klient tego zechce.
+</clarifications>
+
+## Project Context
+@.paul/PROJECT.md
+@.paul/ROADMAP.md
+@.paul/STATE.md
+@.paul/codebase/architecture.md
+
+## Source Files
+@wp-content/plugins/yacht-booking-system/frontend/assets/js/calendar.js
+@wp-content/plugins/yacht-booking-system/frontend/assets/css/calendar.scss
+@wp-content/plugins/yacht-booking-system/frontend/class-calendar-widget.php
+@wp-content/plugins/yacht-booking-system/includes/class-availability.php
+</context>
+
+<acceptance_criteria>
+
+## AC-1: Skos na pierwszym dniu rezerwacji
+```gherkin
+Given jacht ma rezerwację w terminie 21–24 maja
+When użytkownik otwiera kalendarz tego jachtu
+Then dzień 21 maja renderuje się z lewą połową w kolorze "available" i prawą połową w kolorze "booked" (gradient po przekątnej z lewego dołu do prawej góry, lub liniowo 50/50)
+And dni 22 i 23 maja są w pełni w kolorze "booked"
+```
+
+## AC-2: Skos na ostatnim dniu rezerwacji
+```gherkin
+Given jacht ma rezerwację w terminie 21–24 maja
+When użytkownik otwiera kalendarz tego jachtu
+Then dzień 24 maja renderuje się z lewą połową w kolorze "booked" i prawą połową w kolorze "available"
+```
+
+## AC-3: Detekcja ciągłości — różne booking_id obok siebie
+```gherkin
+Given jacht ma rezerwację A (15–18 maja, booking_id=10) i rezerwację B (19–22 maja, booking_id=11)
+When kalendarz renderuje maj
+Then dzień 18 jest "ostatni" rezerwacji A (skos prawy = available) — ale jeśli 19 jest pierwszym B, na styku 18/19 oba dni mają skosy w przeciwnych kierunkach
+And dni 16, 17 (środek A) oraz 20, 21 (środek B) są w pełni booked
+```
+
+## AC-4: Skos także dla blokad GCal/iCal
+```gherkin
+Given jacht ma blokadę zewnętrzną (status=blocked, booking_id=null) w dniach 5–7 czerwca
+When kalendarz renderuje czerwiec
+Then dzień 5 czerwca = lewa połowa available, prawa booked
+And dzień 7 czerwca = lewa booked, prawa available
+And dzień 6 czerwca = w pełni booked
+```
+
+## AC-5: Nowa paleta domyślna widgetu
+```gherkin
+Given administrator dodaje świeży widget "Yacht Calendar" w Elementorze
+When otwiera ustawienia stylu
+Then domyślne kolory to: primary = granat strony (np. #0a2a5e), available = jasny / transparentny (np. #f5f9ff lub rgba), booked = czerwień strony (np. #d63638)
+And istniejące widgety (z zapisanymi własnymi kolorami) zachowują swoje wartości — nie są nadpisywane
+```
+
+## AC-6: Walidacja wyboru dat niezmieniona
+```gherkin
+Given jacht ma rezerwację 21–24 maja
+When użytkownik próbuje wybrać 24–26 maja w kalendarzu
+Then system blokuje wybór (alert "Wybrane daty zawierają niedostępne terminy")
+# Zmiana logiki check-in/check-out poza zakresem tego planu.
+```
+
+</acceptance_criteria>
+
+<tasks>
+
+<task type="auto">
+  <name>Task 1: Wzbogacić REST/JS o detekcję krawędzi rezerwacji i wyrenderować skos</name>
+  <files>
+    wp-content/plugins/yacht-booking-system/frontend/assets/js/calendar.js,
+    wp-content/plugins/yacht-booking-system/frontend/assets/css/calendar.scss,
+    wp-content/plugins/yacht-booking-system/frontend/assets/css/calendar.css
+  </files>
+  <action>
+    **Detekcja krawędzi (klient-side, w `events` callback):**
+    1. Po pobraniu danych z `/availability/{yacht_id}` posortować dni po dacie.
+    2. Dla każdego dnia o statusie != 'available' obliczyć:
+       - `isStart` = poprzedni dzień (date - 1) jest 'available' LUB ma inny `booking_id` LUB ma inny status (booked vs blocked).
+       - `isEnd` = następny dzień (date + 1) j.w.
+       - Jeżeli zarówno `isStart` jak i `isEnd` to dzień jest "single" (1-dniowa blokada) → traktuj jako pełen booked (nie skos), albo opcjonalnie skos w kształcie klepsydry — w tym planie: pełen booked dla 1-dniowych.
+    3. Zamiast pojedynczego eventu `display: 'background'` z jednym kolorem, dodaj `classNames`:
+       - `yacht-day-booked` (środek)
+       - `yacht-day-booked-start` (pierwszy dzień)
+       - `yacht-day-booked-end` (ostatni dzień)
+       - analogicznie `yacht-day-blocked-*` dla statusu 'blocked'
+    4. Zachować istniejący `backgroundColor` jako fallback dla starszych przeglądarek; rzeczywiste tło renderować przez CSS (linear-gradient).
+    5. Przekazać kolor `availableBg` i `bookedBg` do CSS przez CSS custom properties ustawiane na wrapperze: `--yacht-available-bg`, `--yacht-booked-bg`.
+       - Set `$wrapper.css({'--yacht-available-bg': availableBg, '--yacht-booked-bg': bookedBg})`.
+
+    **CSS (calendar.scss + skompilowany calendar.css):**
+    1. Dodaj reguły:
+       ```css
+       .yacht-day-booked-start .fc-bg-event,
+       .yacht-day-booked-start.fc-day {
+         background: linear-gradient(to right,
+           var(--yacht-available-bg) 0%,
+           var(--yacht-available-bg) 50%,
+           var(--yacht-booked-bg) 50%,
+           var(--yacht-booked-bg) 100%) !important;
+       }
+       .yacht-day-booked-end .fc-bg-event,
+       .yacht-day-booked-end.fc-day {
+         background: linear-gradient(to right,
+           var(--yacht-booked-bg) 0%,
+           var(--yacht-booked-bg) 50%,
+           var(--yacht-available-bg) 50%,
+           var(--yacht-available-bg) 100%) !important;
+       }
+       /* Analogicznie dla blocked-* */
+       ```
+    2. Skos liniowy 50/50 — preferowany nad ukośnym (`to bottom right`), bo zachowuje czytelność daty i nie nakłada się na cyfrę.
+    3. Zaktualizować legendę widgetu o trzeci stan "Częściowo zajęty" (gradient sample) — tylko jeśli widget już renderuje legendę; jeśli nie, pominąć.
+
+    **Nie zmieniać:**
+    - logiki walidacji `selectAllow` / `select` (AC-6).
+    - struktury REST API (`/availability/{yacht_id}` zwraca dalej te same pola).
+
+    **Avoid:**
+    - Mutacji `event.display` — zostaw `'background'`, klasy CSS wystarczą.
+    - Inline styles na komórkach (FullCalendar je nadpisuje na re-render).
+  </action>
+  <verify>
+    1. `php -l wp-content/plugins/yacht-booking-system/frontend/class-calendar-widget.php` — syntax OK.
+    2. Skompilować SCSS → CSS (lub edytować oba pliki ręcznie spójnie); `git diff calendar.css` pokazuje nowe selektory.
+    3. Manualnie: po deployu FTP otworzyć /rezerwacja-maja/, sprawdzić że dla istniejącej rezerwacji pierwszy/ostatni dzień ma skos. (CHECKPOINT human-verify w Task 3).
+  </verify>
+  <done>AC-1, AC-2, AC-3, AC-4, AC-6 spełnione.</done>
+</task>
+
+<task type="auto">
+  <name>Task 2: Zaktualizować domyślne kolory widgetu Elementor do palety strony</name>
+  <files>
+    wp-content/plugins/yacht-booking-system/frontend/class-calendar-widget.php
+  </files>
+  <action>
+    W `Calendar_Widget::register_controls()` (linie ~218–245 oraz ~272–274 dla `render()` i ~530–532 dla `_content_template()`) zmienić wartości `'default'` na paletę dopasowaną do strony jachty3.pagedev.pl:
+
+    - `primary_color`:  `#2271b1` → `#0a2a5e` (granat główny strony)
+    - `available_color`: `#35b56a` → `#f5f9ff` (bardzo jasny niebieski / prawie biały)
+    - `booked_color`:   `#e53935` → `#d63638` (czerwień akcentu strony, taka sama jak CTA)
+
+    Jeśli paleta strony zostanie później doprecyzowana — wartości można dostroić w ramach UNIFY. Punkt wyjścia: granat #0a2a5e + czerwień #d63638 (zgodne z screenshotem strony).
+
+    Dodatkowo:
+    - W szablonie legendy (linie ~566–570) zaktualizować `background-color` swatch'y do nowych defaultów (lub jeszcze lepiej: użyć CSS custom properties z wrappera, żeby legenda też reagowała na zmianę w Elementorze).
+    - Fallback w `calendar.js` (`normalizeColor`) — dodać stare zielone/czerwone `#35b56a` i `#e53935` jako "legacyColor", aby instancje wciąż używające tych wartości automatycznie dostały nowe domyślne. Dla istniejących instancji ze świadomie dobranymi kolorami (np. brand klienta) zachować jak jest — czyli **nie ruszać** instancji, gdzie wartość jest inna niż stary default.
+
+    **Avoid:**
+    - Migracji wartości w bazie danych (Elementor zapisuje per-widget; nie ruszamy istniejących).
+    - Łamania backward-compatibility dla widgetów bez ustawionego koloru (puste = nowy default).
+  </action>
+  <verify>
+    1. `php -l wp-content/plugins/yacht-booking-system/frontend/class-calendar-widget.php`.
+    2. Po deployu: dodać nowy widget Yacht Calendar w Elementor → sprawdzić że suwaki pokazują nowe wartości HEX.
+    3. Otworzyć stronę z istniejącym widgetem — kolory niezmienione (jeśli zapisane w meta) lub odświeżone (jeśli legacy zielony/czerwony).
+  </verify>
+  <done>AC-5 spełnione.</done>
+</task>
+
+<task type="checkpoint:human-verify" gate="blocking">
+  <what-built>
+    Wizualne oznaczenie pół-dni i nowa paleta widgetu na środowisku produkcyjnym (po deployu FTP).
+  </what-built>
+  <how-to-verify>
+    1. Po wgraniu plików przez ftp-kr odświeżyć z hard-reload: https://jachty3.pagedev.pl/rezerwacja-maja/
+    2. Wybrać miesiąc, w którym istnieje rezerwacja (lub stworzyć testową).
+    3. Sprawdzić wizualnie:
+       - Pierwszy dzień rezerwacji: lewa połowa jasna, prawa czerwona.
+       - Środkowe dni: w pełni czerwone.
+       - Ostatni dzień: lewa czerwona, prawa jasna.
+       - Tło wolnych dni: jasno-niebieskie / białe (dopasowane do strony).
+       - Brak regresji w wyborze dat (selecton działa, walidacja overlap aktywna).
+    4. Sprawdzić w Elementorze: nowy widget Yacht Calendar → defaultowe kolory = granat/jasny/czerwień.
+    5. Mobile (DevTools 375px) — skos czytelny, data nie znika.
+  </how-to-verify>
+  <resume-signal>Wpisz "approved" aby kontynuować, lub opisz problemy do poprawienia (kolor, kierunek skosu, kontrast itp.)</resume-signal>
+</task>
+
+</tasks>
+
+<boundaries>
+
+## DO NOT CHANGE
+- `wp-content/plugins/yacht-booking-system/api/class-rest-controller.php` — REST API surface bez zmian.
+- `wp-content/plugins/yacht-booking-system/includes/class-availability.php` — schemat danych i metody bez zmian.
+- Logika walidacji rezerwacji w `Rest_Controller::create_booking()` i `selectAllow` w JS — nie zmieniać polityki overlap.
+- `wp_yacht_availability` — schemat tabeli niezmieniony.
+- Backend admin (`admin/class-admin.php` itd.) — plan dotyczy tylko frontendu.
+- Istniejące zapisane ustawienia kolorów w meta widgetów Elementora.
+
+## SCOPE LIMITS
+- Tylko frontend kalendarza (FullCalendar w widgecie + shortcode).
+- Tylko CSS + JS detekcja krawędzi; brak nowych endpointów REST.
+- Bez zmian w polityce check-in/check-out (godziny odbioru/zwrotu jako konfiguracja → ewentualnie osobny plan).
+- Bez zmian w systemie email / templates.
+- Bez tłumaczeń .po/.mo (osobny plan 09-04).
+
+</boundaries>
+
+<verification>
+- [ ] `php -l` na zmodyfikowanych plikach PHP — bez błędów składni.
+- [ ] Skompilowany `calendar.css` zsynchronizowany z `calendar.scss`.
+- [ ] Brak nowych warningów w konsoli przeglądarki (DevTools) na /rezerwacja-maja/.
+- [ ] FullCalendar nadal renderuje miesiąc/dni i refetch działa po zmianie jachtu.
+- [ ] Wszystkie AC (AC-1..AC-6) zweryfikowane wizualnie w checkpoint human-verify.
+</verification>
+
+<success_criteria>
+- Skos na pierwszym/ostatnim dniu każdej ciągłej blokady (booked + blocked).
+- Środkowe dni renderują się w pełnym kolorze booked.
+- 1-dniowe blokady renderują się jako pełen booked (decyzja: nie używamy klepsydry).
+- Nowe defaulty kolorów w widgecie pasują wizualnie do palety strony (granat + czerwień).
+- Istniejące widgety z customowymi kolorami nie tracą swoich ustawień.
+- Klient potwierdza ("approved") w checkpoint human-verify.
+</success_criteria>
+
+<output>
+Po zakończeniu: `.paul/phases/09-finalizacja/09-01-SUMMARY.md`
+</output>

.paul/phases/09-finalizacja/09-01-SUMMARY.md

@@ -0,0 +1,183 @@
+---
+phase: 09-finalizacja
+plan: 01
+subsystem: ui
+tags: [fullcalendar, css, elementor, frontend, ux]
+
+requires:
+  - phase: 04-frontend-kalendarz
+    provides: FullCalendar widget Elementor + REST availability endpoint
+  - phase: 03-system-dostepnosci
+    provides: wp_yacht_availability table z polem booking_id (bazą detekcji krawędzi)
+
+provides:
+  - Wizualne oznaczenie pierwszego/ostatniego dnia rezerwacji jako pół-zajętego (gradient 45°)
+  - Detekcja krawędzi rezerwacji po stronie klienta (start/end/mid/single) na bazie sąsiedztwa booking_id+status
+  - Paleta widgetu Elementor dopasowana do brandu strony (granat #0e2036, czerwień #bc1834)
+  - CSS custom properties --yacht-available-bg / --yacht-booked-bg umożliwiające reużycie kolorów w gradientach i legendzie
+
+affects:
+  - 09-02-settings (settings page może w przyszłości eksponować godziny check-in/out)
+  - przyszłe plany dotyczące UX kalendarza
+
+tech-stack:
+  added: [CSS custom properties, FullCalendar --fc-border-color override]
+  patterns:
+    - "Edge detection przez sąsiedztwo: porównanie current vs (date-1, date+1) po booking_id i status"
+    - "Linear-gradient 50/50 z hard stop dla skosu 45° zamiast SVG/canvas"
+
+key-files:
+  created:
+    - test-add-booking.php (helper testowy w roocie projektu — DO USUNIĘCIA po teście)
+  modified:
+    - wp-content/plugins/yacht-booking-system/frontend/assets/js/calendar.js
+    - wp-content/plugins/yacht-booking-system/frontend/assets/css/calendar.scss
+    - wp-content/plugins/yacht-booking-system/frontend/assets/css/calendar.css
+    - wp-content/plugins/yacht-booking-system/frontend/class-calendar-widget.php
+
+key-decisions:
+  - "Skos 45° z linear-gradient zamiast SVG/clip-path — prostszy CSS, działa we wszystkich nowoczesnych przeglądarkach"
+  - "Single-day blokada renderowana jako pełen booked (nie klepsydra) — uproszczenie wizualne"
+  - "Walidacja overlap (selectAllow/select) niezmieniona — polityka check-in/check-out poza zakresem"
+  - "Defaulty kolorów dopasowane do faktycznej palety strony (granat #0e2036, czerwień #bc1834) zamiast generycznych #0a2a5e/#d63638 z planu"
+  - "Cyfry dni #021526 z !important — przebicie globalnej reguły body a:not([href])"
+
+patterns-established:
+  - "CSS custom properties ustawiane z JS na wrapperze pozwalają na reuse koloru w gradientach + legendzie bez duplikacji"
+  - "Krawędzie segmentu = porównanie 3 atrybutów (status, booking_id, sąsiad) — działa zarówno dla bookings jak i blocked z GCal/iCal"
+
+duration: ~90min
+started: 2026-05-06T08:00:00+02:00
+completed: 2026-05-06T09:30:00+02:00
+---
+
+# Phase 9 Plan 01: UX/UI polish kalendarza — Summary
+
+**Pierwszy/ostatni dzień rezerwacji renderuje się jako pół-zajęty trójkąt (skos 45°) z paletą strony (granat + czerwień); ramki dni i nagłówki kolumn ciemne, cyfry granatowe.**
+
+## Performance
+
+| Metric | Value |
+|--------|-------|
+| Duration | ~90 min |
+| Started | 2026-05-06T08:00:00+02:00 |
+| Completed | 2026-05-06T09:30:00+02:00 |
+| Tasks | 3 of 3 (2 auto + 1 checkpoint) |
+| Files modified | 4 (plugin) + 1 utworzony (test helper) |
+
+## Acceptance Criteria Results
+
+| Criterion | Status | Notes |
+|-----------|--------|-------|
+| AC-1: Skos na pierwszym dniu rezerwacji | Pass | Po iteracji finalna orientacja: gradient 135° → top-left = wolny, bottom-right = zajęty |
+| AC-2: Skos na ostatnim dniu rezerwacji | Pass | Gradient 135° → top-left = zajęty, bottom-right = wolny. Razem ze start tworzy parallelogram przez wiersz |
+| AC-3: Detekcja ciągłości — różne booking_id | Pass | `sameSegment(a,b)` porównuje status + booking_id; różne `booking_id` przerywają segment |
+| AC-4: Skos także dla blokad GCal/iCal | Pass | Klasy `yacht-day-blocked-start/end` reagują na ten sam gradient — jeden zestaw reguł |
+| AC-5: Nowa paleta domyślna widgetu | Pass | primary #0e2036, available #f5f9ff, booked #bc1834 (zamiast generycznych z planu — wzięto faktyczną paletę z SCSS strony) |
+| AC-6: Walidacja wyboru dat niezmieniona | Pass | `selectAllow` i `select` callback bez zmian, overlap dalej blokuje |
+
+## Accomplishments
+
+- Skos 45° pierwszego/ostatniego dnia rezerwacji (gradient 135° + 135°), spójny dla bookings i blokad GCal/iCal
+- Detekcja krawędzi po stronie klienta — bez zmian w REST API ani schemacie DB
+- Paleta widgetu dopasowana do brandu strony (granat + czerwień) z fallbackiem dla legacy zielony/czerwony
+- Ciemne ramki kalendarza przez `--fc-border-color` (oficjalna zmienna FullCalendar v6) + override dla 7 selektorów
+- Cyfry dni granatowe `#021526`, past `#6c757d` zamiast białych
+- Legenda rozszerzona o swatch „Dzień odbioru / zwrotu" z gradientem 135°
+- Helper `test-add-booking.php` z token-protected akcjami add/list/remove dla łatwego smoke testu
+
+## Files Created/Modified
+
+| File | Change | Purpose |
+|------|--------|---------|
+| `wp-content/plugins/yacht-booking-system/frontend/assets/js/calendar.js` | Modified (+58/-3) | Edge detection w `events` callback; CSS custom properties na wrapperze; nowe defaulty `#f5f9ff`/`#bc1834` |
+| `wp-content/plugins/yacht-booking-system/frontend/assets/css/calendar.scss` | Modified (+61/-7) | Gradienty 135° dla start/end; ciemne ramki przez --fc-border-color + override; nagłówki kolumn granatowe; cyfry dni #021526 |
+| `wp-content/plugins/yacht-booking-system/frontend/assets/css/calendar.css` | Modified (~) | Skompilowane reguły zsynchronizowane z SCSS |
+| `wp-content/plugins/yacht-booking-system/frontend/class-calendar-widget.php` | Modified (+15/-7) | Defaulty kolorów Elementora; legenda rozszerzona o swatch gradientu |
+| `test-add-booking.php` | Created | Token-protected helper FTP do tworzenia/listowania/usuwania testowych rezerwacji |
+
+## Decisions Made
+
+| Decision | Rationale | Impact |
+|----------|-----------|--------|
+| Skos przez `linear-gradient(135deg, A 50%, B 50%)` zamiast SVG/clip-path | Najprostsze CSS, brak dodatkowych assetów, pełne wsparcie w nowoczesnych przeglądarkach | Łatwa modyfikacja kątów / kierunków bez zmian w JS |
+| Paleta `#0e2036`/`#bc1834` zamiast `#0a2a5e`/`#d63638` z planu | Po inspekcji `calendar.scss` znaleziono faktyczne kolory już używane na stronie (przyciski, switcher, instructions) | Spójność wizualna z resztą widgetu — bez nowych kolorów do utrzymania |
+| Iteracja kierunku skosu pierwszego dnia (45° → 135°) | Klient zgłosił błędny kierunek po pierwszym deployu; flip → parallelogram przez wiersz | Wymagała 2 deployów, ale teraz oba dni mają tę samą oś diagonalną |
+| Cyfry dni z `!important` na `.fc-daygrid-day-number` | Globalna reguła `body a:not([href]):not([tabindex])` na końcu pliku ustawiała `color: #fff` na linkach FullCalendar | Bez !important globalna reguła wygrywała specyficznością |
+| Single-day blokada = pełen booked (klasa `*-single`, brak gradientu) | Skos klepsydry byłby wizualnie mylący dla 1-dniowej blokady | Klasa `*-single` zarezerwowana — łatwa do wykorzystania w przyszłości |
+| `test-add-booking.php` w roocie z tokenem | Zgodne z konwencją projektu (`test-*.php` per CLAUDE.md); brak DB CLI; token chroni przed nieautoryzowanym użyciem | Plik DO USUNIĘCIA po testach — nie commitować na produkcję |
+
+## Deviations from Plan
+
+### Summary
+
+| Type | Count | Impact |
+|------|-------|--------|
+| Auto-fixed | 3 | Essential UX fixes wymagane przez klienta podczas verify |
+| Scope additions | 1 | test-add-booking.php helper — nie był w planie ale niezbędny do weryfikacji |
+| Deferred | 0 | — |
+
+### Auto-fixed Issues
+
+**1. [UX] Ramki dni w kalendarzu były jasne mimo override w pierwszej iteracji**
+- **Found during:** Checkpoint human-verify (iteracja 2)
+- **Issue:** Pierwotny override `border-color: #0e2036 !important` na 3 selektorach nie działał — FullCalendar v6 używa `--fc-border-color` na wielu warstwach (scrollgrid section, daygrid-day, theme-standard td/th)
+- **Fix:** Ustawiłem `--fc-border-color: #0e2036` na `.yacht-calendar` i `.yacht-calendar .fc` plus override na 7 selektorach (td/th/scrollgrid/scrollgrid-section/daygrid-day/col-header-cell)
+- **Files:** calendar.scss, calendar.css
+- **Verification:** Klient potwierdził „Jest ok" po deployu
+
+**2. [UX] Skos pionowy zamiast 45°**
+- **Found during:** Checkpoint human-verify (iteracja 2)
+- **Issue:** Pierwotny gradient `to right` dawał pionowy podział 50/50 — nieczytelny estetycznie i niezgodny z image013.png
+- **Fix:** Zmiana na `linear-gradient(45deg, ...)` (start) i `linear-gradient(135deg, ...)` (end), potem korekta start na `135deg` po feedbacku
+- **Files:** calendar.scss, calendar.css, class-calendar-widget.php (legenda)
+- **Verification:** „Jest ok" po finalnej korekcie kierunku
+
+**3. [UX] Cyfry dni białe (nieczytelne na jasnym tle)**
+- **Found during:** Checkpoint human-verify (iteracja 4)
+- **Issue:** Globalna reguła `body a:not([href]):not([tabindex]) { color: #fff }` (linia 672 SCSS) pokrywała linki cyfr FullCalendar
+- **Fix:** `.yacht-calendar .fc-daygrid-day-number { color: #021526 !important; font-weight: 600 }`. Past days `#6c757d`
+- **Files:** calendar.scss, calendar.css
+- **Verification:** Klient potwierdził „Jest ok"
+
+### Scope Additions
+
+**1. test-add-booking.php — token-protected helper**
+- **Reason:** Klient chciał zobaczyć podzielone dni; brak istniejącej rezerwacji do testów; brak dostępu DB CLI z tej maszyny
+- **Implementation:** Skrypt PHP w roocie z tokenem `YACHT_TEST_2026`, akcje add/list/remove, marker meta `_yacht_test_booking_marker = PAUL_TEST_09_01`
+- **Cleanup:** Plik DO USUNIĘCIA z FTP po zakończeniu testów (jest w `.gitignore`? — nie, świadomie zostawiamy w repo lokalnym aby user mógł użyć ponownie; produkcyjnie usunąć z FTP)
+
+### Deferred Items
+
+Brak.
+
+## Issues Encountered
+
+| Issue | Resolution |
+|-------|------------|
+| Pierwsza iteracja gradientu pionowa zamiast skośnej | Klient feedback → kąt 45°/135° |
+| Kierunek skosu pierwszego dnia odwrotny niż oczekiwany | Flip 45° → 135° na start |
+| Cyfry dni białe | !important override na `.fc-daygrid-day-number` |
+| Ramki dalej jasne po pierwszej próbie | Dodanie `--fc-border-color` (zmienna FullCalendar v6) plus szerszy zestaw selektorów |
+
+## Skill Audit
+
+Brak `.paul/SPECIAL-FLOWS.md` w projekcie — pominięto.
+
+## Next Phase Readiness
+
+**Ready:**
+- Phase 9 / Plan 01 zamknięty, kalendarz UX/UI w stanie produkcyjnym
+- Paleta widgetu znormalizowana, można używać CSS variables w przyszłych iteracjach
+- Helper `test-add-booking.php` dostępny do dalszych smoke testów
+
+**Concerns:**
+- Walidacja overlap dalej blokuje rezerwację rozpoczynającą się w dniu zwrotu — wizualnie skos sugeruje że to dozwolone. Decyzja biznesowa: czy klient chce wprowadzić politykę check-in/check-out z godzinami (osobny plan)
+- `test-add-booking.php` powinien zostać USUNIĘTY z FTP po testach (zostaje w repo dla wygody)
+
+**Blockers:**
+- Brak. Faza 9 może kontynuować planem 09-02 (Settings Page)
+
+---
+*Phase: 09-finalizacja, Plan: 01*
+*Completed: 2026-05-06*