From 8daf185ecc1fc725d21f5ca382c94e4b83eeeccc Mon Sep 17 00:00:00 2001
From: David Nguyen <h250694@gmail.com>
Date: Tue, 29 Sep 2026 15:16:17 +0700
Subject: [PATCH 01/11] feat: shift home dashboard to post-booking trip mode

---
 index.html | 22 +++++++++++-----------
 1 file changed, 11 insertions(+), 11 deletions(-)

diff --git a/index.html b/index.html
index ddb4075..fab122b 100644
--- a/index.html
+++ b/index.html
@@ -22,9 +22,9 @@
     <nav class="side-nav">
       <a class="active" href="#top"><span class="nav-icon"><svg><use href="#i-home"/></svg></span>Tổng quan</a>
       <a href="#itinerary"><span class="nav-icon"><svg><use href="#i-calendar"/></svg></span>Lịch trình</a>
-      <a href="./flights/"><span class="nav-icon"><svg><use href="#i-plane"/></svg></span>Giá vé</a>
+      <a href="./flights/"><span class="nav-icon"><svg><use href="#i-plane"/></svg></span>Chuyến bay</a>
       <a href="./flight-status.html"><span class="nav-icon"><svg><use href="#i-status"/></svg></span>Trạng thái</a>
-      <a href="./hotels/"><span class="nav-icon"><svg><use href="#i-pin"/></svg></span>Giá phòng</a>
+      <a href="./hotels/"><span class="nav-icon"><svg><use href="#i-pin"/></svg></span>Lưu trú</a>
       <a href="#budget"><span class="nav-icon"><svg><use href="#i-wallet"/></svg></span>Ngân sách</a>
       <a href="#checklist"><span class="nav-icon"><svg><use href="#i-check"/></svg></span>Chuẩn bị</a>
       <a href="#notes"><span class="nav-icon"><svg><use href="#i-note"/></svg></span>Ghi chú</a>
@@ -41,8 +41,8 @@
         <select class="language-select" data-language-select aria-label="Ngôn ngữ">
           <option value="vi">VI</option><option value="en">EN</option><option value="zh">中文</option><option value="ja">日本語</option>
         </select>
-        <a class="btn sm" href="./hotels/">Giá phòng</a>
-        <a class="btn sm" href="./flights/">Xem giá vé</a>
+        <a class="btn sm" href="./hotels/">Lưu trú</a>
+        <a class="btn sm" href="./flights/">Chuyến bay</a>
         <a class="btn sm" href="./flight-status.html">Trạng thái chuyến bay</a>
         <button class="icon-btn" data-theme-toggle aria-label="Đổi giao diện"><svg class="ui-icon"><use href="#i-moon"/></svg></button>
       </div>
@@ -61,25 +61,25 @@
     <main class="content" id="top">
       <section class="trip-hero">
         <div class="hero-copy">
-          <div class="hero-kicker">Chuyến đi sắp tới</div>
+          <div class="hero-kicker"><span class="booking-dot"></span> Chuyến đi đã được đặt</div>
           <h1>Trung Quốc · 19–26/10/2026</h1>
           <div class="hero-route">TP.HCM → Thượng Hải → Bắc Kinh → TP.HCM</div>
-          <div class="hero-meta">8 ngày 7 đêm · 6 người lớn + 1 em bé</div>
-          <div class="hero-actions"><a class="btn" href="#itinerary">Xem lịch trình</a><a class="btn secondary" href="./flights/">Theo dõi giá vé</a><a class="btn secondary" href="./flight-status.html">Trạng thái chuyến bay</a><a class="btn secondary" href="./hotels/">Theo dõi giá phòng</a></div>
+          <div class="hero-meta">8 ngày 7 đêm · 6 người lớn + 1 em bé</div><div class="booking-summary"><span class="booking-chip success">✓ Vé máy bay đã đặt</span><span class="booking-chip success">✓ Khách sạn đã đặt</span><span class="booking-chip muted">Theo dõi giá tự động đã tạm dừng</span></div>
+          <div class="hero-actions"><a class="btn" href="#itinerary">Xem lịch trình</a><a class="btn secondary" href="./flights/">Chi tiết chuyến bay</a><a class="btn secondary" href="./flight-status.html">Trạng thái chuyến bay</a><a class="btn secondary" href="./hotels/">Thông tin lưu trú</a></div>
         </div>
         <aside class="countdown"><span id="daysPrefix">Còn</span><strong id="daysLeft">—</strong><span id="daysUnit">ngày đến chuyến đi</span><b>Khởi hành 19/10/2026</b></aside>
       </section>
 
       <section class="stat-grid">
         <article class="card stat-card"><div class="stat-top"><span class="label">Ngân sách dự kiến</span><span class="stat-icon"><svg><use href="#i-wallet"/></svg></span></div><strong id="summaryBudget">Chưa thiết lập</strong><small id="budgetPerPerson">Nhập ngân sách bên dưới</small></article>
-        <article class="card stat-card"><div class="stat-top"><span class="label">Chuyến bay</span><span class="stat-icon"><svg><use href="#i-plane"/></svg></span></div><strong>2 chặng</strong><small id="flightStatNote">Đang tải dữ liệu giá vé…</small></article>
+        <article class="card stat-card"><div class="stat-top"><span class="label">Chuyến bay</span><span class="stat-icon"><svg><use href="#i-plane"/></svg></span></div><strong>2 chặng</strong><small id="flightStatNote">Đã đặt · theo dõi trạng thái chuyến bay</small></article>
         <article class="card stat-card"><div class="stat-top"><span class="label">Thành phố chính</span><span class="stat-icon"><svg><use href="#i-pin"/></svg></span></div><strong>2</strong><small>Thượng Hải · Bắc Kinh</small></article>
         <article class="card stat-card"><div class="stat-top"><span class="label">Việc còn lại</span><span class="stat-icon"><svg><use href="#i-check"/></svg></span></div><strong id="taskCount">7</strong><small id="taskStatus">0/7 đã hoàn thành</small></article>
       </section>
 
       <section class="dashboard-grid">
         <article class="card" id="itinerary">
-          <div class="card-head"><h2>Lịch trình chính</h2><a href="./flights/">Xem giá vé</a></div>
+          <div class="card-head"><h2>Lịch trình chính</h2><a href="./flights/">Chuyến bay</a></div>
           <div class="timeline">
             <div class="timeline-item"><div class="date-box"><strong>19</strong><span>TH10</span></div><span class="time-dot"></span><div class="timeline-info"><strong>TP.HCM → Thượng Hải <span class="pill success" id="outboundBadge">Đang kiểm tra</span></strong><div class="sub" id="outboundFlightText">Đang tải chuyến bay phù hợp…</div><div class="detail" id="outboundFlightMeta">SGN → PVG / SHA</div></div><div class="timeline-photo shanghai">上海</div></div>
             <div class="timeline-item"><div class="date-box"><strong>20</strong><span>TH10</span></div><span class="time-dot"></span><div class="timeline-info"><strong>Thượng Hải</strong><div class="sub">Bến Thượng Hải · Dự Viên · phố cổ</div><div class="detail">Lịch nhẹ ngày đầu, ưu tiên nghỉ ngơi</div></div><div class="timeline-photo shanghai">上海</div></div>
@@ -130,8 +130,8 @@ <h1>Trung Quốc · 19–26/10/2026</h1>
 <nav class="mobile-bottom">
   <a class="active" href="#top"><span class="nav-icon"><svg><use href="#i-home"/></svg></span>Tổng quan</a>
   <a href="./flight-status.html"><span class="nav-icon"><svg><use href="#i-status"/></svg></span>Trạng thái</a>
-  <a href="./flights/"><span class="nav-icon"><svg><use href="#i-plane"/></svg></span>Giá vé</a>
-  <a href="./hotels/"><span class="nav-icon"><svg><use href="#i-pin"/></svg></span>Giá phòng</a>
+  <a href="./flights/"><span class="nav-icon"><svg><use href="#i-plane"/></svg></span>Chuyến bay</a>
+  <a href="./hotels/"><span class="nav-icon"><svg><use href="#i-pin"/></svg></span>Lưu trú</a>
 </nav>
 
 <svg width="0" height="0" style="position:absolute;overflow:hidden" aria-hidden="true">

From 1cb72532f22bd64794e04e0003fe5ddb022b0bdf Mon Sep 17 00:00:00 2001
From: David Nguyen <h250694@gmail.com>
Date: Tue, 29 Sep 2026 15:16:20 +0700
Subject: [PATCH 02/11] style: add post-booking dashboard states

---
 app.css | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/app.css b/app.css
index 51dd249..515542c 100644
--- a/app.css
+++ b/app.css
@@ -10,3 +10,11 @@
 @media(max-width:520px){
   .timeline-item:not(:last-child)::after{left:55px}
 }
+
+/* Post-booking trip mode */
+.booking-summary{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}
+.booking-chip{display:inline-flex;align-items:center;min-height:30px;padding:6px 10px;border:1px solid var(--line);border-radius:999px;font-size:12px;font-weight:750;background:var(--surface)}
+.booking-chip.success{border-color:rgba(34,197,94,.25);background:rgba(34,197,94,.09)}
+.booking-chip.muted{color:var(--muted)}
+.booking-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 4px rgba(34,197,94,.12);margin-right:6px}
+@media(max-width:640px){.booking-summary{gap:6px}.booking-chip{font-size:11px;padding:5px 8px}.hero-actions{display:grid;grid-template-columns:1fr 1fr}.hero-actions .btn:first-child{grid-column:1/-1}}

From 35abceca8a7c9a95929250d1ee71d6523df0d7cc Mon Sep 17 00:00:00 2001
From: David Nguyen <h250694@gmail.com>
Date: Tue, 29 Sep 2026 15:16:23 +0700
Subject: [PATCH 03/11] docs: document post-booking tracking mode

---
 README.md | 14 ++++----------
 1 file changed, 4 insertions(+), 10 deletions(-)

diff --git a/README.md b/README.md
index 7892073..02c515a 100644
--- a/README.md
+++ b/README.md
@@ -1,6 +1,6 @@
 # Personal Travel Log
 
-A lightweight personal travel dashboard for GitHub Pages with itinerary, budget, notes, PWA support and automated Google Flights price tracking.
+A lightweight personal travel dashboard for GitHub Pages with itinerary, budget, notes, PWA support with itinerary, booking status, flight operations, budget, notes and optional on-demand price checks.
 
 ## Features
 
@@ -9,7 +9,7 @@ A lightweight personal travel dashboard for GitHub Pages with itinerary, budget,
 - Checklist, budget and notes saved in `localStorage`
 - Export/import local travel data
 - Light/dark mode and PWA/offline support
-- **Google Flights price snapshots through SerpApi + GitHub Actions**
+- **On-demand Google Flights price snapshots through SerpApi + GitHub Actions**
 - Fare-specific baggage details from Google Flights search and Booking Options
 - Direct-flight priority, stops/airline filters, price history and price alerts
 - SerpApi credit/usage snapshot written automatically to this README
@@ -153,15 +153,9 @@ data/api-usage.json
 
 and commits refreshed snapshots back to `main`.
 
-### Automatic refresh
+### Price refresh mode
 
-The default schedule is:
-
-```text
-07:17 Asia/Ho_Chi_Minh
-```
-
-At 2 main search requests per refresh, a 30-day month is roughly **60 Google Flights search requests**, plus manual checks. Booking Options can add up to **240 requests/month** at the default 8 requests/day if it is enabled every day. Actual provider usage is shown in the live SerpApi usage table above and resets when SerpApi starts the next billing cycle.
+Automatic flight and hotel price schedules are currently **paused because the trip has been booked**. Both workflows retain `workflow_dispatch`, so price snapshots can still be refreshed manually when needed. Flight-status tracking remains active independently.
 
 ### Price dashboard
 

From bbd0704bad30d0d195a9ffcb3b838c51e9c2e2d4 Mon Sep 17 00:00:00 2001
From: David Nguyen <h250694@gmail.com>
Date: Tue, 29 Sep 2026 15:46:32 +0700
Subject: [PATCH 04/11] feat: add trip booking center and rail shortcut

---
 index.html | 21 ++++++++++++++++++---
 1 file changed, 18 insertions(+), 3 deletions(-)

diff --git a/index.html b/index.html
index fab122b..7a3f1c2 100644
--- a/index.html
+++ b/index.html
@@ -25,7 +25,7 @@
       <a href="./flights/"><span class="nav-icon"><svg><use href="#i-plane"/></svg></span>Chuyến bay</a>
       <a href="./flight-status.html"><span class="nav-icon"><svg><use href="#i-status"/></svg></span>Trạng thái</a>
       <a href="./hotels/"><span class="nav-icon"><svg><use href="#i-pin"/></svg></span>Lưu trú</a>
-      <a href="#budget"><span class="nav-icon"><svg><use href="#i-wallet"/></svg></span>Ngân sách</a>
+      <a href="#bookings"><span class="nav-icon"><svg><use href="#i-note"/></svg></span>Booking Center</a>\n      <a href="#budget"><span class="nav-icon"><svg><use href="#i-wallet"/></svg></span>Ngân sách</a>
       <a href="#checklist"><span class="nav-icon"><svg><use href="#i-check"/></svg></span>Chuẩn bị</a>
       <a href="#notes"><span class="nav-icon"><svg><use href="#i-note"/></svg></span>Ghi chú</a>
     </nav>
@@ -118,6 +118,22 @@ <h1>Trung Quốc · 19–26/10/2026</h1>
           </article>
         </div>
 
+        <article class="card booking-center" id="bookings">
+          <div class="card-head"><div><h2>Booking Center</h2><small>Thông tin cần mở nhanh trong chuyến đi</small></div><span class="pill success">Đã đặt</span></div>
+          <div class="booking-center-grid">
+            <section class="booking-panel"><div class="booking-panel-head"><span>✈️</span><div><b>Chuyến bay</b><small>SGN → Shanghai · Beijing → SGN</small></div></div><a class="btn sm" href="./flight-status.html">Theo dõi trạng thái</a></section>
+            <section class="booking-panel"><div class="booking-panel-head"><span>🏨</span><div><b>Lưu trú</b><small>Shanghai · Beijing</small></div></div><a class="btn sm" href="./hotels/">Xem thông tin khách sạn</a></section>
+            <section class="booking-panel"><div class="booking-panel-head"><span>🚄</span><div><b>Tàu cao tốc</b><small>Shanghai → Beijing · 21/10/2026</small></div></div><div class="booking-panel-actions"><span class="booking-chip muted">Chưa mở bán</span><a class="btn sm" href="https://www.12306.cn/en/index.html" target="_blank" rel="noopener">China Railway 12306</a></div></section>
+          </div>
+          <div class="booking-fields">
+            <label>Mã đặt chỗ / PNR<input data-booking="pnr" placeholder="Nhập mã booking"></label>
+            <label>Khách sạn / mã xác nhận<input data-booking="hotel" placeholder="Tên khách sạn hoặc mã xác nhận"></label>
+            <label>Tàu / số hiệu ghế<input data-booking="train" placeholder="VD: Gxx · Coach 05 · Seat 08A"></label>
+            <label>Ghi chú quan trọng<input data-booking="important" placeholder="Ga, terminal, giờ check-in..."></label>
+          </div>
+          <div class="booking-save"><span>Dữ liệu lưu cục bộ trên thiết bị này.</span><button class="btn sm" id="copyBookings">Sao chép Booking Center</button></div>
+        </article>
+
         <article class="card notes-card" id="notes">
           <div class="card-head"><h3>Ghi chú</h3><span class="pill">Lưu trên thiết bị này</span></div>
           <div class="notes-wrap"><textarea id="tripNotes" placeholder="Địa chỉ khách sạn, mã đặt chỗ, quán ăn, chi tiết tàu, điều cần nhớ..."></textarea><div class="notes-actions"><button class="btn sm" id="copyNotes">Sao chép</button><button class="btn sm" id="exportData">Xuất dữ liệu</button><label class="btn sm" for="importData">Nhập dữ liệu<input id="importData" type="file" accept="application/json" hidden></label><span class="save-state" id="saveState">Sẵn sàng</span></div></div>
@@ -268,6 +284,5 @@ <h1>Trung Quốc · 19–26/10/2026</h1>
 
   if('serviceWorker'in navigator)window.addEventListener('load',()=>navigator.serviceWorker.register('./sw.js').catch(()=>{}));
 })();
-</script>
-</body>
+</script>\n<script>\n(()=>{const key="travel-booking-center-v1";const fields=[...document.querySelectorAll("[data-booking]")];let saved={};try{saved=JSON.parse(localStorage.getItem(key)||"{}")}catch{}fields.forEach(el=>{el.value=saved[el.dataset.booking]||"";el.addEventListener("input",()=>{const data=Object.fromEntries(fields.map(x=>[x.dataset.booking,x.value]));localStorage.setItem(key,JSON.stringify(data))})});document.getElementById("copyBookings")?.addEventListener("click",async()=>{const lines=fields.filter(x=>x.value.trim()).map(x=>`${x.closest("label")?.childNodes[0]?.textContent?.trim()}: ${x.value.trim()}`);if(!lines.length)return;try{await navigator.clipboard.writeText(lines.join("\\n"))}catch{}})})();\n</script>\n</body>
 </html>
\ No newline at end of file

From f21722a69e5114af7302b737aecb291d64213f73 Mon Sep 17 00:00:00 2001
From: David Nguyen <h250694@gmail.com>
Date: Tue, 29 Sep 2026 15:46:35 +0700
Subject: [PATCH 05/11] style: add responsive booking center

---
 app.css | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/app.css b/app.css
index 515542c..2561623 100644
--- a/app.css
+++ b/app.css
@@ -18,3 +18,5 @@
 .booking-chip.muted{color:var(--muted)}
 .booking-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 4px rgba(34,197,94,.12);margin-right:6px}
 @media(max-width:640px){.booking-summary{gap:6px}.booking-chip{font-size:11px;padding:5px 8px}.hero-actions{display:grid;grid-template-columns:1fr 1fr}.hero-actions .btn:first-child{grid-column:1/-1}}
+
+.booking-center{grid-column:1/-1}.booking-center-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:8px}.booking-panel{display:flex;flex-direction:column;justify-content:space-between;gap:14px;padding:16px;border:1px solid var(--line);border-radius:14px;background:var(--surface)}.booking-panel-head{display:flex;gap:10px;align-items:flex-start}.booking-panel-head>span{font-size:20px}.booking-panel-head div{display:grid;gap:4px}.booking-panel-head small,.booking-save{color:var(--muted);font-size:12px}.booking-panel-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.booking-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:14px}.booking-fields label{display:grid;gap:6px;font-size:12px;font-weight:700;color:var(--muted)}.booking-fields input{width:100%;min-height:42px;padding:9px 11px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--text);font:inherit}.booking-save{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:12px}@media(max-width:760px){.booking-center-grid,.booking-fields{grid-template-columns:1fr}.booking-save{align-items:flex-start;flex-direction:column}}

From df17cab95082bce469026181921568318f862121 Mon Sep 17 00:00:00 2001
From: David Nguyen <h250694@gmail.com>
Date: Tue, 29 Sep 2026 16:59:01 +0700
Subject: [PATCH 06/11] fix: remove escaped newline artifacts from dashboard
 html

---
 index.html | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/index.html b/index.html
index 7a3f1c2..d4d00da 100644
--- a/index.html
+++ b/index.html
@@ -284,5 +284,8 @@ <h1>Trung Quốc · 19–26/10/2026</h1>
 
   if('serviceWorker'in navigator)window.addEventListener('load',()=>navigator.serviceWorker.register('./sw.js').catch(()=>{}));
 })();
-</script>\n<script>\n(()=>{const key="travel-booking-center-v1";const fields=[...document.querySelectorAll("[data-booking]")];let saved={};try{saved=JSON.parse(localStorage.getItem(key)||"{}")}catch{}fields.forEach(el=>{el.value=saved[el.dataset.booking]||"";el.addEventListener("input",()=>{const data=Object.fromEntries(fields.map(x=>[x.dataset.booking,x.value]));localStorage.setItem(key,JSON.stringify(data))})});document.getElementById("copyBookings")?.addEventListener("click",async()=>{const lines=fields.filter(x=>x.value.trim()).map(x=>`${x.closest("label")?.childNodes[0]?.textContent?.trim()}: ${x.value.trim()}`);if(!lines.length)return;try{await navigator.clipboard.writeText(lines.join("\\n"))}catch{}})})();\n</script>\n</body>
+</script>
+<script>\n(()=>{const key="travel-booking-center-v1";const fields=[...document.querySelectorAll("[data-booking]")];let saved={};try{saved=JSON.parse(localStorage.getItem(key)||"{}")}catch{}fields.forEach(el=>{el.value=saved[el.dataset.booking]||"";el.addEventListener("input",()=>{const data=Object.fromEntries(fields.map(x=>[x.dataset.booking,x.value]));localStorage.setItem(key,JSON.stringify(data))})});document.getElementById("copyBookings")?.addEventListener("click",async()=>{const lines=fields.filter(x=>x.value.trim()).map(x=>`${x.closest("label")?.childNodes[0]?.textContent?.trim()}: ${x.value.trim()}`);if(!lines.length)return;try{await navigator.clipboard.writeText(lines.join("\\n"))}catch{}})})();
+</script>
+</body>
 </html>
\ No newline at end of file

From 6b880c0df34ef35b1e76dbb76dceba9b2cfb9cc8 Mon Sep 17 00:00:00 2001
From: David Nguyen <h250694@gmail.com>
Date: Tue, 29 Sep 2026 16:59:04 +0700
Subject: [PATCH 07/11] fix: prevent booking UI overlap on mobile

---
 app.css | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/app.css b/app.css
index 2561623..5888207 100644
--- a/app.css
+++ b/app.css
@@ -20,3 +20,8 @@
 @media(max-width:640px){.booking-summary{gap:6px}.booking-chip{font-size:11px;padding:5px 8px}.hero-actions{display:grid;grid-template-columns:1fr 1fr}.hero-actions .btn:first-child{grid-column:1/-1}}
 
 .booking-center{grid-column:1/-1}.booking-center-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:8px}.booking-panel{display:flex;flex-direction:column;justify-content:space-between;gap:14px;padding:16px;border:1px solid var(--line);border-radius:14px;background:var(--surface)}.booking-panel-head{display:flex;gap:10px;align-items:flex-start}.booking-panel-head>span{font-size:20px}.booking-panel-head div{display:grid;gap:4px}.booking-panel-head small,.booking-save{color:var(--muted);font-size:12px}.booking-panel-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.booking-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:14px}.booking-fields label{display:grid;gap:6px;font-size:12px;font-weight:700;color:var(--muted)}.booking-fields input{width:100%;min-height:42px;padding:9px 11px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--text);font:inherit}.booking-save{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:12px}@media(max-width:760px){.booking-center-grid,.booking-fields{grid-template-columns:1fr}.booking-save{align-items:flex-start;flex-direction:column}}
+
+/* Booking hero responsive fixes */
+body:has(#itinerary) .booking-summary{position:relative;z-index:2;max-width:760px}
+@media(max-width:820px){body:has(#itinerary) .booking-summary{max-width:calc(100% - 118px);margin-top:12px}body:has(#itinerary) .booking-summary .booking-chip{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.18);color:#fff}body:has(#itinerary) .hero-actions{max-width:calc(100% - 118px)}}
+@media(max-width:520px){body:has(#itinerary) .trip-hero{min-height:310px}body:has(#itinerary) .booking-summary{max-width:100%;padding-right:0;margin-top:14px}body:has(#itinerary) .hero-actions{max-width:100%;grid-template-columns:1fr 1fr}body:has(#itinerary) .hero-actions .btn{white-space:normal;text-align:center}body:has(#itinerary) .countdown{top:48px}body:has(#itinerary) .booking-center{min-width:0}body:has(#itinerary) .booking-panel,body:has(#itinerary) .booking-fields label{min-width:0}body:has(#itinerary) .booking-fields input{min-width:0;box-sizing:border-box}}

From d93f5abe05ece38a302e949d80462ef2b982ea6c Mon Sep 17 00:00:00 2001
From: David Nguyen <h250694@gmail.com>
Date: Tue, 29 Sep 2026 17:33:29 +0700
Subject: [PATCH 08/11] fix: remove remaining escaped newline from navigation

---
 index.html | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/index.html b/index.html
index d4d00da..e1d837c 100644
--- a/index.html
+++ b/index.html
@@ -25,7 +25,8 @@
       <a href="./flights/"><span class="nav-icon"><svg><use href="#i-plane"/></svg></span>Chuyến bay</a>
       <a href="./flight-status.html"><span class="nav-icon"><svg><use href="#i-status"/></svg></span>Trạng thái</a>
       <a href="./hotels/"><span class="nav-icon"><svg><use href="#i-pin"/></svg></span>Lưu trú</a>
-      <a href="#bookings"><span class="nav-icon"><svg><use href="#i-note"/></svg></span>Booking Center</a>\n      <a href="#budget"><span class="nav-icon"><svg><use href="#i-wallet"/></svg></span>Ngân sách</a>
+      <a href="#bookings"><span class="nav-icon"><svg><use href="#i-note"/></svg></span>Booking Center</a>
+      <a href="#budget"><span class="nav-icon"><svg><use href="#i-wallet"/></svg></span>Ngân sách</a>
       <a href="#checklist"><span class="nav-icon"><svg><use href="#i-check"/></svg></span>Chuẩn bị</a>
       <a href="#notes"><span class="nav-icon"><svg><use href="#i-note"/></svg></span>Ghi chú</a>
     </nav>

From 1e2990a9022a1d609796b901b6089e50829b5b2b Mon Sep 17 00:00:00 2001
From: David Nguyen <h250694@gmail.com>
Date: Tue, 29 Sep 2026 17:33:32 +0700
Subject: [PATCH 09/11] refactor: remove dashboard-specific booking patches
 from shared css

---
 app.css | 7 -------
 1 file changed, 7 deletions(-)

diff --git a/app.css b/app.css
index 5888207..515542c 100644
--- a/app.css
+++ b/app.css
@@ -18,10 +18,3 @@
 .booking-chip.muted{color:var(--muted)}
 .booking-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 4px rgba(34,197,94,.12);margin-right:6px}
 @media(max-width:640px){.booking-summary{gap:6px}.booking-chip{font-size:11px;padding:5px 8px}.hero-actions{display:grid;grid-template-columns:1fr 1fr}.hero-actions .btn:first-child{grid-column:1/-1}}
-
-.booking-center{grid-column:1/-1}.booking-center-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:8px}.booking-panel{display:flex;flex-direction:column;justify-content:space-between;gap:14px;padding:16px;border:1px solid var(--line);border-radius:14px;background:var(--surface)}.booking-panel-head{display:flex;gap:10px;align-items:flex-start}.booking-panel-head>span{font-size:20px}.booking-panel-head div{display:grid;gap:4px}.booking-panel-head small,.booking-save{color:var(--muted);font-size:12px}.booking-panel-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.booking-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:14px}.booking-fields label{display:grid;gap:6px;font-size:12px;font-weight:700;color:var(--muted)}.booking-fields input{width:100%;min-height:42px;padding:9px 11px;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--text);font:inherit}.booking-save{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:12px}@media(max-width:760px){.booking-center-grid,.booking-fields{grid-template-columns:1fr}.booking-save{align-items:flex-start;flex-direction:column}}
-
-/* Booking hero responsive fixes */
-body:has(#itinerary) .booking-summary{position:relative;z-index:2;max-width:760px}
-@media(max-width:820px){body:has(#itinerary) .booking-summary{max-width:calc(100% - 118px);margin-top:12px}body:has(#itinerary) .booking-summary .booking-chip{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.18);color:#fff}body:has(#itinerary) .hero-actions{max-width:calc(100% - 118px)}}
-@media(max-width:520px){body:has(#itinerary) .trip-hero{min-height:310px}body:has(#itinerary) .booking-summary{max-width:100%;padding-right:0;margin-top:14px}body:has(#itinerary) .hero-actions{max-width:100%;grid-template-columns:1fr 1fr}body:has(#itinerary) .hero-actions .btn{white-space:normal;text-align:center}body:has(#itinerary) .countdown{top:48px}body:has(#itinerary) .booking-center{min-width:0}body:has(#itinerary) .booking-panel,body:has(#itinerary) .booking-fields label{min-width:0}body:has(#itinerary) .booking-fields input{min-width:0;box-sizing:border-box}}

From ca4cff497a66ba637bc4e12267ea0e20518fb629 Mon Sep 17 00:00:00 2001
From: David Nguyen <h250694@gmail.com>
Date: Tue, 29 Sep 2026 17:33:35 +0700
Subject: [PATCH 10/11] refactor: unify post-booking responsive layout

---
 dashboard.css | 46 ++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 46 insertions(+)

diff --git a/dashboard.css b/dashboard.css
index 517bc3f..f7df509 100644
--- a/dashboard.css
+++ b/dashboard.css
@@ -153,3 +153,49 @@ body:has(#itinerary) .notes-actions{margin-top:11px}
   body:has(#itinerary) .checklist,body:has(#itinerary) .budget{padding-left:14px;padding-right:14px}
   body:has(#itinerary) .notes-wrap{padding:14px}
 }
+
+
+/* Post-booking dashboard */
+body:has(#itinerary) .booking-summary{display:flex;flex-wrap:wrap;gap:7px;margin-top:13px}
+body:has(#itinerary) .booking-chip{display:inline-flex;align-items:center;min-height:26px;padding:0 9px;border:1px solid rgba(255,255,255,.18);border-radius:999px;background:rgba(255,255,255,.1);color:#fff;font-size:10.5px;font-weight:700}
+body:has(#itinerary) .booking-chip.success{background:rgba(34,197,94,.16)}
+body:has(#itinerary) .booking-dot{width:6px;height:6px;margin-right:6px;border-radius:50%;background:#4ade80;box-shadow:0 0 0 3px rgba(74,222,128,.15)}
+body:has(#itinerary) .booking-center{grid-column:1/-1;min-width:0}
+body:has(#itinerary) .booking-center-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px;padding:16px 20px 0}
+body:has(#itinerary) .booking-panel{min-width:0;padding:14px;border:1px solid var(--dashboard-border);border-radius:12px;background:var(--surface);display:flex;flex-direction:column;justify-content:space-between;gap:12px}
+body:has(#itinerary) .booking-panel-head{display:flex;align-items:flex-start;gap:9px;min-width:0}
+body:has(#itinerary) .booking-panel-head>span{font-size:18px;line-height:1.3}
+body:has(#itinerary) .booking-panel-head>div{display:grid;gap:3px;min-width:0}
+body:has(#itinerary) .booking-panel-head b{font-size:12px}
+body:has(#itinerary) .booking-panel-head small{color:var(--muted);font-size:10.5px;line-height:1.45;overflow-wrap:anywhere}
+body:has(#itinerary) .booking-panel-actions{display:flex;align-items:center;flex-wrap:wrap;gap:7px}
+body:has(#itinerary) .booking-panel .booking-chip{border-color:var(--line);background:var(--surface-2);color:var(--muted)}
+body:has(#itinerary) .booking-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:12px 20px 0}
+body:has(#itinerary) .booking-fields label{display:grid;min-width:0;gap:5px;color:var(--muted);font-size:10.5px;font-weight:750}
+body:has(#itinerary) .booking-fields input{width:100%;min-width:0;height:36px;box-sizing:border-box;padding:0 10px;border:1px solid var(--line);border-radius:9px;background:var(--surface);color:var(--text);font:inherit;outline:none}
+body:has(#itinerary) .booking-fields input:focus{border-color:#8eb0f6;box-shadow:0 0 0 3px var(--primary-soft)}
+body:has(#itinerary) .booking-save{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 20px 18px;color:var(--muted);font-size:10.5px}
+
+@media(max-width:820px){
+  body:has(#itinerary) .trip-hero{display:block;min-height:0}
+  body:has(#itinerary) .hero-copy{padding-right:24px}
+  body:has(#itinerary) .hero-copy h1,
+  body:has(#itinerary) .hero-route,
+  body:has(#itinerary) .hero-meta{max-width:none}
+  body:has(#itinerary) .countdown{position:relative;right:auto;top:auto;width:auto;min-height:0;height:auto;margin:0 24px 24px;padding:12px 14px;display:flex;align-items:baseline;justify-content:center;gap:7px}
+  body:has(#itinerary) .countdown strong{margin:0;font-size:28px}
+  body:has(#itinerary) .countdown b{display:block;margin:0 0 0 auto}
+  body:has(#itinerary) .booking-center-grid{grid-template-columns:1fr}
+}
+
+@media(max-width:520px){
+  body:has(#itinerary) .hero-copy{padding:20px 16px 16px}
+  body:has(#itinerary) .hero-actions{display:grid;grid-template-columns:1fr 1fr}
+  body:has(#itinerary) .hero-actions .btn{width:100%;box-sizing:border-box;white-space:normal;text-align:center;justify-content:center}
+  body:has(#itinerary) .countdown{margin:0 16px 16px;justify-content:flex-start;flex-wrap:wrap}
+  body:has(#itinerary) .countdown b{width:100%;margin:0;font-size:9.5px}
+  body:has(#itinerary) .booking-center-grid{padding:12px 14px 0}
+  body:has(#itinerary) .booking-fields{grid-template-columns:1fr;padding:10px 14px 0}
+  body:has(#itinerary) .booking-save{align-items:stretch;flex-direction:column;padding:10px 14px 14px}
+  body:has(#itinerary) .booking-save .btn{width:100%;justify-content:center}
+}

From 4a771d89122fb213d977079450c852d5e7e48c3a Mon Sep 17 00:00:00 2001
From: David Nguyen <h250694@gmail.com>
Date: Tue, 29 Sep 2026 17:33:48 +0700
Subject: [PATCH 11/11] fix: clean booking script markup

---
 index.html | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/index.html b/index.html
index e1d837c..5e28dce 100644
--- a/index.html
+++ b/index.html
@@ -286,7 +286,8 @@ <h1>Trung Quốc · 19–26/10/2026</h1>
   if('serviceWorker'in navigator)window.addEventListener('load',()=>navigator.serviceWorker.register('./sw.js').catch(()=>{}));
 })();
 </script>
-<script>\n(()=>{const key="travel-booking-center-v1";const fields=[...document.querySelectorAll("[data-booking]")];let saved={};try{saved=JSON.parse(localStorage.getItem(key)||"{}")}catch{}fields.forEach(el=>{el.value=saved[el.dataset.booking]||"";el.addEventListener("input",()=>{const data=Object.fromEntries(fields.map(x=>[x.dataset.booking,x.value]));localStorage.setItem(key,JSON.stringify(data))})});document.getElementById("copyBookings")?.addEventListener("click",async()=>{const lines=fields.filter(x=>x.value.trim()).map(x=>`${x.closest("label")?.childNodes[0]?.textContent?.trim()}: ${x.value.trim()}`);if(!lines.length)return;try{await navigator.clipboard.writeText(lines.join("\\n"))}catch{}})})();
+<script>
+(()=>{const key="travel-booking-center-v1";const fields=[...document.querySelectorAll("[data-booking]")];let saved={};try{saved=JSON.parse(localStorage.getItem(key)||"{}")}catch{}fields.forEach(el=>{el.value=saved[el.dataset.booking]||"";el.addEventListener("input",()=>{const data=Object.fromEntries(fields.map(x=>[x.dataset.booking,x.value]));localStorage.setItem(key,JSON.stringify(data))})});document.getElementById("copyBookings")?.addEventListener("click",async()=>{const lines=fields.filter(x=>x.value.trim()).map(x=>`${x.closest("label")?.childNodes[0]?.textContent?.trim()}: ${x.value.trim()}`);if(!lines.length)return;try{await navigator.clipboard.writeText(lines.join("\\n"))}catch{}})})();
 </script>
 </body>
 </html>
\ No newline at end of file