diff --git a/README.md b/README.md
index 5013ff5..4bcd4a2 100755
--- a/README.md
+++ b/README.md
@@ -32,10 +32,21 @@ Ein intelligentes Bookmarklet für die Mitarbeiter-Kantine der Bessa App. Dieses
 *   Bash (für `build-bookmarklet.sh`)
 
 ### Projektstruktur
-*   `kantine.js`: Der Haupt-Quellcode des Bookmarklets.
-*   `public/style.css`: Das Design (CSS).
-*   `build-bookmarklet.sh`: Skript zum Erstellen der `dist/` Dateien.
-*   `dist/`: Enthält die kompilierten Dateien (`bookmarklet.txt`, `install.html`).
+
+#### Quelldateien
+*   `kantine.js`: Der Haupt-Quellcode des Bookmarklets (UI, API-Logik, Rendering).
+*   `style.css`: Das komplette Design (CSS mit Light/Dark Mode).
+*   `mock-data.js`: Mock-Fetch-Interceptor mit realistischen Dummy-Menüdaten für Standalone-Tests.
+*   `build-bookmarklet.sh`: Build-Skript – erzeugt alle `dist/`-Artefakte.
+*   `test_build.py`: Automatische Build-Tests, laufen am Ende jedes Builds.
+
+#### `dist/` – Build-Artefakte
+| Datei | Beschreibung |
+|-------|-------------|
+| `bookmarklet.txt` | Die rohe Bookmarklet-URL (`javascript:...`). Enthält CSS + JS als selbstextrahierendes IIFE. Kann direkt als Lesezeichen-URL eingefügt werden. |
+| `bookmarklet-payload.js` | Der entpackte Bookmarklet-Payload (JS). Erstellt `<style>` + `<script>` Elemente und injiziert sie in die Seite. Nützlich zum Debuggen. |
+| `install.html` | Installer-Seite mit Drag & Drop Button, Anleitung, Feature-Liste und Changelog. Kann lokal oder gehostet geöffnet werden. |
+| `kantine-standalone.html` | Eigenständige HTML-Datei mit eingebettetem CSS + JS + **Mock-Daten**. Lädt automatisch Dummy-Menüs für UI-Tests ohne API-Zugriff. |
 
 ### Build
 Um Änderungen an `kantine.js` oder `style.css` wirksam zu machen, führe den Build aus:
diff --git a/build-bookmarklet.sh b/build-bookmarklet.sh
index c146f05..48a6582 100755
--- a/build-bookmarklet.sh
+++ b/build-bookmarklet.sh
@@ -53,6 +53,10 @@ cat >> "$DIST_DIR/kantine-standalone.html" << HTMLEOF
     <script>
 HTMLEOF
 
+# Inject mock data for standalone testing (loaded BEFORE kantine.js)
+cat "$SCRIPT_DIR/mock-data.js" >> "$DIST_DIR/kantine-standalone.html"
+echo "" >> "$DIST_DIR/kantine-standalone.html"
+
 # Inject JS
 echo "$JS_CONTENT" >> "$DIST_DIR/kantine-standalone.html"
 
diff --git a/changelog.md b/changelog.md
index 84c7ad3..8bbd1ba 100755
--- a/changelog.md
+++ b/changelog.md
@@ -1,3 +1,12 @@
+## v1.2.1 (2026-02-16)
+- **Fix**: Smart Highlights werden jetzt korrekt auf Menü-Items angewendet (`checkHighlight` in `createDayCard`). 🌟
+- **Feature**: Mock-Daten (`mock-data.js`) für Standalone-Tests eingebaut. 🧪
+- **Style**: Highlight-Glow mit blauer Puls-Animation (`blue-pulse`) überarbeitet. 💎
+- **Style**: Tag-Badges konsistent mit Badge-System gestaltet. 🏷️
+- **Style**: "Hinzufügen"-Button (`#btn-add-tag`) als Primary-Button gestylt. 🎨
+- **Style**: Modal-Body Padding und Input-Font korrigiert. 🔧
+- **Docs**: README Projektstruktur mit Tabelle für `dist/`-Artefakte ergänzt. 📖
+
 ## v1.2.0 (2026-02-16)
 - **Feature**: Bessere UX im Installer (Button oben, Log unten, Features aktualisiert). 💅
 - **Tech**: Build-Tests hinzugefügt. 🧪
diff --git a/dist/bookmarklet-payload.js b/dist/bookmarklet-payload.js
index 11f9db5..fabb305 100755
--- a/dist/bookmarklet-payload.js
+++ b/dist/bookmarklet-payload.js
@@ -1,9 +1,9 @@
 (function(){
 if(window.__KANTINE_LOADED){alert('Kantine Wrapper already loaded!');return;}
 var s=document.createElement('style');
-s.textContent=':root { /* Premium Slate/Gray-Blue Palette - Light Mode */ --bg-body: #f1f5f9; /* Slate 100 */ --bg-card: #ffffff; --text-primary: #334155; /* Slate 700 */ --text-secondary: #64748b; --accent-color: #0f172a; /* Slate 900 (High contrast) */ --border-color: #cbd5e1; /* Slate 300 */ --banner-bg: #e2e8f0; --banner-text: #1e293b; --success-color: #059669; --error-color: #dc2626; --card-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.05), 0 2px 4px -2px rgb(0 0 0 / 0.05); --header-bg: rgba(255, 255, 255, 0.9); --header-border: 1px solid rgba(203, 213, 225, 0.6); } [data-theme="dark"] { /* Premium Slate/Gray-Blue Palette - Dark Mode */ --bg-body: #1e293b; /* Deep Slate Gray (Requested) */ --bg-card: #334155; /* Slate 700 */ --text-primary: #f8fafc; /* Slate 50 */ --text-secondary: #cbd5e1; /* Slate 300 */ --accent-color: #60a5fa; /* Blue 400 */ --border-color: #475569; /* Slate 600 */ --banner-bg: #475569; --banner-text: #e2e8f0; --header-bg: rgba(30, 41, 59, 0.9); --header-border: 1px solid rgba(71, 85, 105, 0.6); --card-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.4); } * { box-sizing: border-box; margin: 0; padding: 0; } body { font-family: \'Inter\', system-ui, -apple-system, sans-serif; background-color: var(--bg-body); color: var(--text-primary); transition: background-color 0.3s ease, color 0.3s ease; line-height: 1.5; -webkit-font-smoothing: antialiased; } /* Fix scrolling bug: Reset html/body styles from host page */ html, body { height: auto !important; min-height: 100% !important; overflow-y: auto !important; overflow-x: hidden !important; position: static !important; margin: 0 !important; padding: 0 !important; } /* Header */ .app-header { position: sticky; top: 0; z-index: 100; backdrop-filter: blur(12px); background-color: var(--header-bg); border-bottom: var(--header-border); padding: 1rem 0; } .header-content { width: 100%; /* Full width */ padding: 0 2rem; /* Comfortable padding */ display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 1rem; } .brand { display: flex; align-items: center; gap: 0.75rem; } .brand-text { display: flex; flex-direction: column; } .brand h1 { font-size: 1.25rem; font-weight: 700; letter-spacing: -0.025em; margin-bottom: 0; } .subtitle { font-size: 0.85rem; color: var(--text-secondary); font-weight: 400; margin-left: 2px; } .logo-icon { font-size: 1.5rem; color: var(--accent-color); } /* Controls */ .controls { display: flex; align-items: center; gap: 1.5rem; justify-self: end; } /* Header Week Info (centered) */ .header-week-info { text-align: center; line-height: 1.3; } .header-center-wrapper { display: flex; flex-direction: row; align-items: center; gap: 1.5rem; justify-content: center; } .header-week-title { font-size: 1.1rem; font-weight: 600; color: var(--text-primary); } .header-week-subtitle { font-size: 0.85rem; color: var(--text-secondary); } .nav-group { display: flex; background-color: var(--bg-card); border: 1px solid var(--border-color); padding: 0.25rem; border-radius: 8px; } .nav-btn { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.875rem; font-weight: 500; color: var(--text-secondary); cursor: pointer; border-radius: 6px; transition: all 0.2s; display: flex; align-items: center; gap: 0.5rem; } .nav-btn:hover { color: var(--text-primary); background-color: rgba(100, 116, 139, 0.1); } .nav-btn.active { background-color: var(--accent-color); color: white; } /* Badge for nav buttons (day count indicator) */ .nav-badge { background-color: var(--error-color); color: white; font-size: 0.75rem; font-weight: 600; padding: 0 6px; border-radius: 10px; min-width: 18px; height: 18px; display: inline-flex; align-items: center; justify-content: center; margin-left: 8px; gap: 3px; line-height: 1; } .nav-badge .orderable { color: #fff; font-weight: 800; } .nav-badge .separator { opacity: 0.6; font-weight: 400; } .nav-badge .total { opacity: 0.8; font-weight: 400; } .nav-btn.active .nav-badge { background: rgba(255, 255, 255, 0.3); } /* Primary style for Login Button to match header */ #btn-login-open { background-color: var(--accent-color); color: white; padding: 0.5rem 1.25rem; border-radius: 8px; font-weight: 600; letter-spacing: 0.025em; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); } #btn-login-open:hover { background-color: #334155; /* Slightly lighter than slate-900 */ transform: translateY(-1px); box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); } /* User Badge Button (Login) */ .user-badge-btn { display: flex; align-items: center; gap: 8px; padding: 6px 12px; background: var(--bg-card); border: 1px solid var(--border-color); border-radius: 20px; font-size: 0.9rem; font-weight: 500; color: var(--text-primary); cursor: pointer; transition: all 0.2s; } .user-badge-btn:hover { background: rgba(100, 116, 139, 0.1); border-color: var(--accent-color); } .user-badge-btn .material-icons-round { font-size: 1.25rem; color: var(--accent-color); } .icon-btn { background: none; border: none; color: var(--text-primary); cursor: pointer; padding: 0.5rem; border-radius: 50%; transition: background-color 0.2s; display: flex; align-items: center; justify-content: center; } .icon-btn:hover { background-color: rgba(100, 116, 139, 0.1); } /* Refresh button animation */ #btn-refresh.refreshing .material-icons-round { animation: rotate 1s linear infinite; } @keyframes rotate { from { transform: rotate(0deg); } to { transform: rotate(360deg); } } /* Progress Modal */ .progress-container { margin-bottom: 1.5rem; } .progress-bar { width: 100%; height: 8px; background-color: var(--border-color); border-radius: 4px; overflow: hidden; margin-bottom: 0.75rem; } .progress-fill { height: 100%; background: linear-gradient(90deg, var(--accent-color) 0%, #60a5fa 100%); width: 0%; transition: width 0.3s ease; border-radius: 4px; } .progress-percent { text-align: center; font-size: 1.5rem; font-weight: 700; color: var(--text-primary); margin-bottom: 0.5rem; } .progress-message { text-align: center; color: var(--text-secondary); font-size: 0.9rem; font-weight: 500; } .weekly-cost { background-color: rgba(59, 130, 246, 0.1); /* Blue tint */ color: var(--accent-color); padding: 0.4rem 0.8rem; border-radius: 8px; font-weight: 600; font-size: 0.9rem; display: flex; align-items: center; gap: 0.5rem; border: 1px solid rgba(59, 130, 246, 0.2); } .weekly-cost .material-icons-round { font-size: 18px; } /* Container */ .container { width: 100%; /* Full width */ margin: 2rem auto; padding: 0 2rem; min-height: 80vh; } /* Banner */ .banner { background-color: var(--banner-bg); color: var(--banner-text); padding: 0.75rem 1rem; border-radius: 8px; display: flex; align-items: center; gap: 0.5rem; margin-bottom: 2rem; font-size: 0.875rem; font-weight: 500; border: 1px solid var(--border-color); max-width: fit-content; } /* User Badge */ .user-badge { display: flex; align-items: center; gap: 8px; padding: 6px 12px; background: var(--bg-card); /* Changed from --surface */ border: 1px solid var(--border-color); /* Changed from --border */ border-radius: 20px; font-size: 0.9rem; font-weight: 500; } .icon-btn-small { background: none; border: none; padding: 4px; cursor: pointer; color: var(--text-secondary); /* Changed from --text-muted */ display: flex; align-items: center; justify-content: center; border-radius: 50%; transition: all 0.2s; } .icon-btn-small:hover { color: var(--error-color); /* Changed from --danger */ background: rgba(239, 68, 68, 0.1); } /* Modal */ .modal { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); backdrop-filter: blur(4px); display: flex; align-items: center; justify-content: center; z-index: 1000; transition: all 0.3s; } .modal.hidden { opacity: 0; pointer-events: none; } .modal-content { background: var(--bg-card); /* Changed from --surface */ width: 90%; max-width: 400px; border-radius: 16px; box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); overflow: hidden; animation: modalSlide 0.3s ease-out; } @keyframes modalSlide { from { transform: translateY(20px); opacity: 0; } to { transform: translateY(0); opacity: 1; } } .modal-header { display: flex; align-items: center; justify-content: space-between; padding: 20px; border-bottom: 1px solid var(--border-color); /* Changed from --border */ } .modal-header h2 { margin: 0; font-size: 1.25rem; } #login-form { padding: 20px; } .form-group { margin-bottom: 20px; } .form-group label { display: block; margin-bottom: 6px; font-weight: 500; font-size: 0.9rem; } .form-group input { width: 100%; padding: 10px 12px; border: 1px solid var(--border-color); /* Changed from --border */ border-radius: 8px; background: var(--bg-body); /* Changed from --bg */ color: var(--text-primary); /* Changed from --text */ font-family: inherit; transition: border-color 0.2s; } .form-group input:focus { outline: none; border-color: var(--accent-color); /* Changed from --primary */ } .help-text { display: block; margin-top: 4px; color: var(--text-secondary); /* Changed from --text-muted */ font-size: 0.75rem; } .error-msg { margin-bottom: 16px; padding: 10px; background: rgba(239, 68, 68, 0.1); color: var(--error-color); /* Changed from --danger */ border-radius: 8px; font-size: 0.85rem; text-align: center; } .modal-actions { margin-top: 24px; } .btn-primary.wide { width: 100%; justify-content: center; } .hidden { display: none !important; } /* Menu Grid */ .menu-grid { display: grid; gap: 2rem; } .week-section { margin-bottom: 3rem; } .week-header { margin-bottom: 1.5rem; border-bottom: 1px solid var(--border-color); padding-bottom: 1rem; text-align: center; } .week-title { font-size: 1.75rem; font-weight: 700; color: var(--text-primary); } .week-range { color: var(--text-secondary); font-size: 0.9rem; margin-top: 0.25rem; } .days-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 0.75rem; } /* Card */ .menu-card { background-color: var(--bg-card); border-radius: 12px; border: 1px solid var(--border-color); box-shadow: var(--card-shadow); overflow: hidden; transition: transform 0.2s ease, box-shadow 0.2s ease; display: flex; flex-direction: column; } /* Past Day Styling - Target specific elements so ordered items can remain visible */ .menu-card.past-day .card-header, .menu-card.past-day .menu-item:not(.ordered) { opacity: 0.6; filter: grayscale(0.8); transition: opacity 0.3s, filter 0.3s; } .menu-card.past-day:hover .card-header, .menu-card.past-day:hover .menu-item:not(.ordered) { opacity: 0.8; filter: grayscale(0.4); } /* Enhancements for ordered items */ .menu-card.past-day .menu-item.ordered { /* No opacity/filter here - fully visible */ background: var(--bg-card); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); border: 1px solid var(--accent-color); border-radius: 8px; padding: 1rem; margin: 0 -1rem 1.5rem -1rem; position: relative; z-index: 10; } .menu-item.today-ordered { border: 2px solid var(--accent-color); box-shadow: 0 0 20px rgba(96, 165, 250, 0.4); border-radius: 8px; padding: 1rem; margin: 0 -1rem 1.5rem -1rem; background: var(--bg-card); position: relative; z-index: 5; animation: pulse-glow 3s infinite; } @keyframes pulse-glow { 0% { box-shadow: 0 0 15px rgba(96, 165, 250, 0.3); } 50% { box-shadow: 0 0 25px rgba(96, 165, 250, 0.6); } 100% { box-shadow: 0 0 15px rgba(96, 165, 250, 0.3); } } .menu-card:hover { transform: translateY(-2px); box-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1); } .card-header { padding: 1rem 1.25rem; border-bottom: 1px solid var(--border-color); display: flex; justify-content: space-between; align-items: baseline; background-color: rgba(100, 116, 139, 0.05); } .day-name { font-size: 1.125rem; font-weight: 600; } .day-date { font-size: 0.875rem; color: var(--text-secondary); } .card-body { padding: 1.25rem; display: grid; grid-template-rows: auto; /* Each menu item gets its own row */ align-content: start; } .empty-state { color: var(--text-secondary); font-style: italic; text-align: center; padding: 1rem; } /* Menu Items */ .menu-item { margin-bottom: 1.5rem; padding-bottom: 1.5rem; border-bottom: 1px solid var(--border-color); } .menu-item:last-child { margin-bottom: 0; padding-bottom: 0; border-bottom: none; } .item-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 0.5rem; gap: 1rem; } .item-name { font-weight: 600; color: var(--text-primary); font-size: 1rem; } .item-price { font-weight: 700; color: var(--accent-color); white-space: nowrap; } .item-desc { font-size: 0.875rem; color: var(--text-secondary); line-height: 1.6; margin-bottom: 0.75rem; } .badges { display: flex; gap: 0.5rem; margin-left: auto; } .item-status-row { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.75rem; } .badge { display: inline-flex; align-items: center; justify-content: center; height: 24px; font-size: 0.75rem; padding: 0 10px; border-radius: 4px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; line-height: normal; white-space: nowrap; } .badge.available { background-color: rgba(16, 185, 129, 0.1); /* Emerald 500 / 10% */ color: var(--success-color); border: 1px solid rgba(16, 185, 129, 0.2); } .badge.sold-out { background-color: rgba(239, 68, 68, 0.1); /* Red 500 / 10% */ color: var(--error-color); border: 1px solid rgba(239, 68, 68, 0.2); } .badge.ordered { background-color: rgba(139, 92, 246, 0.1); /* Violet 500 / 10% */ color: #8b5cf6; border: 1px solid rgba(139, 92, 246, 0.2); gap: 4px; } .badge.ordered .material-icons-round { font-size: 1rem; } /* Loading */ .loading-state { text-align: center; padding: 4rem; color: var(--text-secondary); } .spinner { width: 40px; height: 40px; border: 3px solid var(--border-color); border-top-color: var(--accent-color); border-radius: 50%; margin: 0 auto 1rem; animation: spin 1s linear infinite; } @keyframes spin { to { transform: rotate(360deg); } } /* Footer */ .app-footer { text-align: center; padding: 2rem; color: var(--text-secondary); font-size: 0.875rem; border-top: 1px solid var(--border-color); margin-top: auto; } /* === Order / Cancel Buttons (inline in status row) === */ .btn-order { display: inline-flex; align-items: center; gap: 4px; padding: 4px 10px; border: none; border-radius: 6px; background: var(--success-color); color: white; font-size: 0.75rem; font-weight: 600; cursor: pointer; transition: all 0.2s ease; font-family: inherit; } .btn-order .material-icons-round { font-size: 16px; } .btn-order:hover:not(:disabled) { filter: brightness(1.15); transform: translateY(-1px); } .btn-order:disabled { opacity: 0.5; cursor: not-allowed; } .btn-order.loading { pointer-events: none; opacity: 0.6; } .btn-order-compact { padding: 2px 4px; gap: 0; } .btn-order-compact .material-icons-round { font-size: 16px; } .btn-cancel { display: inline-flex; align-items: center; justify-content: center; padding: 4px 6px; border: none; border-radius: 6px; background: var(--error-color); color: white; font-size: 0.75rem; cursor: pointer; transition: all 0.2s ease; font-family: inherit; } .btn-cancel .material-icons-round { font-size: 16px; } .btn-cancel:hover:not(:disabled) { filter: brightness(1.15); transform: translateY(-1px); } .btn-cancel:disabled { opacity: 0.5; cursor: not-allowed; } /* Past days: hide action buttons */ .past-day .item-actions { display: none; } /* Order count badge (for multi-orders) */ .order-count-badge { display: inline-flex; align-items: center; justify-content: center; background: rgba(255, 255, 255, 0.3); color: white; font-size: 0.65rem; font-weight: 700; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 8px; margin-left: 4px; line-height: 1; } /* === Toast Notifications === */ #toast-container { position: fixed; bottom: 20px; right: 20px; z-index: 10000; display: flex; flex-direction: column; gap: 8px; pointer-events: none; } .toast { display: flex; align-items: center; gap: 8px; padding: 10px 16px; border-radius: 8px; font-size: 0.85rem; font-weight: 500; font-family: \'Inter\', sans-serif; color: white; backdrop-filter: blur(10px); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3); pointer-events: auto; transform: translateX(120%); opacity: 0; transition: transform 0.3s ease, opacity 0.3s ease; } .toast.show { transform: translateX(0); opacity: 1; } .toast .material-icons-round { font-size: 18px; } .toast-success { background: rgba(5, 150, 105, 0.95); } .toast-error { background: rgba(220, 38, 38, 0.95); } .toast-info { background: rgba(59, 130, 246, 0.95); } /* === Mobile Responsiveness === */ @media (max-width: 600px) { .header-content { flex-direction: column; gap: 1rem; padding: 0.75rem; } .week-nav { width: 100%; justify-content: center; } .nav-pills { width: 100%; justify-content: space-between; } .nav-btn { flex: 1; justify-content: center; padding: 0.5rem; font-size: 0.85rem; } .days-grid { grid-template-columns: 1fr; /* Force single column */ } .main-content { padding: 1rem; } .week-title { font-size: 1.5rem; } /* Adjust toast position for mobile */ .toast-container { bottom: 1rem; right: 1rem; left: 1rem; /* Center on mobile */ width: auto; } .menu-card { margin-bottom: 1rem; } } /* === Flagging & Notification Styles === */ .btn-flag { display: inline-flex; align-items: center; justify-content: center; background: transparent; border: 1px solid var(--text-secondary); color: var(--text-secondary); border-radius: 6px; padding: 4px; cursor: pointer; transition: all 0.2s; margin-right: 0.5rem; width: 28px; height: 28px; } .btn-flag:hover { background: rgba(234, 179, 8, 0.1); /* Yellow-500 / 10% */ color: #eab308; border-color: #eab308; } .btn-flag.active { background: rgba(234, 179, 8, 0.1); color: #eab308; border-color: #eab308; } .btn-flag .material-icons-round { font-size: 1.1rem; } /* Flagged & Sold Out (Yellow Glow) */ .menu-item.flagged-sold-out { border: 1px solid #eab308; box-shadow: 0 0 10px rgba(234, 179, 8, 0.2); border-radius: 8px; padding: 1rem; margin: 0 -1rem 1.5rem -1rem; background: var(--bg-card); position: relative; z-index: 5; animation: yellow-pulse 3s infinite; } @keyframes yellow-pulse { 0% { box-shadow: 0 0 8px rgba(234, 179, 8, 0.2); } 50% { box-shadow: 0 0 16px rgba(234, 179, 8, 0.5); } 100% { box-shadow: 0 0 8px rgba(234, 179, 8, 0.2); } } /* Flagged & Available (Green Glow) */ .menu-item.flagged-available { border: 2px solid var(--success-color); box-shadow: 0 0 15px rgba(16, 185, 129, 0.3); border-radius: 8px; padding: 1rem; margin: 0 -1rem 1.5rem -1rem; background: var(--bg-card); position: relative; z-index: 5; animation: green-pulse 3s infinite; } @keyframes green-pulse { 0% { box-shadow: 0 0 10px rgba(16, 185, 129, 0.3); } 50% { box-shadow: 0 0 20px rgba(16, 185, 129, 0.6); } 100% { box-shadow: 0 0 10px rgba(16, 185, 129, 0.3); } } /* Day Header Badges */ .day-header-left { display: flex; align-items: center; gap: 0.75rem; } .menu-code-badge { font-size: 0.75rem; font-weight: 700; color: #8b5cf6; /* Violet 500 */ background-color: rgba(139, 92, 246, 0.15); border: 1px solid rgba(139, 92, 246, 0.3); padding: 2px 6px; border-radius: 6px; line-height: normal; display: inline-block; } /* Detailed Badge Colors */ .nav-badge.badge-violet { background-color: #8b5cf6; } .nav-badge.badge-green { background-color: var(--success-color); } .nav-badge.badge-red { background-color: var(--error-color); } .nav-badge.badge-blue { background-color: var(--accent-color); } /* Day Header Status Colors (User Request) */ .card-header.header-violet { background-color: rgba(139, 92, 246, 0.15); border-bottom: 2px solid #8b5cf6; } .card-header.header-green { background-color: rgba(16, 185, 129, 0.15); border-bottom: 2px solid var(--success-color); } .card-header.header-red { background-color: rgba(239, 68, 68, 0.15); border-bottom: 2px solid var(--error-color); } .card-header.header-violet .day-name, .card-header.header-green .day-name, .card-header.header-red .day-name { font-weight: 700; color: var(--text-primary); /* Ensure text remains standard color */ } /* Update Icon */ .update-icon { display: inline-flex; align-items: center; justify-content: center; margin-left: 8px; background-color: rgba(16, 185, 129, 0.2); /* Green tint */ color: var(--success-color); border-radius: 50%; width: 24px; height: 24px; cursor: pointer; font-size: 14px; transition: all 0.2s; text-decoration: none; animation: pulse 2s infinite; } .update-icon:hover { background-color: var(--success-color); color: white; transform: scale(1.1); } @keyframes pulse { 0% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.4); } 70% { box-shadow: 0 0 0 6px rgba(16, 185, 129, 0); } 100% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0); } } /* Order Countdown */ #order-countdown { background: rgba(255, 255, 255, 0.1); padding: 0.25rem 0.75rem; border-radius: 99px; font-size: 0.85rem; display: flex; align-items: center; gap: 0.5rem; white-space: nowrap; border: 1px solid var(--border-color); } #order-countdown span { opacity: 0.7; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.5px; } #order-countdown.urgent { background: rgba(239, 68, 68, 0.2); border-color: rgba(239, 68, 68, 0.5); color: #ef4444; animation: pulse-red 2s infinite; } @keyframes pulse-red { 0% { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.4); } 70% { box-shadow: 0 0 0 6px rgba(239, 68, 68, 0); } 100% { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0); } } /* Smart Highlights */ .highlight-glow { box-shadow: 0 0 15px rgba(59, 130, 246, 0.5); /* Blue glow */ border: 1px solid rgba(59, 130, 246, 0.8); background: rgba(59, 130, 246, 0.05); position: relative; z-index: 1; } /* Nav Badge with Count */ .nav-badge.has-highlights { background-color: var(--bg-card); /* Neutral background */ color: var(--text-primary); border: 1px solid var(--border-color); padding: 2px 6px; } .nav-badge .highlight-count { color: #3b82f6; /* Blue 500 */ font-weight: 700; margin-left: 4px; } /* Tag Management Modal */ #tags-list { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 1rem; min-height: 50px; } .tag-badge { display: inline-flex; align-items: center; background: rgba(59, 130, 246, 0.15); color: #3b82f6; padding: 4px 10px; border-radius: 99px; font-size: 0.85rem; font-weight: 500; } .tag-remove { margin-left: 6px; cursor: pointer; opacity: 0.7; font-size: 1.1em; line-height: 1; } .tag-remove:hover { opacity: 1; color: #ef4444; } .input-group { display: flex; gap: 0.5rem; } .input-group input { flex: 1; padding: 0.75rem; background: var(--bg-body); border: 1px solid var(--border-color); color: var(--text-primary); border-radius: 8px; } /* Update Banner Enhanced */ .change-summary { font-size: 0.8rem; background: rgba(0, 0, 0, 0.1); padding: 0.5rem; border-radius: 4px; margin: 0.5rem 0; white-space: pre-wrap; font-family: inherit; line-height: 1.4; max-height: 100px; overflow-y: auto; } .update-content { display: flex; flex-direction: column; gap: 4px; flex: 1; } /* Installer Changelog */ .changelog-container ul { padding-left: 1.5rem; margin: 0.5rem 0; } .changelog-container li { margin-bottom: 0.4rem; line-height: 1.5; } .changelog-container h3 { margin-top: 1.5rem; margin-bottom: 0.5rem; font-size: 1.1em; color: var(--accent-color); } ';
+s.textContent=':root { /* Premium Slate/Gray-Blue Palette - Light Mode */ --bg-body: #f1f5f9; /* Slate 100 */ --bg-card: #ffffff; --text-primary: #334155; /* Slate 700 */ --text-secondary: #64748b; --accent-color: #0f172a; /* Slate 900 (High contrast) */ --border-color: #cbd5e1; /* Slate 300 */ --banner-bg: #e2e8f0; --banner-text: #1e293b; --success-color: #059669; --error-color: #dc2626; --card-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.05), 0 2px 4px -2px rgb(0 0 0 / 0.05); --header-bg: rgba(255, 255, 255, 0.9); --header-border: 1px solid rgba(203, 213, 225, 0.6); } [data-theme="dark"] { /* Premium Slate/Gray-Blue Palette - Dark Mode */ --bg-body: #1e293b; /* Deep Slate Gray (Requested) */ --bg-card: #334155; /* Slate 700 */ --text-primary: #f8fafc; /* Slate 50 */ --text-secondary: #cbd5e1; /* Slate 300 */ --accent-color: #60a5fa; /* Blue 400 */ --border-color: #475569; /* Slate 600 */ --banner-bg: #475569; --banner-text: #e2e8f0; --header-bg: rgba(30, 41, 59, 0.9); --header-border: 1px solid rgba(71, 85, 105, 0.6); --card-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.4); } * { box-sizing: border-box; margin: 0; padding: 0; } body { font-family: \'Inter\', system-ui, -apple-system, sans-serif; background-color: var(--bg-body); color: var(--text-primary); transition: background-color 0.3s ease, color 0.3s ease; line-height: 1.5; -webkit-font-smoothing: antialiased; } /* Fix scrolling bug: Reset html/body styles from host page */ html, body { height: auto !important; min-height: 100% !important; overflow-y: auto !important; overflow-x: hidden !important; position: static !important; margin: 0 !important; padding: 0 !important; } /* Header */ .app-header { position: sticky; top: 0; z-index: 100; backdrop-filter: blur(12px); background-color: var(--header-bg); border-bottom: var(--header-border); padding: 1rem 0; } .header-content { width: 100%; /* Full width */ padding: 0 2rem; /* Comfortable padding */ display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 1rem; } .brand { display: flex; align-items: center; gap: 0.75rem; } .brand-text { display: flex; flex-direction: column; } .brand h1 { font-size: 1.25rem; font-weight: 700; letter-spacing: -0.025em; margin-bottom: 0; } .subtitle { font-size: 0.85rem; color: var(--text-secondary); font-weight: 400; margin-left: 2px; } .logo-icon { font-size: 1.5rem; color: var(--accent-color); } /* Controls */ .controls { display: flex; align-items: center; gap: 1.5rem; justify-self: end; } /* Header Week Info (centered) */ .header-week-info { text-align: center; line-height: 1.3; } .header-center-wrapper { display: flex; flex-direction: row; align-items: center; gap: 1.5rem; justify-content: center; } .header-week-title { font-size: 1.1rem; font-weight: 600; color: var(--text-primary); } .header-week-subtitle { font-size: 0.85rem; color: var(--text-secondary); } .nav-group { display: flex; background-color: var(--bg-card); border: 1px solid var(--border-color); padding: 0.25rem; border-radius: 8px; } .nav-btn { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.875rem; font-weight: 500; color: var(--text-secondary); cursor: pointer; border-radius: 6px; transition: all 0.2s; display: flex; align-items: center; gap: 0.5rem; } .nav-btn:hover { color: var(--text-primary); background-color: rgba(100, 116, 139, 0.1); } .nav-btn.active { background-color: var(--accent-color); color: white; } /* Badge for nav buttons (day count indicator) */ .nav-badge { background-color: var(--error-color); color: white; font-size: 0.75rem; font-weight: 600; padding: 0 6px; border-radius: 10px; min-width: 18px; height: 18px; display: inline-flex; align-items: center; justify-content: center; margin-left: 8px; gap: 3px; line-height: 1; } .nav-badge .orderable { color: #fff; font-weight: 800; } .nav-badge .separator { opacity: 0.6; font-weight: 400; } .nav-badge .total { opacity: 0.8; font-weight: 400; } .nav-btn.active .nav-badge { background: rgba(255, 255, 255, 0.3); } /* Primary style for Login Button to match header */ #btn-login-open { background-color: var(--accent-color); color: white; padding: 0.5rem 1.25rem; border-radius: 8px; font-weight: 600; letter-spacing: 0.025em; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); } #btn-login-open:hover { background-color: #334155; /* Slightly lighter than slate-900 */ transform: translateY(-1px); box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); } /* User Badge Button (Login) */ .user-badge-btn { display: flex; align-items: center; gap: 8px; padding: 6px 12px; background: var(--bg-card); border: 1px solid var(--border-color); border-radius: 20px; font-size: 0.9rem; font-weight: 500; color: var(--text-primary); cursor: pointer; transition: all 0.2s; } .user-badge-btn:hover { background: rgba(100, 116, 139, 0.1); border-color: var(--accent-color); } .user-badge-btn .material-icons-round { font-size: 1.25rem; color: var(--accent-color); } .icon-btn { background: none; border: none; color: var(--text-primary); cursor: pointer; padding: 0.5rem; border-radius: 50%; transition: background-color 0.2s; display: flex; align-items: center; justify-content: center; } .icon-btn:hover { background-color: rgba(100, 116, 139, 0.1); } /* Refresh button animation */ #btn-refresh.refreshing .material-icons-round { animation: rotate 1s linear infinite; } @keyframes rotate { from { transform: rotate(0deg); } to { transform: rotate(360deg); } } /* Progress Modal */ .progress-container { margin-bottom: 1.5rem; } .progress-bar { width: 100%; height: 8px; background-color: var(--border-color); border-radius: 4px; overflow: hidden; margin-bottom: 0.75rem; } .progress-fill { height: 100%; background: linear-gradient(90deg, var(--accent-color) 0%, #60a5fa 100%); width: 0%; transition: width 0.3s ease; border-radius: 4px; } .progress-percent { text-align: center; font-size: 1.5rem; font-weight: 700; color: var(--text-primary); margin-bottom: 0.5rem; } .progress-message { text-align: center; color: var(--text-secondary); font-size: 0.9rem; font-weight: 500; } .weekly-cost { background-color: rgba(59, 130, 246, 0.1); /* Blue tint */ color: var(--accent-color); padding: 0.4rem 0.8rem; border-radius: 8px; font-weight: 600; font-size: 0.9rem; display: flex; align-items: center; gap: 0.5rem; border: 1px solid rgba(59, 130, 246, 0.2); } .weekly-cost .material-icons-round { font-size: 18px; } /* Container */ .container { width: 100%; /* Full width */ margin: 2rem auto; padding: 0 2rem; min-height: 80vh; } /* Banner */ .banner { background-color: var(--banner-bg); color: var(--banner-text); padding: 0.75rem 1rem; border-radius: 8px; display: flex; align-items: center; gap: 0.5rem; margin-bottom: 2rem; font-size: 0.875rem; font-weight: 500; border: 1px solid var(--border-color); max-width: fit-content; } /* User Badge */ .user-badge { display: flex; align-items: center; gap: 8px; padding: 6px 12px; background: var(--bg-card); /* Changed from --surface */ border: 1px solid var(--border-color); /* Changed from --border */ border-radius: 20px; font-size: 0.9rem; font-weight: 500; } .icon-btn-small { background: none; border: none; padding: 4px; cursor: pointer; color: var(--text-secondary); /* Changed from --text-muted */ display: flex; align-items: center; justify-content: center; border-radius: 50%; transition: all 0.2s; } .icon-btn-small:hover { color: var(--error-color); /* Changed from --danger */ background: rgba(239, 68, 68, 0.1); } /* Modal */ .modal { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); backdrop-filter: blur(4px); display: flex; align-items: center; justify-content: center; z-index: 1000; transition: all 0.3s; } .modal.hidden { opacity: 0; pointer-events: none; } .modal-content { background: var(--bg-card); /* Changed from --surface */ width: 90%; max-width: 400px; border-radius: 16px; box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); overflow: hidden; animation: modalSlide 0.3s ease-out; } @keyframes modalSlide { from { transform: translateY(20px); opacity: 0; } to { transform: translateY(0); opacity: 1; } } .modal-header { display: flex; align-items: center; justify-content: space-between; padding: 20px; border-bottom: 1px solid var(--border-color); } .modal-header h2 { margin: 0; font-size: 1.25rem; } .modal-body { padding: 20px; } #login-form { padding: 20px; } .form-group { margin-bottom: 20px; } .form-group label { display: block; margin-bottom: 6px; font-weight: 500; font-size: 0.9rem; } .form-group input { width: 100%; padding: 10px 12px; border: 1px solid var(--border-color); /* Changed from --border */ border-radius: 8px; background: var(--bg-body); /* Changed from --bg */ color: var(--text-primary); /* Changed from --text */ font-family: inherit; transition: border-color 0.2s; } .form-group input:focus { outline: none; border-color: var(--accent-color); /* Changed from --primary */ } .help-text { display: block; margin-top: 4px; color: var(--text-secondary); /* Changed from --text-muted */ font-size: 0.75rem; } .error-msg { margin-bottom: 16px; padding: 10px; background: rgba(239, 68, 68, 0.1); color: var(--error-color); /* Changed from --danger */ border-radius: 8px; font-size: 0.85rem; text-align: center; } .modal-actions { margin-top: 24px; } .btn-primary.wide { width: 100%; justify-content: center; } .hidden { display: none !important; } /* Menu Grid */ .menu-grid { display: grid; gap: 2rem; } .week-section { margin-bottom: 3rem; } .week-header { margin-bottom: 1.5rem; border-bottom: 1px solid var(--border-color); padding-bottom: 1rem; text-align: center; } .week-title { font-size: 1.75rem; font-weight: 700; color: var(--text-primary); } .week-range { color: var(--text-secondary); font-size: 0.9rem; margin-top: 0.25rem; } .days-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 0.75rem; } /* Card */ .menu-card { background-color: var(--bg-card); border-radius: 12px; border: 1px solid var(--border-color); box-shadow: var(--card-shadow); overflow: hidden; transition: transform 0.2s ease, box-shadow 0.2s ease; display: flex; flex-direction: column; } /* Past Day Styling - Target specific elements so ordered items can remain visible */ .menu-card.past-day .card-header, .menu-card.past-day .menu-item:not(.ordered) { opacity: 0.6; filter: grayscale(0.8); transition: opacity 0.3s, filter 0.3s; } .menu-card.past-day:hover .card-header, .menu-card.past-day:hover .menu-item:not(.ordered) { opacity: 0.8; filter: grayscale(0.4); } /* Enhancements for ordered items */ .menu-card.past-day .menu-item.ordered { /* No opacity/filter here - fully visible */ background: var(--bg-card); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); border: 1px solid var(--accent-color); border-radius: 8px; padding: 1rem; margin: 0 -1rem 1.5rem -1rem; position: relative; z-index: 10; } .menu-item.today-ordered { border: 2px solid var(--accent-color); box-shadow: 0 0 20px rgba(96, 165, 250, 0.4); border-radius: 8px; padding: 1rem; margin: 0 -1rem 1.5rem -1rem; background: var(--bg-card); position: relative; z-index: 5; animation: pulse-glow 3s infinite; } @keyframes pulse-glow { 0% { box-shadow: 0 0 15px rgba(96, 165, 250, 0.3); } 50% { box-shadow: 0 0 25px rgba(96, 165, 250, 0.6); } 100% { box-shadow: 0 0 15px rgba(96, 165, 250, 0.3); } } .menu-card:hover { transform: translateY(-2px); box-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1); } .card-header { padding: 1rem 1.25rem; border-bottom: 1px solid var(--border-color); display: flex; justify-content: space-between; align-items: baseline; background-color: rgba(100, 116, 139, 0.05); } .day-name { font-size: 1.125rem; font-weight: 600; } .day-date { font-size: 0.875rem; color: var(--text-secondary); } .card-body { padding: 1.25rem; display: grid; grid-template-rows: auto; /* Each menu item gets its own row */ align-content: start; } .empty-state { color: var(--text-secondary); font-style: italic; text-align: center; padding: 1rem; } /* Menu Items */ .menu-item { margin-bottom: 1.5rem; padding-bottom: 1.5rem; border-bottom: 1px solid var(--border-color); } .menu-item:last-child { margin-bottom: 0; padding-bottom: 0; border-bottom: none; } .item-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 0.5rem; gap: 1rem; } .item-name { font-weight: 600; color: var(--text-primary); font-size: 1rem; } .item-price { font-weight: 700; color: var(--accent-color); white-space: nowrap; } .item-desc { font-size: 0.875rem; color: var(--text-secondary); line-height: 1.6; margin-bottom: 0.75rem; } .badges { display: flex; gap: 0.5rem; margin-left: auto; } .item-status-row { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.75rem; } .badge { display: inline-flex; align-items: center; justify-content: center; height: 24px; font-size: 0.75rem; padding: 0 10px; border-radius: 4px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; line-height: normal; white-space: nowrap; } .badge.available { background-color: rgba(16, 185, 129, 0.1); /* Emerald 500 / 10% */ color: var(--success-color); border: 1px solid rgba(16, 185, 129, 0.2); } .badge.sold-out { background-color: rgba(239, 68, 68, 0.1); /* Red 500 / 10% */ color: var(--error-color); border: 1px solid rgba(239, 68, 68, 0.2); } .badge.ordered { background-color: rgba(139, 92, 246, 0.1); /* Violet 500 / 10% */ color: #8b5cf6; border: 1px solid rgba(139, 92, 246, 0.2); gap: 4px; } .badge.ordered .material-icons-round { font-size: 1rem; } /* Loading */ .loading-state { text-align: center; padding: 4rem; color: var(--text-secondary); } .spinner { width: 40px; height: 40px; border: 3px solid var(--border-color); border-top-color: var(--accent-color); border-radius: 50%; margin: 0 auto 1rem; animation: spin 1s linear infinite; } @keyframes spin { to { transform: rotate(360deg); } } /* Footer */ .app-footer { text-align: center; padding: 2rem; color: var(--text-secondary); font-size: 0.875rem; border-top: 1px solid var(--border-color); margin-top: auto; } /* === Order / Cancel Buttons (inline in status row) === */ .btn-order { display: inline-flex; align-items: center; gap: 4px; padding: 4px 10px; border: none; border-radius: 6px; background: var(--success-color); color: white; font-size: 0.75rem; font-weight: 600; cursor: pointer; transition: all 0.2s ease; font-family: inherit; } .btn-order .material-icons-round { font-size: 16px; } .btn-order:hover:not(:disabled) { filter: brightness(1.15); transform: translateY(-1px); } .btn-order:disabled { opacity: 0.5; cursor: not-allowed; } .btn-order.loading { pointer-events: none; opacity: 0.6; } .btn-order-compact { padding: 2px 4px; gap: 0; } .btn-order-compact .material-icons-round { font-size: 16px; } .btn-cancel { display: inline-flex; align-items: center; justify-content: center; padding: 4px 6px; border: none; border-radius: 6px; background: var(--error-color); color: white; font-size: 0.75rem; cursor: pointer; transition: all 0.2s ease; font-family: inherit; } .btn-cancel .material-icons-round { font-size: 16px; } .btn-cancel:hover:not(:disabled) { filter: brightness(1.15); transform: translateY(-1px); } .btn-cancel:disabled { opacity: 0.5; cursor: not-allowed; } /* Past days: hide action buttons */ .past-day .item-actions { display: none; } /* Order count badge (for multi-orders) */ .order-count-badge { display: inline-flex; align-items: center; justify-content: center; background: rgba(255, 255, 255, 0.3); color: white; font-size: 0.65rem; font-weight: 700; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 8px; margin-left: 4px; line-height: 1; } /* === Toast Notifications === */ #toast-container { position: fixed; bottom: 20px; right: 20px; z-index: 10000; display: flex; flex-direction: column; gap: 8px; pointer-events: none; } .toast { display: flex; align-items: center; gap: 8px; padding: 10px 16px; border-radius: 8px; font-size: 0.85rem; font-weight: 500; font-family: \'Inter\', sans-serif; color: white; backdrop-filter: blur(10px); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3); pointer-events: auto; transform: translateX(120%); opacity: 0; transition: transform 0.3s ease, opacity 0.3s ease; } .toast.show { transform: translateX(0); opacity: 1; } .toast .material-icons-round { font-size: 18px; } .toast-success { background: rgba(5, 150, 105, 0.95); } .toast-error { background: rgba(220, 38, 38, 0.95); } .toast-info { background: rgba(59, 130, 246, 0.95); } /* === Mobile Responsiveness === */ @media (max-width: 600px) { .header-content { flex-direction: column; gap: 1rem; padding: 0.75rem; } .week-nav { width: 100%; justify-content: center; } .nav-pills { width: 100%; justify-content: space-between; } .nav-btn { flex: 1; justify-content: center; padding: 0.5rem; font-size: 0.85rem; } .days-grid { grid-template-columns: 1fr; /* Force single column */ } .main-content { padding: 1rem; } .week-title { font-size: 1.5rem; } /* Adjust toast position for mobile */ .toast-container { bottom: 1rem; right: 1rem; left: 1rem; /* Center on mobile */ width: auto; } .menu-card { margin-bottom: 1rem; } } /* === Flagging & Notification Styles === */ .btn-flag { display: inline-flex; align-items: center; justify-content: center; background: transparent; border: 1px solid var(--text-secondary); color: var(--text-secondary); border-radius: 6px; padding: 4px; cursor: pointer; transition: all 0.2s; margin-right: 0.5rem; width: 28px; height: 28px; } .btn-flag:hover { background: rgba(234, 179, 8, 0.1); /* Yellow-500 / 10% */ color: #eab308; border-color: #eab308; } .btn-flag.active { background: rgba(234, 179, 8, 0.1); color: #eab308; border-color: #eab308; } .btn-flag .material-icons-round { font-size: 1.1rem; } /* Flagged & Sold Out (Yellow Glow) */ .menu-item.flagged-sold-out { border: 1px solid #eab308; box-shadow: 0 0 10px rgba(234, 179, 8, 0.2); border-radius: 8px; padding: 1rem; margin: 0 -1rem 1.5rem -1rem; background: var(--bg-card); position: relative; z-index: 5; animation: yellow-pulse 3s infinite; } @keyframes yellow-pulse { 0% { box-shadow: 0 0 8px rgba(234, 179, 8, 0.2); } 50% { box-shadow: 0 0 16px rgba(234, 179, 8, 0.5); } 100% { box-shadow: 0 0 8px rgba(234, 179, 8, 0.2); } } /* Flagged & Available (Green Glow) */ .menu-item.flagged-available { border: 2px solid var(--success-color); box-shadow: 0 0 15px rgba(16, 185, 129, 0.3); border-radius: 8px; padding: 1rem; margin: 0 -1rem 1.5rem -1rem; background: var(--bg-card); position: relative; z-index: 5; animation: green-pulse 3s infinite; } @keyframes green-pulse { 0% { box-shadow: 0 0 10px rgba(16, 185, 129, 0.3); } 50% { box-shadow: 0 0 20px rgba(16, 185, 129, 0.6); } 100% { box-shadow: 0 0 10px rgba(16, 185, 129, 0.3); } } /* Day Header Badges */ .day-header-left { display: flex; align-items: center; gap: 0.75rem; } .menu-code-badge { font-size: 0.75rem; font-weight: 700; color: #8b5cf6; /* Violet 500 */ background-color: rgba(139, 92, 246, 0.15); border: 1px solid rgba(139, 92, 246, 0.3); padding: 2px 6px; border-radius: 6px; line-height: normal; display: inline-block; } /* Detailed Badge Colors */ .nav-badge.badge-violet { background-color: #8b5cf6; } .nav-badge.badge-green { background-color: var(--success-color); } .nav-badge.badge-red { background-color: var(--error-color); } .nav-badge.badge-blue { background-color: var(--accent-color); } /* Day Header Status Colors (User Request) */ .card-header.header-violet { background-color: rgba(139, 92, 246, 0.15); border-bottom: 2px solid #8b5cf6; } .card-header.header-green { background-color: rgba(16, 185, 129, 0.15); border-bottom: 2px solid var(--success-color); } .card-header.header-red { background-color: rgba(239, 68, 68, 0.15); border-bottom: 2px solid var(--error-color); } .card-header.header-violet .day-name, .card-header.header-green .day-name, .card-header.header-red .day-name { font-weight: 700; color: var(--text-primary); /* Ensure text remains standard color */ } /* Update Icon */ .update-icon { display: inline-flex; align-items: center; justify-content: center; margin-left: 8px; background-color: rgba(16, 185, 129, 0.2); /* Green tint */ color: var(--success-color); border-radius: 50%; width: 24px; height: 24px; cursor: pointer; font-size: 14px; transition: all 0.2s; text-decoration: none; animation: pulse 2s infinite; } .update-icon:hover { background-color: var(--success-color); color: white; transform: scale(1.1); } @keyframes pulse { 0% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.4); } 70% { box-shadow: 0 0 0 6px rgba(16, 185, 129, 0); } 100% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0); } } /* Order Countdown */ #order-countdown { background: rgba(255, 255, 255, 0.1); padding: 0.25rem 0.75rem; border-radius: 99px; font-size: 0.85rem; display: flex; align-items: center; gap: 0.5rem; white-space: nowrap; border: 1px solid var(--border-color); } #order-countdown span { opacity: 0.7; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.5px; } #order-countdown.urgent { background: rgba(239, 68, 68, 0.2); border-color: rgba(239, 68, 68, 0.5); color: #ef4444; animation: pulse-red 2s infinite; } @keyframes pulse-red { 0% { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.4); } 70% { box-shadow: 0 0 0 6px rgba(239, 68, 68, 0); } 100% { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0); } } /* Smart Highlights (Blue Glow - matches today-ordered/flagged pattern) */ .menu-item.highlight-glow { border: 2px solid rgba(59, 130, 246, 0.7); box-shadow: 0 0 20px rgba(59, 130, 246, 0.4); border-radius: 8px; padding: 1rem; margin: 0 -1rem 1.5rem -1rem; background: var(--bg-card); position: relative; z-index: 5; animation: blue-pulse 3s infinite; } @keyframes blue-pulse { 0% { box-shadow: 0 0 15px rgba(59, 130, 246, 0.3); } 50% { box-shadow: 0 0 25px rgba(59, 130, 246, 0.6); } 100% { box-shadow: 0 0 15px rgba(59, 130, 246, 0.3); } } /* Nav Badge with Count */ .nav-badge.has-highlights { background-color: var(--bg-card); /* Neutral background */ color: var(--text-primary); border: 1px solid var(--border-color); padding: 2px 6px; } .nav-badge .highlight-count { color: #3b82f6; /* Blue 500 */ font-weight: 700; margin-left: 4px; } /* Tag Management Modal */ #tags-list { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 1rem; min-height: 50px; } /* Tag badges styled consistently with .badge (verfügbar/ausverkauft) */ .tag-badge { display: inline-flex; align-items: center; justify-content: center; height: 24px; font-size: 0.75rem; padding: 0 10px; border-radius: 4px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; line-height: normal; white-space: nowrap; background-color: rgba(59, 130, 246, 0.1); color: #3b82f6; border: 1px solid rgba(59, 130, 246, 0.2); gap: 4px; } .tag-remove { cursor: pointer; opacity: 0.7; font-size: 1.1em; line-height: 1; transition: all 0.2s; } .tag-remove:hover { opacity: 1; color: #ef4444; } .input-group { display: flex; gap: 0.5rem; } .input-group input { flex: 1; padding: 0.75rem; background: var(--bg-body); border: 1px solid var(--border-color); color: var(--text-primary); border-radius: 8px; font-family: inherit; } /* Add tag button - styled like .btn-order with nav-btn.active color */ #btn-add-tag { display: inline-flex; align-items: center; gap: 4px; padding: 0.5rem 1rem; border: none; border-radius: 6px; background: var(--accent-color); color: white; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.2s ease; font-family: inherit; white-space: nowrap; } #btn-add-tag:hover { filter: brightness(1.15); transform: translateY(-1px); } /* Update Banner Enhanced */ .change-summary { font-size: 0.8rem; background: rgba(0, 0, 0, 0.1); padding: 0.5rem; border-radius: 4px; margin: 0.5rem 0; white-space: pre-wrap; font-family: inherit; line-height: 1.4; max-height: 100px; overflow-y: auto; } .update-content { display: flex; flex-direction: column; gap: 4px; flex: 1; } /* Installer Changelog */ .changelog-container ul { padding-left: 1.5rem; margin: 0.5rem 0; } .changelog-container li { margin-bottom: 0.4rem; line-height: 1.5; } .changelog-container h3 { margin-top: 1.5rem; margin-bottom: 0.5rem; font-size: 1.1em; color: var(--accent-color); } ';
 document.head.appendChild(s);
 var sc=document.createElement('script');
-sc.textContent="/**\n * Kantine Wrapper \u2013 Client-Only Bookmarklet\n * Replaces Bessa page content with enhanced weekly menu view.\n * All API calls go directly to api.bessa.app (same origin).\n * Data stored in localStorage (flags, theme, auth).\n */\n(function () {\n    'use strict';\n\n    // Prevent double injection\n    if (window.__KANTINE_LOADED) return;\n    window.__KANTINE_LOADED = true;\n\n    // === Constants ===\n    const API_BASE = 'https://api.bessa.app/v1';\n    const GUEST_TOKEN = 'c3418725e95a9f90e3645cbc846b4d67c7c66131';\n    const CLIENT_VERSION = '1.7.0_prod/2026-01-26';\n    const VENUE_ID = 591;\n    const MENU_ID = 7;\n    const POLL_INTERVAL_MS = 5 * 60 * 1000; // 5 minutes\n\n    // === State ===\n    let allWeeks = [];\n    let currentWeekNumber = getISOWeek(new Date());\n    let currentYear = new Date().getFullYear();\n    let displayMode = 'this-week';\n    let authToken = sessionStorage.getItem('kantine_authToken');\n    let currentUser = sessionStorage.getItem('kantine_currentUser');\n    let orderMap = new Map();\n    let userFlags = new Set(JSON.parse(localStorage.getItem('kantine_flags') || '[]'));\n    let pollIntervalId = null;\n\n    // === API Helpers ===\n    function apiHeaders(token) {\n        return {\n            'Authorization': `Token ${token || GUEST_TOKEN}`,\n            'Accept': 'application/json',\n            'Content-Type': 'application/json',\n            'X-Client-Version': CLIENT_VERSION\n        };\n    }\n\n    // === Inject UI ===\n    function injectUI() {\n        // Replace entire page content\n        document.title = 'Kantine Weekly Menu';\n\n        // Inject Google Fonts if not already present\n        if (!document.querySelector('link[href*=\"fonts.googleapis.com/css2?family=Inter\"]')) {\n            const fontLink = document.createElement('link');\n            fontLink.rel = 'stylesheet';\n            fontLink.href = 'https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap';\n            document.head.appendChild(fontLink);\n        }\n        if (!document.querySelector('link[href*=\"Material+Icons+Round\"]')) {\n            const iconLink = document.createElement('link');\n            iconLink.rel = 'stylesheet';\n            iconLink.href = 'https://fonts.googleapis.com/icon?family=Material+Icons+Round';\n            document.head.appendChild(iconLink);\n        }\n\n        document.body.innerHTML = `\n        <div id=\"kantine-wrapper\">\n            <header class=\"app-header\">\n                <div class=\"header-content\">\n                    <div class=\"brand\">\n                        <span class=\"material-icons-round logo-icon\">restaurant_menu</span>\n                        <div class=\"header-left\">\n                            <h1>Kantinen \u00dcbersicht <small style=\"font-size: 0.6em; opacity: 0.7; font-weight: 400;\">v1.2.0</small></h1>\n                            <div id=\"last-updated-subtitle\" class=\"subtitle\"></div>\n                        </div>\n                    </div>\n                    <div class=\"header-center-wrapper\">\n                        <div id=\"header-week-info\" class=\"header-week-info\"></div>\n                        <div id=\"weekly-cost-display\" class=\"weekly-cost hidden\"></div>\n                    </div>\n                    <div class=\"controls\">\n                        <button id=\"btn-refresh\" class=\"icon-btn\" aria-label=\"Men\u00fcdaten aktualisieren\" title=\"Men\u00fcdaten neu laden\">\n                            <span class=\"material-icons-round\">refresh</span>\n                        </button>\n                        <button id=\"btn-highlights\" class=\"icon-btn\" aria-label=\"Pers\u00f6nliche Highlights verwalten\" title=\"Pers\u00f6nliche Highlights verwalten\">\n                            <span class=\"material-icons-round\">label</span>\n                        </button>\n                        <div class=\"nav-group\">\n                            <button id=\"btn-this-week\" class=\"nav-btn active\">Diese Woche</button>\n                            <button id=\"btn-next-week\" class=\"nav-btn\">N\u00e4chste Woche</button>\n                        </div>\n                        <button id=\"theme-toggle\" class=\"icon-btn\" aria-label=\"Toggle Theme\">\n                            <span class=\"material-icons-round theme-icon\">light_mode</span>\n                        </button>\n                        <button id=\"btn-login-open\" class=\"user-badge-btn icon-btn-small\">\n                            <span class=\"material-icons-round\">login</span>\n                            <span>Anmelden</span>\n                        </button>\n                        <div id=\"user-info\" class=\"user-badge hidden\">\n                            <span class=\"material-icons-round\">person</span>\n                            <span id=\"user-id-display\"></span>\n                            <button id=\"btn-logout\" class=\"icon-btn-small\" aria-label=\"Logout\">\n                                <span class=\"material-icons-round\">logout</span>\n                            </button>\n                        </div>\n                    </div>\n                </div>\n            </header>\n\n            <div id=\"login-modal\" class=\"modal hidden\">\n                <div class=\"modal-content\">\n                    <div class=\"modal-header\">\n                        <h2>Login</h2>\n                        <button id=\"btn-login-close\" class=\"icon-btn\" aria-label=\"Close\">\n                            <span class=\"material-icons-round\">close</span>\n                        </button>\n                    </div>\n                    <form id=\"login-form\">\n                        <div class=\"form-group\">\n                            <label for=\"employee-id\">Mitarbeiternummer</label>\n                            <input type=\"text\" id=\"employee-id\" name=\"employee-id\" placeholder=\"z.B. 2041\" required>\n                            <small class=\"help-text\">Deine offizielle Knapp Mitarbeiternummer.</small>\n                        </div>\n                        <div class=\"form-group\">\n                            <label for=\"password\">Passwort</label>\n                            <input type=\"password\" id=\"password\" name=\"password\" placeholder=\"Bessa Passwort\" required>\n                            <small class=\"help-text\">Das Passwort f\u00fcr deinen Bessa Account.</small>\n                        </div>\n                        <div id=\"login-error\" class=\"error-msg hidden\"></div>\n                        <div class=\"modal-actions\">\n                            <button type=\"submit\" class=\"btn-primary wide\">Einloggen</button>\n                        </div>\n                    </form>\n                </div>\n            </div>\n\n            <div id=\"progress-modal\" class=\"modal hidden\">\n                <div class=\"modal-content\">\n                    <div class=\"modal-header\">\n                        <h2>Men\u00fcdaten aktualisieren</h2>\n                    </div>\n                    <div class=\"modal-body\" style=\"padding: 20px;\">\n                        <div class=\"progress-container\">\n                            <div class=\"progress-bar\">\n                                <div id=\"progress-fill\" class=\"progress-fill\"></div>\n                            </div>\n                            <div id=\"progress-percent\" class=\"progress-percent\">0%</div>\n                        </div>\n                        <p id=\"progress-message\" class=\"progress-message\">Initialisierung...</p>\n                    </div>\n                </div>\n            </div>\n\n            <div id=\"highlights-modal\" class=\"modal hidden\">\n                <div class=\"modal-content\">\n                    <div class=\"modal-header\">\n                        <h2>Meine Highlights</h2>\n                        <button id=\"btn-highlights-close\" class=\"icon-btn\" aria-label=\"Close\">\n                            <span class=\"material-icons-round\">close</span>\n                        </button>\n                    </div>\n                    <div class=\"modal-body\">\n                        <p style=\"margin-bottom: 1rem; color: var(--text-secondary);\">\n                            Markiere Men\u00fcs automatisch, wenn sie diese Schlagw\u00f6rter enthalten.\n                        </p>\n                        <div class=\"input-group\">\n                            <input type=\"text\" id=\"tag-input\" placeholder=\"z.B. Schnitzel, Vegetarisch...\">\n                            <button id=\"btn-add-tag\" class=\"btn-primary\">Hinzuf\u00fcgen</button>\n                        </div>\n                        <div id=\"tags-list\"></div>\n                    </div>\n                </div>\n            </div>\n\n            <main class=\"container\">\n                <div id=\"last-updated-banner\" class=\"banner hidden\">\n                    <span class=\"material-icons-round\">update</span>\n                    <span id=\"last-updated-text\">Gerade aktualisiert</span>\n                </div>\n                <div id=\"loading\" class=\"loading-state\">\n                    <div class=\"spinner\"></div>\n                    <p>Lade Men\u00fcdaten...</p>\n                </div>\n                <div id=\"menu-container\" class=\"menu-grid\"></div>\n            </main>\n\n            <footer class=\"app-footer\">\n                <p>Bessa Knapp-Kantine Wrapper &bull; <span id=\"current-year\">${new Date().getFullYear()}</span></p>\n            </footer>\n        </div>`;\n    }\n\n    // === Bind Events ===\n    function bindEvents() {\n        const btnThisWeek = document.getElementById('btn-this-week');\n        const btnNextWeek = document.getElementById('btn-next-week');\n        const btnRefresh = document.getElementById('btn-refresh');\n        const themeToggle = document.getElementById('theme-toggle');\n        const btnLoginOpen = document.getElementById('btn-login-open');\n        const btnLoginClose = document.getElementById('btn-login-close');\n        const btnLogout = document.getElementById('btn-logout');\n        const loginForm = document.getElementById('login-form');\n        const loginModal = document.getElementById('login-modal');\n\n        // Highlights Modal\n        const btnHighlights = document.getElementById('btn-highlights');\n        const highlightsModal = document.getElementById('highlights-modal');\n        const btnHighlightsClose = document.getElementById('btn-highlights-close');\n        const btnAddTag = document.getElementById('btn-add-tag');\n        const tagInput = document.getElementById('tag-input');\n\n        btnHighlights.addEventListener('click', () => {\n            highlightsModal.classList.remove('hidden');\n            renderTagsList();\n            tagInput.focus();\n        });\n\n        btnHighlightsClose.addEventListener('click', () => {\n            highlightsModal.classList.add('hidden');\n        });\n\n        window.addEventListener('click', (e) => {\n            if (e.target === highlightsModal) highlightsModal.classList.add('hidden');\n        });\n\n        btnAddTag.addEventListener('click', () => {\n            const tag = tagInput.value;\n            if (addHighlightTag(tag)) {\n                tagInput.value = '';\n                renderTagsList();\n            }\n        });\n\n        tagInput.addEventListener('keypress', (e) => {\n            if (e.key === 'Enter') {\n                btnAddTag.click();\n            }\n        });\n\n        // Theme\n        const savedTheme = localStorage.getItem('theme');\n        const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;\n        const themeIcon = themeToggle.querySelector('.theme-icon');\n\n        if (savedTheme === 'dark' || (!savedTheme && prefersDark)) {\n            document.documentElement.setAttribute('data-theme', 'dark');\n            themeIcon.textContent = 'dark_mode';\n        } else {\n            document.documentElement.setAttribute('data-theme', 'light');\n            themeIcon.textContent = 'light_mode';\n        }\n\n        themeToggle.addEventListener('click', () => {\n            const current = document.documentElement.getAttribute('data-theme');\n            const next = current === 'dark' ? 'light' : 'dark';\n            document.documentElement.setAttribute('data-theme', next);\n            localStorage.setItem('theme', next);\n            themeIcon.textContent = next === 'dark' ? 'dark_mode' : 'light_mode';\n        });\n\n        // Navigation\n        btnThisWeek.addEventListener('click', () => {\n            if (displayMode !== 'this-week') {\n                displayMode = 'this-week';\n                btnThisWeek.classList.add('active');\n                btnNextWeek.classList.remove('active');\n                renderVisibleWeeks();\n            }\n        });\n\n        btnNextWeek.addEventListener('click', () => {\n            if (displayMode !== 'next-week') {\n                displayMode = 'next-week';\n                btnNextWeek.classList.add('active');\n                btnThisWeek.classList.remove('active');\n                renderVisibleWeeks();\n            }\n        });\n\n        // Refresh \u2013 fetch fresh data from Bessa API\n        btnRefresh.addEventListener('click', () => {\n            if (!authToken) {\n                loginModal.classList.remove('hidden');\n                return;\n            }\n            loadMenuDataFromAPI();\n        });\n\n        // Login Modal\n        btnLoginOpen.addEventListener('click', () => {\n            loginModal.classList.remove('hidden');\n            document.getElementById('login-error').classList.add('hidden');\n            loginForm.reset();\n        });\n\n        btnLoginClose.addEventListener('click', () => {\n            loginModal.classList.add('hidden');\n        });\n\n        window.addEventListener('click', (e) => {\n            if (e.target === loginModal) loginModal.classList.add('hidden');\n        });\n\n        // Login Form Submit\n        loginForm.addEventListener('submit', async (e) => {\n            e.preventDefault();\n            const employeeId = document.getElementById('employee-id').value.trim();\n            const password = document.getElementById('password').value;\n            const loginError = document.getElementById('login-error');\n            const submitBtn = loginForm.querySelector('button[type=\"submit\"]');\n            const originalText = submitBtn.textContent;\n\n            submitBtn.disabled = true;\n            submitBtn.textContent = 'Wird eingeloggt...';\n\n            try {\n                const email = `knapp-${employeeId}@bessa.app`;\n                const response = await fetch(`${API_BASE}/auth/login/`, {\n                    method: 'POST',\n                    headers: apiHeaders(GUEST_TOKEN),\n                    body: JSON.stringify({ email, password })\n                });\n\n                const data = await response.json();\n\n                if (response.ok) {\n                    authToken = data.key;\n                    currentUser = employeeId;\n                    sessionStorage.setItem('kantine_authToken', data.key);\n                    sessionStorage.setItem('kantine_currentUser', employeeId);\n\n                    // Fetch user name\n                    try {\n                        const userResp = await fetch(`${API_BASE}/auth/user/`, {\n                            headers: apiHeaders(authToken)\n                        });\n                        if (userResp.ok) {\n                            const userData = await userResp.json();\n                            if (userData.first_name) sessionStorage.setItem('kantine_firstName', userData.first_name);\n                            if (userData.last_name) sessionStorage.setItem('kantine_lastName', userData.last_name);\n                        }\n                    } catch (err) {\n                        console.error('Failed to fetch user info:', err);\n                    }\n\n                    updateAuthUI();\n                    loginModal.classList.add('hidden');\n                    fetchOrders();\n                    loginForm.reset();\n                    startPolling();\n\n                    // Reload menu data with auth for full details\n                    loadMenuDataFromAPI();\n                } else {\n                    loginError.textContent = data.non_field_errors?.[0] || data.error || 'Login fehlgeschlagen';\n                    loginError.classList.remove('hidden');\n                }\n            } catch (error) {\n                console.error('Login error:', error);\n                loginError.textContent = 'Ein Fehler ist aufgetreten';\n                loginError.classList.remove('hidden');\n            } finally {\n                submitBtn.disabled = false;\n                submitBtn.textContent = originalText;\n            }\n        });\n\n        // Logout\n        btnLogout.addEventListener('click', () => {\n            sessionStorage.removeItem('kantine_authToken');\n            sessionStorage.removeItem('kantine_currentUser');\n            sessionStorage.removeItem('kantine_firstName');\n            sessionStorage.removeItem('kantine_lastName');\n            authToken = null;\n            currentUser = null;\n            orderMap = new Map();\n            stopPolling();\n            updateAuthUI();\n            renderVisibleWeeks();\n        });\n    }\n\n    // === Auth UI ===\n    function updateAuthUI() {\n        // Try to recover session from Bessa's storage if not already logged in\n        if (!authToken) {\n            try {\n                const akita = localStorage.getItem('AkitaStores');\n                if (akita) {\n                    const parsed = JSON.parse(akita);\n                    if (parsed.auth && parsed.auth.token) {\n                        console.log('Found existing Bessa session!');\n                        authToken = parsed.auth.token;\n                        sessionStorage.setItem('kantine_authToken', authToken);\n\n                        if (parsed.auth.user) {\n                            currentUser = parsed.auth.user.id || 'unknown';\n                            sessionStorage.setItem('kantine_currentUser', currentUser);\n                            if (parsed.auth.user.firstName) sessionStorage.setItem('kantine_firstName', parsed.auth.user.firstName);\n                            if (parsed.auth.user.lastName) sessionStorage.setItem('kantine_lastName', parsed.auth.user.lastName);\n                        }\n                    }\n                }\n            } catch (e) {\n                console.warn('Failed to parse AkitaStores:', e);\n            }\n        }\n\n        authToken = sessionStorage.getItem('kantine_authToken');\n        currentUser = sessionStorage.getItem('kantine_currentUser');\n        const firstName = sessionStorage.getItem('kantine_firstName');\n        const btnLoginOpen = document.getElementById('btn-login-open');\n        const userInfo = document.getElementById('user-info');\n        const userIdDisplay = document.getElementById('user-id-display');\n\n        if (authToken) {\n            btnLoginOpen.classList.add('hidden');\n            userInfo.classList.remove('hidden');\n            userIdDisplay.textContent = firstName || (currentUser ? `User ${currentUser}` : 'Angemeldet');\n            fetchOrders(); // Always fetch fresh orders on auth update\n        } else {\n            btnLoginOpen.classList.remove('hidden');\n            userInfo.classList.add('hidden');\n            userIdDisplay.textContent = '';\n        }\n\n        renderVisibleWeeks();\n    }\n\n    // === Fetch Orders from Bessa ===\n    async function fetchOrders() {\n        if (!authToken) return;\n        try {\n            // Use user/orders endpoint for reliable history\n            const response = await fetch(`${API_BASE}/user/orders/?venue=${VENUE_ID}&ordering=-created&limit=50`, {\n                headers: apiHeaders(authToken)\n            });\n            const data = await response.json();\n\n            if (response.ok) {\n                orderMap = new Map();\n                const results = data.results || [];\n\n                for (const order of results) {\n                    // Filter out cancelled orders (State 9)\n                    // Accepting State 1 (Created?), 5 (Placed?), 8 (Completed)\n                    // TODO: Verify exact states. Subagent saw 5=Active, 8=Completed, 9=Cancelled.\n                    if (order.order_state === 9) continue;\n\n                    // Extract date properly (it comes as ISO string)\n                    const orderDate = order.date.split('T')[0];\n\n                    for (const item of (order.items || [])) {\n                        const key = `${orderDate}_${item.article}`;\n                        if (!orderMap.has(key)) orderMap.set(key, []);\n                        orderMap.get(key).push(order.id);\n                    }\n                }\n                console.log(`Fetched ${results.length} orders, mapped active ones.`);\n                renderVisibleWeeks();\n            }\n        } catch (error) {\n            console.error('Error fetching orders:', error);\n        }\n    }\n\n    // === Place Order ===\n    async function placeOrder(date, articleId, name, price, description) {\n        if (!authToken) return;\n        try {\n            // Get user data for customer object\n            const userResp = await fetch(`${API_BASE}/auth/user/`, {\n                headers: apiHeaders(authToken)\n            });\n            if (!userResp.ok) {\n                showToast('Fehler: Benutzerdaten konnten nicht geladen werden', 'error');\n                return;\n            }\n            const userData = await userResp.json();\n            const now = new Date().toISOString();\n\n            const orderPayload = {\n                uuid: crypto.randomUUID(),\n                created: now,\n                updated: now,\n                order_type: 7,\n                items: [{\n                    article: articleId,\n                    course_group: null,\n                    modifiers: [],\n                    uuid: crypto.randomUUID(),\n                    name: name,\n                    description: description || '',\n                    price: String(parseFloat(price)),\n                    amount: 1,\n                    vat: '10.00',\n                    comment: ''\n                }],\n                table: null,\n                total: parseFloat(price),\n                tip: 0,\n                currency: 'EUR',\n                venue: VENUE_ID,\n                states: [],\n                order_state: 1,\n                date: `${date}T10:00:00.000Z`,\n                payment_method: 'payroll',\n                customer: {\n                    first_name: userData.first_name,\n                    last_name: userData.last_name,\n                    email: userData.email,\n                    newsletter: false\n                },\n                preorder: false,\n                delivery_fee: 0,\n                cash_box_table_name: null,\n                take_away: false\n            };\n\n            const response = await fetch(`${API_BASE}/user/orders/`, {\n                method: 'POST',\n                headers: apiHeaders(authToken),\n                body: JSON.stringify(orderPayload)\n            });\n\n            if (response.ok || response.status === 201) {\n                showToast(`Bestellt: ${name}`, 'success');\n                await fetchOrders();\n            } else {\n                const data = await response.json();\n                showToast(`Fehler: ${data.detail || data.non_field_errors?.[0] || 'Bestellung fehlgeschlagen'}`, 'error');\n            }\n        } catch (error) {\n            console.error('Order error:', error);\n            showToast('Netzwerkfehler bei Bestellung', 'error');\n        }\n    }\n\n    // === Cancel Order ===\n    async function cancelOrder(date, articleId, name) {\n        if (!authToken) return;\n        const key = `${date}_${articleId}`;\n        const orderIds = orderMap.get(key);\n        if (!orderIds || orderIds.length === 0) return;\n\n        // LIFO: cancel most recent\n        const orderId = orderIds[orderIds.length - 1];\n        try {\n            const response = await fetch(`${API_BASE}/user/orders/${orderId}/cancel/`, {\n                method: 'PATCH',\n                headers: apiHeaders(authToken),\n                body: JSON.stringify({})\n            });\n\n            if (response.ok) {\n                showToast(`Storniert: ${name}`, 'success');\n                await fetchOrders();\n            } else {\n                const data = await response.json();\n                showToast(`Fehler: ${data.detail || 'Stornierung fehlgeschlagen'}`, 'error');\n            }\n        } catch (error) {\n            console.error('Cancel error:', error);\n            showToast('Netzwerkfehler bei Stornierung', 'error');\n        }\n    }\n\n    // === Flag Management (localStorage) ===\n    function saveFlags() {\n        localStorage.setItem('kantine_flags', JSON.stringify([...userFlags]));\n    }\n\n    function toggleFlag(date, articleId, name, cutoff) {\n        const id = `${date}_${articleId}`;\n        if (userFlags.has(id)) {\n            userFlags.delete(id);\n            showToast(`Flag entfernt f\u00fcr ${name}`, 'success');\n        } else {\n            userFlags.add(id);\n            showToast(`Benachrichtigung aktiviert f\u00fcr ${name}`, 'success');\n            if (Notification.permission === 'default') {\n                Notification.requestPermission();\n            }\n        }\n        saveFlags();\n        renderVisibleWeeks();\n    }\n\n    // FR-019: Auto-remove flags whose cutoff has passed\n    function cleanupExpiredFlags() {\n        const now = new Date();\n        let changed = false;\n        for (const flagId of [...userFlags]) {\n            const [date] = flagId.split('_');\n            const cutoff = new Date(date);\n            cutoff.setHours(10, 0, 0, 0); // Standard cutoff 10:00\n            if (now >= cutoff) {\n                userFlags.delete(flagId);\n                changed = true;\n            }\n        }\n        if (changed) saveFlags();\n    }\n\n    // === Polling (Client-Side) ===\n    function startPolling() {\n        if (pollIntervalId) return;\n        if (!authToken) return;\n        pollIntervalId = setInterval(() => pollFlaggedItems(), POLL_INTERVAL_MS);\n        console.log('Polling started (every 5 min)');\n    }\n\n    function stopPolling() {\n        if (pollIntervalId) {\n            clearInterval(pollIntervalId);\n            pollIntervalId = null;\n            console.log('Polling stopped');\n        }\n    }\n\n    async function pollFlaggedItems() {\n        if (userFlags.size === 0 || !authToken) return;\n        console.log(`Polling ${userFlags.size} flagged items...`);\n\n        for (const flagId of userFlags) {\n            const [date, articleIdStr] = flagId.split('_');\n            const articleId = parseInt(articleIdStr);\n\n            try {\n                const response = await fetch(`${API_BASE}/venues/${VENUE_ID}/menu/${MENU_ID}/${date}/`, {\n                    headers: apiHeaders(authToken)\n                });\n                if (!response.ok) continue;\n\n                const data = await response.json();\n                const groups = data.results || [];\n                let foundItem = null;\n                for (const group of groups) {\n                    if (group.items) {\n                        foundItem = group.items.find(i => i.id === articleId || i.article === articleId);\n                        if (foundItem) break;\n                    }\n                }\n\n                if (foundItem) {\n                    const isAvailable = (foundItem.amount_tracking === false) || (parseInt(foundItem.available_amount) > 0);\n                    if (isAvailable) {\n                        const itemName = foundItem.name || 'Unbekannt';\n                        showToast(`${itemName} ist jetzt verf\u00fcgbar!`, 'success');\n                        if (Notification.permission === 'granted') {\n                            new Notification('Kantine Wrapper', {\n                                body: `${itemName} ist jetzt verf\u00fcgbar!`,\n                                icon: '\ud83c\udf7d\ufe0f'\n                            });\n                        }\n                        // Refresh menu data to update UI\n                        loadMenuDataFromAPI();\n                    }\n                }\n            } catch (err) {\n                console.error(`Poll error for ${flagId}:`, err);\n                // Small delay between checks\n                await new Promise(r => setTimeout(r, 200));\n            }\n        }\n    }\n\n    // === Highlight Management ===\n    let highlightTags = JSON.parse(localStorage.getItem('kantine_highlightTags') || '[]');\n\n    function saveHighlightTags() {\n        localStorage.setItem('kantine_highlightTags', JSON.stringify(highlightTags));\n        renderVisibleWeeks(); // Refresh UI to apply changes\n        updateNextWeekBadge();\n    }\n\n    function addHighlightTag(tag) {\n        tag = tag.trim().toLowerCase();\n        if (tag && !highlightTags.includes(tag)) {\n            highlightTags.push(tag);\n            saveHighlightTags();\n            return true;\n        }\n        return false;\n    }\n\n    function removeHighlightTag(tag) {\n        highlightTags = highlightTags.filter(t => t !== tag);\n        saveHighlightTags();\n    }\n\n    function renderTagsList() {\n        const list = document.getElementById('tags-list');\n        list.innerHTML = '';\n        highlightTags.forEach(tag => {\n            const badge = document.createElement('span');\n            badge.className = 'tag-badge';\n            badge.innerHTML = `${tag} <span class=\"tag-remove\" data-tag=\"${tag}\">&times;</span>`;\n            list.appendChild(badge);\n        });\n\n        // Bind remove events\n        list.querySelectorAll('.tag-remove').forEach(btn => {\n            btn.addEventListener('click', (e) => {\n                removeHighlightTag(e.target.dataset.tag);\n                renderTagsList();\n            });\n        });\n    }\n\n    function checkHighlight(text) {\n        if (!text) return false;\n        text = text.toLowerCase();\n        return highlightTags.some(tag => text.includes(tag));\n    }\n\n    // === Local Menu Cache (localStorage) ===\n    const CACHE_KEY = 'kantine_menuCache';\n    const CACHE_TS_KEY = 'kantine_menuCacheTs';\n\n    function saveMenuCache() {\n        try {\n            localStorage.setItem(CACHE_KEY, JSON.stringify(allWeeks));\n            localStorage.setItem(CACHE_TS_KEY, new Date().toISOString());\n        } catch (e) {\n            console.warn('Failed to cache menu data:', e);\n        }\n    }\n\n    function loadMenuCache() {\n        try {\n            const cached = localStorage.getItem(CACHE_KEY);\n            const cachedTs = localStorage.getItem(CACHE_TS_KEY);\n            if (cached) {\n                allWeeks = JSON.parse(cached);\n                currentWeekNumber = getISOWeek(new Date());\n                currentYear = new Date().getFullYear();\n                renderVisibleWeeks();\n                updateNextWeekBadge();\n                if (cachedTs) updateLastUpdatedTime(cachedTs);\n                console.log('Loaded menu from cache');\n                return true;\n            }\n        } catch (e) {\n            console.warn('Failed to load cached menu:', e);\n        }\n        return false;\n    }\n\n    // === Menu Data Fetching (Direct from Bessa API) ===\n    async function loadMenuDataFromAPI() {\n        const loading = document.getElementById('loading');\n        const progressModal = document.getElementById('progress-modal');\n        const progressFill = document.getElementById('progress-fill');\n        const progressPercent = document.getElementById('progress-percent');\n        const progressMessage = document.getElementById('progress-message');\n\n        loading.classList.remove('hidden');\n\n        const token = authToken || GUEST_TOKEN;\n\n        try {\n            // Show progress modal\n            progressModal.classList.remove('hidden');\n            progressMessage.textContent = 'Hole verf\u00fcgbare Daten...';\n            progressFill.style.width = '0%';\n            progressPercent.textContent = '0%';\n\n            // 1. Fetch available dates\n            const datesResponse = await fetch(`${API_BASE}/venues/${VENUE_ID}/menu/dates/`, {\n                headers: apiHeaders(token)\n            });\n\n            if (!datesResponse.ok) throw new Error(`Failed to fetch dates: ${datesResponse.status}`);\n\n            const datesData = await datesResponse.json();\n            let availableDates = datesData.results || [];\n\n            // Filter \u2013 last 7 days + future, limit 30\n            const cutoff = new Date();\n            cutoff.setDate(cutoff.getDate() - 7);\n            const cutoffStr = cutoff.toISOString().split('T')[0];\n\n            availableDates = availableDates\n                .filter(d => d.date >= cutoffStr)\n                .sort((a, b) => a.date.localeCompare(b.date))\n                .slice(0, 30);\n\n            const totalDates = availableDates.length;\n            progressMessage.textContent = `${totalDates} Tage gefunden. Lade Details...`;\n\n            // 2. Fetch details for each date\n            const allDays = [];\n            let completed = 0;\n\n            for (const dateObj of availableDates) {\n                const dateStr = dateObj.date;\n                const pct = Math.round(((completed + 1) / totalDates) * 100);\n                progressFill.style.width = `${pct}%`;\n                progressPercent.textContent = `${pct}%`;\n                progressMessage.textContent = `Lade Men\u00fc f\u00fcr ${dateStr}...`;\n\n                try {\n                    const detailResp = await fetch(`${API_BASE}/venues/${VENUE_ID}/menu/${MENU_ID}/${dateStr}/`, {\n                        headers: apiHeaders(token)\n                    });\n\n                    if (detailResp.ok) {\n                        const detailData = await detailResp.json();\n                        // Debug: log raw API response for first date\n                        if (completed === 0) {\n                            console.log('[Kantine Debug] Raw API response for', dateStr, ':', JSON.stringify(detailData).substring(0, 2000));\n                        }\n                        const menuGroups = detailData.results || [];\n                        let dayItems = [];\n                        for (const group of menuGroups) {\n                            if (group.items && Array.isArray(group.items)) {\n                                dayItems = dayItems.concat(group.items);\n                            }\n                        }\n                        if (dayItems.length > 0) {\n                            // Debug: log first item structure\n                            if (completed === 0) {\n                                console.log('[Kantine Debug] First item keys:', Object.keys(dayItems[0]));\n                                console.log('[Kantine Debug] First item:', JSON.stringify(dayItems[0]).substring(0, 500));\n                            }\n                            allDays.push({\n                                date: dateStr,\n                                menu_items: dayItems,\n                                orders: dateObj.orders || []\n                            });\n                        }\n                    }\n                } catch (err) {\n                    console.error(`Failed to fetch details for ${dateStr}:`, err);\n                }\n\n                completed++;\n                // Small delay to avoid rate limiting\n                await new Promise(r => setTimeout(r, 100));\n            }\n\n            // 3. Group by ISO week (Merge with existing to preserve past days)\n            const weeksMap = new Map();\n\n            // Hydrate from existing cache (preserve past data)\n            if (allWeeks && allWeeks.length > 0) {\n                allWeeks.forEach(w => {\n                    const key = `${w.year}-${w.weekNumber}`;\n                    try {\n                        weeksMap.set(key, {\n                            year: w.year,\n                            weekNumber: w.weekNumber,\n                            days: w.days ? w.days.map(d => ({ ...d, items: d.items ? [...d.items] : [] })) : []\n                        });\n                    } catch (e) { console.warn('Error hydrating week:', e); }\n                });\n            }\n\n            for (const day of allDays) {\n                const d = new Date(day.date);\n                const weekNum = getISOWeek(d);\n                const year = getWeekYear(d);\n                const key = `${year}-${weekNum}`;\n\n                if (!weeksMap.has(key)) {\n                    weeksMap.set(key, { year, weekNumber: weekNum, days: [] });\n                }\n\n                const weekObj = weeksMap.get(key);\n                const weekday = d.toLocaleDateString('en-US', { weekday: 'long' });\n                const orderCutoffDate = new Date(day.date);\n                orderCutoffDate.setHours(10, 0, 0, 0);\n\n                const newDayObj = {\n                    date: day.date,\n                    weekday: weekday,\n                    orderCutoff: orderCutoffDate.toISOString(),\n                    items: day.menu_items.map(item => {\n                        const isUnlimited = item.amount_tracking === false;\n                        const hasStock = parseInt(item.available_amount) > 0;\n                        return {\n                            id: `${day.date}_${item.id}`,\n                            articleId: item.id,\n                            name: item.name || 'Unknown',\n                            description: item.description || '',\n                            price: parseFloat(item.price) || 0,\n                            available: isUnlimited || hasStock,\n                            availableAmount: parseInt(item.available_amount) || 0,\n                            amountTracking: item.amount_tracking !== false\n                        };\n                    })\n                };\n\n                // Merge: Overwrite if exists, push if new\n                const existingIndex = weekObj.days.findIndex(existing => existing.date === day.date);\n                if (existingIndex >= 0) {\n                    weekObj.days[existingIndex] = newDayObj;\n                } else {\n                    weekObj.days.push(newDayObj);\n                }\n            }\n\n            // Sort weeks and days\n            allWeeks = Array.from(weeksMap.values()).sort((a, b) => {\n                if (a.year !== b.year) return a.year - b.year;\n                return a.weekNumber - b.weekNumber;\n            });\n            allWeeks.forEach(w => {\n                if (w.days) w.days.sort((a, b) => a.date.localeCompare(b.date));\n            });\n\n            // Save to localStorage cache\n            saveMenuCache();\n\n            // Update timestamp\n            updateLastUpdatedTime(new Date().toISOString());\n\n            currentWeekNumber = getISOWeek(new Date());\n            currentYear = new Date().getFullYear();\n\n\n\n            updateAuthUI(); // This will trigger fetchOrders if logged in\n            renderVisibleWeeks();\n            updateNextWeekBadge();\n\n            progressMessage.textContent = 'Fertig!';\n            setTimeout(() => progressModal.classList.add('hidden'), 500);\n\n        } catch (error) {\n            console.error('Error fetching menu:', error);\n            progressModal.classList.add('hidden');\n\n            showErrorModal(\n                'Keine Verbindung',\n                `Die Men\u00fcdaten konnten nicht geladen werden. M\u00f6glicherweise besteht keine Verbindung zur API oder zur Bessa-Webseite.<br><br><small style=\"color:var(--text-secondary)\">${error.message}</small>`,\n                'Zur Original-Seite',\n                'https://web.bessa.app/knapp-kantine'\n            );\n        } finally {\n            loading.classList.add('hidden');\n        }\n    }\n\n    // === Last Updated Display ===\n    function updateLastUpdatedTime(isoTimestamp) {\n        const subtitle = document.getElementById('last-updated-subtitle');\n        if (!isoTimestamp) return;\n        try {\n            const date = new Date(isoTimestamp);\n            const timeStr = date.toLocaleTimeString('de-DE', { hour: '2-digit', minute: '2-digit' });\n            const dateStr = date.toLocaleDateString('de-DE', { day: '2-digit', month: '2-digit' });\n            subtitle.textContent = `Aktualisiert: ${dateStr} ${timeStr}`;\n        } catch (e) {\n            subtitle.textContent = '';\n        }\n    }\n\n    // === Toast Notification ===\n    function showToast(message, type = 'info') {\n        let container = document.getElementById('toast-container');\n        if (!container) {\n            container = document.createElement('div');\n            container.id = 'toast-container';\n            document.body.appendChild(container);\n        }\n        const toast = document.createElement('div');\n        toast.className = `toast toast-${type}`;\n        const icon = type === 'success' ? 'check_circle' : type === 'error' ? 'error' : 'info';\n        toast.innerHTML = `<span class=\"material-icons-round\">${icon}</span><span>${message}</span>`;\n        container.appendChild(toast);\n        requestAnimationFrame(() => toast.classList.add('show'));\n        setTimeout(() => {\n            toast.classList.remove('show');\n            setTimeout(() => toast.remove(), 300);\n        }, 3000);\n    }\n\n    // === Next Week Badge ===\n    function updateNextWeekBadge() {\n        const btnNextWeek = document.getElementById('btn-next-week');\n        let nextWeek = currentWeekNumber + 1;\n        let nextYear = currentYear;\n        if (nextWeek > 52) { nextWeek = 1; nextYear++; }\n\n        const nextWeekData = allWeeks.find(w => w.weekNumber === nextWeek && w.year === nextYear);\n        let totalDataCount = 0;\n        let orderableCount = 0;\n        let daysWithOrders = 0;\n        let daysWithOrderableAndNoOrder = 0;\n\n        if (nextWeekData && nextWeekData.days) {\n            nextWeekData.days.forEach(day => {\n                if (day.items && day.items.length > 0) {\n                    totalDataCount++;\n                    const isOrderable = day.items.some(item => item.available);\n                    if (isOrderable) orderableCount++;\n\n                    let hasOrder = false;\n                    day.items.forEach(item => {\n                        const articleId = item.articleId || parseInt(item.id.split('_')[1]);\n                        const key = `${day.date}_${articleId}`;\n                        if (orderMap.has(key) && orderMap.get(key).length > 0) hasOrder = true;\n                    });\n\n                    if (hasOrder) daysWithOrders++;\n                    if (isOrderable && !hasOrder) daysWithOrderableAndNoOrder++;\n                }\n            });\n        }\n\n        let badge = btnNextWeek.querySelector('.nav-badge');\n        if (totalDataCount > 0) {\n            if (!badge) {\n                badge = document.createElement('span');\n                badge.className = 'nav-badge';\n                btnNextWeek.appendChild(badge);\n            }\n\n            // Format: ( Ordered / Orderable / Total )\n            badge.title = `${daysWithOrders} bestellt / ${orderableCount} bestellbar / ${totalDataCount} gesamt`;\n            badge.innerHTML = `<span class=\"ordered\">${daysWithOrders}</span><span class=\"separator\">/</span><span class=\"orderable\">${orderableCount}</span><span class=\"separator\">/</span><span class=\"total\">${totalDataCount}</span>`;\n\n            // Color Logic\n            badge.classList.remove('badge-violet', 'badge-green', 'badge-red', 'badge-blue');\n\n            // Refined Logic (v1.7.4):\n            // Violet: If we have orders AND there are no DAYS left that are orderable but un-ordered.\n            // (i.e. \"I have ordered everything I can\")\n            if (daysWithOrders > 0 && daysWithOrderableAndNoOrder === 0) {\n                badge.classList.add('badge-violet');\n            } else if (daysWithOrderableAndNoOrder > 0) {\n                badge.classList.add('badge-green'); // Orderable days exist without order\n            } else if (orderableCount === 0) {\n                badge.classList.add('badge-red'); // No orderable days at all & no orders\n            } else {\n                badge.classList.add('badge-blue'); // Default / partial state\n            }\n\n            // Advanced Feature: Highlight Count\n            let highlightCount = 0;\n            if (nextWeekData && nextWeekData.days) {\n                nextWeekData.days.forEach(day => {\n                    day.items.forEach(item => {\n                        if (checkHighlight(item.name) || checkHighlight(item.description)) {\n                            highlightCount++;\n                        }\n                    });\n                });\n            }\n\n            if (highlightCount > 0) {\n                // Append blue count\n                badge.innerHTML += `<span class=\"highlight-count\" title=\"${highlightCount} Highlight Men\u00fcs\">(${highlightCount})</span>`;\n                badge.title += ` \u2022 ${highlightCount} Highlights gefunden`;\n                badge.classList.add('has-highlights');\n            }\n\n        } else if (badge) {\n            badge.remove();\n        }\n    }\n\n    // === Weekly Cost ===\n    function updateWeeklyCost(days) {\n        let totalCost = 0;\n        if (days && days.length > 0) {\n            days.forEach(day => {\n                if (day.items) {\n                    day.items.forEach(item => {\n                        const articleId = item.articleId || parseInt(item.id.split('_')[1]);\n                        const key = `${day.date}_${articleId}`;\n                        const orders = orderMap.get(key) || [];\n                        if (orders.length > 0) totalCost += item.price * orders.length;\n                    });\n                }\n            });\n        }\n\n        const costDisplay = document.getElementById('weekly-cost-display');\n        if (totalCost > 0) {\n            costDisplay.innerHTML = `<span class=\"material-icons-round\">shopping_bag</span> <span>Gesamt: ${totalCost.toFixed(2).replace('.', ',')} \u20ac</span>`;\n            costDisplay.classList.remove('hidden');\n        } else {\n            costDisplay.classList.add('hidden');\n        }\n    }\n\n    // === Render Weeks ===\n    function renderVisibleWeeks() {\n        const menuContainer = document.getElementById('menu-container');\n        if (!menuContainer) return;\n        menuContainer.innerHTML = '';\n\n        let targetWeek = currentWeekNumber;\n        let targetYear = currentYear;\n\n        if (displayMode === 'next-week') {\n            targetWeek++;\n            if (targetWeek > 52) { targetWeek = 1; targetYear++; }\n        }\n\n        // Flatten & filter by week + year\n        const allDays = allWeeks.flatMap(w => w.days || []);\n        const daysInTargetWeek = allDays.filter(day => {\n            const d = new Date(day.date);\n            return getISOWeek(d) === targetWeek && getWeekYear(d) === targetYear;\n        });\n\n        if (daysInTargetWeek.length === 0) {\n            menuContainer.innerHTML = `\n                <div class=\"empty-state\">\n                    <p>Keine Men\u00fcdaten f\u00fcr KW ${targetWeek} (${targetYear}) verf\u00fcgbar.</p>\n                    <small>Versuchen Sie eine andere Woche oder schauen Sie sp\u00e4ter vorbei.</small>\n                </div>`;\n            document.getElementById('weekly-cost-display').classList.add('hidden');\n            return;\n        }\n\n        updateWeeklyCost(daysInTargetWeek);\n\n        // Update header\n        const headerWeekInfo = document.getElementById('header-week-info');\n        const weekTitle = displayMode === 'this-week' ? 'Diese Woche' : 'N\u00e4chste Woche';\n        headerWeekInfo.innerHTML = `\n            <div class=\"header-week-title\">${weekTitle}</div>\n            <div class=\"header-week-subtitle\">Week ${targetWeek} \u2022 ${targetYear}</div>`;\n\n        const grid = document.createElement('div');\n        grid.className = 'days-grid';\n\n        daysInTargetWeek.sort((a, b) => a.date.localeCompare(b.date));\n\n        // Filter weekends\n        const workingDays = daysInTargetWeek.filter(d => {\n            const date = new Date(d.date);\n            const day = date.getDay();\n            return day !== 0 && day !== 6;\n        });\n\n        workingDays.forEach(day => {\n            const card = createDayCard(day);\n            if (card) grid.appendChild(card);\n        });\n\n        menuContainer.appendChild(grid);\n        setTimeout(() => syncMenuItemHeights(grid), 0);\n    }\n\n    // === Sync Item Heights ===\n    function syncMenuItemHeights(grid) {\n        const cards = grid.querySelectorAll('.menu-card');\n        if (cards.length === 0) return;\n        let maxItems = 0;\n        cards.forEach(card => {\n            maxItems = Math.max(maxItems, card.querySelectorAll('.menu-item').length);\n        });\n        for (let i = 0; i < maxItems; i++) {\n            let maxHeight = 0;\n            const itemsAtPos = [];\n            cards.forEach(card => {\n                const items = card.querySelectorAll('.menu-item');\n                if (items[i]) {\n                    items[i].style.height = 'auto';\n                    maxHeight = Math.max(maxHeight, items[i].offsetHeight);\n                    itemsAtPos.push(items[i]);\n                }\n            });\n            itemsAtPos.forEach(item => { item.style.height = `${maxHeight}px`; });\n        }\n    }\n\n    // === Create Day Card ===\n    function createDayCard(day) {\n        if (!day.items || day.items.length === 0) return null;\n\n        const card = document.createElement('div');\n        card.className = 'menu-card';\n\n        const now = new Date();\n        const cardDate = new Date(day.date);\n\n        let isPastCutoff = false;\n        if (day.orderCutoff) {\n            isPastCutoff = now >= new Date(day.orderCutoff);\n        } else {\n            const today = new Date();\n            today.setHours(0, 0, 0, 0);\n            const cd = new Date(day.date);\n            cd.setHours(0, 0, 0, 0);\n            isPastCutoff = cd < today;\n        }\n\n        if (isPastCutoff) card.classList.add('past-day');\n\n        // Collect ordered menu codes\n        const menuBadges = [];\n        if (day.items) {\n            day.items.forEach(item => {\n                const articleId = item.articleId || parseInt(item.id.split('_')[1]);\n                const orderKey = `${day.date}_${articleId}`;\n                const orders = orderMap.get(orderKey) || [];\n                const count = orders.length;\n\n                if (count > 0) {\n                    // Regex for M1, M2, M1F etc.\n                    const match = item.name.match(/([M][1-9][Ff]?)/);\n                    if (match) {\n                        let code = match[1];\n                        if (count > 1) code += '+';\n                        menuBadges.push(code);\n                    }\n                }\n            });\n        }\n\n        // Header\n        const header = document.createElement('div');\n        header.className = 'card-header';\n        const dateStr = cardDate.toLocaleDateString('de-DE', { day: '2-digit', month: '2-digit' });\n\n        const badgesHtml = menuBadges.map(code => `<span class=\"menu-code-badge\">${code}</span>`).join('');\n\n        // Determine Day Status for Header Color\n        // Violet: Has Order\n        // Green: No Order but Orderable\n        // Red: No Order and Not Orderable (Locked/Sold Out)\n        let headerClass = '';\n        const hasAnyOrder = day.items && day.items.some(item => {\n            const articleId = item.articleId || parseInt(item.id.split('_')[1]);\n            const key = `${day.date}_${articleId}`;\n            return orderMap.has(key) && orderMap.get(key).length > 0;\n        });\n\n        const hasOrderable = day.items && day.items.some(item => {\n            // Use pre-calculated available flag from loadMenuDataFromAPI calculation\n            return item.available;\n        });\n\n        if (hasAnyOrder) {\n            headerClass = 'header-violet';\n        } else if (hasOrderable && !isPastCutoff) {\n            headerClass = 'header-green';\n        } else {\n            // Red if not orderable (or past cutoff)\n            headerClass = 'header-red';\n        }\n\n        if (headerClass) header.classList.add(headerClass);\n\n        header.innerHTML = `\n            <div class=\"day-header-left\">\n                <span class=\"day-name\">${translateDay(day.weekday)}</span>\n                <div class=\"day-badges\">${badgesHtml}</div>\n            </div>\n            <span class=\"day-date\">${dateStr}</span>`;\n        card.appendChild(header);\n\n        // Body\n        const body = document.createElement('div');\n        body.className = 'card-body';\n\n        const todayDateStr = new Date().toISOString().split('T')[0];\n        const isToday = day.date === todayDateStr;\n\n        const sortedItems = [...day.items].sort((a, b) => {\n            if (isToday) {\n                const aId = a.articleId || parseInt(a.id.split('_')[1]);\n                const bId = b.articleId || parseInt(b.id.split('_')[1]);\n                const aOrdered = orderMap.has(`${day.date}_${aId}`);\n                const bOrdered = orderMap.has(`${day.date}_${bId}`);\n\n                if (aOrdered && !bOrdered) return -1;\n                if (!aOrdered && bOrdered) return 1;\n            }\n            return a.name.localeCompare(b.name);\n        });\n\n        sortedItems.forEach(item => {\n            const itemEl = document.createElement('div');\n            itemEl.className = 'menu-item';\n\n            const articleId = item.articleId || parseInt(item.id.split('_')[1]);\n            const orderKey = `${day.date}_${articleId}`;\n            const orderIds = orderMap.get(orderKey) || [];\n            const orderCount = orderIds.length;\n\n            // Status badge\n            let statusBadge = '';\n            if (item.available) {\n                statusBadge = item.amountTracking\n                    ? `<span class=\"badge available\">Verf\u00fcgbar (${item.availableAmount})</span>`\n                    : `<span class=\"badge available\">Verf\u00fcgbar</span>`;\n            } else {\n                statusBadge = `<span class=\"badge sold-out\">Ausverkauft</span>`;\n            }\n\n            // Order badge\n            let orderedBadge = '';\n            if (orderCount > 0) {\n                const countBadge = orderCount > 1 ? `<span class=\"order-count-badge\">${orderCount}</span>` : '';\n                orderedBadge = `<span class=\"badge ordered\"><span class=\"material-icons-round\">check_circle</span> Bestellt${countBadge}</span>`;\n                itemEl.classList.add('ordered');\n                if (new Date(day.date).toDateString() === now.toDateString()) {\n                    itemEl.classList.add('today-ordered');\n                }\n            }\n\n            // Flagged styles\n            const flagId = `${day.date}_${articleId}`;\n            const isFlagged = userFlags.has(flagId);\n            if (isFlagged) {\n                itemEl.classList.add(item.available ? 'flagged-available' : 'flagged-sold-out');\n            }\n\n            // Action buttons\n            let orderButton = '';\n            let cancelButton = '';\n            let flagButton = '';\n\n            if (authToken && !isPastCutoff) {\n                // Flag button\n                const flagIcon = isFlagged ? 'notifications_active' : 'notifications_none';\n                const flagClass = isFlagged ? 'btn-flag active' : 'btn-flag';\n                const flagTitle = isFlagged ? 'Benachrichtigung deaktivieren' : 'Benachrichtigen wenn verf\u00fcgbar';\n                if (!item.available || isFlagged) {\n                    flagButton = `<button class=\"${flagClass}\" data-date=\"${day.date}\" data-article=\"${articleId}\" data-name=\"${escapeHtml(item.name)}\" data-cutoff=\"${day.orderCutoff}\" title=\"${flagTitle}\"><span class=\"material-icons-round\">${flagIcon}</span></button>`;\n                }\n\n                // Order button\n                if (item.available) {\n                    if (orderCount > 0) {\n                        orderButton = `<button class=\"btn-order btn-order-compact\" data-date=\"${day.date}\" data-article=\"${articleId}\" data-name=\"${escapeHtml(item.name)}\" data-price=\"${item.price}\" data-desc=\"${escapeHtml(item.description || '')}\" title=\"${escapeHtml(item.name)} nochmal bestellen\"><span class=\"material-icons-round\">add</span></button>`;\n                    } else {\n                        orderButton = `<button class=\"btn-order\" data-date=\"${day.date}\" data-article=\"${articleId}\" data-name=\"${escapeHtml(item.name)}\" data-price=\"${item.price}\" data-desc=\"${escapeHtml(item.description || '')}\" title=\"${escapeHtml(item.name)} bestellen\"><span class=\"material-icons-round\">add_shopping_cart</span> Bestellen</button>`;\n                    }\n                }\n\n                // Cancel button\n                if (orderCount > 0) {\n                    const cancelIcon = orderCount === 1 ? 'close' : 'remove';\n                    const cancelTitle = orderCount === 1 ? 'Bestellung stornieren' : 'Eine Bestellung stornieren';\n                    cancelButton = `<button class=\"btn-cancel\" data-date=\"${day.date}\" data-article=\"${articleId}\" data-name=\"${escapeHtml(item.name)}\" title=\"${cancelTitle}\"><span class=\"material-icons-round\">${cancelIcon}</span></button>`;\n                }\n            }\n\n            itemEl.innerHTML = `\n                <div class=\"item-header\">\n                    <span class=\"item-name\">${escapeHtml(item.name)}</span>\n                    <span class=\"item-price\">${item.price.toFixed(2)} \u20ac</span>\n                </div>\n                <div class=\"item-status-row\">\n                    ${orderedBadge}\n                    ${cancelButton}\n                    ${orderButton}\n                    ${flagButton}\n                    <div class=\"badges\">${statusBadge}</div>\n                </div>\n                <p class=\"item-desc\">${escapeHtml(item.description)}</p>`;\n\n            // Event: Order\n            const orderBtn = itemEl.querySelector('.btn-order');\n            if (orderBtn) {\n                orderBtn.addEventListener('click', (e) => {\n                    e.stopPropagation();\n                    const btn = e.currentTarget;\n                    btn.disabled = true;\n                    btn.classList.add('loading');\n                    placeOrder(btn.dataset.date, parseInt(btn.dataset.article), btn.dataset.name, parseFloat(btn.dataset.price), btn.dataset.desc || '')\n                        .finally(() => { btn.disabled = false; btn.classList.remove('loading'); });\n                });\n            }\n\n            // Event: Cancel\n            const cancelBtn = itemEl.querySelector('.btn-cancel');\n            if (cancelBtn) {\n                cancelBtn.addEventListener('click', (e) => {\n                    e.stopPropagation();\n                    const btn = e.currentTarget;\n                    btn.disabled = true;\n                    cancelOrder(btn.dataset.date, parseInt(btn.dataset.article), btn.dataset.name)\n                        .finally(() => { btn.disabled = false; });\n                });\n            }\n\n            // Event: Flag\n            const flagBtn = itemEl.querySelector('.btn-flag');\n            if (flagBtn) {\n                flagBtn.addEventListener('click', (e) => {\n                    e.stopPropagation();\n                    const btn = e.currentTarget;\n                    toggleFlag(btn.dataset.date, parseInt(btn.dataset.article), btn.dataset.name, btn.dataset.cutoff);\n                });\n            }\n\n            body.appendChild(itemEl);\n        });\n\n        card.appendChild(body);\n        return card;\n    }\n\n    // === Version Check ===\n    async function checkForUpdates() {\n        const CurrentVersion = 'v1.2.0';\n        const VersionUrl = 'https://raw.githubusercontent.com/TauNeutrino/kantine-overview/main/version.txt';\n        const InstallerUrl = 'https://htmlpreview.github.io/?https://github.com/TauNeutrino/kantine-overview/blob/main/dist/install.html';\n\n        console.log(`[Kantine] Checking for updates... (Current: ${CurrentVersion})`);\n\n        try {\n            const response = await fetch(VersionUrl, { cache: 'no-cache' });\n            if (!response.ok) return;\n\n            const remoteVersion = (await response.text()).trim();\n\n            if (remoteVersion && remoteVersion !== CurrentVersion) {\n                console.log(`[Kantine] New version available: ${remoteVersion}`);\n\n                // Fetch Changelog content\n                let changeSummary = '';\n                try {\n                    const clResp = await fetch('https://raw.githubusercontent.com/TauNeutrino/kantine-overview/main/changelog.md');\n                    if (clResp.ok) {\n                        const clText = await clResp.text();\n                        const match = clText.match(/## (v[^\\n]+)\\n((?:-[^\\n]+\\n)+)/);\n                        if (match && match[1].includes(remoteVersion)) {\n                            changeSummary = match[2].replace(/- /g, '\u2022 ').trim();\n                        }\n                    }\n                } catch (e) { console.warn('No changelog', e); }\n\n                // Create Banner\n                const updateBanner = document.createElement('div');\n                updateBanner.className = 'update-banner';\n                updateBanner.innerHTML = `\n                        <div class=\"update-content\">\n                            <strong>Update verf\u00fcgbar: ${remoteVersion}</strong>\n                            ${changeSummary ? `<pre class=\"change-summary\">${changeSummary}</pre>` : ''}\n                            <a href=\"${InstallerUrl}\" target=\"_blank\" class=\"update-link\">\n                                <span class=\"material-icons-round\">system_update_alt</span>\n                                Jetzt aktualisieren\n                            </a>\n                        </div>\n                        <button class=\"icon-btn-small close-update\">&times;</button>\n                    `;\n\n                document.body.appendChild(updateBanner);\n                updateBanner.querySelector('.close-update').addEventListener('click', () => updateBanner.remove());\n\n                // Highlight Header Icon\n                const lastUpdatedIcon = document.querySelector('.material-icons-round.logo-icon');\n                if (lastUpdatedIcon) {\n                    lastUpdatedIcon.style.color = 'var(--accent-color)';\n                    lastUpdatedIcon.parentElement.title = `Update verf\u00fcgbar: ${remoteVersion}`;\n                }\n            }\n        } catch (error) {\n            console.warn('[Kantine] Version check failed:', error);\n        }\n    }\n\n    // === Order Countdown ===\n    function updateCountdown() {\n        const now = new Date();\n        const currentDay = now.getDay();\n        // Skip weekends (0=Sun, 6=Sat)\n        if (currentDay === 0 || currentDay === 6) {\n            removeCountdown();\n            return;\n        }\n\n        const todayStr = now.toISOString().split('T')[0];\n\n        // 1. Check if we already ordered for today\n        let hasOrder = false;\n        // Optimization: Check orderMap for today's date\n        // Keys are \"YYYY-MM-DD_ArticleID\"\n        for (const key of orderMap.keys()) {\n            if (key.startsWith(todayStr)) {\n                hasOrder = true;\n                break;\n            }\n        }\n\n        if (hasOrder) {\n            removeCountdown();\n            return;\n        }\n\n        // 2. Calculate time to cutoff (10:00 AM)\n        const cutoff = new Date();\n        cutoff.setHours(10, 0, 0, 0);\n\n        const diff = cutoff - now;\n\n        // If passed cutoff or more than 3 hours away (e.g. 07:00), maybe don't show?\n        // User req: \"heute noch keine bestellung... countdown erscheinen\"\n        // Let's show it if within valid order window (e.g. 00:00 - 10:00)\n\n        if (diff <= 0) {\n            removeCountdown();\n            return;\n        }\n\n        // 3. Render Countdown\n        const diffHrs = Math.floor(diff / 3600000);\n        const diffMins = Math.floor((diff % 3600000) / 60000);\n\n        const headerCenter = document.querySelector('.header-center-wrapper');\n        if (!headerCenter) return;\n\n        let countdownEl = document.getElementById('order-countdown');\n        if (!countdownEl) {\n            countdownEl = document.createElement('div');\n            countdownEl.id = 'order-countdown';\n            // Insert before cost display or append\n            headerCenter.insertBefore(countdownEl, headerCenter.firstChild);\n        }\n\n        countdownEl.innerHTML = `<span>Bestellschluss:</span> <strong>${diffHrs}h ${diffMins}m</strong>`;\n\n        // Red Alert if < 1 hour\n        if (diff < 3600000) { // 1 hour\n            countdownEl.classList.add('urgent');\n\n            // Notification logic (One time)\n            const notifiedKey = `kantine_notified_${todayStr}`;\n            if (!sessionStorage.getItem(notifiedKey)) {\n                if (Notification.permission === 'granted') {\n                    new Notification('Kantine: Bestellschluss naht!', {\n                        body: 'Du hast heute noch nichts bestellt. Nur noch 1 Stunde!',\n                        icon: '\u23f3'\n                    });\n                } else if (Notification.permission === 'default') {\n                    Notification.requestPermission();\n                }\n                sessionStorage.setItem(notifiedKey, 'true');\n            }\n        } else {\n            countdownEl.classList.remove('urgent');\n        }\n    }\n\n    function removeCountdown() {\n        const el = document.getElementById('order-countdown');\n        if (el) el.remove();\n    }\n\n    // Update countdown every minute\n    setInterval(updateCountdown, 60000);\n    // Also update on load\n    setTimeout(updateCountdown, 1000);\n\n    // === Helpers === \n    function getISOWeek(date) {\n        const d = new Date(Date.UTC(date.getFullYear(), date.getMonth(), date.getDate()));\n        const dayNum = d.getUTCDay() || 7;\n        d.setUTCDate(d.getUTCDate() + 4 - dayNum);\n        const yearStart = new Date(Date.UTC(d.getUTCFullYear(), 0, 1));\n        return Math.ceil(((d - yearStart) / 86400000 + 1) / 7);\n    }\n\n    function getWeekYear(d) {\n        const date = new Date(d.getTime());\n        date.setDate(date.getDate() + 3 - (date.getDay() + 6) % 7);\n        return date.getFullYear();\n    }\n\n\n    function translateDay(englishDay) {\n        const map = { Monday: 'Montag', Tuesday: 'Dienstag', Wednesday: 'Mittwoch', Thursday: 'Donnerstag', Friday: 'Freitag', Saturday: 'Samstag', Sunday: 'Sonntag' };\n        return map[englishDay] || englishDay;\n    }\n\n    function escapeHtml(text) {\n        const div = document.createElement('div');\n        div.textContent = text || '';\n        return div.innerHTML;\n    }\n\n    // === Bootstrap ===\n    injectUI();\n    bindEvents();\n    updateAuthUI();\n    cleanupExpiredFlags();\n\n    // Load cached data first for instant UI, then refresh from API\n    const hadCache = loadMenuCache();\n    if (hadCache) {\n        // Hide loading spinner since cache is shown\n        document.getElementById('loading').classList.add('hidden');\n    }\n    loadMenuDataFromAPI();\n\n    // Auto-start polling if already logged in\n    if (authToken) {\n        startPolling();\n    }\n\n    // Check for updates\n    checkForUpdates();\n\n    console.log('Kantine Wrapper loaded \u2705');\n})();\n\n// === Error Modal ===\nfunction showErrorModal(title, htmlContent, btnText, url) {\n    const modalId = 'error-modal';\n    let modal = document.getElementById(modalId);\n    if (modal) modal.remove();\n\n    modal = document.createElement('div');\n    modal.id = modalId;\n    modal.className = 'modal hidden';\n    modal.innerHTML = `\n            <div class=\"modal-content\">\n                <div class=\"modal-header\">\n                    <h2 style=\"color: var(--error-color); display: flex; align-items: center; gap: 10px;\">\n                        <span class=\"material-icons-round\">signal_wifi_off</span>\n                        ${title}\n                    </h2>\n                </div>\n                <div style=\"padding: 20px;\">\n                    <p style=\"margin-bottom: 15px; color: var(--text-primary);\">${htmlContent}</p>\n                    <div style=\"margin-top: 20px; display: flex; justify-content: center;\">\n                        <button id=\"btn-error-redirect\" style=\"\n                            background-color: var(--accent-color); \n                            color: white; \n                            padding: 12px 24px; \n                            border-radius: 8px; \n                            border: none; \n                            font-weight: 600; \n                            cursor: pointer;\n                            display: flex;\n                            align-items: center;\n                            gap: 8px;\n                            width: 100%;\n                            justify-content: center;\n                            transition: transform 0.1s;\n                        \">\n                            ${btnText}\n                            <span class=\"material-icons-round\">open_in_new</span>\n                        </button>\n                    </div>\n                </div>\n            </div>\n        `;\n    document.body.appendChild(modal);\n\n    document.getElementById('btn-error-redirect').addEventListener('click', () => {\n        window.location.href = url;\n    });\n\n    requestAnimationFrame(() => {\n        modal.classList.remove('hidden');\n    });\n}\n";
+sc.textContent="/**\n * Kantine Wrapper \u2013 Client-Only Bookmarklet\n * Replaces Bessa page content with enhanced weekly menu view.\n * All API calls go directly to api.bessa.app (same origin).\n * Data stored in localStorage (flags, theme, auth).\n */\n(function () {\n    'use strict';\n\n    // Prevent double injection\n    if (window.__KANTINE_LOADED) return;\n    window.__KANTINE_LOADED = true;\n\n    // === Constants ===\n    const API_BASE = 'https://api.bessa.app/v1';\n    const GUEST_TOKEN = 'c3418725e95a9f90e3645cbc846b4d67c7c66131';\n    const CLIENT_VERSION = '1.7.0_prod/2026-01-26';\n    const VENUE_ID = 591;\n    const MENU_ID = 7;\n    const POLL_INTERVAL_MS = 5 * 60 * 1000; // 5 minutes\n\n    // === State ===\n    let allWeeks = [];\n    let currentWeekNumber = getISOWeek(new Date());\n    let currentYear = new Date().getFullYear();\n    let displayMode = 'this-week';\n    let authToken = sessionStorage.getItem('kantine_authToken');\n    let currentUser = sessionStorage.getItem('kantine_currentUser');\n    let orderMap = new Map();\n    let userFlags = new Set(JSON.parse(localStorage.getItem('kantine_flags') || '[]'));\n    let pollIntervalId = null;\n\n    // === API Helpers ===\n    function apiHeaders(token) {\n        return {\n            'Authorization': `Token ${token || GUEST_TOKEN}`,\n            'Accept': 'application/json',\n            'Content-Type': 'application/json',\n            'X-Client-Version': CLIENT_VERSION\n        };\n    }\n\n    // === Inject UI ===\n    function injectUI() {\n        // Replace entire page content\n        document.title = 'Kantine Weekly Menu';\n\n        // Inject Google Fonts if not already present\n        if (!document.querySelector('link[href*=\"fonts.googleapis.com/css2?family=Inter\"]')) {\n            const fontLink = document.createElement('link');\n            fontLink.rel = 'stylesheet';\n            fontLink.href = 'https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap';\n            document.head.appendChild(fontLink);\n        }\n        if (!document.querySelector('link[href*=\"Material+Icons+Round\"]')) {\n            const iconLink = document.createElement('link');\n            iconLink.rel = 'stylesheet';\n            iconLink.href = 'https://fonts.googleapis.com/icon?family=Material+Icons+Round';\n            document.head.appendChild(iconLink);\n        }\n\n        document.body.innerHTML = `\n        <div id=\"kantine-wrapper\">\n            <header class=\"app-header\">\n                <div class=\"header-content\">\n                    <div class=\"brand\">\n                        <span class=\"material-icons-round logo-icon\">restaurant_menu</span>\n                        <div class=\"header-left\">\n                            <h1>Kantinen \u00dcbersicht <small style=\"font-size: 0.6em; opacity: 0.7; font-weight: 400;\">v1.2.1</small></h1>\n                            <div id=\"last-updated-subtitle\" class=\"subtitle\"></div>\n                        </div>\n                    </div>\n                    <div class=\"header-center-wrapper\">\n                        <div id=\"header-week-info\" class=\"header-week-info\"></div>\n                        <div id=\"weekly-cost-display\" class=\"weekly-cost hidden\"></div>\n                    </div>\n                    <div class=\"controls\">\n                        <button id=\"btn-refresh\" class=\"icon-btn\" aria-label=\"Men\u00fcdaten aktualisieren\" title=\"Men\u00fcdaten neu laden\">\n                            <span class=\"material-icons-round\">refresh</span>\n                        </button>\n                        <button id=\"btn-highlights\" class=\"icon-btn\" aria-label=\"Pers\u00f6nliche Highlights verwalten\" title=\"Pers\u00f6nliche Highlights verwalten\">\n                            <span class=\"material-icons-round\">label</span>\n                        </button>\n                        <div class=\"nav-group\">\n                            <button id=\"btn-this-week\" class=\"nav-btn active\">Diese Woche</button>\n                            <button id=\"btn-next-week\" class=\"nav-btn\">N\u00e4chste Woche</button>\n                        </div>\n                        <button id=\"theme-toggle\" class=\"icon-btn\" aria-label=\"Toggle Theme\">\n                            <span class=\"material-icons-round theme-icon\">light_mode</span>\n                        </button>\n                        <button id=\"btn-login-open\" class=\"user-badge-btn icon-btn-small\">\n                            <span class=\"material-icons-round\">login</span>\n                            <span>Anmelden</span>\n                        </button>\n                        <div id=\"user-info\" class=\"user-badge hidden\">\n                            <span class=\"material-icons-round\">person</span>\n                            <span id=\"user-id-display\"></span>\n                            <button id=\"btn-logout\" class=\"icon-btn-small\" aria-label=\"Logout\">\n                                <span class=\"material-icons-round\">logout</span>\n                            </button>\n                        </div>\n                    </div>\n                </div>\n            </header>\n\n            <div id=\"login-modal\" class=\"modal hidden\">\n                <div class=\"modal-content\">\n                    <div class=\"modal-header\">\n                        <h2>Login</h2>\n                        <button id=\"btn-login-close\" class=\"icon-btn\" aria-label=\"Close\">\n                            <span class=\"material-icons-round\">close</span>\n                        </button>\n                    </div>\n                    <form id=\"login-form\">\n                        <div class=\"form-group\">\n                            <label for=\"employee-id\">Mitarbeiternummer</label>\n                            <input type=\"text\" id=\"employee-id\" name=\"employee-id\" placeholder=\"z.B. 2041\" required>\n                            <small class=\"help-text\">Deine offizielle Knapp Mitarbeiternummer.</small>\n                        </div>\n                        <div class=\"form-group\">\n                            <label for=\"password\">Passwort</label>\n                            <input type=\"password\" id=\"password\" name=\"password\" placeholder=\"Bessa Passwort\" required>\n                            <small class=\"help-text\">Das Passwort f\u00fcr deinen Bessa Account.</small>\n                        </div>\n                        <div id=\"login-error\" class=\"error-msg hidden\"></div>\n                        <div class=\"modal-actions\">\n                            <button type=\"submit\" class=\"btn-primary wide\">Einloggen</button>\n                        </div>\n                    </form>\n                </div>\n            </div>\n\n            <div id=\"progress-modal\" class=\"modal hidden\">\n                <div class=\"modal-content\">\n                    <div class=\"modal-header\">\n                        <h2>Men\u00fcdaten aktualisieren</h2>\n                    </div>\n                    <div class=\"modal-body\" style=\"padding: 20px;\">\n                        <div class=\"progress-container\">\n                            <div class=\"progress-bar\">\n                                <div id=\"progress-fill\" class=\"progress-fill\"></div>\n                            </div>\n                            <div id=\"progress-percent\" class=\"progress-percent\">0%</div>\n                        </div>\n                        <p id=\"progress-message\" class=\"progress-message\">Initialisierung...</p>\n                    </div>\n                </div>\n            </div>\n\n            <div id=\"highlights-modal\" class=\"modal hidden\">\n                <div class=\"modal-content\">\n                    <div class=\"modal-header\">\n                        <h2>Meine Highlights</h2>\n                        <button id=\"btn-highlights-close\" class=\"icon-btn\" aria-label=\"Close\">\n                            <span class=\"material-icons-round\">close</span>\n                        </button>\n                    </div>\n                    <div class=\"modal-body\">\n                        <p style=\"margin-bottom: 1rem; color: var(--text-secondary);\">\n                            Markiere Men\u00fcs automatisch, wenn sie diese Schlagw\u00f6rter enthalten.\n                        </p>\n                        <div class=\"input-group\">\n                            <input type=\"text\" id=\"tag-input\" placeholder=\"z.B. Schnitzel, Vegetarisch...\">\n                            <button id=\"btn-add-tag\" class=\"btn-primary\">Hinzuf\u00fcgen</button>\n                        </div>\n                        <div id=\"tags-list\"></div>\n                    </div>\n                </div>\n            </div>\n\n            <main class=\"container\">\n                <div id=\"last-updated-banner\" class=\"banner hidden\">\n                    <span class=\"material-icons-round\">update</span>\n                    <span id=\"last-updated-text\">Gerade aktualisiert</span>\n                </div>\n                <div id=\"loading\" class=\"loading-state\">\n                    <div class=\"spinner\"></div>\n                    <p>Lade Men\u00fcdaten...</p>\n                </div>\n                <div id=\"menu-container\" class=\"menu-grid\"></div>\n            </main>\n\n            <footer class=\"app-footer\">\n                <p>Bessa Knapp-Kantine Wrapper &bull; <span id=\"current-year\">${new Date().getFullYear()}</span></p>\n            </footer>\n        </div>`;\n    }\n\n    // === Bind Events ===\n    function bindEvents() {\n        const btnThisWeek = document.getElementById('btn-this-week');\n        const btnNextWeek = document.getElementById('btn-next-week');\n        const btnRefresh = document.getElementById('btn-refresh');\n        const themeToggle = document.getElementById('theme-toggle');\n        const btnLoginOpen = document.getElementById('btn-login-open');\n        const btnLoginClose = document.getElementById('btn-login-close');\n        const btnLogout = document.getElementById('btn-logout');\n        const loginForm = document.getElementById('login-form');\n        const loginModal = document.getElementById('login-modal');\n\n        // Highlights Modal\n        const btnHighlights = document.getElementById('btn-highlights');\n        const highlightsModal = document.getElementById('highlights-modal');\n        const btnHighlightsClose = document.getElementById('btn-highlights-close');\n        const btnAddTag = document.getElementById('btn-add-tag');\n        const tagInput = document.getElementById('tag-input');\n\n        btnHighlights.addEventListener('click', () => {\n            highlightsModal.classList.remove('hidden');\n            renderTagsList();\n            tagInput.focus();\n        });\n\n        btnHighlightsClose.addEventListener('click', () => {\n            highlightsModal.classList.add('hidden');\n        });\n\n        window.addEventListener('click', (e) => {\n            if (e.target === highlightsModal) highlightsModal.classList.add('hidden');\n        });\n\n        btnAddTag.addEventListener('click', () => {\n            const tag = tagInput.value;\n            if (addHighlightTag(tag)) {\n                tagInput.value = '';\n                renderTagsList();\n            }\n        });\n\n        tagInput.addEventListener('keypress', (e) => {\n            if (e.key === 'Enter') {\n                btnAddTag.click();\n            }\n        });\n\n        // Theme\n        const savedTheme = localStorage.getItem('theme');\n        const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;\n        const themeIcon = themeToggle.querySelector('.theme-icon');\n\n        if (savedTheme === 'dark' || (!savedTheme && prefersDark)) {\n            document.documentElement.setAttribute('data-theme', 'dark');\n            themeIcon.textContent = 'dark_mode';\n        } else {\n            document.documentElement.setAttribute('data-theme', 'light');\n            themeIcon.textContent = 'light_mode';\n        }\n\n        themeToggle.addEventListener('click', () => {\n            const current = document.documentElement.getAttribute('data-theme');\n            const next = current === 'dark' ? 'light' : 'dark';\n            document.documentElement.setAttribute('data-theme', next);\n            localStorage.setItem('theme', next);\n            themeIcon.textContent = next === 'dark' ? 'dark_mode' : 'light_mode';\n        });\n\n        // Navigation\n        btnThisWeek.addEventListener('click', () => {\n            if (displayMode !== 'this-week') {\n                displayMode = 'this-week';\n                btnThisWeek.classList.add('active');\n                btnNextWeek.classList.remove('active');\n                renderVisibleWeeks();\n            }\n        });\n\n        btnNextWeek.addEventListener('click', () => {\n            if (displayMode !== 'next-week') {\n                displayMode = 'next-week';\n                btnNextWeek.classList.add('active');\n                btnThisWeek.classList.remove('active');\n                renderVisibleWeeks();\n            }\n        });\n\n        // Refresh \u2013 fetch fresh data from Bessa API\n        btnRefresh.addEventListener('click', () => {\n            if (!authToken) {\n                loginModal.classList.remove('hidden');\n                return;\n            }\n            loadMenuDataFromAPI();\n        });\n\n        // Login Modal\n        btnLoginOpen.addEventListener('click', () => {\n            loginModal.classList.remove('hidden');\n            document.getElementById('login-error').classList.add('hidden');\n            loginForm.reset();\n        });\n\n        btnLoginClose.addEventListener('click', () => {\n            loginModal.classList.add('hidden');\n        });\n\n        window.addEventListener('click', (e) => {\n            if (e.target === loginModal) loginModal.classList.add('hidden');\n        });\n\n        // Login Form Submit\n        loginForm.addEventListener('submit', async (e) => {\n            e.preventDefault();\n            const employeeId = document.getElementById('employee-id').value.trim();\n            const password = document.getElementById('password').value;\n            const loginError = document.getElementById('login-error');\n            const submitBtn = loginForm.querySelector('button[type=\"submit\"]');\n            const originalText = submitBtn.textContent;\n\n            submitBtn.disabled = true;\n            submitBtn.textContent = 'Wird eingeloggt...';\n\n            try {\n                const email = `knapp-${employeeId}@bessa.app`;\n                const response = await fetch(`${API_BASE}/auth/login/`, {\n                    method: 'POST',\n                    headers: apiHeaders(GUEST_TOKEN),\n                    body: JSON.stringify({ email, password })\n                });\n\n                const data = await response.json();\n\n                if (response.ok) {\n                    authToken = data.key;\n                    currentUser = employeeId;\n                    sessionStorage.setItem('kantine_authToken', data.key);\n                    sessionStorage.setItem('kantine_currentUser', employeeId);\n\n                    // Fetch user name\n                    try {\n                        const userResp = await fetch(`${API_BASE}/auth/user/`, {\n                            headers: apiHeaders(authToken)\n                        });\n                        if (userResp.ok) {\n                            const userData = await userResp.json();\n                            if (userData.first_name) sessionStorage.setItem('kantine_firstName', userData.first_name);\n                            if (userData.last_name) sessionStorage.setItem('kantine_lastName', userData.last_name);\n                        }\n                    } catch (err) {\n                        console.error('Failed to fetch user info:', err);\n                    }\n\n                    updateAuthUI();\n                    loginModal.classList.add('hidden');\n                    fetchOrders();\n                    loginForm.reset();\n                    startPolling();\n\n                    // Reload menu data with auth for full details\n                    loadMenuDataFromAPI();\n                } else {\n                    loginError.textContent = data.non_field_errors?.[0] || data.error || 'Login fehlgeschlagen';\n                    loginError.classList.remove('hidden');\n                }\n            } catch (error) {\n                console.error('Login error:', error);\n                loginError.textContent = 'Ein Fehler ist aufgetreten';\n                loginError.classList.remove('hidden');\n            } finally {\n                submitBtn.disabled = false;\n                submitBtn.textContent = originalText;\n            }\n        });\n\n        // Logout\n        btnLogout.addEventListener('click', () => {\n            sessionStorage.removeItem('kantine_authToken');\n            sessionStorage.removeItem('kantine_currentUser');\n            sessionStorage.removeItem('kantine_firstName');\n            sessionStorage.removeItem('kantine_lastName');\n            authToken = null;\n            currentUser = null;\n            orderMap = new Map();\n            stopPolling();\n            updateAuthUI();\n            renderVisibleWeeks();\n        });\n    }\n\n    // === Auth UI ===\n    function updateAuthUI() {\n        // Try to recover session from Bessa's storage if not already logged in\n        if (!authToken) {\n            try {\n                const akita = localStorage.getItem('AkitaStores');\n                if (akita) {\n                    const parsed = JSON.parse(akita);\n                    if (parsed.auth && parsed.auth.token) {\n                        console.log('Found existing Bessa session!');\n                        authToken = parsed.auth.token;\n                        sessionStorage.setItem('kantine_authToken', authToken);\n\n                        if (parsed.auth.user) {\n                            currentUser = parsed.auth.user.id || 'unknown';\n                            sessionStorage.setItem('kantine_currentUser', currentUser);\n                            if (parsed.auth.user.firstName) sessionStorage.setItem('kantine_firstName', parsed.auth.user.firstName);\n                            if (parsed.auth.user.lastName) sessionStorage.setItem('kantine_lastName', parsed.auth.user.lastName);\n                        }\n                    }\n                }\n            } catch (e) {\n                console.warn('Failed to parse AkitaStores:', e);\n            }\n        }\n\n        authToken = sessionStorage.getItem('kantine_authToken');\n        currentUser = sessionStorage.getItem('kantine_currentUser');\n        const firstName = sessionStorage.getItem('kantine_firstName');\n        const btnLoginOpen = document.getElementById('btn-login-open');\n        const userInfo = document.getElementById('user-info');\n        const userIdDisplay = document.getElementById('user-id-display');\n\n        if (authToken) {\n            btnLoginOpen.classList.add('hidden');\n            userInfo.classList.remove('hidden');\n            userIdDisplay.textContent = firstName || (currentUser ? `User ${currentUser}` : 'Angemeldet');\n            fetchOrders(); // Always fetch fresh orders on auth update\n        } else {\n            btnLoginOpen.classList.remove('hidden');\n            userInfo.classList.add('hidden');\n            userIdDisplay.textContent = '';\n        }\n\n        renderVisibleWeeks();\n    }\n\n    // === Fetch Orders from Bessa ===\n    async function fetchOrders() {\n        if (!authToken) return;\n        try {\n            // Use user/orders endpoint for reliable history\n            const response = await fetch(`${API_BASE}/user/orders/?venue=${VENUE_ID}&ordering=-created&limit=50`, {\n                headers: apiHeaders(authToken)\n            });\n            const data = await response.json();\n\n            if (response.ok) {\n                orderMap = new Map();\n                const results = data.results || [];\n\n                for (const order of results) {\n                    // Filter out cancelled orders (State 9)\n                    // Accepting State 1 (Created?), 5 (Placed?), 8 (Completed)\n                    // TODO: Verify exact states. Subagent saw 5=Active, 8=Completed, 9=Cancelled.\n                    if (order.order_state === 9) continue;\n\n                    // Extract date properly (it comes as ISO string)\n                    const orderDate = order.date.split('T')[0];\n\n                    for (const item of (order.items || [])) {\n                        const key = `${orderDate}_${item.article}`;\n                        if (!orderMap.has(key)) orderMap.set(key, []);\n                        orderMap.get(key).push(order.id);\n                    }\n                }\n                console.log(`Fetched ${results.length} orders, mapped active ones.`);\n                renderVisibleWeeks();\n            }\n        } catch (error) {\n            console.error('Error fetching orders:', error);\n        }\n    }\n\n    // === Place Order ===\n    async function placeOrder(date, articleId, name, price, description) {\n        if (!authToken) return;\n        try {\n            // Get user data for customer object\n            const userResp = await fetch(`${API_BASE}/auth/user/`, {\n                headers: apiHeaders(authToken)\n            });\n            if (!userResp.ok) {\n                showToast('Fehler: Benutzerdaten konnten nicht geladen werden', 'error');\n                return;\n            }\n            const userData = await userResp.json();\n            const now = new Date().toISOString();\n\n            const orderPayload = {\n                uuid: crypto.randomUUID(),\n                created: now,\n                updated: now,\n                order_type: 7,\n                items: [{\n                    article: articleId,\n                    course_group: null,\n                    modifiers: [],\n                    uuid: crypto.randomUUID(),\n                    name: name,\n                    description: description || '',\n                    price: String(parseFloat(price)),\n                    amount: 1,\n                    vat: '10.00',\n                    comment: ''\n                }],\n                table: null,\n                total: parseFloat(price),\n                tip: 0,\n                currency: 'EUR',\n                venue: VENUE_ID,\n                states: [],\n                order_state: 1,\n                date: `${date}T10:00:00.000Z`,\n                payment_method: 'payroll',\n                customer: {\n                    first_name: userData.first_name,\n                    last_name: userData.last_name,\n                    email: userData.email,\n                    newsletter: false\n                },\n                preorder: false,\n                delivery_fee: 0,\n                cash_box_table_name: null,\n                take_away: false\n            };\n\n            const response = await fetch(`${API_BASE}/user/orders/`, {\n                method: 'POST',\n                headers: apiHeaders(authToken),\n                body: JSON.stringify(orderPayload)\n            });\n\n            if (response.ok || response.status === 201) {\n                showToast(`Bestellt: ${name}`, 'success');\n                await fetchOrders();\n            } else {\n                const data = await response.json();\n                showToast(`Fehler: ${data.detail || data.non_field_errors?.[0] || 'Bestellung fehlgeschlagen'}`, 'error');\n            }\n        } catch (error) {\n            console.error('Order error:', error);\n            showToast('Netzwerkfehler bei Bestellung', 'error');\n        }\n    }\n\n    // === Cancel Order ===\n    async function cancelOrder(date, articleId, name) {\n        if (!authToken) return;\n        const key = `${date}_${articleId}`;\n        const orderIds = orderMap.get(key);\n        if (!orderIds || orderIds.length === 0) return;\n\n        // LIFO: cancel most recent\n        const orderId = orderIds[orderIds.length - 1];\n        try {\n            const response = await fetch(`${API_BASE}/user/orders/${orderId}/cancel/`, {\n                method: 'PATCH',\n                headers: apiHeaders(authToken),\n                body: JSON.stringify({})\n            });\n\n            if (response.ok) {\n                showToast(`Storniert: ${name}`, 'success');\n                await fetchOrders();\n            } else {\n                const data = await response.json();\n                showToast(`Fehler: ${data.detail || 'Stornierung fehlgeschlagen'}`, 'error');\n            }\n        } catch (error) {\n            console.error('Cancel error:', error);\n            showToast('Netzwerkfehler bei Stornierung', 'error');\n        }\n    }\n\n    // === Flag Management (localStorage) ===\n    function saveFlags() {\n        localStorage.setItem('kantine_flags', JSON.stringify([...userFlags]));\n    }\n\n    function toggleFlag(date, articleId, name, cutoff) {\n        const id = `${date}_${articleId}`;\n        if (userFlags.has(id)) {\n            userFlags.delete(id);\n            showToast(`Flag entfernt f\u00fcr ${name}`, 'success');\n        } else {\n            userFlags.add(id);\n            showToast(`Benachrichtigung aktiviert f\u00fcr ${name}`, 'success');\n            if (Notification.permission === 'default') {\n                Notification.requestPermission();\n            }\n        }\n        saveFlags();\n        renderVisibleWeeks();\n    }\n\n    // FR-019: Auto-remove flags whose cutoff has passed\n    function cleanupExpiredFlags() {\n        const now = new Date();\n        let changed = false;\n        for (const flagId of [...userFlags]) {\n            const [date] = flagId.split('_');\n            const cutoff = new Date(date);\n            cutoff.setHours(10, 0, 0, 0); // Standard cutoff 10:00\n            if (now >= cutoff) {\n                userFlags.delete(flagId);\n                changed = true;\n            }\n        }\n        if (changed) saveFlags();\n    }\n\n    // === Polling (Client-Side) ===\n    function startPolling() {\n        if (pollIntervalId) return;\n        if (!authToken) return;\n        pollIntervalId = setInterval(() => pollFlaggedItems(), POLL_INTERVAL_MS);\n        console.log('Polling started (every 5 min)');\n    }\n\n    function stopPolling() {\n        if (pollIntervalId) {\n            clearInterval(pollIntervalId);\n            pollIntervalId = null;\n            console.log('Polling stopped');\n        }\n    }\n\n    async function pollFlaggedItems() {\n        if (userFlags.size === 0 || !authToken) return;\n        console.log(`Polling ${userFlags.size} flagged items...`);\n\n        for (const flagId of userFlags) {\n            const [date, articleIdStr] = flagId.split('_');\n            const articleId = parseInt(articleIdStr);\n\n            try {\n                const response = await fetch(`${API_BASE}/venues/${VENUE_ID}/menu/${MENU_ID}/${date}/`, {\n                    headers: apiHeaders(authToken)\n                });\n                if (!response.ok) continue;\n\n                const data = await response.json();\n                const groups = data.results || [];\n                let foundItem = null;\n                for (const group of groups) {\n                    if (group.items) {\n                        foundItem = group.items.find(i => i.id === articleId || i.article === articleId);\n                        if (foundItem) break;\n                    }\n                }\n\n                if (foundItem) {\n                    const isAvailable = (foundItem.amount_tracking === false) || (parseInt(foundItem.available_amount) > 0);\n                    if (isAvailable) {\n                        const itemName = foundItem.name || 'Unbekannt';\n                        showToast(`${itemName} ist jetzt verf\u00fcgbar!`, 'success');\n                        if (Notification.permission === 'granted') {\n                            new Notification('Kantine Wrapper', {\n                                body: `${itemName} ist jetzt verf\u00fcgbar!`,\n                                icon: '\ud83c\udf7d\ufe0f'\n                            });\n                        }\n                        // Refresh menu data to update UI\n                        loadMenuDataFromAPI();\n                    }\n                }\n            } catch (err) {\n                console.error(`Poll error for ${flagId}:`, err);\n                // Small delay between checks\n                await new Promise(r => setTimeout(r, 200));\n            }\n        }\n    }\n\n    // === Highlight Management ===\n    let highlightTags = JSON.parse(localStorage.getItem('kantine_highlightTags') || '[]');\n\n    function saveHighlightTags() {\n        localStorage.setItem('kantine_highlightTags', JSON.stringify(highlightTags));\n        renderVisibleWeeks(); // Refresh UI to apply changes\n        updateNextWeekBadge();\n    }\n\n    function addHighlightTag(tag) {\n        tag = tag.trim().toLowerCase();\n        if (tag && !highlightTags.includes(tag)) {\n            highlightTags.push(tag);\n            saveHighlightTags();\n            return true;\n        }\n        return false;\n    }\n\n    function removeHighlightTag(tag) {\n        highlightTags = highlightTags.filter(t => t !== tag);\n        saveHighlightTags();\n    }\n\n    function renderTagsList() {\n        const list = document.getElementById('tags-list');\n        list.innerHTML = '';\n        highlightTags.forEach(tag => {\n            const badge = document.createElement('span');\n            badge.className = 'tag-badge';\n            badge.innerHTML = `${tag} <span class=\"tag-remove\" data-tag=\"${tag}\">&times;</span>`;\n            list.appendChild(badge);\n        });\n\n        // Bind remove events\n        list.querySelectorAll('.tag-remove').forEach(btn => {\n            btn.addEventListener('click', (e) => {\n                removeHighlightTag(e.target.dataset.tag);\n                renderTagsList();\n            });\n        });\n    }\n\n    function checkHighlight(text) {\n        if (!text) return false;\n        text = text.toLowerCase();\n        return highlightTags.some(tag => text.includes(tag));\n    }\n\n    // === Local Menu Cache (localStorage) ===\n    const CACHE_KEY = 'kantine_menuCache';\n    const CACHE_TS_KEY = 'kantine_menuCacheTs';\n\n    function saveMenuCache() {\n        try {\n            localStorage.setItem(CACHE_KEY, JSON.stringify(allWeeks));\n            localStorage.setItem(CACHE_TS_KEY, new Date().toISOString());\n        } catch (e) {\n            console.warn('Failed to cache menu data:', e);\n        }\n    }\n\n    function loadMenuCache() {\n        try {\n            const cached = localStorage.getItem(CACHE_KEY);\n            const cachedTs = localStorage.getItem(CACHE_TS_KEY);\n            if (cached) {\n                allWeeks = JSON.parse(cached);\n                currentWeekNumber = getISOWeek(new Date());\n                currentYear = new Date().getFullYear();\n                renderVisibleWeeks();\n                updateNextWeekBadge();\n                if (cachedTs) updateLastUpdatedTime(cachedTs);\n                console.log('Loaded menu from cache');\n                return true;\n            }\n        } catch (e) {\n            console.warn('Failed to load cached menu:', e);\n        }\n        return false;\n    }\n\n    // === Menu Data Fetching (Direct from Bessa API) ===\n    async function loadMenuDataFromAPI() {\n        const loading = document.getElementById('loading');\n        const progressModal = document.getElementById('progress-modal');\n        const progressFill = document.getElementById('progress-fill');\n        const progressPercent = document.getElementById('progress-percent');\n        const progressMessage = document.getElementById('progress-message');\n\n        loading.classList.remove('hidden');\n\n        const token = authToken || GUEST_TOKEN;\n\n        try {\n            // Show progress modal\n            progressModal.classList.remove('hidden');\n            progressMessage.textContent = 'Hole verf\u00fcgbare Daten...';\n            progressFill.style.width = '0%';\n            progressPercent.textContent = '0%';\n\n            // 1. Fetch available dates\n            const datesResponse = await fetch(`${API_BASE}/venues/${VENUE_ID}/menu/dates/`, {\n                headers: apiHeaders(token)\n            });\n\n            if (!datesResponse.ok) throw new Error(`Failed to fetch dates: ${datesResponse.status}`);\n\n            const datesData = await datesResponse.json();\n            let availableDates = datesData.results || [];\n\n            // Filter \u2013 last 7 days + future, limit 30\n            const cutoff = new Date();\n            cutoff.setDate(cutoff.getDate() - 7);\n            const cutoffStr = cutoff.toISOString().split('T')[0];\n\n            availableDates = availableDates\n                .filter(d => d.date >= cutoffStr)\n                .sort((a, b) => a.date.localeCompare(b.date))\n                .slice(0, 30);\n\n            const totalDates = availableDates.length;\n            progressMessage.textContent = `${totalDates} Tage gefunden. Lade Details...`;\n\n            // 2. Fetch details for each date\n            const allDays = [];\n            let completed = 0;\n\n            for (const dateObj of availableDates) {\n                const dateStr = dateObj.date;\n                const pct = Math.round(((completed + 1) / totalDates) * 100);\n                progressFill.style.width = `${pct}%`;\n                progressPercent.textContent = `${pct}%`;\n                progressMessage.textContent = `Lade Men\u00fc f\u00fcr ${dateStr}...`;\n\n                try {\n                    const detailResp = await fetch(`${API_BASE}/venues/${VENUE_ID}/menu/${MENU_ID}/${dateStr}/`, {\n                        headers: apiHeaders(token)\n                    });\n\n                    if (detailResp.ok) {\n                        const detailData = await detailResp.json();\n                        // Debug: log raw API response for first date\n                        if (completed === 0) {\n                            console.log('[Kantine Debug] Raw API response for', dateStr, ':', JSON.stringify(detailData).substring(0, 2000));\n                        }\n                        const menuGroups = detailData.results || [];\n                        let dayItems = [];\n                        for (const group of menuGroups) {\n                            if (group.items && Array.isArray(group.items)) {\n                                dayItems = dayItems.concat(group.items);\n                            }\n                        }\n                        if (dayItems.length > 0) {\n                            // Debug: log first item structure\n                            if (completed === 0) {\n                                console.log('[Kantine Debug] First item keys:', Object.keys(dayItems[0]));\n                                console.log('[Kantine Debug] First item:', JSON.stringify(dayItems[0]).substring(0, 500));\n                            }\n                            allDays.push({\n                                date: dateStr,\n                                menu_items: dayItems,\n                                orders: dateObj.orders || []\n                            });\n                        }\n                    }\n                } catch (err) {\n                    console.error(`Failed to fetch details for ${dateStr}:`, err);\n                }\n\n                completed++;\n                // Small delay to avoid rate limiting\n                await new Promise(r => setTimeout(r, 100));\n            }\n\n            // 3. Group by ISO week (Merge with existing to preserve past days)\n            const weeksMap = new Map();\n\n            // Hydrate from existing cache (preserve past data)\n            if (allWeeks && allWeeks.length > 0) {\n                allWeeks.forEach(w => {\n                    const key = `${w.year}-${w.weekNumber}`;\n                    try {\n                        weeksMap.set(key, {\n                            year: w.year,\n                            weekNumber: w.weekNumber,\n                            days: w.days ? w.days.map(d => ({ ...d, items: d.items ? [...d.items] : [] })) : []\n                        });\n                    } catch (e) { console.warn('Error hydrating week:', e); }\n                });\n            }\n\n            for (const day of allDays) {\n                const d = new Date(day.date);\n                const weekNum = getISOWeek(d);\n                const year = getWeekYear(d);\n                const key = `${year}-${weekNum}`;\n\n                if (!weeksMap.has(key)) {\n                    weeksMap.set(key, { year, weekNumber: weekNum, days: [] });\n                }\n\n                const weekObj = weeksMap.get(key);\n                const weekday = d.toLocaleDateString('en-US', { weekday: 'long' });\n                const orderCutoffDate = new Date(day.date);\n                orderCutoffDate.setHours(10, 0, 0, 0);\n\n                const newDayObj = {\n                    date: day.date,\n                    weekday: weekday,\n                    orderCutoff: orderCutoffDate.toISOString(),\n                    items: day.menu_items.map(item => {\n                        const isUnlimited = item.amount_tracking === false;\n                        const hasStock = parseInt(item.available_amount) > 0;\n                        return {\n                            id: `${day.date}_${item.id}`,\n                            articleId: item.id,\n                            name: item.name || 'Unknown',\n                            description: item.description || '',\n                            price: parseFloat(item.price) || 0,\n                            available: isUnlimited || hasStock,\n                            availableAmount: parseInt(item.available_amount) || 0,\n                            amountTracking: item.amount_tracking !== false\n                        };\n                    })\n                };\n\n                // Merge: Overwrite if exists, push if new\n                const existingIndex = weekObj.days.findIndex(existing => existing.date === day.date);\n                if (existingIndex >= 0) {\n                    weekObj.days[existingIndex] = newDayObj;\n                } else {\n                    weekObj.days.push(newDayObj);\n                }\n            }\n\n            // Sort weeks and days\n            allWeeks = Array.from(weeksMap.values()).sort((a, b) => {\n                if (a.year !== b.year) return a.year - b.year;\n                return a.weekNumber - b.weekNumber;\n            });\n            allWeeks.forEach(w => {\n                if (w.days) w.days.sort((a, b) => a.date.localeCompare(b.date));\n            });\n\n            // Save to localStorage cache\n            saveMenuCache();\n\n            // Update timestamp\n            updateLastUpdatedTime(new Date().toISOString());\n\n            currentWeekNumber = getISOWeek(new Date());\n            currentYear = new Date().getFullYear();\n\n\n\n            updateAuthUI(); // This will trigger fetchOrders if logged in\n            renderVisibleWeeks();\n            updateNextWeekBadge();\n\n            progressMessage.textContent = 'Fertig!';\n            setTimeout(() => progressModal.classList.add('hidden'), 500);\n\n        } catch (error) {\n            console.error('Error fetching menu:', error);\n            progressModal.classList.add('hidden');\n\n            showErrorModal(\n                'Keine Verbindung',\n                `Die Men\u00fcdaten konnten nicht geladen werden. M\u00f6glicherweise besteht keine Verbindung zur API oder zur Bessa-Webseite.<br><br><small style=\"color:var(--text-secondary)\">${error.message}</small>`,\n                'Zur Original-Seite',\n                'https://web.bessa.app/knapp-kantine'\n            );\n        } finally {\n            loading.classList.add('hidden');\n        }\n    }\n\n    // === Last Updated Display ===\n    function updateLastUpdatedTime(isoTimestamp) {\n        const subtitle = document.getElementById('last-updated-subtitle');\n        if (!isoTimestamp) return;\n        try {\n            const date = new Date(isoTimestamp);\n            const timeStr = date.toLocaleTimeString('de-DE', { hour: '2-digit', minute: '2-digit' });\n            const dateStr = date.toLocaleDateString('de-DE', { day: '2-digit', month: '2-digit' });\n            subtitle.textContent = `Aktualisiert: ${dateStr} ${timeStr}`;\n        } catch (e) {\n            subtitle.textContent = '';\n        }\n    }\n\n    // === Toast Notification ===\n    function showToast(message, type = 'info') {\n        let container = document.getElementById('toast-container');\n        if (!container) {\n            container = document.createElement('div');\n            container.id = 'toast-container';\n            document.body.appendChild(container);\n        }\n        const toast = document.createElement('div');\n        toast.className = `toast toast-${type}`;\n        const icon = type === 'success' ? 'check_circle' : type === 'error' ? 'error' : 'info';\n        toast.innerHTML = `<span class=\"material-icons-round\">${icon}</span><span>${message}</span>`;\n        container.appendChild(toast);\n        requestAnimationFrame(() => toast.classList.add('show'));\n        setTimeout(() => {\n            toast.classList.remove('show');\n            setTimeout(() => toast.remove(), 300);\n        }, 3000);\n    }\n\n    // === Next Week Badge ===\n    function updateNextWeekBadge() {\n        const btnNextWeek = document.getElementById('btn-next-week');\n        let nextWeek = currentWeekNumber + 1;\n        let nextYear = currentYear;\n        if (nextWeek > 52) { nextWeek = 1; nextYear++; }\n\n        const nextWeekData = allWeeks.find(w => w.weekNumber === nextWeek && w.year === nextYear);\n        let totalDataCount = 0;\n        let orderableCount = 0;\n        let daysWithOrders = 0;\n        let daysWithOrderableAndNoOrder = 0;\n\n        if (nextWeekData && nextWeekData.days) {\n            nextWeekData.days.forEach(day => {\n                if (day.items && day.items.length > 0) {\n                    totalDataCount++;\n                    const isOrderable = day.items.some(item => item.available);\n                    if (isOrderable) orderableCount++;\n\n                    let hasOrder = false;\n                    day.items.forEach(item => {\n                        const articleId = item.articleId || parseInt(item.id.split('_')[1]);\n                        const key = `${day.date}_${articleId}`;\n                        if (orderMap.has(key) && orderMap.get(key).length > 0) hasOrder = true;\n                    });\n\n                    if (hasOrder) daysWithOrders++;\n                    if (isOrderable && !hasOrder) daysWithOrderableAndNoOrder++;\n                }\n            });\n        }\n\n        let badge = btnNextWeek.querySelector('.nav-badge');\n        if (totalDataCount > 0) {\n            if (!badge) {\n                badge = document.createElement('span');\n                badge.className = 'nav-badge';\n                btnNextWeek.appendChild(badge);\n            }\n\n            // Format: ( Ordered / Orderable / Total )\n            badge.title = `${daysWithOrders} bestellt / ${orderableCount} bestellbar / ${totalDataCount} gesamt`;\n            badge.innerHTML = `<span class=\"ordered\">${daysWithOrders}</span><span class=\"separator\">/</span><span class=\"orderable\">${orderableCount}</span><span class=\"separator\">/</span><span class=\"total\">${totalDataCount}</span>`;\n\n            // Color Logic\n            badge.classList.remove('badge-violet', 'badge-green', 'badge-red', 'badge-blue');\n\n            // Refined Logic (v1.7.4):\n            // Violet: If we have orders AND there are no DAYS left that are orderable but un-ordered.\n            // (i.e. \"I have ordered everything I can\")\n            if (daysWithOrders > 0 && daysWithOrderableAndNoOrder === 0) {\n                badge.classList.add('badge-violet');\n            } else if (daysWithOrderableAndNoOrder > 0) {\n                badge.classList.add('badge-green'); // Orderable days exist without order\n            } else if (orderableCount === 0) {\n                badge.classList.add('badge-red'); // No orderable days at all & no orders\n            } else {\n                badge.classList.add('badge-blue'); // Default / partial state\n            }\n\n            // Advanced Feature: Highlight Count\n            let highlightCount = 0;\n            if (nextWeekData && nextWeekData.days) {\n                nextWeekData.days.forEach(day => {\n                    day.items.forEach(item => {\n                        if (checkHighlight(item.name) || checkHighlight(item.description)) {\n                            highlightCount++;\n                        }\n                    });\n                });\n            }\n\n            if (highlightCount > 0) {\n                // Append blue count\n                badge.innerHTML += `<span class=\"highlight-count\" title=\"${highlightCount} Highlight Men\u00fcs\">(${highlightCount})</span>`;\n                badge.title += ` \u2022 ${highlightCount} Highlights gefunden`;\n                badge.classList.add('has-highlights');\n            }\n\n        } else if (badge) {\n            badge.remove();\n        }\n    }\n\n    // === Weekly Cost ===\n    function updateWeeklyCost(days) {\n        let totalCost = 0;\n        if (days && days.length > 0) {\n            days.forEach(day => {\n                if (day.items) {\n                    day.items.forEach(item => {\n                        const articleId = item.articleId || parseInt(item.id.split('_')[1]);\n                        const key = `${day.date}_${articleId}`;\n                        const orders = orderMap.get(key) || [];\n                        if (orders.length > 0) totalCost += item.price * orders.length;\n                    });\n                }\n            });\n        }\n\n        const costDisplay = document.getElementById('weekly-cost-display');\n        if (totalCost > 0) {\n            costDisplay.innerHTML = `<span class=\"material-icons-round\">shopping_bag</span> <span>Gesamt: ${totalCost.toFixed(2).replace('.', ',')} \u20ac</span>`;\n            costDisplay.classList.remove('hidden');\n        } else {\n            costDisplay.classList.add('hidden');\n        }\n    }\n\n    // === Render Weeks ===\n    function renderVisibleWeeks() {\n        const menuContainer = document.getElementById('menu-container');\n        if (!menuContainer) return;\n        menuContainer.innerHTML = '';\n\n        let targetWeek = currentWeekNumber;\n        let targetYear = currentYear;\n\n        if (displayMode === 'next-week') {\n            targetWeek++;\n            if (targetWeek > 52) { targetWeek = 1; targetYear++; }\n        }\n\n        // Flatten & filter by week + year\n        const allDays = allWeeks.flatMap(w => w.days || []);\n        const daysInTargetWeek = allDays.filter(day => {\n            const d = new Date(day.date);\n            return getISOWeek(d) === targetWeek && getWeekYear(d) === targetYear;\n        });\n\n        if (daysInTargetWeek.length === 0) {\n            menuContainer.innerHTML = `\n                <div class=\"empty-state\">\n                    <p>Keine Men\u00fcdaten f\u00fcr KW ${targetWeek} (${targetYear}) verf\u00fcgbar.</p>\n                    <small>Versuchen Sie eine andere Woche oder schauen Sie sp\u00e4ter vorbei.</small>\n                </div>`;\n            document.getElementById('weekly-cost-display').classList.add('hidden');\n            return;\n        }\n\n        updateWeeklyCost(daysInTargetWeek);\n\n        // Update header\n        const headerWeekInfo = document.getElementById('header-week-info');\n        const weekTitle = displayMode === 'this-week' ? 'Diese Woche' : 'N\u00e4chste Woche';\n        headerWeekInfo.innerHTML = `\n            <div class=\"header-week-title\">${weekTitle}</div>\n            <div class=\"header-week-subtitle\">Week ${targetWeek} \u2022 ${targetYear}</div>`;\n\n        const grid = document.createElement('div');\n        grid.className = 'days-grid';\n\n        daysInTargetWeek.sort((a, b) => a.date.localeCompare(b.date));\n\n        // Filter weekends\n        const workingDays = daysInTargetWeek.filter(d => {\n            const date = new Date(d.date);\n            const day = date.getDay();\n            return day !== 0 && day !== 6;\n        });\n\n        workingDays.forEach(day => {\n            const card = createDayCard(day);\n            if (card) grid.appendChild(card);\n        });\n\n        menuContainer.appendChild(grid);\n        setTimeout(() => syncMenuItemHeights(grid), 0);\n    }\n\n    // === Sync Item Heights ===\n    function syncMenuItemHeights(grid) {\n        const cards = grid.querySelectorAll('.menu-card');\n        if (cards.length === 0) return;\n        let maxItems = 0;\n        cards.forEach(card => {\n            maxItems = Math.max(maxItems, card.querySelectorAll('.menu-item').length);\n        });\n        for (let i = 0; i < maxItems; i++) {\n            let maxHeight = 0;\n            const itemsAtPos = [];\n            cards.forEach(card => {\n                const items = card.querySelectorAll('.menu-item');\n                if (items[i]) {\n                    items[i].style.height = 'auto';\n                    maxHeight = Math.max(maxHeight, items[i].offsetHeight);\n                    itemsAtPos.push(items[i]);\n                }\n            });\n            itemsAtPos.forEach(item => { item.style.height = `${maxHeight}px`; });\n        }\n    }\n\n    // === Create Day Card ===\n    function createDayCard(day) {\n        if (!day.items || day.items.length === 0) return null;\n\n        const card = document.createElement('div');\n        card.className = 'menu-card';\n\n        const now = new Date();\n        const cardDate = new Date(day.date);\n\n        let isPastCutoff = false;\n        if (day.orderCutoff) {\n            isPastCutoff = now >= new Date(day.orderCutoff);\n        } else {\n            const today = new Date();\n            today.setHours(0, 0, 0, 0);\n            const cd = new Date(day.date);\n            cd.setHours(0, 0, 0, 0);\n            isPastCutoff = cd < today;\n        }\n\n        if (isPastCutoff) card.classList.add('past-day');\n\n        // Collect ordered menu codes\n        const menuBadges = [];\n        if (day.items) {\n            day.items.forEach(item => {\n                const articleId = item.articleId || parseInt(item.id.split('_')[1]);\n                const orderKey = `${day.date}_${articleId}`;\n                const orders = orderMap.get(orderKey) || [];\n                const count = orders.length;\n\n                if (count > 0) {\n                    // Regex for M1, M2, M1F etc.\n                    const match = item.name.match(/([M][1-9][Ff]?)/);\n                    if (match) {\n                        let code = match[1];\n                        if (count > 1) code += '+';\n                        menuBadges.push(code);\n                    }\n                }\n            });\n        }\n\n        // Header\n        const header = document.createElement('div');\n        header.className = 'card-header';\n        const dateStr = cardDate.toLocaleDateString('de-DE', { day: '2-digit', month: '2-digit' });\n\n        const badgesHtml = menuBadges.map(code => `<span class=\"menu-code-badge\">${code}</span>`).join('');\n\n        // Determine Day Status for Header Color\n        // Violet: Has Order\n        // Green: No Order but Orderable\n        // Red: No Order and Not Orderable (Locked/Sold Out)\n        let headerClass = '';\n        const hasAnyOrder = day.items && day.items.some(item => {\n            const articleId = item.articleId || parseInt(item.id.split('_')[1]);\n            const key = `${day.date}_${articleId}`;\n            return orderMap.has(key) && orderMap.get(key).length > 0;\n        });\n\n        const hasOrderable = day.items && day.items.some(item => {\n            // Use pre-calculated available flag from loadMenuDataFromAPI calculation\n            return item.available;\n        });\n\n        if (hasAnyOrder) {\n            headerClass = 'header-violet';\n        } else if (hasOrderable && !isPastCutoff) {\n            headerClass = 'header-green';\n        } else {\n            // Red if not orderable (or past cutoff)\n            headerClass = 'header-red';\n        }\n\n        if (headerClass) header.classList.add(headerClass);\n\n        header.innerHTML = `\n            <div class=\"day-header-left\">\n                <span class=\"day-name\">${translateDay(day.weekday)}</span>\n                <div class=\"day-badges\">${badgesHtml}</div>\n            </div>\n            <span class=\"day-date\">${dateStr}</span>`;\n        card.appendChild(header);\n\n        // Body\n        const body = document.createElement('div');\n        body.className = 'card-body';\n\n        const todayDateStr = new Date().toISOString().split('T')[0];\n        const isToday = day.date === todayDateStr;\n\n        const sortedItems = [...day.items].sort((a, b) => {\n            if (isToday) {\n                const aId = a.articleId || parseInt(a.id.split('_')[1]);\n                const bId = b.articleId || parseInt(b.id.split('_')[1]);\n                const aOrdered = orderMap.has(`${day.date}_${aId}`);\n                const bOrdered = orderMap.has(`${day.date}_${bId}`);\n\n                if (aOrdered && !bOrdered) return -1;\n                if (!aOrdered && bOrdered) return 1;\n            }\n            return a.name.localeCompare(b.name);\n        });\n\n        sortedItems.forEach(item => {\n            const itemEl = document.createElement('div');\n            itemEl.className = 'menu-item';\n\n            const articleId = item.articleId || parseInt(item.id.split('_')[1]);\n            const orderKey = `${day.date}_${articleId}`;\n            const orderIds = orderMap.get(orderKey) || [];\n            const orderCount = orderIds.length;\n\n            // Status badge\n            let statusBadge = '';\n            if (item.available) {\n                statusBadge = item.amountTracking\n                    ? `<span class=\"badge available\">Verf\u00fcgbar (${item.availableAmount})</span>`\n                    : `<span class=\"badge available\">Verf\u00fcgbar</span>`;\n            } else {\n                statusBadge = `<span class=\"badge sold-out\">Ausverkauft</span>`;\n            }\n\n            // Order badge\n            let orderedBadge = '';\n            if (orderCount > 0) {\n                const countBadge = orderCount > 1 ? `<span class=\"order-count-badge\">${orderCount}</span>` : '';\n                orderedBadge = `<span class=\"badge ordered\"><span class=\"material-icons-round\">check_circle</span> Bestellt${countBadge}</span>`;\n                itemEl.classList.add('ordered');\n                if (new Date(day.date).toDateString() === now.toDateString()) {\n                    itemEl.classList.add('today-ordered');\n                }\n            }\n\n            // Flagged styles\n            const flagId = `${day.date}_${articleId}`;\n            const isFlagged = userFlags.has(flagId);\n            if (isFlagged) {\n                itemEl.classList.add(item.available ? 'flagged-available' : 'flagged-sold-out');\n            }\n\n            // Highlight matching menu items based on user tags\n            if (checkHighlight(item.name) || checkHighlight(item.description)) {\n                itemEl.classList.add('highlight-glow');\n            }\n\n            // Action buttons\n            let orderButton = '';\n            let cancelButton = '';\n            let flagButton = '';\n\n            if (authToken && !isPastCutoff) {\n                // Flag button\n                const flagIcon = isFlagged ? 'notifications_active' : 'notifications_none';\n                const flagClass = isFlagged ? 'btn-flag active' : 'btn-flag';\n                const flagTitle = isFlagged ? 'Benachrichtigung deaktivieren' : 'Benachrichtigen wenn verf\u00fcgbar';\n                if (!item.available || isFlagged) {\n                    flagButton = `<button class=\"${flagClass}\" data-date=\"${day.date}\" data-article=\"${articleId}\" data-name=\"${escapeHtml(item.name)}\" data-cutoff=\"${day.orderCutoff}\" title=\"${flagTitle}\"><span class=\"material-icons-round\">${flagIcon}</span></button>`;\n                }\n\n                // Order button\n                if (item.available) {\n                    if (orderCount > 0) {\n                        orderButton = `<button class=\"btn-order btn-order-compact\" data-date=\"${day.date}\" data-article=\"${articleId}\" data-name=\"${escapeHtml(item.name)}\" data-price=\"${item.price}\" data-desc=\"${escapeHtml(item.description || '')}\" title=\"${escapeHtml(item.name)} nochmal bestellen\"><span class=\"material-icons-round\">add</span></button>`;\n                    } else {\n                        orderButton = `<button class=\"btn-order\" data-date=\"${day.date}\" data-article=\"${articleId}\" data-name=\"${escapeHtml(item.name)}\" data-price=\"${item.price}\" data-desc=\"${escapeHtml(item.description || '')}\" title=\"${escapeHtml(item.name)} bestellen\"><span class=\"material-icons-round\">add_shopping_cart</span> Bestellen</button>`;\n                    }\n                }\n\n                // Cancel button\n                if (orderCount > 0) {\n                    const cancelIcon = orderCount === 1 ? 'close' : 'remove';\n                    const cancelTitle = orderCount === 1 ? 'Bestellung stornieren' : 'Eine Bestellung stornieren';\n                    cancelButton = `<button class=\"btn-cancel\" data-date=\"${day.date}\" data-article=\"${articleId}\" data-name=\"${escapeHtml(item.name)}\" title=\"${cancelTitle}\"><span class=\"material-icons-round\">${cancelIcon}</span></button>`;\n                }\n            }\n\n            itemEl.innerHTML = `\n                <div class=\"item-header\">\n                    <span class=\"item-name\">${escapeHtml(item.name)}</span>\n                    <span class=\"item-price\">${item.price.toFixed(2)} \u20ac</span>\n                </div>\n                <div class=\"item-status-row\">\n                    ${orderedBadge}\n                    ${cancelButton}\n                    ${orderButton}\n                    ${flagButton}\n                    <div class=\"badges\">${statusBadge}</div>\n                </div>\n                <p class=\"item-desc\">${escapeHtml(item.description)}</p>`;\n\n            // Event: Order\n            const orderBtn = itemEl.querySelector('.btn-order');\n            if (orderBtn) {\n                orderBtn.addEventListener('click', (e) => {\n                    e.stopPropagation();\n                    const btn = e.currentTarget;\n                    btn.disabled = true;\n                    btn.classList.add('loading');\n                    placeOrder(btn.dataset.date, parseInt(btn.dataset.article), btn.dataset.name, parseFloat(btn.dataset.price), btn.dataset.desc || '')\n                        .finally(() => { btn.disabled = false; btn.classList.remove('loading'); });\n                });\n            }\n\n            // Event: Cancel\n            const cancelBtn = itemEl.querySelector('.btn-cancel');\n            if (cancelBtn) {\n                cancelBtn.addEventListener('click', (e) => {\n                    e.stopPropagation();\n                    const btn = e.currentTarget;\n                    btn.disabled = true;\n                    cancelOrder(btn.dataset.date, parseInt(btn.dataset.article), btn.dataset.name)\n                        .finally(() => { btn.disabled = false; });\n                });\n            }\n\n            // Event: Flag\n            const flagBtn = itemEl.querySelector('.btn-flag');\n            if (flagBtn) {\n                flagBtn.addEventListener('click', (e) => {\n                    e.stopPropagation();\n                    const btn = e.currentTarget;\n                    toggleFlag(btn.dataset.date, parseInt(btn.dataset.article), btn.dataset.name, btn.dataset.cutoff);\n                });\n            }\n\n            body.appendChild(itemEl);\n        });\n\n        card.appendChild(body);\n        return card;\n    }\n\n    // === Version Check ===\n    async function checkForUpdates() {\n        const CurrentVersion = 'v1.2.1';\n        const VersionUrl = 'https://raw.githubusercontent.com/TauNeutrino/kantine-overview/main/version.txt';\n        const InstallerUrl = 'https://htmlpreview.github.io/?https://github.com/TauNeutrino/kantine-overview/blob/main/dist/install.html';\n\n        console.log(`[Kantine] Checking for updates... (Current: ${CurrentVersion})`);\n\n        try {\n            const response = await fetch(VersionUrl, { cache: 'no-cache' });\n            if (!response.ok) return;\n\n            const remoteVersion = (await response.text()).trim();\n\n            if (remoteVersion && remoteVersion !== CurrentVersion) {\n                console.log(`[Kantine] New version available: ${remoteVersion}`);\n\n                // Fetch Changelog content\n                let changeSummary = '';\n                try {\n                    const clResp = await fetch('https://raw.githubusercontent.com/TauNeutrino/kantine-overview/main/changelog.md');\n                    if (clResp.ok) {\n                        const clText = await clResp.text();\n                        const match = clText.match(/## (v[^\\n]+)\\n((?:-[^\\n]+\\n)+)/);\n                        if (match && match[1].includes(remoteVersion)) {\n                            changeSummary = match[2].replace(/- /g, '\u2022 ').trim();\n                        }\n                    }\n                } catch (e) { console.warn('No changelog', e); }\n\n                // Create Banner\n                const updateBanner = document.createElement('div');\n                updateBanner.className = 'update-banner';\n                updateBanner.innerHTML = `\n                        <div class=\"update-content\">\n                            <strong>Update verf\u00fcgbar: ${remoteVersion}</strong>\n                            ${changeSummary ? `<pre class=\"change-summary\">${changeSummary}</pre>` : ''}\n                            <a href=\"${InstallerUrl}\" target=\"_blank\" class=\"update-link\">\n                                <span class=\"material-icons-round\">system_update_alt</span>\n                                Jetzt aktualisieren\n                            </a>\n                        </div>\n                        <button class=\"icon-btn-small close-update\">&times;</button>\n                    `;\n\n                document.body.appendChild(updateBanner);\n                updateBanner.querySelector('.close-update').addEventListener('click', () => updateBanner.remove());\n\n                // Highlight Header Icon\n                const lastUpdatedIcon = document.querySelector('.material-icons-round.logo-icon');\n                if (lastUpdatedIcon) {\n                    lastUpdatedIcon.style.color = 'var(--accent-color)';\n                    lastUpdatedIcon.parentElement.title = `Update verf\u00fcgbar: ${remoteVersion}`;\n                }\n            }\n        } catch (error) {\n            console.warn('[Kantine] Version check failed:', error);\n        }\n    }\n\n    // === Order Countdown ===\n    function updateCountdown() {\n        const now = new Date();\n        const currentDay = now.getDay();\n        // Skip weekends (0=Sun, 6=Sat)\n        if (currentDay === 0 || currentDay === 6) {\n            removeCountdown();\n            return;\n        }\n\n        const todayStr = now.toISOString().split('T')[0];\n\n        // 1. Check if we already ordered for today\n        let hasOrder = false;\n        // Optimization: Check orderMap for today's date\n        // Keys are \"YYYY-MM-DD_ArticleID\"\n        for (const key of orderMap.keys()) {\n            if (key.startsWith(todayStr)) {\n                hasOrder = true;\n                break;\n            }\n        }\n\n        if (hasOrder) {\n            removeCountdown();\n            return;\n        }\n\n        // 2. Calculate time to cutoff (10:00 AM)\n        const cutoff = new Date();\n        cutoff.setHours(10, 0, 0, 0);\n\n        const diff = cutoff - now;\n\n        // If passed cutoff or more than 3 hours away (e.g. 07:00), maybe don't show?\n        // User req: \"heute noch keine bestellung... countdown erscheinen\"\n        // Let's show it if within valid order window (e.g. 00:00 - 10:00)\n\n        if (diff <= 0) {\n            removeCountdown();\n            return;\n        }\n\n        // 3. Render Countdown\n        const diffHrs = Math.floor(diff / 3600000);\n        const diffMins = Math.floor((diff % 3600000) / 60000);\n\n        const headerCenter = document.querySelector('.header-center-wrapper');\n        if (!headerCenter) return;\n\n        let countdownEl = document.getElementById('order-countdown');\n        if (!countdownEl) {\n            countdownEl = document.createElement('div');\n            countdownEl.id = 'order-countdown';\n            // Insert before cost display or append\n            headerCenter.insertBefore(countdownEl, headerCenter.firstChild);\n        }\n\n        countdownEl.innerHTML = `<span>Bestellschluss:</span> <strong>${diffHrs}h ${diffMins}m</strong>`;\n\n        // Red Alert if < 1 hour\n        if (diff < 3600000) { // 1 hour\n            countdownEl.classList.add('urgent');\n\n            // Notification logic (One time)\n            const notifiedKey = `kantine_notified_${todayStr}`;\n            if (!sessionStorage.getItem(notifiedKey)) {\n                if (Notification.permission === 'granted') {\n                    new Notification('Kantine: Bestellschluss naht!', {\n                        body: 'Du hast heute noch nichts bestellt. Nur noch 1 Stunde!',\n                        icon: '\u23f3'\n                    });\n                } else if (Notification.permission === 'default') {\n                    Notification.requestPermission();\n                }\n                sessionStorage.setItem(notifiedKey, 'true');\n            }\n        } else {\n            countdownEl.classList.remove('urgent');\n        }\n    }\n\n    function removeCountdown() {\n        const el = document.getElementById('order-countdown');\n        if (el) el.remove();\n    }\n\n    // Update countdown every minute\n    setInterval(updateCountdown, 60000);\n    // Also update on load\n    setTimeout(updateCountdown, 1000);\n\n    // === Helpers === \n    function getISOWeek(date) {\n        const d = new Date(Date.UTC(date.getFullYear(), date.getMonth(), date.getDate()));\n        const dayNum = d.getUTCDay() || 7;\n        d.setUTCDate(d.getUTCDate() + 4 - dayNum);\n        const yearStart = new Date(Date.UTC(d.getUTCFullYear(), 0, 1));\n        return Math.ceil(((d - yearStart) / 86400000 + 1) / 7);\n    }\n\n    function getWeekYear(d) {\n        const date = new Date(d.getTime());\n        date.setDate(date.getDate() + 3 - (date.getDay() + 6) % 7);\n        return date.getFullYear();\n    }\n\n\n    function translateDay(englishDay) {\n        const map = { Monday: 'Montag', Tuesday: 'Dienstag', Wednesday: 'Mittwoch', Thursday: 'Donnerstag', Friday: 'Freitag', Saturday: 'Samstag', Sunday: 'Sonntag' };\n        return map[englishDay] || englishDay;\n    }\n\n    function escapeHtml(text) {\n        const div = document.createElement('div');\n        div.textContent = text || '';\n        return div.innerHTML;\n    }\n\n    // === Bootstrap ===\n    injectUI();\n    bindEvents();\n    updateAuthUI();\n    cleanupExpiredFlags();\n\n    // Load cached data first for instant UI, then refresh from API\n    const hadCache = loadMenuCache();\n    if (hadCache) {\n        // Hide loading spinner since cache is shown\n        document.getElementById('loading').classList.add('hidden');\n    }\n    loadMenuDataFromAPI();\n\n    // Auto-start polling if already logged in\n    if (authToken) {\n        startPolling();\n    }\n\n    // Check for updates\n    checkForUpdates();\n\n    console.log('Kantine Wrapper loaded \u2705');\n})();\n\n// === Error Modal ===\nfunction showErrorModal(title, htmlContent, btnText, url) {\n    const modalId = 'error-modal';\n    let modal = document.getElementById(modalId);\n    if (modal) modal.remove();\n\n    modal = document.createElement('div');\n    modal.id = modalId;\n    modal.className = 'modal hidden';\n    modal.innerHTML = `\n            <div class=\"modal-content\">\n                <div class=\"modal-header\">\n                    <h2 style=\"color: var(--error-color); display: flex; align-items: center; gap: 10px;\">\n                        <span class=\"material-icons-round\">signal_wifi_off</span>\n                        ${title}\n                    </h2>\n                </div>\n                <div style=\"padding: 20px;\">\n                    <p style=\"margin-bottom: 15px; color: var(--text-primary);\">${htmlContent}</p>\n                    <div style=\"margin-top: 20px; display: flex; justify-content: center;\">\n                        <button id=\"btn-error-redirect\" style=\"\n                            background-color: var(--accent-color); \n                            color: white; \n                            padding: 12px 24px; \n                            border-radius: 8px; \n                            border: none; \n                            font-weight: 600; \n                            cursor: pointer;\n                            display: flex;\n                            align-items: center;\n                            gap: 8px;\n                            width: 100%;\n                            justify-content: center;\n                            transition: transform 0.1s;\n                        \">\n                            ${btnText}\n                            <span class=\"material-icons-round\">open_in_new</span>\n                        </button>\n                    </div>\n                </div>\n            </div>\n        `;\n    document.body.appendChild(modal);\n\n    document.getElementById('btn-error-redirect').addEventListener('click', () => {\n        window.location.href = url;\n    });\n\n    requestAnimationFrame(() => {\n        modal.classList.remove('hidden');\n    });\n}\n";
 document.head.appendChild(sc);
 })();
diff --git a/dist/bookmarklet.txt b/dist/bookmarklet.txt
index a5b092f..90db718 100755
--- a/dist/bookmarklet.txt
+++ b/dist/bookmarklet.txt
@@ -1 +1 @@
-javascript:(function(){ if(window.__KANTINE_LOADED){alert('Kantine Wrapper already loaded!');return;} var s=document.createElement('style'); s.textContent=':root { /* Premium Slate/Gray-Blue Palette - Light Mode */ --bg-body: #f1f5f9; /* Slate 100 */ --bg-card: #ffffff; --text-primary: #334155; /* Slate 700 */ --text-secondary: #64748b; --accent-color: #0f172a; /* Slate 900 (High contrast) */ --border-color: #cbd5e1; /* Slate 300 */ --banner-bg: #e2e8f0; --banner-text: #1e293b; --success-color: #059669; --error-color: #dc2626; --card-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.05), 0 2px 4px -2px rgb(0 0 0 / 0.05); --header-bg: rgba(255, 255, 255, 0.9); --header-border: 1px solid rgba(203, 213, 225, 0.6); } [data-theme="dark"] { /* Premium Slate/Gray-Blue Palette - Dark Mode */ --bg-body: #1e293b; /* Deep Slate Gray (Requested) */ --bg-card: #334155; /* Slate 700 */ --text-primary: #f8fafc; /* Slate 50 */ --text-secondary: #cbd5e1; /* Slate 300 */ --accent-color: #60a5fa; /* Blue 400 */ --border-color: #475569; /* Slate 600 */ --banner-bg: #475569; --banner-text: #e2e8f0; --header-bg: rgba(30, 41, 59, 0.9); --header-border: 1px solid rgba(71, 85, 105, 0.6); --card-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.4); } * { box-sizing: border-box; margin: 0; padding: 0; } body { font-family: \'Inter\', system-ui, -apple-system, sans-serif; background-color: var(--bg-body); color: var(--text-primary); transition: background-color 0.3s ease, color 0.3s ease; line-height: 1.5; -webkit-font-smoothing: antialiased; } /* Fix scrolling bug: Reset html/body styles from host page */ html, body { height: auto !important; min-height: 100% !important; overflow-y: auto !important; overflow-x: hidden !important; position: static !important; margin: 0 !important; padding: 0 !important; } /* Header */ .app-header { position: sticky; top: 0; z-index: 100; backdrop-filter: blur(12px); background-color: var(--header-bg); border-bottom: var(--header-border); padding: 1rem 0; } .header-content { width: 100%; /* Full width */ padding: 0 2rem; /* Comfortable padding */ display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 1rem; } .brand { display: flex; align-items: center; gap: 0.75rem; } .brand-text { display: flex; flex-direction: column; } .brand h1 { font-size: 1.25rem; font-weight: 700; letter-spacing: -0.025em; margin-bottom: 0; } .subtitle { font-size: 0.85rem; color: var(--text-secondary); font-weight: 400; margin-left: 2px; } .logo-icon { font-size: 1.5rem; color: var(--accent-color); } /* Controls */ .controls { display: flex; align-items: center; gap: 1.5rem; justify-self: end; } /* Header Week Info (centered) */ .header-week-info { text-align: center; line-height: 1.3; } .header-center-wrapper { display: flex; flex-direction: row; align-items: center; gap: 1.5rem; justify-content: center; } .header-week-title { font-size: 1.1rem; font-weight: 600; color: var(--text-primary); } .header-week-subtitle { font-size: 0.85rem; color: var(--text-secondary); } .nav-group { display: flex; background-color: var(--bg-card); border: 1px solid var(--border-color); padding: 0.25rem; border-radius: 8px; } .nav-btn { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.875rem; font-weight: 500; color: var(--text-secondary); cursor: pointer; border-radius: 6px; transition: all 0.2s; display: flex; align-items: center; gap: 0.5rem; } .nav-btn:hover { color: var(--text-primary); background-color: rgba(100, 116, 139, 0.1); } .nav-btn.active { background-color: var(--accent-color); color: white; } /* Badge for nav buttons (day count indicator) */ .nav-badge { background-color: var(--error-color); color: white; font-size: 0.75rem; font-weight: 600; padding: 0 6px; border-radius: 10px; min-width: 18px; height: 18px; display: inline-flex; align-items: center; justify-content: center; margin-left: 8px; gap: 3px; line-height: 1; } .nav-badge .orderable { color: #fff; font-weight: 800; } .nav-badge .separator { opacity: 0.6; font-weight: 400; } .nav-badge .total { opacity: 0.8; font-weight: 400; } .nav-btn.active .nav-badge { background: rgba(255, 255, 255, 0.3); } /* Primary style for Login Button to match header */ #btn-login-open { background-color: var(--accent-color); color: white; padding: 0.5rem 1.25rem; border-radius: 8px; font-weight: 600; letter-spacing: 0.025em; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); } #btn-login-open:hover { background-color: #334155; /* Slightly lighter than slate-900 */ transform: translateY(-1px); box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); } /* User Badge Button (Login) */ .user-badge-btn { display: flex; align-items: center; gap: 8px; padding: 6px 12px; background: var(--bg-card); border: 1px solid var(--border-color); border-radius: 20px; font-size: 0.9rem; font-weight: 500; color: var(--text-primary); cursor: pointer; transition: all 0.2s; } .user-badge-btn:hover { background: rgba(100, 116, 139, 0.1); border-color: var(--accent-color); } .user-badge-btn .material-icons-round { font-size: 1.25rem; color: var(--accent-color); } .icon-btn { background: none; border: none; color: var(--text-primary); cursor: pointer; padding: 0.5rem; border-radius: 50%; transition: background-color 0.2s; display: flex; align-items: center; justify-content: center; } .icon-btn:hover { background-color: rgba(100, 116, 139, 0.1); } /* Refresh button animation */ #btn-refresh.refreshing .material-icons-round { animation: rotate 1s linear infinite; } @keyframes rotate { from { transform: rotate(0deg); } to { transform: rotate(360deg); } } /* Progress Modal */ .progress-container { margin-bottom: 1.5rem; } .progress-bar { width: 100%; height: 8px; background-color: var(--border-color); border-radius: 4px; overflow: hidden; margin-bottom: 0.75rem; } .progress-fill { height: 100%; background: linear-gradient(90deg, var(--accent-color) 0%, #60a5fa 100%); width: 0%; transition: width 0.3s ease; border-radius: 4px; } .progress-percent { text-align: center; font-size: 1.5rem; font-weight: 700; color: var(--text-primary); margin-bottom: 0.5rem; } .progress-message { text-align: center; color: var(--text-secondary); font-size: 0.9rem; font-weight: 500; } .weekly-cost { background-color: rgba(59, 130, 246, 0.1); /* Blue tint */ color: var(--accent-color); padding: 0.4rem 0.8rem; border-radius: 8px; font-weight: 600; font-size: 0.9rem; display: flex; align-items: center; gap: 0.5rem; border: 1px solid rgba(59, 130, 246, 0.2); } .weekly-cost .material-icons-round { font-size: 18px; } /* Container */ .container { width: 100%; /* Full width */ margin: 2rem auto; padding: 0 2rem; min-height: 80vh; } /* Banner */ .banner { background-color: var(--banner-bg); color: var(--banner-text); padding: 0.75rem 1rem; border-radius: 8px; display: flex; align-items: center; gap: 0.5rem; margin-bottom: 2rem; font-size: 0.875rem; font-weight: 500; border: 1px solid var(--border-color); max-width: fit-content; } /* User Badge */ .user-badge { display: flex; align-items: center; gap: 8px; padding: 6px 12px; background: var(--bg-card); /* Changed from --surface */ border: 1px solid var(--border-color); /* Changed from --border */ border-radius: 20px; font-size: 0.9rem; font-weight: 500; } .icon-btn-small { background: none; border: none; padding: 4px; cursor: pointer; color: var(--text-secondary); /* Changed from --text-muted */ display: flex; align-items: center; justify-content: center; border-radius: 50%; transition: all 0.2s; } .icon-btn-small:hover { color: var(--error-color); /* Changed from --danger */ background: rgba(239, 68, 68, 0.1); } /* Modal */ .modal { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); backdrop-filter: blur(4px); display: flex; align-items: center; justify-content: center; z-index: 1000; transition: all 0.3s; } .modal.hidden { opacity: 0; pointer-events: none; } .modal-content { background: var(--bg-card); /* Changed from --surface */ width: 90%; max-width: 400px; border-radius: 16px; box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); overflow: hidden; animation: modalSlide 0.3s ease-out; } @keyframes modalSlide { from { transform: translateY(20px); opacity: 0; } to { transform: translateY(0); opacity: 1; } } .modal-header { display: flex; align-items: center; justify-content: space-between; padding: 20px; border-bottom: 1px solid var(--border-color); /* Changed from --border */ } .modal-header h2 { margin: 0; font-size: 1.25rem; } #login-form { padding: 20px; } .form-group { margin-bottom: 20px; } .form-group label { display: block; margin-bottom: 6px; font-weight: 500; font-size: 0.9rem; } .form-group input { width: 100%; padding: 10px 12px; border: 1px solid var(--border-color); /* Changed from --border */ border-radius: 8px; background: var(--bg-body); /* Changed from --bg */ color: var(--text-primary); /* Changed from --text */ font-family: inherit; transition: border-color 0.2s; } .form-group input:focus { outline: none; border-color: var(--accent-color); /* Changed from --primary */ } .help-text { display: block; margin-top: 4px; color: var(--text-secondary); /* Changed from --text-muted */ font-size: 0.75rem; } .error-msg { margin-bottom: 16px; padding: 10px; background: rgba(239, 68, 68, 0.1); color: var(--error-color); /* Changed from --danger */ border-radius: 8px; font-size: 0.85rem; text-align: center; } .modal-actions { margin-top: 24px; } .btn-primary.wide { width: 100%; justify-content: center; } .hidden { display: none !important; } /* Menu Grid */ .menu-grid { display: grid; gap: 2rem; } .week-section { margin-bottom: 3rem; } .week-header { margin-bottom: 1.5rem; border-bottom: 1px solid var(--border-color); padding-bottom: 1rem; text-align: center; } .week-title { font-size: 1.75rem; font-weight: 700; color: var(--text-primary); } .week-range { color: var(--text-secondary); font-size: 0.9rem; margin-top: 0.25rem; } .days-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 0.75rem; } /* Card */ .menu-card { background-color: var(--bg-card); border-radius: 12px; border: 1px solid var(--border-color); box-shadow: var(--card-shadow); overflow: hidden; transition: transform 0.2s ease, box-shadow 0.2s ease; display: flex; flex-direction: column; } /* Past Day Styling - Target specific elements so ordered items can remain visible */ .menu-card.past-day .card-header, .menu-card.past-day .menu-item:not(.ordered) { opacity: 0.6; filter: grayscale(0.8); transition: opacity 0.3s, filter 0.3s; } .menu-card.past-day:hover .card-header, .menu-card.past-day:hover .menu-item:not(.ordered) { opacity: 0.8; filter: grayscale(0.4); } /* Enhancements for ordered items */ .menu-card.past-day .menu-item.ordered { /* No opacity/filter here - fully visible */ background: var(--bg-card); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); border: 1px solid var(--accent-color); border-radius: 8px; padding: 1rem; margin: 0 -1rem 1.5rem -1rem; position: relative; z-index: 10; } .menu-item.today-ordered { border: 2px solid var(--accent-color); box-shadow: 0 0 20px rgba(96, 165, 250, 0.4); border-radius: 8px; padding: 1rem; margin: 0 -1rem 1.5rem -1rem; background: var(--bg-card); position: relative; z-index: 5; animation: pulse-glow 3s infinite; } @keyframes pulse-glow { 0% { box-shadow: 0 0 15px rgba(96, 165, 250, 0.3); } 50% { box-shadow: 0 0 25px rgba(96, 165, 250, 0.6); } 100% { box-shadow: 0 0 15px rgba(96, 165, 250, 0.3); } } .menu-card:hover { transform: translateY(-2px); box-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1); } .card-header { padding: 1rem 1.25rem; border-bottom: 1px solid var(--border-color); display: flex; justify-content: space-between; align-items: baseline; background-color: rgba(100, 116, 139, 0.05); } .day-name { font-size: 1.125rem; font-weight: 600; } .day-date { font-size: 0.875rem; color: var(--text-secondary); } .card-body { padding: 1.25rem; display: grid; grid-template-rows: auto; /* Each menu item gets its own row */ align-content: start; } .empty-state { color: var(--text-secondary); font-style: italic; text-align: center; padding: 1rem; } /* Menu Items */ .menu-item { margin-bottom: 1.5rem; padding-bottom: 1.5rem; border-bottom: 1px solid var(--border-color); } .menu-item:last-child { margin-bottom: 0; padding-bottom: 0; border-bottom: none; } .item-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 0.5rem; gap: 1rem; } .item-name { font-weight: 600; color: var(--text-primary); font-size: 1rem; } .item-price { font-weight: 700; color: var(--accent-color); white-space: nowrap; } .item-desc { font-size: 0.875rem; color: var(--text-secondary); line-height: 1.6; margin-bottom: 0.75rem; } .badges { display: flex; gap: 0.5rem; margin-left: auto; } .item-status-row { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.75rem; } .badge { display: inline-flex; align-items: center; justify-content: center; height: 24px; font-size: 0.75rem; padding: 0 10px; border-radius: 4px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; line-height: normal; white-space: nowrap; } .badge.available { background-color: rgba(16, 185, 129, 0.1); /* Emerald 500 / 10% */ color: var(--success-color); border: 1px solid rgba(16, 185, 129, 0.2); } .badge.sold-out { background-color: rgba(239, 68, 68, 0.1); /* Red 500 / 10% */ color: var(--error-color); border: 1px solid rgba(239, 68, 68, 0.2); } .badge.ordered { background-color: rgba(139, 92, 246, 0.1); /* Violet 500 / 10% */ color: #8b5cf6; border: 1px solid rgba(139, 92, 246, 0.2); gap: 4px; } .badge.ordered .material-icons-round { font-size: 1rem; } /* Loading */ .loading-state { text-align: center; padding: 4rem; color: var(--text-secondary); } .spinner { width: 40px; height: 40px; border: 3px solid var(--border-color); border-top-color: var(--accent-color); border-radius: 50%; margin: 0 auto 1rem; animation: spin 1s linear infinite; } @keyframes spin { to { transform: rotate(360deg); } } /* Footer */ .app-footer { text-align: center; padding: 2rem; color: var(--text-secondary); font-size: 0.875rem; border-top: 1px solid var(--border-color); margin-top: auto; } /* === Order / Cancel Buttons (inline in status row) === */ .btn-order { display: inline-flex; align-items: center; gap: 4px; padding: 4px 10px; border: none; border-radius: 6px; background: var(--success-color); color: white; font-size: 0.75rem; font-weight: 600; cursor: pointer; transition: all 0.2s ease; font-family: inherit; } .btn-order .material-icons-round { font-size: 16px; } .btn-order:hover:not(:disabled) { filter: brightness(1.15); transform: translateY(-1px); } .btn-order:disabled { opacity: 0.5; cursor: not-allowed; } .btn-order.loading { pointer-events: none; opacity: 0.6; } .btn-order-compact { padding: 2px 4px; gap: 0; } .btn-order-compact .material-icons-round { font-size: 16px; } .btn-cancel { display: inline-flex; align-items: center; justify-content: center; padding: 4px 6px; border: none; border-radius: 6px; background: var(--error-color); color: white; font-size: 0.75rem; cursor: pointer; transition: all 0.2s ease; font-family: inherit; } .btn-cancel .material-icons-round { font-size: 16px; } .btn-cancel:hover:not(:disabled) { filter: brightness(1.15); transform: translateY(-1px); } .btn-cancel:disabled { opacity: 0.5; cursor: not-allowed; } /* Past days: hide action buttons */ .past-day .item-actions { display: none; } /* Order count badge (for multi-orders) */ .order-count-badge { display: inline-flex; align-items: center; justify-content: center; background: rgba(255, 255, 255, 0.3); color: white; font-size: 0.65rem; font-weight: 700; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 8px; margin-left: 4px; line-height: 1; } /* === Toast Notifications === */ #toast-container { position: fixed; bottom: 20px; right: 20px; z-index: 10000; display: flex; flex-direction: column; gap: 8px; pointer-events: none; } .toast { display: flex; align-items: center; gap: 8px; padding: 10px 16px; border-radius: 8px; font-size: 0.85rem; font-weight: 500; font-family: \'Inter\', sans-serif; color: white; backdrop-filter: blur(10px); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3); pointer-events: auto; transform: translateX(120%); opacity: 0; transition: transform 0.3s ease, opacity 0.3s ease; } .toast.show { transform: translateX(0); opacity: 1; } .toast .material-icons-round { font-size: 18px; } .toast-success { background: rgba(5, 150, 105, 0.95); } .toast-error { background: rgba(220, 38, 38, 0.95); } .toast-info { background: rgba(59, 130, 246, 0.95); } /* === Mobile Responsiveness === */ @media (max-width: 600px) { .header-content { flex-direction: column; gap: 1rem; padding: 0.75rem; } .week-nav { width: 100%; justify-content: center; } .nav-pills { width: 100%; justify-content: space-between; } .nav-btn { flex: 1; justify-content: center; padding: 0.5rem; font-size: 0.85rem; } .days-grid { grid-template-columns: 1fr; /* Force single column */ } .main-content { padding: 1rem; } .week-title { font-size: 1.5rem; } /* Adjust toast position for mobile */ .toast-container { bottom: 1rem; right: 1rem; left: 1rem; /* Center on mobile */ width: auto; } .menu-card { margin-bottom: 1rem; } } /* === Flagging & Notification Styles === */ .btn-flag { display: inline-flex; align-items: center; justify-content: center; background: transparent; border: 1px solid var(--text-secondary); color: var(--text-secondary); border-radius: 6px; padding: 4px; cursor: pointer; transition: all 0.2s; margin-right: 0.5rem; width: 28px; height: 28px; } .btn-flag:hover { background: rgba(234, 179, 8, 0.1); /* Yellow-500 / 10% */ color: #eab308; border-color: #eab308; } .btn-flag.active { background: rgba(234, 179, 8, 0.1); color: #eab308; border-color: #eab308; } .btn-flag .material-icons-round { font-size: 1.1rem; } /* Flagged & Sold Out (Yellow Glow) */ .menu-item.flagged-sold-out { border: 1px solid #eab308; box-shadow: 0 0 10px rgba(234, 179, 8, 0.2); border-radius: 8px; padding: 1rem; margin: 0 -1rem 1.5rem -1rem; background: var(--bg-card); position: relative; z-index: 5; animation: yellow-pulse 3s infinite; } @keyframes yellow-pulse { 0% { box-shadow: 0 0 8px rgba(234, 179, 8, 0.2); } 50% { box-shadow: 0 0 16px rgba(234, 179, 8, 0.5); } 100% { box-shadow: 0 0 8px rgba(234, 179, 8, 0.2); } } /* Flagged & Available (Green Glow) */ .menu-item.flagged-available { border: 2px solid var(--success-color); box-shadow: 0 0 15px rgba(16, 185, 129, 0.3); border-radius: 8px; padding: 1rem; margin: 0 -1rem 1.5rem -1rem; background: var(--bg-card); position: relative; z-index: 5; animation: green-pulse 3s infinite; } @keyframes green-pulse { 0% { box-shadow: 0 0 10px rgba(16, 185, 129, 0.3); } 50% { box-shadow: 0 0 20px rgba(16, 185, 129, 0.6); } 100% { box-shadow: 0 0 10px rgba(16, 185, 129, 0.3); } } /* Day Header Badges */ .day-header-left { display: flex; align-items: center; gap: 0.75rem; } .menu-code-badge { font-size: 0.75rem; font-weight: 700; color: #8b5cf6; /* Violet 500 */ background-color: rgba(139, 92, 246, 0.15); border: 1px solid rgba(139, 92, 246, 0.3); padding: 2px 6px; border-radius: 6px; line-height: normal; display: inline-block; } /* Detailed Badge Colors */ .nav-badge.badge-violet { background-color: #8b5cf6; } .nav-badge.badge-green { background-color: var(--success-color); } .nav-badge.badge-red { background-color: var(--error-color); } .nav-badge.badge-blue { background-color: var(--accent-color); } /* Day Header Status Colors (User Request) */ .card-header.header-violet { background-color: rgba(139, 92, 246, 0.15); border-bottom: 2px solid #8b5cf6; } .card-header.header-green { background-color: rgba(16, 185, 129, 0.15); border-bottom: 2px solid var(--success-color); } .card-header.header-red { background-color: rgba(239, 68, 68, 0.15); border-bottom: 2px solid var(--error-color); } .card-header.header-violet .day-name, .card-header.header-green .day-name, .card-header.header-red .day-name { font-weight: 700; color: var(--text-primary); /* Ensure text remains standard color */ } /* Update Icon */ .update-icon { display: inline-flex; align-items: center; justify-content: center; margin-left: 8px; background-color: rgba(16, 185, 129, 0.2); /* Green tint */ color: var(--success-color); border-radius: 50%; width: 24px; height: 24px; cursor: pointer; font-size: 14px; transition: all 0.2s; text-decoration: none; animation: pulse 2s infinite; } .update-icon:hover { background-color: var(--success-color); color: white; transform: scale(1.1); } @keyframes pulse { 0% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.4); } 70% { box-shadow: 0 0 0 6px rgba(16, 185, 129, 0); } 100% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0); } } /* Order Countdown */ #order-countdown { background: rgba(255, 255, 255, 0.1); padding: 0.25rem 0.75rem; border-radius: 99px; font-size: 0.85rem; display: flex; align-items: center; gap: 0.5rem; white-space: nowrap; border: 1px solid var(--border-color); } #order-countdown span { opacity: 0.7; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.5px; } #order-countdown.urgent { background: rgba(239, 68, 68, 0.2); border-color: rgba(239, 68, 68, 0.5); color: #ef4444; animation: pulse-red 2s infinite; } @keyframes pulse-red { 0% { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.4); } 70% { box-shadow: 0 0 0 6px rgba(239, 68, 68, 0); } 100% { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0); } } /* Smart Highlights */ .highlight-glow { box-shadow: 0 0 15px rgba(59, 130, 246, 0.5); /* Blue glow */ border: 1px solid rgba(59, 130, 246, 0.8); background: rgba(59, 130, 246, 0.05); position: relative; z-index: 1; } /* Nav Badge with Count */ .nav-badge.has-highlights { background-color: var(--bg-card); /* Neutral background */ color: var(--text-primary); border: 1px solid var(--border-color); padding: 2px 6px; } .nav-badge .highlight-count { color: #3b82f6; /* Blue 500 */ font-weight: 700; margin-left: 4px; } /* Tag Management Modal */ #tags-list { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 1rem; min-height: 50px; } .tag-badge { display: inline-flex; align-items: center; background: rgba(59, 130, 246, 0.15); color: #3b82f6; padding: 4px 10px; border-radius: 99px; font-size: 0.85rem; font-weight: 500; } .tag-remove { margin-left: 6px; cursor: pointer; opacity: 0.7; font-size: 1.1em; line-height: 1; } .tag-remove:hover { opacity: 1; color: #ef4444; } .input-group { display: flex; gap: 0.5rem; } .input-group input { flex: 1; padding: 0.75rem; background: var(--bg-body); border: 1px solid var(--border-color); color: var(--text-primary); border-radius: 8px; } /* Update Banner Enhanced */ .change-summary { font-size: 0.8rem; background: rgba(0, 0, 0, 0.1); padding: 0.5rem; border-radius: 4px; margin: 0.5rem 0; white-space: pre-wrap; font-family: inherit; line-height: 1.4; max-height: 100px; overflow-y: auto; } .update-content { display: flex; flex-direction: column; gap: 4px; flex: 1; } /* Installer Changelog */ .changelog-container ul { padding-left: 1.5rem; margin: 0.5rem 0; } .changelog-container li { margin-bottom: 0.4rem; line-height: 1.5; } .changelog-container h3 { margin-top: 1.5rem; margin-bottom: 0.5rem; font-size: 1.1em; color: var(--accent-color); } '; document.head.appendChild(s); var sc=document.createElement('script'); sc.textContent="/**\n * Kantine Wrapper \u2013 Client-Only Bookmarklet\n * Replaces Bessa page content with enhanced weekly menu view.\n * All API calls go directly to api.bessa.app (same origin).\n * Data stored in localStorage (flags, theme, auth).\n */\n(function () {\n 'use strict';\n\n // Prevent double injection\n if (window.__KANTINE_LOADED) return;\n window.__KANTINE_LOADED = true;\n\n // === Constants ===\n const API_BASE = 'https://api.bessa.app/v1';\n const GUEST_TOKEN = 'c3418725e95a9f90e3645cbc846b4d67c7c66131';\n const CLIENT_VERSION = '1.7.0_prod/2026-01-26';\n const VENUE_ID = 591;\n const MENU_ID = 7;\n const POLL_INTERVAL_MS = 5 * 60 * 1000; // 5 minutes\n\n // === State ===\n let allWeeks = [];\n let currentWeekNumber = getISOWeek(new Date());\n let currentYear = new Date().getFullYear();\n let displayMode = 'this-week';\n let authToken = sessionStorage.getItem('kantine_authToken');\n let currentUser = sessionStorage.getItem('kantine_currentUser');\n let orderMap = new Map();\n let userFlags = new Set(JSON.parse(localStorage.getItem('kantine_flags') || '[]'));\n let pollIntervalId = null;\n\n // === API Helpers ===\n function apiHeaders(token) {\n return {\n 'Authorization': `Token ${token || GUEST_TOKEN}`,\n 'Accept': 'application/json',\n 'Content-Type': 'application/json',\n 'X-Client-Version': CLIENT_VERSION\n };\n }\n\n // === Inject UI ===\n function injectUI() {\n // Replace entire page content\n document.title = 'Kantine Weekly Menu';\n\n // Inject Google Fonts if not already present\n if (!document.querySelector('link[href*=\"fonts.googleapis.com/css2?family=Inter\"]')) {\n const fontLink = document.createElement('link');\n fontLink.rel = 'stylesheet';\n fontLink.href = 'https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap';\n document.head.appendChild(fontLink);\n }\n if (!document.querySelector('link[href*=\"Material+Icons+Round\"]')) {\n const iconLink = document.createElement('link');\n iconLink.rel = 'stylesheet';\n iconLink.href = 'https://fonts.googleapis.com/icon?family=Material+Icons+Round';\n document.head.appendChild(iconLink);\n }\n\n document.body.innerHTML = `\n <div id=\"kantine-wrapper\">\n <header class=\"app-header\">\n <div class=\"header-content\">\n <div class=\"brand\">\n <span class=\"material-icons-round logo-icon\">restaurant_menu</span>\n <div class=\"header-left\">\n <h1>Kantinen \u00dcbersicht <small style=\"font-size: 0.6em; opacity: 0.7; font-weight: 400;\">v1.2.0</small></h1>\n <div id=\"last-updated-subtitle\" class=\"subtitle\"></div>\n </div>\n </div>\n <div class=\"header-center-wrapper\">\n <div id=\"header-week-info\" class=\"header-week-info\"></div>\n <div id=\"weekly-cost-display\" class=\"weekly-cost hidden\"></div>\n </div>\n <div class=\"controls\">\n <button id=\"btn-refresh\" class=\"icon-btn\" aria-label=\"Men\u00fcdaten aktualisieren\" title=\"Men\u00fcdaten neu laden\">\n <span class=\"material-icons-round\">refresh</span>\n </button>\n <button id=\"btn-highlights\" class=\"icon-btn\" aria-label=\"Pers\u00f6nliche Highlights verwalten\" title=\"Pers\u00f6nliche Highlights verwalten\">\n <span class=\"material-icons-round\">label</span>\n </button>\n <div class=\"nav-group\">\n <button id=\"btn-this-week\" class=\"nav-btn active\">Diese Woche</button>\n <button id=\"btn-next-week\" class=\"nav-btn\">N\u00e4chste Woche</button>\n </div>\n <button id=\"theme-toggle\" class=\"icon-btn\" aria-label=\"Toggle Theme\">\n <span class=\"material-icons-round theme-icon\">light_mode</span>\n </button>\n <button id=\"btn-login-open\" class=\"user-badge-btn icon-btn-small\">\n <span class=\"material-icons-round\">login</span>\n <span>Anmelden</span>\n </button>\n <div id=\"user-info\" class=\"user-badge hidden\">\n <span class=\"material-icons-round\">person</span>\n <span id=\"user-id-display\"></span>\n <button id=\"btn-logout\" class=\"icon-btn-small\" aria-label=\"Logout\">\n <span class=\"material-icons-round\">logout</span>\n </button>\n </div>\n </div>\n </div>\n </header>\n\n <div id=\"login-modal\" class=\"modal hidden\">\n <div class=\"modal-content\">\n <div class=\"modal-header\">\n <h2>Login</h2>\n <button id=\"btn-login-close\" class=\"icon-btn\" aria-label=\"Close\">\n <span class=\"material-icons-round\">close</span>\n </button>\n </div>\n <form id=\"login-form\">\n <div class=\"form-group\">\n <label for=\"employee-id\">Mitarbeiternummer</label>\n <input type=\"text\" id=\"employee-id\" name=\"employee-id\" placeholder=\"z.B. 2041\" required>\n <small class=\"help-text\">Deine offizielle Knapp Mitarbeiternummer.</small>\n </div>\n <div class=\"form-group\">\n <label for=\"password\">Passwort</label>\n <input type=\"password\" id=\"password\" name=\"password\" placeholder=\"Bessa Passwort\" required>\n <small class=\"help-text\">Das Passwort f\u00fcr deinen Bessa Account.</small>\n </div>\n <div id=\"login-error\" class=\"error-msg hidden\"></div>\n <div class=\"modal-actions\">\n <button type=\"submit\" class=\"btn-primary wide\">Einloggen</button>\n </div>\n </form>\n </div>\n </div>\n\n <div id=\"progress-modal\" class=\"modal hidden\">\n <div class=\"modal-content\">\n <div class=\"modal-header\">\n <h2>Men\u00fcdaten aktualisieren</h2>\n </div>\n <div class=\"modal-body\" style=\"padding: 20px;\">\n <div class=\"progress-container\">\n <div class=\"progress-bar\">\n <div id=\"progress-fill\" class=\"progress-fill\"></div>\n </div>\n <div id=\"progress-percent\" class=\"progress-percent\">0%</div>\n </div>\n <p id=\"progress-message\" class=\"progress-message\">Initialisierung...</p>\n </div>\n </div>\n </div>\n\n <div id=\"highlights-modal\" class=\"modal hidden\">\n <div class=\"modal-content\">\n <div class=\"modal-header\">\n <h2>Meine Highlights</h2>\n <button id=\"btn-highlights-close\" class=\"icon-btn\" aria-label=\"Close\">\n <span class=\"material-icons-round\">close</span>\n </button>\n </div>\n <div class=\"modal-body\">\n <p style=\"margin-bottom: 1rem; color: var(--text-secondary);\">\n Markiere Men\u00fcs automatisch, wenn sie diese Schlagw\u00f6rter enthalten.\n </p>\n <div class=\"input-group\">\n <input type=\"text\" id=\"tag-input\" placeholder=\"z.B. Schnitzel, Vegetarisch...\">\n <button id=\"btn-add-tag\" class=\"btn-primary\">Hinzuf\u00fcgen</button>\n </div>\n <div id=\"tags-list\"></div>\n </div>\n </div>\n </div>\n\n <main class=\"container\">\n <div id=\"last-updated-banner\" class=\"banner hidden\">\n <span class=\"material-icons-round\">update</span>\n <span id=\"last-updated-text\">Gerade aktualisiert</span>\n </div>\n <div id=\"loading\" class=\"loading-state\">\n <div class=\"spinner\"></div>\n <p>Lade Men\u00fcdaten...</p>\n </div>\n <div id=\"menu-container\" class=\"menu-grid\"></div>\n </main>\n\n <footer class=\"app-footer\">\n <p>Bessa Knapp-Kantine Wrapper &bull; <span id=\"current-year\">${new Date().getFullYear()}</span></p>\n </footer>\n </div>`;\n }\n\n // === Bind Events ===\n function bindEvents() {\n const btnThisWeek = document.getElementById('btn-this-week');\n const btnNextWeek = document.getElementById('btn-next-week');\n const btnRefresh = document.getElementById('btn-refresh');\n const themeToggle = document.getElementById('theme-toggle');\n const btnLoginOpen = document.getElementById('btn-login-open');\n const btnLoginClose = document.getElementById('btn-login-close');\n const btnLogout = document.getElementById('btn-logout');\n const loginForm = document.getElementById('login-form');\n const loginModal = document.getElementById('login-modal');\n\n // Highlights Modal\n const btnHighlights = document.getElementById('btn-highlights');\n const highlightsModal = document.getElementById('highlights-modal');\n const btnHighlightsClose = document.getElementById('btn-highlights-close');\n const btnAddTag = document.getElementById('btn-add-tag');\n const tagInput = document.getElementById('tag-input');\n\n btnHighlights.addEventListener('click', () => {\n highlightsModal.classList.remove('hidden');\n renderTagsList();\n tagInput.focus();\n });\n\n btnHighlightsClose.addEventListener('click', () => {\n highlightsModal.classList.add('hidden');\n });\n\n window.addEventListener('click', (e) => {\n if (e.target === highlightsModal) highlightsModal.classList.add('hidden');\n });\n\n btnAddTag.addEventListener('click', () => {\n const tag = tagInput.value;\n if (addHighlightTag(tag)) {\n tagInput.value = '';\n renderTagsList();\n }\n });\n\n tagInput.addEventListener('keypress', (e) => {\n if (e.key === 'Enter') {\n btnAddTag.click();\n }\n });\n\n // Theme\n const savedTheme = localStorage.getItem('theme');\n const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;\n const themeIcon = themeToggle.querySelector('.theme-icon');\n\n if (savedTheme === 'dark' || (!savedTheme && prefersDark)) {\n document.documentElement.setAttribute('data-theme', 'dark');\n themeIcon.textContent = 'dark_mode';\n } else {\n document.documentElement.setAttribute('data-theme', 'light');\n themeIcon.textContent = 'light_mode';\n }\n\n themeToggle.addEventListener('click', () => {\n const current = document.documentElement.getAttribute('data-theme');\n const next = current === 'dark' ? 'light' : 'dark';\n document.documentElement.setAttribute('data-theme', next);\n localStorage.setItem('theme', next);\n themeIcon.textContent = next === 'dark' ? 'dark_mode' : 'light_mode';\n });\n\n // Navigation\n btnThisWeek.addEventListener('click', () => {\n if (displayMode !== 'this-week') {\n displayMode = 'this-week';\n btnThisWeek.classList.add('active');\n btnNextWeek.classList.remove('active');\n renderVisibleWeeks();\n }\n });\n\n btnNextWeek.addEventListener('click', () => {\n if (displayMode !== 'next-week') {\n displayMode = 'next-week';\n btnNextWeek.classList.add('active');\n btnThisWeek.classList.remove('active');\n renderVisibleWeeks();\n }\n });\n\n // Refresh \u2013 fetch fresh data from Bessa API\n btnRefresh.addEventListener('click', () => {\n if (!authToken) {\n loginModal.classList.remove('hidden');\n return;\n }\n loadMenuDataFromAPI();\n });\n\n // Login Modal\n btnLoginOpen.addEventListener('click', () => {\n loginModal.classList.remove('hidden');\n document.getElementById('login-error').classList.add('hidden');\n loginForm.reset();\n });\n\n btnLoginClose.addEventListener('click', () => {\n loginModal.classList.add('hidden');\n });\n\n window.addEventListener('click', (e) => {\n if (e.target === loginModal) loginModal.classList.add('hidden');\n });\n\n // Login Form Submit\n loginForm.addEventListener('submit', async (e) => {\n e.preventDefault();\n const employeeId = document.getElementById('employee-id').value.trim();\n const password = document.getElementById('password').value;\n const loginError = document.getElementById('login-error');\n const submitBtn = loginForm.querySelector('button[type=\"submit\"]');\n const originalText = submitBtn.textContent;\n\n submitBtn.disabled = true;\n submitBtn.textContent = 'Wird eingeloggt...';\n\n try {\n const email = `knapp-${employeeId}@bessa.app`;\n const response = await fetch(`${API_BASE}/auth/login/`, {\n method: 'POST',\n headers: apiHeaders(GUEST_TOKEN),\n body: JSON.stringify({ email, password })\n });\n\n const data = await response.json();\n\n if (response.ok) {\n authToken = data.key;\n currentUser = employeeId;\n sessionStorage.setItem('kantine_authToken', data.key);\n sessionStorage.setItem('kantine_currentUser', employeeId);\n\n // Fetch user name\n try {\n const userResp = await fetch(`${API_BASE}/auth/user/`, {\n headers: apiHeaders(authToken)\n });\n if (userResp.ok) {\n const userData = await userResp.json();\n if (userData.first_name) sessionStorage.setItem('kantine_firstName', userData.first_name);\n if (userData.last_name) sessionStorage.setItem('kantine_lastName', userData.last_name);\n }\n } catch (err) {\n console.error('Failed to fetch user info:', err);\n }\n\n updateAuthUI();\n loginModal.classList.add('hidden');\n fetchOrders();\n loginForm.reset();\n startPolling();\n\n // Reload menu data with auth for full details\n loadMenuDataFromAPI();\n } else {\n loginError.textContent = data.non_field_errors?.[0] || data.error || 'Login fehlgeschlagen';\n loginError.classList.remove('hidden');\n }\n } catch (error) {\n console.error('Login error:', error);\n loginError.textContent = 'Ein Fehler ist aufgetreten';\n loginError.classList.remove('hidden');\n } finally {\n submitBtn.disabled = false;\n submitBtn.textContent = originalText;\n }\n });\n\n // Logout\n btnLogout.addEventListener('click', () => {\n sessionStorage.removeItem('kantine_authToken');\n sessionStorage.removeItem('kantine_currentUser');\n sessionStorage.removeItem('kantine_firstName');\n sessionStorage.removeItem('kantine_lastName');\n authToken = null;\n currentUser = null;\n orderMap = new Map();\n stopPolling();\n updateAuthUI();\n renderVisibleWeeks();\n });\n }\n\n // === Auth UI ===\n function updateAuthUI() {\n // Try to recover session from Bessa's storage if not already logged in\n if (!authToken) {\n try {\n const akita = localStorage.getItem('AkitaStores');\n if (akita) {\n const parsed = JSON.parse(akita);\n if (parsed.auth && parsed.auth.token) {\n console.log('Found existing Bessa session!');\n authToken = parsed.auth.token;\n sessionStorage.setItem('kantine_authToken', authToken);\n\n if (parsed.auth.user) {\n currentUser = parsed.auth.user.id || 'unknown';\n sessionStorage.setItem('kantine_currentUser', currentUser);\n if (parsed.auth.user.firstName) sessionStorage.setItem('kantine_firstName', parsed.auth.user.firstName);\n if (parsed.auth.user.lastName) sessionStorage.setItem('kantine_lastName', parsed.auth.user.lastName);\n }\n }\n }\n } catch (e) {\n console.warn('Failed to parse AkitaStores:', e);\n }\n }\n\n authToken = sessionStorage.getItem('kantine_authToken');\n currentUser = sessionStorage.getItem('kantine_currentUser');\n const firstName = sessionStorage.getItem('kantine_firstName');\n const btnLoginOpen = document.getElementById('btn-login-open');\n const userInfo = document.getElementById('user-info');\n const userIdDisplay = document.getElementById('user-id-display');\n\n if (authToken) {\n btnLoginOpen.classList.add('hidden');\n userInfo.classList.remove('hidden');\n userIdDisplay.textContent = firstName || (currentUser ? `User ${currentUser}` : 'Angemeldet');\n fetchOrders(); // Always fetch fresh orders on auth update\n } else {\n btnLoginOpen.classList.remove('hidden');\n userInfo.classList.add('hidden');\n userIdDisplay.textContent = '';\n }\n\n renderVisibleWeeks();\n }\n\n // === Fetch Orders from Bessa ===\n async function fetchOrders() {\n if (!authToken) return;\n try {\n // Use user/orders endpoint for reliable history\n const response = await fetch(`${API_BASE}/user/orders/?venue=${VENUE_ID}&ordering=-created&limit=50`, {\n headers: apiHeaders(authToken)\n });\n const data = await response.json();\n\n if (response.ok) {\n orderMap = new Map();\n const results = data.results || [];\n\n for (const order of results) {\n // Filter out cancelled orders (State 9)\n // Accepting State 1 (Created?), 5 (Placed?), 8 (Completed)\n // TODO: Verify exact states. Subagent saw 5=Active, 8=Completed, 9=Cancelled.\n if (order.order_state === 9) continue;\n\n // Extract date properly (it comes as ISO string)\n const orderDate = order.date.split('T')[0];\n\n for (const item of (order.items || [])) {\n const key = `${orderDate}_${item.article}`;\n if (!orderMap.has(key)) orderMap.set(key, []);\n orderMap.get(key).push(order.id);\n }\n }\n console.log(`Fetched ${results.length} orders, mapped active ones.`);\n renderVisibleWeeks();\n }\n } catch (error) {\n console.error('Error fetching orders:', error);\n }\n }\n\n // === Place Order ===\n async function placeOrder(date, articleId, name, price, description) {\n if (!authToken) return;\n try {\n // Get user data for customer object\n const userResp = await fetch(`${API_BASE}/auth/user/`, {\n headers: apiHeaders(authToken)\n });\n if (!userResp.ok) {\n showToast('Fehler: Benutzerdaten konnten nicht geladen werden', 'error');\n return;\n }\n const userData = await userResp.json();\n const now = new Date().toISOString();\n\n const orderPayload = {\n uuid: crypto.randomUUID(),\n created: now,\n updated: now,\n order_type: 7,\n items: [{\n article: articleId,\n course_group: null,\n modifiers: [],\n uuid: crypto.randomUUID(),\n name: name,\n description: description || '',\n price: String(parseFloat(price)),\n amount: 1,\n vat: '10.00',\n comment: ''\n }],\n table: null,\n total: parseFloat(price),\n tip: 0,\n currency: 'EUR',\n venue: VENUE_ID,\n states: [],\n order_state: 1,\n date: `${date}T10:00:00.000Z`,\n payment_method: 'payroll',\n customer: {\n first_name: userData.first_name,\n last_name: userData.last_name,\n email: userData.email,\n newsletter: false\n },\n preorder: false,\n delivery_fee: 0,\n cash_box_table_name: null,\n take_away: false\n };\n\n const response = await fetch(`${API_BASE}/user/orders/`, {\n method: 'POST',\n headers: apiHeaders(authToken),\n body: JSON.stringify(orderPayload)\n });\n\n if (response.ok || response.status === 201) {\n showToast(`Bestellt: ${name}`, 'success');\n await fetchOrders();\n } else {\n const data = await response.json();\n showToast(`Fehler: ${data.detail || data.non_field_errors?.[0] || 'Bestellung fehlgeschlagen'}`, 'error');\n }\n } catch (error) {\n console.error('Order error:', error);\n showToast('Netzwerkfehler bei Bestellung', 'error');\n }\n }\n\n // === Cancel Order ===\n async function cancelOrder(date, articleId, name) {\n if (!authToken) return;\n const key = `${date}_${articleId}`;\n const orderIds = orderMap.get(key);\n if (!orderIds || orderIds.length === 0) return;\n\n // LIFO: cancel most recent\n const orderId = orderIds[orderIds.length - 1];\n try {\n const response = await fetch(`${API_BASE}/user/orders/${orderId}/cancel/`, {\n method: 'PATCH',\n headers: apiHeaders(authToken),\n body: JSON.stringify({})\n });\n\n if (response.ok) {\n showToast(`Storniert: ${name}`, 'success');\n await fetchOrders();\n } else {\n const data = await response.json();\n showToast(`Fehler: ${data.detail || 'Stornierung fehlgeschlagen'}`, 'error');\n }\n } catch (error) {\n console.error('Cancel error:', error);\n showToast('Netzwerkfehler bei Stornierung', 'error');\n }\n }\n\n // === Flag Management (localStorage) ===\n function saveFlags() {\n localStorage.setItem('kantine_flags', JSON.stringify([...userFlags]));\n }\n\n function toggleFlag(date, articleId, name, cutoff) {\n const id = `${date}_${articleId}`;\n if (userFlags.has(id)) {\n userFlags.delete(id);\n showToast(`Flag entfernt f\u00fcr ${name}`, 'success');\n } else {\n userFlags.add(id);\n showToast(`Benachrichtigung aktiviert f\u00fcr ${name}`, 'success');\n if (Notification.permission === 'default') {\n Notification.requestPermission();\n }\n }\n saveFlags();\n renderVisibleWeeks();\n }\n\n // FR-019: Auto-remove flags whose cutoff has passed\n function cleanupExpiredFlags() {\n const now = new Date();\n let changed = false;\n for (const flagId of [...userFlags]) {\n const [date] = flagId.split('_');\n const cutoff = new Date(date);\n cutoff.setHours(10, 0, 0, 0); // Standard cutoff 10:00\n if (now >= cutoff) {\n userFlags.delete(flagId);\n changed = true;\n }\n }\n if (changed) saveFlags();\n }\n\n // === Polling (Client-Side) ===\n function startPolling() {\n if (pollIntervalId) return;\n if (!authToken) return;\n pollIntervalId = setInterval(() => pollFlaggedItems(), POLL_INTERVAL_MS);\n console.log('Polling started (every 5 min)');\n }\n\n function stopPolling() {\n if (pollIntervalId) {\n clearInterval(pollIntervalId);\n pollIntervalId = null;\n console.log('Polling stopped');\n }\n }\n\n async function pollFlaggedItems() {\n if (userFlags.size === 0 || !authToken) return;\n console.log(`Polling ${userFlags.size} flagged items...`);\n\n for (const flagId of userFlags) {\n const [date, articleIdStr] = flagId.split('_');\n const articleId = parseInt(articleIdStr);\n\n try {\n const response = await fetch(`${API_BASE}/venues/${VENUE_ID}/menu/${MENU_ID}/${date}/`, {\n headers: apiHeaders(authToken)\n });\n if (!response.ok) continue;\n\n const data = await response.json();\n const groups = data.results || [];\n let foundItem = null;\n for (const group of groups) {\n if (group.items) {\n foundItem = group.items.find(i => i.id === articleId || i.article === articleId);\n if (foundItem) break;\n }\n }\n\n if (foundItem) {\n const isAvailable = (foundItem.amount_tracking === false) || (parseInt(foundItem.available_amount) > 0);\n if (isAvailable) {\n const itemName = foundItem.name || 'Unbekannt';\n showToast(`${itemName} ist jetzt verf\u00fcgbar!`, 'success');\n if (Notification.permission === 'granted') {\n new Notification('Kantine Wrapper', {\n body: `${itemName} ist jetzt verf\u00fcgbar!`,\n icon: '\ud83c\udf7d\ufe0f'\n });\n }\n // Refresh menu data to update UI\n loadMenuDataFromAPI();\n }\n }\n } catch (err) {\n console.error(`Poll error for ${flagId}:`, err);\n // Small delay between checks\n await new Promise(r => setTimeout(r, 200));\n }\n }\n }\n\n // === Highlight Management ===\n let highlightTags = JSON.parse(localStorage.getItem('kantine_highlightTags') || '[]');\n\n function saveHighlightTags() {\n localStorage.setItem('kantine_highlightTags', JSON.stringify(highlightTags));\n renderVisibleWeeks(); // Refresh UI to apply changes\n updateNextWeekBadge();\n }\n\n function addHighlightTag(tag) {\n tag = tag.trim().toLowerCase();\n if (tag && !highlightTags.includes(tag)) {\n highlightTags.push(tag);\n saveHighlightTags();\n return true;\n }\n return false;\n }\n\n function removeHighlightTag(tag) {\n highlightTags = highlightTags.filter(t => t !== tag);\n saveHighlightTags();\n }\n\n function renderTagsList() {\n const list = document.getElementById('tags-list');\n list.innerHTML = '';\n highlightTags.forEach(tag => {\n const badge = document.createElement('span');\n badge.className = 'tag-badge';\n badge.innerHTML = `${tag} <span class=\"tag-remove\" data-tag=\"${tag}\">&times;</span>`;\n list.appendChild(badge);\n });\n\n // Bind remove events\n list.querySelectorAll('.tag-remove').forEach(btn => {\n btn.addEventListener('click', (e) => {\n removeHighlightTag(e.target.dataset.tag);\n renderTagsList();\n });\n });\n }\n\n function checkHighlight(text) {\n if (!text) return false;\n text = text.toLowerCase();\n return highlightTags.some(tag => text.includes(tag));\n }\n\n // === Local Menu Cache (localStorage) ===\n const CACHE_KEY = 'kantine_menuCache';\n const CACHE_TS_KEY = 'kantine_menuCacheTs';\n\n function saveMenuCache() {\n try {\n localStorage.setItem(CACHE_KEY, JSON.stringify(allWeeks));\n localStorage.setItem(CACHE_TS_KEY, new Date().toISOString());\n } catch (e) {\n console.warn('Failed to cache menu data:', e);\n }\n }\n\n function loadMenuCache() {\n try {\n const cached = localStorage.getItem(CACHE_KEY);\n const cachedTs = localStorage.getItem(CACHE_TS_KEY);\n if (cached) {\n allWeeks = JSON.parse(cached);\n currentWeekNumber = getISOWeek(new Date());\n currentYear = new Date().getFullYear();\n renderVisibleWeeks();\n updateNextWeekBadge();\n if (cachedTs) updateLastUpdatedTime(cachedTs);\n console.log('Loaded menu from cache');\n return true;\n }\n } catch (e) {\n console.warn('Failed to load cached menu:', e);\n }\n return false;\n }\n\n // === Menu Data Fetching (Direct from Bessa API) ===\n async function loadMenuDataFromAPI() {\n const loading = document.getElementById('loading');\n const progressModal = document.getElementById('progress-modal');\n const progressFill = document.getElementById('progress-fill');\n const progressPercent = document.getElementById('progress-percent');\n const progressMessage = document.getElementById('progress-message');\n\n loading.classList.remove('hidden');\n\n const token = authToken || GUEST_TOKEN;\n\n try {\n // Show progress modal\n progressModal.classList.remove('hidden');\n progressMessage.textContent = 'Hole verf\u00fcgbare Daten...';\n progressFill.style.width = '0%';\n progressPercent.textContent = '0%';\n\n // 1. Fetch available dates\n const datesResponse = await fetch(`${API_BASE}/venues/${VENUE_ID}/menu/dates/`, {\n headers: apiHeaders(token)\n });\n\n if (!datesResponse.ok) throw new Error(`Failed to fetch dates: ${datesResponse.status}`);\n\n const datesData = await datesResponse.json();\n let availableDates = datesData.results || [];\n\n // Filter \u2013 last 7 days + future, limit 30\n const cutoff = new Date();\n cutoff.setDate(cutoff.getDate() - 7);\n const cutoffStr = cutoff.toISOString().split('T')[0];\n\n availableDates = availableDates\n .filter(d => d.date >= cutoffStr)\n .sort((a, b) => a.date.localeCompare(b.date))\n .slice(0, 30);\n\n const totalDates = availableDates.length;\n progressMessage.textContent = `${totalDates} Tage gefunden. Lade Details...`;\n\n // 2. Fetch details for each date\n const allDays = [];\n let completed = 0;\n\n for (const dateObj of availableDates) {\n const dateStr = dateObj.date;\n const pct = Math.round(((completed + 1) / totalDates) * 100);\n progressFill.style.width = `${pct}%`;\n progressPercent.textContent = `${pct}%`;\n progressMessage.textContent = `Lade Men\u00fc f\u00fcr ${dateStr}...`;\n\n try {\n const detailResp = await fetch(`${API_BASE}/venues/${VENUE_ID}/menu/${MENU_ID}/${dateStr}/`, {\n headers: apiHeaders(token)\n });\n\n if (detailResp.ok) {\n const detailData = await detailResp.json();\n // Debug: log raw API response for first date\n if (completed === 0) {\n console.log('[Kantine Debug] Raw API response for', dateStr, ':', JSON.stringify(detailData).substring(0, 2000));\n }\n const menuGroups = detailData.results || [];\n let dayItems = [];\n for (const group of menuGroups) {\n if (group.items && Array.isArray(group.items)) {\n dayItems = dayItems.concat(group.items);\n }\n }\n if (dayItems.length > 0) {\n // Debug: log first item structure\n if (completed === 0) {\n console.log('[Kantine Debug] First item keys:', Object.keys(dayItems[0]));\n console.log('[Kantine Debug] First item:', JSON.stringify(dayItems[0]).substring(0, 500));\n }\n allDays.push({\n date: dateStr,\n menu_items: dayItems,\n orders: dateObj.orders || []\n });\n }\n }\n } catch (err) {\n console.error(`Failed to fetch details for ${dateStr}:`, err);\n }\n\n completed++;\n // Small delay to avoid rate limiting\n await new Promise(r => setTimeout(r, 100));\n }\n\n // 3. Group by ISO week (Merge with existing to preserve past days)\n const weeksMap = new Map();\n\n // Hydrate from existing cache (preserve past data)\n if (allWeeks && allWeeks.length > 0) {\n allWeeks.forEach(w => {\n const key = `${w.year}-${w.weekNumber}`;\n try {\n weeksMap.set(key, {\n year: w.year,\n weekNumber: w.weekNumber,\n days: w.days ? w.days.map(d => ({ ...d, items: d.items ? [...d.items] : [] })) : []\n });\n } catch (e) { console.warn('Error hydrating week:', e); }\n });\n }\n\n for (const day of allDays) {\n const d = new Date(day.date);\n const weekNum = getISOWeek(d);\n const year = getWeekYear(d);\n const key = `${year}-${weekNum}`;\n\n if (!weeksMap.has(key)) {\n weeksMap.set(key, { year, weekNumber: weekNum, days: [] });\n }\n\n const weekObj = weeksMap.get(key);\n const weekday = d.toLocaleDateString('en-US', { weekday: 'long' });\n const orderCutoffDate = new Date(day.date);\n orderCutoffDate.setHours(10, 0, 0, 0);\n\n const newDayObj = {\n date: day.date,\n weekday: weekday,\n orderCutoff: orderCutoffDate.toISOString(),\n items: day.menu_items.map(item => {\n const isUnlimited = item.amount_tracking === false;\n const hasStock = parseInt(item.available_amount) > 0;\n return {\n id: `${day.date}_${item.id}`,\n articleId: item.id,\n name: item.name || 'Unknown',\n description: item.description || '',\n price: parseFloat(item.price) || 0,\n available: isUnlimited || hasStock,\n availableAmount: parseInt(item.available_amount) || 0,\n amountTracking: item.amount_tracking !== false\n };\n })\n };\n\n // Merge: Overwrite if exists, push if new\n const existingIndex = weekObj.days.findIndex(existing => existing.date === day.date);\n if (existingIndex >= 0) {\n weekObj.days[existingIndex] = newDayObj;\n } else {\n weekObj.days.push(newDayObj);\n }\n }\n\n // Sort weeks and days\n allWeeks = Array.from(weeksMap.values()).sort((a, b) => {\n if (a.year !== b.year) return a.year - b.year;\n return a.weekNumber - b.weekNumber;\n });\n allWeeks.forEach(w => {\n if (w.days) w.days.sort((a, b) => a.date.localeCompare(b.date));\n });\n\n // Save to localStorage cache\n saveMenuCache();\n\n // Update timestamp\n updateLastUpdatedTime(new Date().toISOString());\n\n currentWeekNumber = getISOWeek(new Date());\n currentYear = new Date().getFullYear();\n\n\n\n updateAuthUI(); // This will trigger fetchOrders if logged in\n renderVisibleWeeks();\n updateNextWeekBadge();\n\n progressMessage.textContent = 'Fertig!';\n setTimeout(() => progressModal.classList.add('hidden'), 500);\n\n } catch (error) {\n console.error('Error fetching menu:', error);\n progressModal.classList.add('hidden');\n\n showErrorModal(\n 'Keine Verbindung',\n `Die Men\u00fcdaten konnten nicht geladen werden. M\u00f6glicherweise besteht keine Verbindung zur API oder zur Bessa-Webseite.<br><br><small style=\"color:var(--text-secondary)\">${error.message}</small>`,\n 'Zur Original-Seite',\n 'https://web.bessa.app/knapp-kantine'\n );\n } finally {\n loading.classList.add('hidden');\n }\n }\n\n // === Last Updated Display ===\n function updateLastUpdatedTime(isoTimestamp) {\n const subtitle = document.getElementById('last-updated-subtitle');\n if (!isoTimestamp) return;\n try {\n const date = new Date(isoTimestamp);\n const timeStr = date.toLocaleTimeString('de-DE', { hour: '2-digit', minute: '2-digit' });\n const dateStr = date.toLocaleDateString('de-DE', { day: '2-digit', month: '2-digit' });\n subtitle.textContent = `Aktualisiert: ${dateStr} ${timeStr}`;\n } catch (e) {\n subtitle.textContent = '';\n }\n }\n\n // === Toast Notification ===\n function showToast(message, type = 'info') {\n let container = document.getElementById('toast-container');\n if (!container) {\n container = document.createElement('div');\n container.id = 'toast-container';\n document.body.appendChild(container);\n }\n const toast = document.createElement('div');\n toast.className = `toast toast-${type}`;\n const icon = type === 'success' ? 'check_circle' : type === 'error' ? 'error' : 'info';\n toast.innerHTML = `<span class=\"material-icons-round\">${icon}</span><span>${message}</span>`;\n container.appendChild(toast);\n requestAnimationFrame(() => toast.classList.add('show'));\n setTimeout(() => {\n toast.classList.remove('show');\n setTimeout(() => toast.remove(), 300);\n }, 3000);\n }\n\n // === Next Week Badge ===\n function updateNextWeekBadge() {\n const btnNextWeek = document.getElementById('btn-next-week');\n let nextWeek = currentWeekNumber + 1;\n let nextYear = currentYear;\n if (nextWeek > 52) { nextWeek = 1; nextYear++; }\n\n const nextWeekData = allWeeks.find(w => w.weekNumber === nextWeek && w.year === nextYear);\n let totalDataCount = 0;\n let orderableCount = 0;\n let daysWithOrders = 0;\n let daysWithOrderableAndNoOrder = 0;\n\n if (nextWeekData && nextWeekData.days) {\n nextWeekData.days.forEach(day => {\n if (day.items && day.items.length > 0) {\n totalDataCount++;\n const isOrderable = day.items.some(item => item.available);\n if (isOrderable) orderableCount++;\n\n let hasOrder = false;\n day.items.forEach(item => {\n const articleId = item.articleId || parseInt(item.id.split('_')[1]);\n const key = `${day.date}_${articleId}`;\n if (orderMap.has(key) && orderMap.get(key).length > 0) hasOrder = true;\n });\n\n if (hasOrder) daysWithOrders++;\n if (isOrderable && !hasOrder) daysWithOrderableAndNoOrder++;\n }\n });\n }\n\n let badge = btnNextWeek.querySelector('.nav-badge');\n if (totalDataCount > 0) {\n if (!badge) {\n badge = document.createElement('span');\n badge.className = 'nav-badge';\n btnNextWeek.appendChild(badge);\n }\n\n // Format: ( Ordered / Orderable / Total )\n badge.title = `${daysWithOrders} bestellt / ${orderableCount} bestellbar / ${totalDataCount} gesamt`;\n badge.innerHTML = `<span class=\"ordered\">${daysWithOrders}</span><span class=\"separator\">/</span><span class=\"orderable\">${orderableCount}</span><span class=\"separator\">/</span><span class=\"total\">${totalDataCount}</span>`;\n\n // Color Logic\n badge.classList.remove('badge-violet', 'badge-green', 'badge-red', 'badge-blue');\n\n // Refined Logic (v1.7.4):\n // Violet: If we have orders AND there are no DAYS left that are orderable but un-ordered.\n // (i.e. \"I have ordered everything I can\")\n if (daysWithOrders > 0 && daysWithOrderableAndNoOrder === 0) {\n badge.classList.add('badge-violet');\n } else if (daysWithOrderableAndNoOrder > 0) {\n badge.classList.add('badge-green'); // Orderable days exist without order\n } else if (orderableCount === 0) {\n badge.classList.add('badge-red'); // No orderable days at all & no orders\n } else {\n badge.classList.add('badge-blue'); // Default / partial state\n }\n\n // Advanced Feature: Highlight Count\n let highlightCount = 0;\n if (nextWeekData && nextWeekData.days) {\n nextWeekData.days.forEach(day => {\n day.items.forEach(item => {\n if (checkHighlight(item.name) || checkHighlight(item.description)) {\n highlightCount++;\n }\n });\n });\n }\n\n if (highlightCount > 0) {\n // Append blue count\n badge.innerHTML += `<span class=\"highlight-count\" title=\"${highlightCount} Highlight Men\u00fcs\">(${highlightCount})</span>`;\n badge.title += ` \u2022 ${highlightCount} Highlights gefunden`;\n badge.classList.add('has-highlights');\n }\n\n } else if (badge) {\n badge.remove();\n }\n }\n\n // === Weekly Cost ===\n function updateWeeklyCost(days) {\n let totalCost = 0;\n if (days && days.length > 0) {\n days.forEach(day => {\n if (day.items) {\n day.items.forEach(item => {\n const articleId = item.articleId || parseInt(item.id.split('_')[1]);\n const key = `${day.date}_${articleId}`;\n const orders = orderMap.get(key) || [];\n if (orders.length > 0) totalCost += item.price * orders.length;\n });\n }\n });\n }\n\n const costDisplay = document.getElementById('weekly-cost-display');\n if (totalCost > 0) {\n costDisplay.innerHTML = `<span class=\"material-icons-round\">shopping_bag</span> <span>Gesamt: ${totalCost.toFixed(2).replace('.', ',')} \u20ac</span>`;\n costDisplay.classList.remove('hidden');\n } else {\n costDisplay.classList.add('hidden');\n }\n }\n\n // === Render Weeks ===\n function renderVisibleWeeks() {\n const menuContainer = document.getElementById('menu-container');\n if (!menuContainer) return;\n menuContainer.innerHTML = '';\n\n let targetWeek = currentWeekNumber;\n let targetYear = currentYear;\n\n if (displayMode === 'next-week') {\n targetWeek++;\n if (targetWeek > 52) { targetWeek = 1; targetYear++; }\n }\n\n // Flatten & filter by week + year\n const allDays = allWeeks.flatMap(w => w.days || []);\n const daysInTargetWeek = allDays.filter(day => {\n const d = new Date(day.date);\n return getISOWeek(d) === targetWeek && getWeekYear(d) === targetYear;\n });\n\n if (daysInTargetWeek.length === 0) {\n menuContainer.innerHTML = `\n <div class=\"empty-state\">\n <p>Keine Men\u00fcdaten f\u00fcr KW ${targetWeek} (${targetYear}) verf\u00fcgbar.</p>\n <small>Versuchen Sie eine andere Woche oder schauen Sie sp\u00e4ter vorbei.</small>\n </div>`;\n document.getElementById('weekly-cost-display').classList.add('hidden');\n return;\n }\n\n updateWeeklyCost(daysInTargetWeek);\n\n // Update header\n const headerWeekInfo = document.getElementById('header-week-info');\n const weekTitle = displayMode === 'this-week' ? 'Diese Woche' : 'N\u00e4chste Woche';\n headerWeekInfo.innerHTML = `\n <div class=\"header-week-title\">${weekTitle}</div>\n <div class=\"header-week-subtitle\">Week ${targetWeek} \u2022 ${targetYear}</div>`;\n\n const grid = document.createElement('div');\n grid.className = 'days-grid';\n\n daysInTargetWeek.sort((a, b) => a.date.localeCompare(b.date));\n\n // Filter weekends\n const workingDays = daysInTargetWeek.filter(d => {\n const date = new Date(d.date);\n const day = date.getDay();\n return day !== 0 && day !== 6;\n });\n\n workingDays.forEach(day => {\n const card = createDayCard(day);\n if (card) grid.appendChild(card);\n });\n\n menuContainer.appendChild(grid);\n setTimeout(() => syncMenuItemHeights(grid), 0);\n }\n\n // === Sync Item Heights ===\n function syncMenuItemHeights(grid) {\n const cards = grid.querySelectorAll('.menu-card');\n if (cards.length === 0) return;\n let maxItems = 0;\n cards.forEach(card => {\n maxItems = Math.max(maxItems, card.querySelectorAll('.menu-item').length);\n });\n for (let i = 0; i < maxItems; i++) {\n let maxHeight = 0;\n const itemsAtPos = [];\n cards.forEach(card => {\n const items = card.querySelectorAll('.menu-item');\n if (items[i]) {\n items[i].style.height = 'auto';\n maxHeight = Math.max(maxHeight, items[i].offsetHeight);\n itemsAtPos.push(items[i]);\n }\n });\n itemsAtPos.forEach(item => { item.style.height = `${maxHeight}px`; });\n }\n }\n\n // === Create Day Card ===\n function createDayCard(day) {\n if (!day.items || day.items.length === 0) return null;\n\n const card = document.createElement('div');\n card.className = 'menu-card';\n\n const now = new Date();\n const cardDate = new Date(day.date);\n\n let isPastCutoff = false;\n if (day.orderCutoff) {\n isPastCutoff = now >= new Date(day.orderCutoff);\n } else {\n const today = new Date();\n today.setHours(0, 0, 0, 0);\n const cd = new Date(day.date);\n cd.setHours(0, 0, 0, 0);\n isPastCutoff = cd < today;\n }\n\n if (isPastCutoff) card.classList.add('past-day');\n\n // Collect ordered menu codes\n const menuBadges = [];\n if (day.items) {\n day.items.forEach(item => {\n const articleId = item.articleId || parseInt(item.id.split('_')[1]);\n const orderKey = `${day.date}_${articleId}`;\n const orders = orderMap.get(orderKey) || [];\n const count = orders.length;\n\n if (count > 0) {\n // Regex for M1, M2, M1F etc.\n const match = item.name.match(/([M][1-9][Ff]?)/);\n if (match) {\n let code = match[1];\n if (count > 1) code += '+';\n menuBadges.push(code);\n }\n }\n });\n }\n\n // Header\n const header = document.createElement('div');\n header.className = 'card-header';\n const dateStr = cardDate.toLocaleDateString('de-DE', { day: '2-digit', month: '2-digit' });\n\n const badgesHtml = menuBadges.map(code => `<span class=\"menu-code-badge\">${code}</span>`).join('');\n\n // Determine Day Status for Header Color\n // Violet: Has Order\n // Green: No Order but Orderable\n // Red: No Order and Not Orderable (Locked/Sold Out)\n let headerClass = '';\n const hasAnyOrder = day.items && day.items.some(item => {\n const articleId = item.articleId || parseInt(item.id.split('_')[1]);\n const key = `${day.date}_${articleId}`;\n return orderMap.has(key) && orderMap.get(key).length > 0;\n });\n\n const hasOrderable = day.items && day.items.some(item => {\n // Use pre-calculated available flag from loadMenuDataFromAPI calculation\n return item.available;\n });\n\n if (hasAnyOrder) {\n headerClass = 'header-violet';\n } else if (hasOrderable && !isPastCutoff) {\n headerClass = 'header-green';\n } else {\n // Red if not orderable (or past cutoff)\n headerClass = 'header-red';\n }\n\n if (headerClass) header.classList.add(headerClass);\n\n header.innerHTML = `\n <div class=\"day-header-left\">\n <span class=\"day-name\">${translateDay(day.weekday)}</span>\n <div class=\"day-badges\">${badgesHtml}</div>\n </div>\n <span class=\"day-date\">${dateStr}</span>`;\n card.appendChild(header);\n\n // Body\n const body = document.createElement('div');\n body.className = 'card-body';\n\n const todayDateStr = new Date().toISOString().split('T')[0];\n const isToday = day.date === todayDateStr;\n\n const sortedItems = [...day.items].sort((a, b) => {\n if (isToday) {\n const aId = a.articleId || parseInt(a.id.split('_')[1]);\n const bId = b.articleId || parseInt(b.id.split('_')[1]);\n const aOrdered = orderMap.has(`${day.date}_${aId}`);\n const bOrdered = orderMap.has(`${day.date}_${bId}`);\n\n if (aOrdered && !bOrdered) return -1;\n if (!aOrdered && bOrdered) return 1;\n }\n return a.name.localeCompare(b.name);\n });\n\n sortedItems.forEach(item => {\n const itemEl = document.createElement('div');\n itemEl.className = 'menu-item';\n\n const articleId = item.articleId || parseInt(item.id.split('_')[1]);\n const orderKey = `${day.date}_${articleId}`;\n const orderIds = orderMap.get(orderKey) || [];\n const orderCount = orderIds.length;\n\n // Status badge\n let statusBadge = '';\n if (item.available) {\n statusBadge = item.amountTracking\n ? `<span class=\"badge available\">Verf\u00fcgbar (${item.availableAmount})</span>`\n : `<span class=\"badge available\">Verf\u00fcgbar</span>`;\n } else {\n statusBadge = `<span class=\"badge sold-out\">Ausverkauft</span>`;\n }\n\n // Order badge\n let orderedBadge = '';\n if (orderCount > 0) {\n const countBadge = orderCount > 1 ? `<span class=\"order-count-badge\">${orderCount}</span>` : '';\n orderedBadge = `<span class=\"badge ordered\"><span class=\"material-icons-round\">check_circle</span> Bestellt${countBadge}</span>`;\n itemEl.classList.add('ordered');\n if (new Date(day.date).toDateString() === now.toDateString()) {\n itemEl.classList.add('today-ordered');\n }\n }\n\n // Flagged styles\n const flagId = `${day.date}_${articleId}`;\n const isFlagged = userFlags.has(flagId);\n if (isFlagged) {\n itemEl.classList.add(item.available ? 'flagged-available' : 'flagged-sold-out');\n }\n\n // Action buttons\n let orderButton = '';\n let cancelButton = '';\n let flagButton = '';\n\n if (authToken && !isPastCutoff) {\n // Flag button\n const flagIcon = isFlagged ? 'notifications_active' : 'notifications_none';\n const flagClass = isFlagged ? 'btn-flag active' : 'btn-flag';\n const flagTitle = isFlagged ? 'Benachrichtigung deaktivieren' : 'Benachrichtigen wenn verf\u00fcgbar';\n if (!item.available || isFlagged) {\n flagButton = `<button class=\"${flagClass}\" data-date=\"${day.date}\" data-article=\"${articleId}\" data-name=\"${escapeHtml(item.name)}\" data-cutoff=\"${day.orderCutoff}\" title=\"${flagTitle}\"><span class=\"material-icons-round\">${flagIcon}</span></button>`;\n }\n\n // Order button\n if (item.available) {\n if (orderCount > 0) {\n orderButton = `<button class=\"btn-order btn-order-compact\" data-date=\"${day.date}\" data-article=\"${articleId}\" data-name=\"${escapeHtml(item.name)}\" data-price=\"${item.price}\" data-desc=\"${escapeHtml(item.description || '')}\" title=\"${escapeHtml(item.name)} nochmal bestellen\"><span class=\"material-icons-round\">add</span></button>`;\n } else {\n orderButton = `<button class=\"btn-order\" data-date=\"${day.date}\" data-article=\"${articleId}\" data-name=\"${escapeHtml(item.name)}\" data-price=\"${item.price}\" data-desc=\"${escapeHtml(item.description || '')}\" title=\"${escapeHtml(item.name)} bestellen\"><span class=\"material-icons-round\">add_shopping_cart</span> Bestellen</button>`;\n }\n }\n\n // Cancel button\n if (orderCount > 0) {\n const cancelIcon = orderCount === 1 ? 'close' : 'remove';\n const cancelTitle = orderCount === 1 ? 'Bestellung stornieren' : 'Eine Bestellung stornieren';\n cancelButton = `<button class=\"btn-cancel\" data-date=\"${day.date}\" data-article=\"${articleId}\" data-name=\"${escapeHtml(item.name)}\" title=\"${cancelTitle}\"><span class=\"material-icons-round\">${cancelIcon}</span></button>`;\n }\n }\n\n itemEl.innerHTML = `\n <div class=\"item-header\">\n <span class=\"item-name\">${escapeHtml(item.name)}</span>\n <span class=\"item-price\">${item.price.toFixed(2)} \u20ac</span>\n </div>\n <div class=\"item-status-row\">\n ${orderedBadge}\n ${cancelButton}\n ${orderButton}\n ${flagButton}\n <div class=\"badges\">${statusBadge}</div>\n </div>\n <p class=\"item-desc\">${escapeHtml(item.description)}</p>`;\n\n // Event: Order\n const orderBtn = itemEl.querySelector('.btn-order');\n if (orderBtn) {\n orderBtn.addEventListener('click', (e) => {\n e.stopPropagation();\n const btn = e.currentTarget;\n btn.disabled = true;\n btn.classList.add('loading');\n placeOrder(btn.dataset.date, parseInt(btn.dataset.article), btn.dataset.name, parseFloat(btn.dataset.price), btn.dataset.desc || '')\n .finally(() => { btn.disabled = false; btn.classList.remove('loading'); });\n });\n }\n\n // Event: Cancel\n const cancelBtn = itemEl.querySelector('.btn-cancel');\n if (cancelBtn) {\n cancelBtn.addEventListener('click', (e) => {\n e.stopPropagation();\n const btn = e.currentTarget;\n btn.disabled = true;\n cancelOrder(btn.dataset.date, parseInt(btn.dataset.article), btn.dataset.name)\n .finally(() => { btn.disabled = false; });\n });\n }\n\n // Event: Flag\n const flagBtn = itemEl.querySelector('.btn-flag');\n if (flagBtn) {\n flagBtn.addEventListener('click', (e) => {\n e.stopPropagation();\n const btn = e.currentTarget;\n toggleFlag(btn.dataset.date, parseInt(btn.dataset.article), btn.dataset.name, btn.dataset.cutoff);\n });\n }\n\n body.appendChild(itemEl);\n });\n\n card.appendChild(body);\n return card;\n }\n\n // === Version Check ===\n async function checkForUpdates() {\n const CurrentVersion = 'v1.2.0';\n const VersionUrl = 'https://raw.githubusercontent.com/TauNeutrino/kantine-overview/main/version.txt';\n const InstallerUrl = 'https://htmlpreview.github.io/?https://github.com/TauNeutrino/kantine-overview/blob/main/dist/install.html';\n\n console.log(`[Kantine] Checking for updates... (Current: ${CurrentVersion})`);\n\n try {\n const response = await fetch(VersionUrl, { cache: 'no-cache' });\n if (!response.ok) return;\n\n const remoteVersion = (await response.text()).trim();\n\n if (remoteVersion && remoteVersion !== CurrentVersion) {\n console.log(`[Kantine] New version available: ${remoteVersion}`);\n\n // Fetch Changelog content\n let changeSummary = '';\n try {\n const clResp = await fetch('https://raw.githubusercontent.com/TauNeutrino/kantine-overview/main/changelog.md');\n if (clResp.ok) {\n const clText = await clResp.text();\n const match = clText.match(/## (v[^\\n]+)\\n((?:-[^\\n]+\\n)+)/);\n if (match && match[1].includes(remoteVersion)) {\n changeSummary = match[2].replace(/- /g, '\u2022 ').trim();\n }\n }\n } catch (e) { console.warn('No changelog', e); }\n\n // Create Banner\n const updateBanner = document.createElement('div');\n updateBanner.className = 'update-banner';\n updateBanner.innerHTML = `\n <div class=\"update-content\">\n <strong>Update verf\u00fcgbar: ${remoteVersion}</strong>\n ${changeSummary ? `<pre class=\"change-summary\">${changeSummary}</pre>` : ''}\n <a href=\"${InstallerUrl}\" target=\"_blank\" class=\"update-link\">\n <span class=\"material-icons-round\">system_update_alt</span>\n Jetzt aktualisieren\n </a>\n </div>\n <button class=\"icon-btn-small close-update\">&times;</button>\n `;\n\n document.body.appendChild(updateBanner);\n updateBanner.querySelector('.close-update').addEventListener('click', () => updateBanner.remove());\n\n // Highlight Header Icon\n const lastUpdatedIcon = document.querySelector('.material-icons-round.logo-icon');\n if (lastUpdatedIcon) {\n lastUpdatedIcon.style.color = 'var(--accent-color)';\n lastUpdatedIcon.parentElement.title = `Update verf\u00fcgbar: ${remoteVersion}`;\n }\n }\n } catch (error) {\n console.warn('[Kantine] Version check failed:', error);\n }\n }\n\n // === Order Countdown ===\n function updateCountdown() {\n const now = new Date();\n const currentDay = now.getDay();\n // Skip weekends (0=Sun, 6=Sat)\n if (currentDay === 0 || currentDay === 6) {\n removeCountdown();\n return;\n }\n\n const todayStr = now.toISOString().split('T')[0];\n\n // 1. Check if we already ordered for today\n let hasOrder = false;\n // Optimization: Check orderMap for today's date\n // Keys are \"YYYY-MM-DD_ArticleID\"\n for (const key of orderMap.keys()) {\n if (key.startsWith(todayStr)) {\n hasOrder = true;\n break;\n }\n }\n\n if (hasOrder) {\n removeCountdown();\n return;\n }\n\n // 2. Calculate time to cutoff (10:00 AM)\n const cutoff = new Date();\n cutoff.setHours(10, 0, 0, 0);\n\n const diff = cutoff - now;\n\n // If passed cutoff or more than 3 hours away (e.g. 07:00), maybe don't show?\n // User req: \"heute noch keine bestellung... countdown erscheinen\"\n // Let's show it if within valid order window (e.g. 00:00 - 10:00)\n\n if (diff <= 0) {\n removeCountdown();\n return;\n }\n\n // 3. Render Countdown\n const diffHrs = Math.floor(diff / 3600000);\n const diffMins = Math.floor((diff % 3600000) / 60000);\n\n const headerCenter = document.querySelector('.header-center-wrapper');\n if (!headerCenter) return;\n\n let countdownEl = document.getElementById('order-countdown');\n if (!countdownEl) {\n countdownEl = document.createElement('div');\n countdownEl.id = 'order-countdown';\n // Insert before cost display or append\n headerCenter.insertBefore(countdownEl, headerCenter.firstChild);\n }\n\n countdownEl.innerHTML = `<span>Bestellschluss:</span> <strong>${diffHrs}h ${diffMins}m</strong>`;\n\n // Red Alert if < 1 hour\n if (diff < 3600000) { // 1 hour\n countdownEl.classList.add('urgent');\n\n // Notification logic (One time)\n const notifiedKey = `kantine_notified_${todayStr}`;\n if (!sessionStorage.getItem(notifiedKey)) {\n if (Notification.permission === 'granted') {\n new Notification('Kantine: Bestellschluss naht!', {\n body: 'Du hast heute noch nichts bestellt. Nur noch 1 Stunde!',\n icon: '\u23f3'\n });\n } else if (Notification.permission === 'default') {\n Notification.requestPermission();\n }\n sessionStorage.setItem(notifiedKey, 'true');\n }\n } else {\n countdownEl.classList.remove('urgent');\n }\n }\n\n function removeCountdown() {\n const el = document.getElementById('order-countdown');\n if (el) el.remove();\n }\n\n // Update countdown every minute\n setInterval(updateCountdown, 60000);\n // Also update on load\n setTimeout(updateCountdown, 1000);\n\n // === Helpers === \n function getISOWeek(date) {\n const d = new Date(Date.UTC(date.getFullYear(), date.getMonth(), date.getDate()));\n const dayNum = d.getUTCDay() || 7;\n d.setUTCDate(d.getUTCDate() + 4 - dayNum);\n const yearStart = new Date(Date.UTC(d.getUTCFullYear(), 0, 1));\n return Math.ceil(((d - yearStart) / 86400000 + 1) / 7);\n }\n\n function getWeekYear(d) {\n const date = new Date(d.getTime());\n date.setDate(date.getDate() + 3 - (date.getDay() + 6) % 7);\n return date.getFullYear();\n }\n\n\n function translateDay(englishDay) {\n const map = { Monday: 'Montag', Tuesday: 'Dienstag', Wednesday: 'Mittwoch', Thursday: 'Donnerstag', Friday: 'Freitag', Saturday: 'Samstag', Sunday: 'Sonntag' };\n return map[englishDay] || englishDay;\n }\n\n function escapeHtml(text) {\n const div = document.createElement('div');\n div.textContent = text || '';\n return div.innerHTML;\n }\n\n // === Bootstrap ===\n injectUI();\n bindEvents();\n updateAuthUI();\n cleanupExpiredFlags();\n\n // Load cached data first for instant UI, then refresh from API\n const hadCache = loadMenuCache();\n if (hadCache) {\n // Hide loading spinner since cache is shown\n document.getElementById('loading').classList.add('hidden');\n }\n loadMenuDataFromAPI();\n\n // Auto-start polling if already logged in\n if (authToken) {\n startPolling();\n }\n\n // Check for updates\n checkForUpdates();\n\n console.log('Kantine Wrapper loaded \u2705');\n})();\n\n// === Error Modal ===\nfunction showErrorModal(title, htmlContent, btnText, url) {\n const modalId = 'error-modal';\n let modal = document.getElementById(modalId);\n if (modal) modal.remove();\n\n modal = document.createElement('div');\n modal.id = modalId;\n modal.className = 'modal hidden';\n modal.innerHTML = `\n <div class=\"modal-content\">\n <div class=\"modal-header\">\n <h2 style=\"color: var(--error-color); display: flex; align-items: center; gap: 10px;\">\n <span class=\"material-icons-round\">signal_wifi_off</span>\n ${title}\n </h2>\n </div>\n <div style=\"padding: 20px;\">\n <p style=\"margin-bottom: 15px; color: var(--text-primary);\">${htmlContent}</p>\n <div style=\"margin-top: 20px; display: flex; justify-content: center;\">\n <button id=\"btn-error-redirect\" style=\"\n background-color: var(--accent-color); \n color: white; \n padding: 12px 24px; \n border-radius: 8px; \n border: none; \n font-weight: 600; \n cursor: pointer;\n display: flex;\n align-items: center;\n gap: 8px;\n width: 100%;\n justify-content: center;\n transition: transform 0.1s;\n \">\n ${btnText}\n <span class=\"material-icons-round\">open_in_new</span>\n </button>\n </div>\n </div>\n </div>\n `;\n document.body.appendChild(modal);\n\n document.getElementById('btn-error-redirect').addEventListener('click', () => {\n window.location.href = url;\n });\n\n requestAnimationFrame(() => {\n modal.classList.remove('hidden');\n });\n}\n"; document.head.appendChild(sc); })(); 
+javascript:(function(){ if(window.__KANTINE_LOADED){alert('Kantine Wrapper already loaded!');return;} var s=document.createElement('style'); s.textContent=':root { /* Premium Slate/Gray-Blue Palette - Light Mode */ --bg-body: #f1f5f9; /* Slate 100 */ --bg-card: #ffffff; --text-primary: #334155; /* Slate 700 */ --text-secondary: #64748b; --accent-color: #0f172a; /* Slate 900 (High contrast) */ --border-color: #cbd5e1; /* Slate 300 */ --banner-bg: #e2e8f0; --banner-text: #1e293b; --success-color: #059669; --error-color: #dc2626; --card-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.05), 0 2px 4px -2px rgb(0 0 0 / 0.05); --header-bg: rgba(255, 255, 255, 0.9); --header-border: 1px solid rgba(203, 213, 225, 0.6); } [data-theme="dark"] { /* Premium Slate/Gray-Blue Palette - Dark Mode */ --bg-body: #1e293b; /* Deep Slate Gray (Requested) */ --bg-card: #334155; /* Slate 700 */ --text-primary: #f8fafc; /* Slate 50 */ --text-secondary: #cbd5e1; /* Slate 300 */ --accent-color: #60a5fa; /* Blue 400 */ --border-color: #475569; /* Slate 600 */ --banner-bg: #475569; --banner-text: #e2e8f0; --header-bg: rgba(30, 41, 59, 0.9); --header-border: 1px solid rgba(71, 85, 105, 0.6); --card-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.4); } * { box-sizing: border-box; margin: 0; padding: 0; } body { font-family: \'Inter\', system-ui, -apple-system, sans-serif; background-color: var(--bg-body); color: var(--text-primary); transition: background-color 0.3s ease, color 0.3s ease; line-height: 1.5; -webkit-font-smoothing: antialiased; } /* Fix scrolling bug: Reset html/body styles from host page */ html, body { height: auto !important; min-height: 100% !important; overflow-y: auto !important; overflow-x: hidden !important; position: static !important; margin: 0 !important; padding: 0 !important; } /* Header */ .app-header { position: sticky; top: 0; z-index: 100; backdrop-filter: blur(12px); background-color: var(--header-bg); border-bottom: var(--header-border); padding: 1rem 0; } .header-content { width: 100%; /* Full width */ padding: 0 2rem; /* Comfortable padding */ display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 1rem; } .brand { display: flex; align-items: center; gap: 0.75rem; } .brand-text { display: flex; flex-direction: column; } .brand h1 { font-size: 1.25rem; font-weight: 700; letter-spacing: -0.025em; margin-bottom: 0; } .subtitle { font-size: 0.85rem; color: var(--text-secondary); font-weight: 400; margin-left: 2px; } .logo-icon { font-size: 1.5rem; color: var(--accent-color); } /* Controls */ .controls { display: flex; align-items: center; gap: 1.5rem; justify-self: end; } /* Header Week Info (centered) */ .header-week-info { text-align: center; line-height: 1.3; } .header-center-wrapper { display: flex; flex-direction: row; align-items: center; gap: 1.5rem; justify-content: center; } .header-week-title { font-size: 1.1rem; font-weight: 600; color: var(--text-primary); } .header-week-subtitle { font-size: 0.85rem; color: var(--text-secondary); } .nav-group { display: flex; background-color: var(--bg-card); border: 1px solid var(--border-color); padding: 0.25rem; border-radius: 8px; } .nav-btn { background: none; border: none; padding: 0.5rem 1rem; font-size: 0.875rem; font-weight: 500; color: var(--text-secondary); cursor: pointer; border-radius: 6px; transition: all 0.2s; display: flex; align-items: center; gap: 0.5rem; } .nav-btn:hover { color: var(--text-primary); background-color: rgba(100, 116, 139, 0.1); } .nav-btn.active { background-color: var(--accent-color); color: white; } /* Badge for nav buttons (day count indicator) */ .nav-badge { background-color: var(--error-color); color: white; font-size: 0.75rem; font-weight: 600; padding: 0 6px; border-radius: 10px; min-width: 18px; height: 18px; display: inline-flex; align-items: center; justify-content: center; margin-left: 8px; gap: 3px; line-height: 1; } .nav-badge .orderable { color: #fff; font-weight: 800; } .nav-badge .separator { opacity: 0.6; font-weight: 400; } .nav-badge .total { opacity: 0.8; font-weight: 400; } .nav-btn.active .nav-badge { background: rgba(255, 255, 255, 0.3); } /* Primary style for Login Button to match header */ #btn-login-open { background-color: var(--accent-color); color: white; padding: 0.5rem 1.25rem; border-radius: 8px; font-weight: 600; letter-spacing: 0.025em; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); } #btn-login-open:hover { background-color: #334155; /* Slightly lighter than slate-900 */ transform: translateY(-1px); box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); } /* User Badge Button (Login) */ .user-badge-btn { display: flex; align-items: center; gap: 8px; padding: 6px 12px; background: var(--bg-card); border: 1px solid var(--border-color); border-radius: 20px; font-size: 0.9rem; font-weight: 500; color: var(--text-primary); cursor: pointer; transition: all 0.2s; } .user-badge-btn:hover { background: rgba(100, 116, 139, 0.1); border-color: var(--accent-color); } .user-badge-btn .material-icons-round { font-size: 1.25rem; color: var(--accent-color); } .icon-btn { background: none; border: none; color: var(--text-primary); cursor: pointer; padding: 0.5rem; border-radius: 50%; transition: background-color 0.2s; display: flex; align-items: center; justify-content: center; } .icon-btn:hover { background-color: rgba(100, 116, 139, 0.1); } /* Refresh button animation */ #btn-refresh.refreshing .material-icons-round { animation: rotate 1s linear infinite; } @keyframes rotate { from { transform: rotate(0deg); } to { transform: rotate(360deg); } } /* Progress Modal */ .progress-container { margin-bottom: 1.5rem; } .progress-bar { width: 100%; height: 8px; background-color: var(--border-color); border-radius: 4px; overflow: hidden; margin-bottom: 0.75rem; } .progress-fill { height: 100%; background: linear-gradient(90deg, var(--accent-color) 0%, #60a5fa 100%); width: 0%; transition: width 0.3s ease; border-radius: 4px; } .progress-percent { text-align: center; font-size: 1.5rem; font-weight: 700; color: var(--text-primary); margin-bottom: 0.5rem; } .progress-message { text-align: center; color: var(--text-secondary); font-size: 0.9rem; font-weight: 500; } .weekly-cost { background-color: rgba(59, 130, 246, 0.1); /* Blue tint */ color: var(--accent-color); padding: 0.4rem 0.8rem; border-radius: 8px; font-weight: 600; font-size: 0.9rem; display: flex; align-items: center; gap: 0.5rem; border: 1px solid rgba(59, 130, 246, 0.2); } .weekly-cost .material-icons-round { font-size: 18px; } /* Container */ .container { width: 100%; /* Full width */ margin: 2rem auto; padding: 0 2rem; min-height: 80vh; } /* Banner */ .banner { background-color: var(--banner-bg); color: var(--banner-text); padding: 0.75rem 1rem; border-radius: 8px; display: flex; align-items: center; gap: 0.5rem; margin-bottom: 2rem; font-size: 0.875rem; font-weight: 500; border: 1px solid var(--border-color); max-width: fit-content; } /* User Badge */ .user-badge { display: flex; align-items: center; gap: 8px; padding: 6px 12px; background: var(--bg-card); /* Changed from --surface */ border: 1px solid var(--border-color); /* Changed from --border */ border-radius: 20px; font-size: 0.9rem; font-weight: 500; } .icon-btn-small { background: none; border: none; padding: 4px; cursor: pointer; color: var(--text-secondary); /* Changed from --text-muted */ display: flex; align-items: center; justify-content: center; border-radius: 50%; transition: all 0.2s; } .icon-btn-small:hover { color: var(--error-color); /* Changed from --danger */ background: rgba(239, 68, 68, 0.1); } /* Modal */ .modal { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); backdrop-filter: blur(4px); display: flex; align-items: center; justify-content: center; z-index: 1000; transition: all 0.3s; } .modal.hidden { opacity: 0; pointer-events: none; } .modal-content { background: var(--bg-card); /* Changed from --surface */ width: 90%; max-width: 400px; border-radius: 16px; box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); overflow: hidden; animation: modalSlide 0.3s ease-out; } @keyframes modalSlide { from { transform: translateY(20px); opacity: 0; } to { transform: translateY(0); opacity: 1; } } .modal-header { display: flex; align-items: center; justify-content: space-between; padding: 20px; border-bottom: 1px solid var(--border-color); } .modal-header h2 { margin: 0; font-size: 1.25rem; } .modal-body { padding: 20px; } #login-form { padding: 20px; } .form-group { margin-bottom: 20px; } .form-group label { display: block; margin-bottom: 6px; font-weight: 500; font-size: 0.9rem; } .form-group input { width: 100%; padding: 10px 12px; border: 1px solid var(--border-color); /* Changed from --border */ border-radius: 8px; background: var(--bg-body); /* Changed from --bg */ color: var(--text-primary); /* Changed from --text */ font-family: inherit; transition: border-color 0.2s; } .form-group input:focus { outline: none; border-color: var(--accent-color); /* Changed from --primary */ } .help-text { display: block; margin-top: 4px; color: var(--text-secondary); /* Changed from --text-muted */ font-size: 0.75rem; } .error-msg { margin-bottom: 16px; padding: 10px; background: rgba(239, 68, 68, 0.1); color: var(--error-color); /* Changed from --danger */ border-radius: 8px; font-size: 0.85rem; text-align: center; } .modal-actions { margin-top: 24px; } .btn-primary.wide { width: 100%; justify-content: center; } .hidden { display: none !important; } /* Menu Grid */ .menu-grid { display: grid; gap: 2rem; } .week-section { margin-bottom: 3rem; } .week-header { margin-bottom: 1.5rem; border-bottom: 1px solid var(--border-color); padding-bottom: 1rem; text-align: center; } .week-title { font-size: 1.75rem; font-weight: 700; color: var(--text-primary); } .week-range { color: var(--text-secondary); font-size: 0.9rem; margin-top: 0.25rem; } .days-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 0.75rem; } /* Card */ .menu-card { background-color: var(--bg-card); border-radius: 12px; border: 1px solid var(--border-color); box-shadow: var(--card-shadow); overflow: hidden; transition: transform 0.2s ease, box-shadow 0.2s ease; display: flex; flex-direction: column; } /* Past Day Styling - Target specific elements so ordered items can remain visible */ .menu-card.past-day .card-header, .menu-card.past-day .menu-item:not(.ordered) { opacity: 0.6; filter: grayscale(0.8); transition: opacity 0.3s, filter 0.3s; } .menu-card.past-day:hover .card-header, .menu-card.past-day:hover .menu-item:not(.ordered) { opacity: 0.8; filter: grayscale(0.4); } /* Enhancements for ordered items */ .menu-card.past-day .menu-item.ordered { /* No opacity/filter here - fully visible */ background: var(--bg-card); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); border: 1px solid var(--accent-color); border-radius: 8px; padding: 1rem; margin: 0 -1rem 1.5rem -1rem; position: relative; z-index: 10; } .menu-item.today-ordered { border: 2px solid var(--accent-color); box-shadow: 0 0 20px rgba(96, 165, 250, 0.4); border-radius: 8px; padding: 1rem; margin: 0 -1rem 1.5rem -1rem; background: var(--bg-card); position: relative; z-index: 5; animation: pulse-glow 3s infinite; } @keyframes pulse-glow { 0% { box-shadow: 0 0 15px rgba(96, 165, 250, 0.3); } 50% { box-shadow: 0 0 25px rgba(96, 165, 250, 0.6); } 100% { box-shadow: 0 0 15px rgba(96, 165, 250, 0.3); } } .menu-card:hover { transform: translateY(-2px); box-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1); } .card-header { padding: 1rem 1.25rem; border-bottom: 1px solid var(--border-color); display: flex; justify-content: space-between; align-items: baseline; background-color: rgba(100, 116, 139, 0.05); } .day-name { font-size: 1.125rem; font-weight: 600; } .day-date { font-size: 0.875rem; color: var(--text-secondary); } .card-body { padding: 1.25rem; display: grid; grid-template-rows: auto; /* Each menu item gets its own row */ align-content: start; } .empty-state { color: var(--text-secondary); font-style: italic; text-align: center; padding: 1rem; } /* Menu Items */ .menu-item { margin-bottom: 1.5rem; padding-bottom: 1.5rem; border-bottom: 1px solid var(--border-color); } .menu-item:last-child { margin-bottom: 0; padding-bottom: 0; border-bottom: none; } .item-header { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 0.5rem; gap: 1rem; } .item-name { font-weight: 600; color: var(--text-primary); font-size: 1rem; } .item-price { font-weight: 700; color: var(--accent-color); white-space: nowrap; } .item-desc { font-size: 0.875rem; color: var(--text-secondary); line-height: 1.6; margin-bottom: 0.75rem; } .badges { display: flex; gap: 0.5rem; margin-left: auto; } .item-status-row { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 0.75rem; } .badge { display: inline-flex; align-items: center; justify-content: center; height: 24px; font-size: 0.75rem; padding: 0 10px; border-radius: 4px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; line-height: normal; white-space: nowrap; } .badge.available { background-color: rgba(16, 185, 129, 0.1); /* Emerald 500 / 10% */ color: var(--success-color); border: 1px solid rgba(16, 185, 129, 0.2); } .badge.sold-out { background-color: rgba(239, 68, 68, 0.1); /* Red 500 / 10% */ color: var(--error-color); border: 1px solid rgba(239, 68, 68, 0.2); } .badge.ordered { background-color: rgba(139, 92, 246, 0.1); /* Violet 500 / 10% */ color: #8b5cf6; border: 1px solid rgba(139, 92, 246, 0.2); gap: 4px; } .badge.ordered .material-icons-round { font-size: 1rem; } /* Loading */ .loading-state { text-align: center; padding: 4rem; color: var(--text-secondary); } .spinner { width: 40px; height: 40px; border: 3px solid var(--border-color); border-top-color: var(--accent-color); border-radius: 50%; margin: 0 auto 1rem; animation: spin 1s linear infinite; } @keyframes spin { to { transform: rotate(360deg); } } /* Footer */ .app-footer { text-align: center; padding: 2rem; color: var(--text-secondary); font-size: 0.875rem; border-top: 1px solid var(--border-color); margin-top: auto; } /* === Order / Cancel Buttons (inline in status row) === */ .btn-order { display: inline-flex; align-items: center; gap: 4px; padding: 4px 10px; border: none; border-radius: 6px; background: var(--success-color); color: white; font-size: 0.75rem; font-weight: 600; cursor: pointer; transition: all 0.2s ease; font-family: inherit; } .btn-order .material-icons-round { font-size: 16px; } .btn-order:hover:not(:disabled) { filter: brightness(1.15); transform: translateY(-1px); } .btn-order:disabled { opacity: 0.5; cursor: not-allowed; } .btn-order.loading { pointer-events: none; opacity: 0.6; } .btn-order-compact { padding: 2px 4px; gap: 0; } .btn-order-compact .material-icons-round { font-size: 16px; } .btn-cancel { display: inline-flex; align-items: center; justify-content: center; padding: 4px 6px; border: none; border-radius: 6px; background: var(--error-color); color: white; font-size: 0.75rem; cursor: pointer; transition: all 0.2s ease; font-family: inherit; } .btn-cancel .material-icons-round { font-size: 16px; } .btn-cancel:hover:not(:disabled) { filter: brightness(1.15); transform: translateY(-1px); } .btn-cancel:disabled { opacity: 0.5; cursor: not-allowed; } /* Past days: hide action buttons */ .past-day .item-actions { display: none; } /* Order count badge (for multi-orders) */ .order-count-badge { display: inline-flex; align-items: center; justify-content: center; background: rgba(255, 255, 255, 0.3); color: white; font-size: 0.65rem; font-weight: 700; min-width: 16px; height: 16px; padding: 0 4px; border-radius: 8px; margin-left: 4px; line-height: 1; } /* === Toast Notifications === */ #toast-container { position: fixed; bottom: 20px; right: 20px; z-index: 10000; display: flex; flex-direction: column; gap: 8px; pointer-events: none; } .toast { display: flex; align-items: center; gap: 8px; padding: 10px 16px; border-radius: 8px; font-size: 0.85rem; font-weight: 500; font-family: \'Inter\', sans-serif; color: white; backdrop-filter: blur(10px); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3); pointer-events: auto; transform: translateX(120%); opacity: 0; transition: transform 0.3s ease, opacity 0.3s ease; } .toast.show { transform: translateX(0); opacity: 1; } .toast .material-icons-round { font-size: 18px; } .toast-success { background: rgba(5, 150, 105, 0.95); } .toast-error { background: rgba(220, 38, 38, 0.95); } .toast-info { background: rgba(59, 130, 246, 0.95); } /* === Mobile Responsiveness === */ @media (max-width: 600px) { .header-content { flex-direction: column; gap: 1rem; padding: 0.75rem; } .week-nav { width: 100%; justify-content: center; } .nav-pills { width: 100%; justify-content: space-between; } .nav-btn { flex: 1; justify-content: center; padding: 0.5rem; font-size: 0.85rem; } .days-grid { grid-template-columns: 1fr; /* Force single column */ } .main-content { padding: 1rem; } .week-title { font-size: 1.5rem; } /* Adjust toast position for mobile */ .toast-container { bottom: 1rem; right: 1rem; left: 1rem; /* Center on mobile */ width: auto; } .menu-card { margin-bottom: 1rem; } } /* === Flagging & Notification Styles === */ .btn-flag { display: inline-flex; align-items: center; justify-content: center; background: transparent; border: 1px solid var(--text-secondary); color: var(--text-secondary); border-radius: 6px; padding: 4px; cursor: pointer; transition: all 0.2s; margin-right: 0.5rem; width: 28px; height: 28px; } .btn-flag:hover { background: rgba(234, 179, 8, 0.1); /* Yellow-500 / 10% */ color: #eab308; border-color: #eab308; } .btn-flag.active { background: rgba(234, 179, 8, 0.1); color: #eab308; border-color: #eab308; } .btn-flag .material-icons-round { font-size: 1.1rem; } /* Flagged & Sold Out (Yellow Glow) */ .menu-item.flagged-sold-out { border: 1px solid #eab308; box-shadow: 0 0 10px rgba(234, 179, 8, 0.2); border-radius: 8px; padding: 1rem; margin: 0 -1rem 1.5rem -1rem; background: var(--bg-card); position: relative; z-index: 5; animation: yellow-pulse 3s infinite; } @keyframes yellow-pulse { 0% { box-shadow: 0 0 8px rgba(234, 179, 8, 0.2); } 50% { box-shadow: 0 0 16px rgba(234, 179, 8, 0.5); } 100% { box-shadow: 0 0 8px rgba(234, 179, 8, 0.2); } } /* Flagged & Available (Green Glow) */ .menu-item.flagged-available { border: 2px solid var(--success-color); box-shadow: 0 0 15px rgba(16, 185, 129, 0.3); border-radius: 8px; padding: 1rem; margin: 0 -1rem 1.5rem -1rem; background: var(--bg-card); position: relative; z-index: 5; animation: green-pulse 3s infinite; } @keyframes green-pulse { 0% { box-shadow: 0 0 10px rgba(16, 185, 129, 0.3); } 50% { box-shadow: 0 0 20px rgba(16, 185, 129, 0.6); } 100% { box-shadow: 0 0 10px rgba(16, 185, 129, 0.3); } } /* Day Header Badges */ .day-header-left { display: flex; align-items: center; gap: 0.75rem; } .menu-code-badge { font-size: 0.75rem; font-weight: 700; color: #8b5cf6; /* Violet 500 */ background-color: rgba(139, 92, 246, 0.15); border: 1px solid rgba(139, 92, 246, 0.3); padding: 2px 6px; border-radius: 6px; line-height: normal; display: inline-block; } /* Detailed Badge Colors */ .nav-badge.badge-violet { background-color: #8b5cf6; } .nav-badge.badge-green { background-color: var(--success-color); } .nav-badge.badge-red { background-color: var(--error-color); } .nav-badge.badge-blue { background-color: var(--accent-color); } /* Day Header Status Colors (User Request) */ .card-header.header-violet { background-color: rgba(139, 92, 246, 0.15); border-bottom: 2px solid #8b5cf6; } .card-header.header-green { background-color: rgba(16, 185, 129, 0.15); border-bottom: 2px solid var(--success-color); } .card-header.header-red { background-color: rgba(239, 68, 68, 0.15); border-bottom: 2px solid var(--error-color); } .card-header.header-violet .day-name, .card-header.header-green .day-name, .card-header.header-red .day-name { font-weight: 700; color: var(--text-primary); /* Ensure text remains standard color */ } /* Update Icon */ .update-icon { display: inline-flex; align-items: center; justify-content: center; margin-left: 8px; background-color: rgba(16, 185, 129, 0.2); /* Green tint */ color: var(--success-color); border-radius: 50%; width: 24px; height: 24px; cursor: pointer; font-size: 14px; transition: all 0.2s; text-decoration: none; animation: pulse 2s infinite; } .update-icon:hover { background-color: var(--success-color); color: white; transform: scale(1.1); } @keyframes pulse { 0% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.4); } 70% { box-shadow: 0 0 0 6px rgba(16, 185, 129, 0); } 100% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0); } } /* Order Countdown */ #order-countdown { background: rgba(255, 255, 255, 0.1); padding: 0.25rem 0.75rem; border-radius: 99px; font-size: 0.85rem; display: flex; align-items: center; gap: 0.5rem; white-space: nowrap; border: 1px solid var(--border-color); } #order-countdown span { opacity: 0.7; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.5px; } #order-countdown.urgent { background: rgba(239, 68, 68, 0.2); border-color: rgba(239, 68, 68, 0.5); color: #ef4444; animation: pulse-red 2s infinite; } @keyframes pulse-red { 0% { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0.4); } 70% { box-shadow: 0 0 0 6px rgba(239, 68, 68, 0); } 100% { box-shadow: 0 0 0 0 rgba(239, 68, 68, 0); } } /* Smart Highlights (Blue Glow - matches today-ordered/flagged pattern) */ .menu-item.highlight-glow { border: 2px solid rgba(59, 130, 246, 0.7); box-shadow: 0 0 20px rgba(59, 130, 246, 0.4); border-radius: 8px; padding: 1rem; margin: 0 -1rem 1.5rem -1rem; background: var(--bg-card); position: relative; z-index: 5; animation: blue-pulse 3s infinite; } @keyframes blue-pulse { 0% { box-shadow: 0 0 15px rgba(59, 130, 246, 0.3); } 50% { box-shadow: 0 0 25px rgba(59, 130, 246, 0.6); } 100% { box-shadow: 0 0 15px rgba(59, 130, 246, 0.3); } } /* Nav Badge with Count */ .nav-badge.has-highlights { background-color: var(--bg-card); /* Neutral background */ color: var(--text-primary); border: 1px solid var(--border-color); padding: 2px 6px; } .nav-badge .highlight-count { color: #3b82f6; /* Blue 500 */ font-weight: 700; margin-left: 4px; } /* Tag Management Modal */ #tags-list { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 1rem; min-height: 50px; } /* Tag badges styled consistently with .badge (verfügbar/ausverkauft) */ .tag-badge { display: inline-flex; align-items: center; justify-content: center; height: 24px; font-size: 0.75rem; padding: 0 10px; border-radius: 4px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; line-height: normal; white-space: nowrap; background-color: rgba(59, 130, 246, 0.1); color: #3b82f6; border: 1px solid rgba(59, 130, 246, 0.2); gap: 4px; } .tag-remove { cursor: pointer; opacity: 0.7; font-size: 1.1em; line-height: 1; transition: all 0.2s; } .tag-remove:hover { opacity: 1; color: #ef4444; } .input-group { display: flex; gap: 0.5rem; } .input-group input { flex: 1; padding: 0.75rem; background: var(--bg-body); border: 1px solid var(--border-color); color: var(--text-primary); border-radius: 8px; font-family: inherit; } /* Add tag button - styled like .btn-order with nav-btn.active color */ #btn-add-tag { display: inline-flex; align-items: center; gap: 4px; padding: 0.5rem 1rem; border: none; border-radius: 6px; background: var(--accent-color); color: white; font-size: 0.8rem; font-weight: 600; cursor: pointer; transition: all 0.2s ease; font-family: inherit; white-space: nowrap; } #btn-add-tag:hover { filter: brightness(1.15); transform: translateY(-1px); } /* Update Banner Enhanced */ .change-summary { font-size: 0.8rem; background: rgba(0, 0, 0, 0.1); padding: 0.5rem; border-radius: 4px; margin: 0.5rem 0; white-space: pre-wrap; font-family: inherit; line-height: 1.4; max-height: 100px; overflow-y: auto; } .update-content { display: flex; flex-direction: column; gap: 4px; flex: 1; } /* Installer Changelog */ .changelog-container ul { padding-left: 1.5rem; margin: 0.5rem 0; } .changelog-container li { margin-bottom: 0.4rem; line-height: 1.5; } .changelog-container h3 { margin-top: 1.5rem; margin-bottom: 0.5rem; font-size: 1.1em; color: var(--accent-color); } '; document.head.appendChild(s); var sc=document.createElement('script'); sc.textContent="/**\n * Kantine Wrapper \u2013 Client-Only Bookmarklet\n * Replaces Bessa page content with enhanced weekly menu view.\n * All API calls go directly to api.bessa.app (same origin).\n * Data stored in localStorage (flags, theme, auth).\n */\n(function () {\n 'use strict';\n\n // Prevent double injection\n if (window.__KANTINE_LOADED) return;\n window.__KANTINE_LOADED = true;\n\n // === Constants ===\n const API_BASE = 'https://api.bessa.app/v1';\n const GUEST_TOKEN = 'c3418725e95a9f90e3645cbc846b4d67c7c66131';\n const CLIENT_VERSION = '1.7.0_prod/2026-01-26';\n const VENUE_ID = 591;\n const MENU_ID = 7;\n const POLL_INTERVAL_MS = 5 * 60 * 1000; // 5 minutes\n\n // === State ===\n let allWeeks = [];\n let currentWeekNumber = getISOWeek(new Date());\n let currentYear = new Date().getFullYear();\n let displayMode = 'this-week';\n let authToken = sessionStorage.getItem('kantine_authToken');\n let currentUser = sessionStorage.getItem('kantine_currentUser');\n let orderMap = new Map();\n let userFlags = new Set(JSON.parse(localStorage.getItem('kantine_flags') || '[]'));\n let pollIntervalId = null;\n\n // === API Helpers ===\n function apiHeaders(token) {\n return {\n 'Authorization': `Token ${token || GUEST_TOKEN}`,\n 'Accept': 'application/json',\n 'Content-Type': 'application/json',\n 'X-Client-Version': CLIENT_VERSION\n };\n }\n\n // === Inject UI ===\n function injectUI() {\n // Replace entire page content\n document.title = 'Kantine Weekly Menu';\n\n // Inject Google Fonts if not already present\n if (!document.querySelector('link[href*=\"fonts.googleapis.com/css2?family=Inter\"]')) {\n const fontLink = document.createElement('link');\n fontLink.rel = 'stylesheet';\n fontLink.href = 'https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap';\n document.head.appendChild(fontLink);\n }\n if (!document.querySelector('link[href*=\"Material+Icons+Round\"]')) {\n const iconLink = document.createElement('link');\n iconLink.rel = 'stylesheet';\n iconLink.href = 'https://fonts.googleapis.com/icon?family=Material+Icons+Round';\n document.head.appendChild(iconLink);\n }\n\n document.body.innerHTML = `\n <div id=\"kantine-wrapper\">\n <header class=\"app-header\">\n <div class=\"header-content\">\n <div class=\"brand\">\n <span class=\"material-icons-round logo-icon\">restaurant_menu</span>\n <div class=\"header-left\">\n <h1>Kantinen \u00dcbersicht <small style=\"font-size: 0.6em; opacity: 0.7; font-weight: 400;\">v1.2.1</small></h1>\n <div id=\"last-updated-subtitle\" class=\"subtitle\"></div>\n </div>\n </div>\n <div class=\"header-center-wrapper\">\n <div id=\"header-week-info\" class=\"header-week-info\"></div>\n <div id=\"weekly-cost-display\" class=\"weekly-cost hidden\"></div>\n </div>\n <div class=\"controls\">\n <button id=\"btn-refresh\" class=\"icon-btn\" aria-label=\"Men\u00fcdaten aktualisieren\" title=\"Men\u00fcdaten neu laden\">\n <span class=\"material-icons-round\">refresh</span>\n </button>\n <button id=\"btn-highlights\" class=\"icon-btn\" aria-label=\"Pers\u00f6nliche Highlights verwalten\" title=\"Pers\u00f6nliche Highlights verwalten\">\n <span class=\"material-icons-round\">label</span>\n </button>\n <div class=\"nav-group\">\n <button id=\"btn-this-week\" class=\"nav-btn active\">Diese Woche</button>\n <button id=\"btn-next-week\" class=\"nav-btn\">N\u00e4chste Woche</button>\n </div>\n <button id=\"theme-toggle\" class=\"icon-btn\" aria-label=\"Toggle Theme\">\n <span class=\"material-icons-round theme-icon\">light_mode</span>\n </button>\n <button id=\"btn-login-open\" class=\"user-badge-btn icon-btn-small\">\n <span class=\"material-icons-round\">login</span>\n <span>Anmelden</span>\n </button>\n <div id=\"user-info\" class=\"user-badge hidden\">\n <span class=\"material-icons-round\">person</span>\n <span id=\"user-id-display\"></span>\n <button id=\"btn-logout\" class=\"icon-btn-small\" aria-label=\"Logout\">\n <span class=\"material-icons-round\">logout</span>\n </button>\n </div>\n </div>\n </div>\n </header>\n\n <div id=\"login-modal\" class=\"modal hidden\">\n <div class=\"modal-content\">\n <div class=\"modal-header\">\n <h2>Login</h2>\n <button id=\"btn-login-close\" class=\"icon-btn\" aria-label=\"Close\">\n <span class=\"material-icons-round\">close</span>\n </button>\n </div>\n <form id=\"login-form\">\n <div class=\"form-group\">\n <label for=\"employee-id\">Mitarbeiternummer</label>\n <input type=\"text\" id=\"employee-id\" name=\"employee-id\" placeholder=\"z.B. 2041\" required>\n <small class=\"help-text\">Deine offizielle Knapp Mitarbeiternummer.</small>\n </div>\n <div class=\"form-group\">\n <label for=\"password\">Passwort</label>\n <input type=\"password\" id=\"password\" name=\"password\" placeholder=\"Bessa Passwort\" required>\n <small class=\"help-text\">Das Passwort f\u00fcr deinen Bessa Account.</small>\n </div>\n <div id=\"login-error\" class=\"error-msg hidden\"></div>\n <div class=\"modal-actions\">\n <button type=\"submit\" class=\"btn-primary wide\">Einloggen</button>\n </div>\n </form>\n </div>\n </div>\n\n <div id=\"progress-modal\" class=\"modal hidden\">\n <div class=\"modal-content\">\n <div class=\"modal-header\">\n <h2>Men\u00fcdaten aktualisieren</h2>\n </div>\n <div class=\"modal-body\" style=\"padding: 20px;\">\n <div class=\"progress-container\">\n <div class=\"progress-bar\">\n <div id=\"progress-fill\" class=\"progress-fill\"></div>\n </div>\n <div id=\"progress-percent\" class=\"progress-percent\">0%</div>\n </div>\n <p id=\"progress-message\" class=\"progress-message\">Initialisierung...</p>\n </div>\n </div>\n </div>\n\n <div id=\"highlights-modal\" class=\"modal hidden\">\n <div class=\"modal-content\">\n <div class=\"modal-header\">\n <h2>Meine Highlights</h2>\n <button id=\"btn-highlights-close\" class=\"icon-btn\" aria-label=\"Close\">\n <span class=\"material-icons-round\">close</span>\n </button>\n </div>\n <div class=\"modal-body\">\n <p style=\"margin-bottom: 1rem; color: var(--text-secondary);\">\n Markiere Men\u00fcs automatisch, wenn sie diese Schlagw\u00f6rter enthalten.\n </p>\n <div class=\"input-group\">\n <input type=\"text\" id=\"tag-input\" placeholder=\"z.B. Schnitzel, Vegetarisch...\">\n <button id=\"btn-add-tag\" class=\"btn-primary\">Hinzuf\u00fcgen</button>\n </div>\n <div id=\"tags-list\"></div>\n </div>\n </div>\n </div>\n\n <main class=\"container\">\n <div id=\"last-updated-banner\" class=\"banner hidden\">\n <span class=\"material-icons-round\">update</span>\n <span id=\"last-updated-text\">Gerade aktualisiert</span>\n </div>\n <div id=\"loading\" class=\"loading-state\">\n <div class=\"spinner\"></div>\n <p>Lade Men\u00fcdaten...</p>\n </div>\n <div id=\"menu-container\" class=\"menu-grid\"></div>\n </main>\n\n <footer class=\"app-footer\">\n <p>Bessa Knapp-Kantine Wrapper &bull; <span id=\"current-year\">${new Date().getFullYear()}</span></p>\n </footer>\n </div>`;\n }\n\n // === Bind Events ===\n function bindEvents() {\n const btnThisWeek = document.getElementById('btn-this-week');\n const btnNextWeek = document.getElementById('btn-next-week');\n const btnRefresh = document.getElementById('btn-refresh');\n const themeToggle = document.getElementById('theme-toggle');\n const btnLoginOpen = document.getElementById('btn-login-open');\n const btnLoginClose = document.getElementById('btn-login-close');\n const btnLogout = document.getElementById('btn-logout');\n const loginForm = document.getElementById('login-form');\n const loginModal = document.getElementById('login-modal');\n\n // Highlights Modal\n const btnHighlights = document.getElementById('btn-highlights');\n const highlightsModal = document.getElementById('highlights-modal');\n const btnHighlightsClose = document.getElementById('btn-highlights-close');\n const btnAddTag = document.getElementById('btn-add-tag');\n const tagInput = document.getElementById('tag-input');\n\n btnHighlights.addEventListener('click', () => {\n highlightsModal.classList.remove('hidden');\n renderTagsList();\n tagInput.focus();\n });\n\n btnHighlightsClose.addEventListener('click', () => {\n highlightsModal.classList.add('hidden');\n });\n\n window.addEventListener('click', (e) => {\n if (e.target === highlightsModal) highlightsModal.classList.add('hidden');\n });\n\n btnAddTag.addEventListener('click', () => {\n const tag = tagInput.value;\n if (addHighlightTag(tag)) {\n tagInput.value = '';\n renderTagsList();\n }\n });\n\n tagInput.addEventListener('keypress', (e) => {\n if (e.key === 'Enter') {\n btnAddTag.click();\n }\n });\n\n // Theme\n const savedTheme = localStorage.getItem('theme');\n const prefersDark = window.matchMedia('(prefers-color-scheme: dark)').matches;\n const themeIcon = themeToggle.querySelector('.theme-icon');\n\n if (savedTheme === 'dark' || (!savedTheme && prefersDark)) {\n document.documentElement.setAttribute('data-theme', 'dark');\n themeIcon.textContent = 'dark_mode';\n } else {\n document.documentElement.setAttribute('data-theme', 'light');\n themeIcon.textContent = 'light_mode';\n }\n\n themeToggle.addEventListener('click', () => {\n const current = document.documentElement.getAttribute('data-theme');\n const next = current === 'dark' ? 'light' : 'dark';\n document.documentElement.setAttribute('data-theme', next);\n localStorage.setItem('theme', next);\n themeIcon.textContent = next === 'dark' ? 'dark_mode' : 'light_mode';\n });\n\n // Navigation\n btnThisWeek.addEventListener('click', () => {\n if (displayMode !== 'this-week') {\n displayMode = 'this-week';\n btnThisWeek.classList.add('active');\n btnNextWeek.classList.remove('active');\n renderVisibleWeeks();\n }\n });\n\n btnNextWeek.addEventListener('click', () => {\n if (displayMode !== 'next-week') {\n displayMode = 'next-week';\n btnNextWeek.classList.add('active');\n btnThisWeek.classList.remove('active');\n renderVisibleWeeks();\n }\n });\n\n // Refresh \u2013 fetch fresh data from Bessa API\n btnRefresh.addEventListener('click', () => {\n if (!authToken) {\n loginModal.classList.remove('hidden');\n return;\n }\n loadMenuDataFromAPI();\n });\n\n // Login Modal\n btnLoginOpen.addEventListener('click', () => {\n loginModal.classList.remove('hidden');\n document.getElementById('login-error').classList.add('hidden');\n loginForm.reset();\n });\n\n btnLoginClose.addEventListener('click', () => {\n loginModal.classList.add('hidden');\n });\n\n window.addEventListener('click', (e) => {\n if (e.target === loginModal) loginModal.classList.add('hidden');\n });\n\n // Login Form Submit\n loginForm.addEventListener('submit', async (e) => {\n e.preventDefault();\n const employeeId = document.getElementById('employee-id').value.trim();\n const password = document.getElementById('password').value;\n const loginError = document.getElementById('login-error');\n const submitBtn = loginForm.querySelector('button[type=\"submit\"]');\n const originalText = submitBtn.textContent;\n\n submitBtn.disabled = true;\n submitBtn.textContent = 'Wird eingeloggt...';\n\n try {\n const email = `knapp-${employeeId}@bessa.app`;\n const response = await fetch(`${API_BASE}/auth/login/`, {\n method: 'POST',\n headers: apiHeaders(GUEST_TOKEN),\n body: JSON.stringify({ email, password })\n });\n\n const data = await response.json();\n\n if (response.ok) {\n authToken = data.key;\n currentUser = employeeId;\n sessionStorage.setItem('kantine_authToken', data.key);\n sessionStorage.setItem('kantine_currentUser', employeeId);\n\n // Fetch user name\n try {\n const userResp = await fetch(`${API_BASE}/auth/user/`, {\n headers: apiHeaders(authToken)\n });\n if (userResp.ok) {\n const userData = await userResp.json();\n if (userData.first_name) sessionStorage.setItem('kantine_firstName', userData.first_name);\n if (userData.last_name) sessionStorage.setItem('kantine_lastName', userData.last_name);\n }\n } catch (err) {\n console.error('Failed to fetch user info:', err);\n }\n\n updateAuthUI();\n loginModal.classList.add('hidden');\n fetchOrders();\n loginForm.reset();\n startPolling();\n\n // Reload menu data with auth for full details\n loadMenuDataFromAPI();\n } else {\n loginError.textContent = data.non_field_errors?.[0] || data.error || 'Login fehlgeschlagen';\n loginError.classList.remove('hidden');\n }\n } catch (error) {\n console.error('Login error:', error);\n loginError.textContent = 'Ein Fehler ist aufgetreten';\n loginError.classList.remove('hidden');\n } finally {\n submitBtn.disabled = false;\n submitBtn.textContent = originalText;\n }\n });\n\n // Logout\n btnLogout.addEventListener('click', () => {\n sessionStorage.removeItem('kantine_authToken');\n sessionStorage.removeItem('kantine_currentUser');\n sessionStorage.removeItem('kantine_firstName');\n sessionStorage.removeItem('kantine_lastName');\n authToken = null;\n currentUser = null;\n orderMap = new Map();\n stopPolling();\n updateAuthUI();\n renderVisibleWeeks();\n });\n }\n\n // === Auth UI ===\n function updateAuthUI() {\n // Try to recover session from Bessa's storage if not already logged in\n if (!authToken) {\n try {\n const akita = localStorage.getItem('AkitaStores');\n if (akita) {\n const parsed = JSON.parse(akita);\n if (parsed.auth && parsed.auth.token) {\n console.log('Found existing Bessa session!');\n authToken = parsed.auth.token;\n sessionStorage.setItem('kantine_authToken', authToken);\n\n if (parsed.auth.user) {\n currentUser = parsed.auth.user.id || 'unknown';\n sessionStorage.setItem('kantine_currentUser', currentUser);\n if (parsed.auth.user.firstName) sessionStorage.setItem('kantine_firstName', parsed.auth.user.firstName);\n if (parsed.auth.user.lastName) sessionStorage.setItem('kantine_lastName', parsed.auth.user.lastName);\n }\n }\n }\n } catch (e) {\n console.warn('Failed to parse AkitaStores:', e);\n }\n }\n\n authToken = sessionStorage.getItem('kantine_authToken');\n currentUser = sessionStorage.getItem('kantine_currentUser');\n const firstName = sessionStorage.getItem('kantine_firstName');\n const btnLoginOpen = document.getElementById('btn-login-open');\n const userInfo = document.getElementById('user-info');\n const userIdDisplay = document.getElementById('user-id-display');\n\n if (authToken) {\n btnLoginOpen.classList.add('hidden');\n userInfo.classList.remove('hidden');\n userIdDisplay.textContent = firstName || (currentUser ? `User ${currentUser}` : 'Angemeldet');\n fetchOrders(); // Always fetch fresh orders on auth update\n } else {\n btnLoginOpen.classList.remove('hidden');\n userInfo.classList.add('hidden');\n userIdDisplay.textContent = '';\n }\n\n renderVisibleWeeks();\n }\n\n // === Fetch Orders from Bessa ===\n async function fetchOrders() {\n if (!authToken) return;\n try {\n // Use user/orders endpoint for reliable history\n const response = await fetch(`${API_BASE}/user/orders/?venue=${VENUE_ID}&ordering=-created&limit=50`, {\n headers: apiHeaders(authToken)\n });\n const data = await response.json();\n\n if (response.ok) {\n orderMap = new Map();\n const results = data.results || [];\n\n for (const order of results) {\n // Filter out cancelled orders (State 9)\n // Accepting State 1 (Created?), 5 (Placed?), 8 (Completed)\n // TODO: Verify exact states. Subagent saw 5=Active, 8=Completed, 9=Cancelled.\n if (order.order_state === 9) continue;\n\n // Extract date properly (it comes as ISO string)\n const orderDate = order.date.split('T')[0];\n\n for (const item of (order.items || [])) {\n const key = `${orderDate}_${item.article}`;\n if (!orderMap.has(key)) orderMap.set(key, []);\n orderMap.get(key).push(order.id);\n }\n }\n console.log(`Fetched ${results.length} orders, mapped active ones.`);\n renderVisibleWeeks();\n }\n } catch (error) {\n console.error('Error fetching orders:', error);\n }\n }\n\n // === Place Order ===\n async function placeOrder(date, articleId, name, price, description) {\n if (!authToken) return;\n try {\n // Get user data for customer object\n const userResp = await fetch(`${API_BASE}/auth/user/`, {\n headers: apiHeaders(authToken)\n });\n if (!userResp.ok) {\n showToast('Fehler: Benutzerdaten konnten nicht geladen werden', 'error');\n return;\n }\n const userData = await userResp.json();\n const now = new Date().toISOString();\n\n const orderPayload = {\n uuid: crypto.randomUUID(),\n created: now,\n updated: now,\n order_type: 7,\n items: [{\n article: articleId,\n course_group: null,\n modifiers: [],\n uuid: crypto.randomUUID(),\n name: name,\n description: description || '',\n price: String(parseFloat(price)),\n amount: 1,\n vat: '10.00',\n comment: ''\n }],\n table: null,\n total: parseFloat(price),\n tip: 0,\n currency: 'EUR',\n venue: VENUE_ID,\n states: [],\n order_state: 1,\n date: `${date}T10:00:00.000Z`,\n payment_method: 'payroll',\n customer: {\n first_name: userData.first_name,\n last_name: userData.last_name,\n email: userData.email,\n newsletter: false\n },\n preorder: false,\n delivery_fee: 0,\n cash_box_table_name: null,\n take_away: false\n };\n\n const response = await fetch(`${API_BASE}/user/orders/`, {\n method: 'POST',\n headers: apiHeaders(authToken),\n body: JSON.stringify(orderPayload)\n });\n\n if (response.ok || response.status === 201) {\n showToast(`Bestellt: ${name}`, 'success');\n await fetchOrders();\n } else {\n const data = await response.json();\n showToast(`Fehler: ${data.detail || data.non_field_errors?.[0] || 'Bestellung fehlgeschlagen'}`, 'error');\n }\n } catch (error) {\n console.error('Order error:', error);\n showToast('Netzwerkfehler bei Bestellung', 'error');\n }\n }\n\n // === Cancel Order ===\n async function cancelOrder(date, articleId, name) {\n if (!authToken) return;\n const key = `${date}_${articleId}`;\n const orderIds = orderMap.get(key);\n if (!orderIds || orderIds.length === 0) return;\n\n // LIFO: cancel most recent\n const orderId = orderIds[orderIds.length - 1];\n try {\n const response = await fetch(`${API_BASE}/user/orders/${orderId}/cancel/`, {\n method: 'PATCH',\n headers: apiHeaders(authToken),\n body: JSON.stringify({})\n });\n\n if (response.ok) {\n showToast(`Storniert: ${name}`, 'success');\n await fetchOrders();\n } else {\n const data = await response.json();\n showToast(`Fehler: ${data.detail || 'Stornierung fehlgeschlagen'}`, 'error');\n }\n } catch (error) {\n console.error('Cancel error:', error);\n showToast('Netzwerkfehler bei Stornierung', 'error');\n }\n }\n\n // === Flag Management (localStorage) ===\n function saveFlags() {\n localStorage.setItem('kantine_flags', JSON.stringify([...userFlags]));\n }\n\n function toggleFlag(date, articleId, name, cutoff) {\n const id = `${date}_${articleId}`;\n if (userFlags.has(id)) {\n userFlags.delete(id);\n showToast(`Flag entfernt f\u00fcr ${name}`, 'success');\n } else {\n userFlags.add(id);\n showToast(`Benachrichtigung aktiviert f\u00fcr ${name}`, 'success');\n if (Notification.permission === 'default') {\n Notification.requestPermission();\n }\n }\n saveFlags();\n renderVisibleWeeks();\n }\n\n // FR-019: Auto-remove flags whose cutoff has passed\n function cleanupExpiredFlags() {\n const now = new Date();\n let changed = false;\n for (const flagId of [...userFlags]) {\n const [date] = flagId.split('_');\n const cutoff = new Date(date);\n cutoff.setHours(10, 0, 0, 0); // Standard cutoff 10:00\n if (now >= cutoff) {\n userFlags.delete(flagId);\n changed = true;\n }\n }\n if (changed) saveFlags();\n }\n\n // === Polling (Client-Side) ===\n function startPolling() {\n if (pollIntervalId) return;\n if (!authToken) return;\n pollIntervalId = setInterval(() => pollFlaggedItems(), POLL_INTERVAL_MS);\n console.log('Polling started (every 5 min)');\n }\n\n function stopPolling() {\n if (pollIntervalId) {\n clearInterval(pollIntervalId);\n pollIntervalId = null;\n console.log('Polling stopped');\n }\n }\n\n async function pollFlaggedItems() {\n if (userFlags.size === 0 || !authToken) return;\n console.log(`Polling ${userFlags.size} flagged items...`);\n\n for (const flagId of userFlags) {\n const [date, articleIdStr] = flagId.split('_');\n const articleId = parseInt(articleIdStr);\n\n try {\n const response = await fetch(`${API_BASE}/venues/${VENUE_ID}/menu/${MENU_ID}/${date}/`, {\n headers: apiHeaders(authToken)\n });\n if (!response.ok) continue;\n\n const data = await response.json();\n const groups = data.results || [];\n let foundItem = null;\n for (const group of groups) {\n if (group.items) {\n foundItem = group.items.find(i => i.id === articleId || i.article === articleId);\n if (foundItem) break;\n }\n }\n\n if (foundItem) {\n const isAvailable = (foundItem.amount_tracking === false) || (parseInt(foundItem.available_amount) > 0);\n if (isAvailable) {\n const itemName = foundItem.name || 'Unbekannt';\n showToast(`${itemName} ist jetzt verf\u00fcgbar!`, 'success');\n if (Notification.permission === 'granted') {\n new Notification('Kantine Wrapper', {\n body: `${itemName} ist jetzt verf\u00fcgbar!`,\n icon: '\ud83c\udf7d\ufe0f'\n });\n }\n // Refresh menu data to update UI\n loadMenuDataFromAPI();\n }\n }\n } catch (err) {\n console.error(`Poll error for ${flagId}:`, err);\n // Small delay between checks\n await new Promise(r => setTimeout(r, 200));\n }\n }\n }\n\n // === Highlight Management ===\n let highlightTags = JSON.parse(localStorage.getItem('kantine_highlightTags') || '[]');\n\n function saveHighlightTags() {\n localStorage.setItem('kantine_highlightTags', JSON.stringify(highlightTags));\n renderVisibleWeeks(); // Refresh UI to apply changes\n updateNextWeekBadge();\n }\n\n function addHighlightTag(tag) {\n tag = tag.trim().toLowerCase();\n if (tag && !highlightTags.includes(tag)) {\n highlightTags.push(tag);\n saveHighlightTags();\n return true;\n }\n return false;\n }\n\n function removeHighlightTag(tag) {\n highlightTags = highlightTags.filter(t => t !== tag);\n saveHighlightTags();\n }\n\n function renderTagsList() {\n const list = document.getElementById('tags-list');\n list.innerHTML = '';\n highlightTags.forEach(tag => {\n const badge = document.createElement('span');\n badge.className = 'tag-badge';\n badge.innerHTML = `${tag} <span class=\"tag-remove\" data-tag=\"${tag}\">&times;</span>`;\n list.appendChild(badge);\n });\n\n // Bind remove events\n list.querySelectorAll('.tag-remove').forEach(btn => {\n btn.addEventListener('click', (e) => {\n removeHighlightTag(e.target.dataset.tag);\n renderTagsList();\n });\n });\n }\n\n function checkHighlight(text) {\n if (!text) return false;\n text = text.toLowerCase();\n return highlightTags.some(tag => text.includes(tag));\n }\n\n // === Local Menu Cache (localStorage) ===\n const CACHE_KEY = 'kantine_menuCache';\n const CACHE_TS_KEY = 'kantine_menuCacheTs';\n\n function saveMenuCache() {\n try {\n localStorage.setItem(CACHE_KEY, JSON.stringify(allWeeks));\n localStorage.setItem(CACHE_TS_KEY, new Date().toISOString());\n } catch (e) {\n console.warn('Failed to cache menu data:', e);\n }\n }\n\n function loadMenuCache() {\n try {\n const cached = localStorage.getItem(CACHE_KEY);\n const cachedTs = localStorage.getItem(CACHE_TS_KEY);\n if (cached) {\n allWeeks = JSON.parse(cached);\n currentWeekNumber = getISOWeek(new Date());\n currentYear = new Date().getFullYear();\n renderVisibleWeeks();\n updateNextWeekBadge();\n if (cachedTs) updateLastUpdatedTime(cachedTs);\n console.log('Loaded menu from cache');\n return true;\n }\n } catch (e) {\n console.warn('Failed to load cached menu:', e);\n }\n return false;\n }\n\n // === Menu Data Fetching (Direct from Bessa API) ===\n async function loadMenuDataFromAPI() {\n const loading = document.getElementById('loading');\n const progressModal = document.getElementById('progress-modal');\n const progressFill = document.getElementById('progress-fill');\n const progressPercent = document.getElementById('progress-percent');\n const progressMessage = document.getElementById('progress-message');\n\n loading.classList.remove('hidden');\n\n const token = authToken || GUEST_TOKEN;\n\n try {\n // Show progress modal\n progressModal.classList.remove('hidden');\n progressMessage.textContent = 'Hole verf\u00fcgbare Daten...';\n progressFill.style.width = '0%';\n progressPercent.textContent = '0%';\n\n // 1. Fetch available dates\n const datesResponse = await fetch(`${API_BASE}/venues/${VENUE_ID}/menu/dates/`, {\n headers: apiHeaders(token)\n });\n\n if (!datesResponse.ok) throw new Error(`Failed to fetch dates: ${datesResponse.status}`);\n\n const datesData = await datesResponse.json();\n let availableDates = datesData.results || [];\n\n // Filter \u2013 last 7 days + future, limit 30\n const cutoff = new Date();\n cutoff.setDate(cutoff.getDate() - 7);\n const cutoffStr = cutoff.toISOString().split('T')[0];\n\n availableDates = availableDates\n .filter(d => d.date >= cutoffStr)\n .sort((a, b) => a.date.localeCompare(b.date))\n .slice(0, 30);\n\n const totalDates = availableDates.length;\n progressMessage.textContent = `${totalDates} Tage gefunden. Lade Details...`;\n\n // 2. Fetch details for each date\n const allDays = [];\n let completed = 0;\n\n for (const dateObj of availableDates) {\n const dateStr = dateObj.date;\n const pct = Math.round(((completed + 1) / totalDates) * 100);\n progressFill.style.width = `${pct}%`;\n progressPercent.textContent = `${pct}%`;\n progressMessage.textContent = `Lade Men\u00fc f\u00fcr ${dateStr}...`;\n\n try {\n const detailResp = await fetch(`${API_BASE}/venues/${VENUE_ID}/menu/${MENU_ID}/${dateStr}/`, {\n headers: apiHeaders(token)\n });\n\n if (detailResp.ok) {\n const detailData = await detailResp.json();\n // Debug: log raw API response for first date\n if (completed === 0) {\n console.log('[Kantine Debug] Raw API response for', dateStr, ':', JSON.stringify(detailData).substring(0, 2000));\n }\n const menuGroups = detailData.results || [];\n let dayItems = [];\n for (const group of menuGroups) {\n if (group.items && Array.isArray(group.items)) {\n dayItems = dayItems.concat(group.items);\n }\n }\n if (dayItems.length > 0) {\n // Debug: log first item structure\n if (completed === 0) {\n console.log('[Kantine Debug] First item keys:', Object.keys(dayItems[0]));\n console.log('[Kantine Debug] First item:', JSON.stringify(dayItems[0]).substring(0, 500));\n }\n allDays.push({\n date: dateStr,\n menu_items: dayItems,\n orders: dateObj.orders || []\n });\n }\n }\n } catch (err) {\n console.error(`Failed to fetch details for ${dateStr}:`, err);\n }\n\n completed++;\n // Small delay to avoid rate limiting\n await new Promise(r => setTimeout(r, 100));\n }\n\n // 3. Group by ISO week (Merge with existing to preserve past days)\n const weeksMap = new Map();\n\n // Hydrate from existing cache (preserve past data)\n if (allWeeks && allWeeks.length > 0) {\n allWeeks.forEach(w => {\n const key = `${w.year}-${w.weekNumber}`;\n try {\n weeksMap.set(key, {\n year: w.year,\n weekNumber: w.weekNumber,\n days: w.days ? w.days.map(d => ({ ...d, items: d.items ? [...d.items] : [] })) : []\n });\n } catch (e) { console.warn('Error hydrating week:', e); }\n });\n }\n\n for (const day of allDays) {\n const d = new Date(day.date);\n const weekNum = getISOWeek(d);\n const year = getWeekYear(d);\n const key = `${year}-${weekNum}`;\n\n if (!weeksMap.has(key)) {\n weeksMap.set(key, { year, weekNumber: weekNum, days: [] });\n }\n\n const weekObj = weeksMap.get(key);\n const weekday = d.toLocaleDateString('en-US', { weekday: 'long' });\n const orderCutoffDate = new Date(day.date);\n orderCutoffDate.setHours(10, 0, 0, 0);\n\n const newDayObj = {\n date: day.date,\n weekday: weekday,\n orderCutoff: orderCutoffDate.toISOString(),\n items: day.menu_items.map(item => {\n const isUnlimited = item.amount_tracking === false;\n const hasStock = parseInt(item.available_amount) > 0;\n return {\n id: `${day.date}_${item.id}`,\n articleId: item.id,\n name: item.name || 'Unknown',\n description: item.description || '',\n price: parseFloat(item.price) || 0,\n available: isUnlimited || hasStock,\n availableAmount: parseInt(item.available_amount) || 0,\n amountTracking: item.amount_tracking !== false\n };\n })\n };\n\n // Merge: Overwrite if exists, push if new\n const existingIndex = weekObj.days.findIndex(existing => existing.date === day.date);\n if (existingIndex >= 0) {\n weekObj.days[existingIndex] = newDayObj;\n } else {\n weekObj.days.push(newDayObj);\n }\n }\n\n // Sort weeks and days\n allWeeks = Array.from(weeksMap.values()).sort((a, b) => {\n if (a.year !== b.year) return a.year - b.year;\n return a.weekNumber - b.weekNumber;\n });\n allWeeks.forEach(w => {\n if (w.days) w.days.sort((a, b) => a.date.localeCompare(b.date));\n });\n\n // Save to localStorage cache\n saveMenuCache();\n\n // Update timestamp\n updateLastUpdatedTime(new Date().toISOString());\n\n currentWeekNumber = getISOWeek(new Date());\n currentYear = new Date().getFullYear();\n\n\n\n updateAuthUI(); // This will trigger fetchOrders if logged in\n renderVisibleWeeks();\n updateNextWeekBadge();\n\n progressMessage.textContent = 'Fertig!';\n setTimeout(() => progressModal.classList.add('hidden'), 500);\n\n } catch (error) {\n console.error('Error fetching menu:', error);\n progressModal.classList.add('hidden');\n\n showErrorModal(\n 'Keine Verbindung',\n `Die Men\u00fcdaten konnten nicht geladen werden. M\u00f6glicherweise besteht keine Verbindung zur API oder zur Bessa-Webseite.<br><br><small style=\"color:var(--text-secondary)\">${error.message}</small>`,\n 'Zur Original-Seite',\n 'https://web.bessa.app/knapp-kantine'\n );\n } finally {\n loading.classList.add('hidden');\n }\n }\n\n // === Last Updated Display ===\n function updateLastUpdatedTime(isoTimestamp) {\n const subtitle = document.getElementById('last-updated-subtitle');\n if (!isoTimestamp) return;\n try {\n const date = new Date(isoTimestamp);\n const timeStr = date.toLocaleTimeString('de-DE', { hour: '2-digit', minute: '2-digit' });\n const dateStr = date.toLocaleDateString('de-DE', { day: '2-digit', month: '2-digit' });\n subtitle.textContent = `Aktualisiert: ${dateStr} ${timeStr}`;\n } catch (e) {\n subtitle.textContent = '';\n }\n }\n\n // === Toast Notification ===\n function showToast(message, type = 'info') {\n let container = document.getElementById('toast-container');\n if (!container) {\n container = document.createElement('div');\n container.id = 'toast-container';\n document.body.appendChild(container);\n }\n const toast = document.createElement('div');\n toast.className = `toast toast-${type}`;\n const icon = type === 'success' ? 'check_circle' : type === 'error' ? 'error' : 'info';\n toast.innerHTML = `<span class=\"material-icons-round\">${icon}</span><span>${message}</span>`;\n container.appendChild(toast);\n requestAnimationFrame(() => toast.classList.add('show'));\n setTimeout(() => {\n toast.classList.remove('show');\n setTimeout(() => toast.remove(), 300);\n }, 3000);\n }\n\n // === Next Week Badge ===\n function updateNextWeekBadge() {\n const btnNextWeek = document.getElementById('btn-next-week');\n let nextWeek = currentWeekNumber + 1;\n let nextYear = currentYear;\n if (nextWeek > 52) { nextWeek = 1; nextYear++; }\n\n const nextWeekData = allWeeks.find(w => w.weekNumber === nextWeek && w.year === nextYear);\n let totalDataCount = 0;\n let orderableCount = 0;\n let daysWithOrders = 0;\n let daysWithOrderableAndNoOrder = 0;\n\n if (nextWeekData && nextWeekData.days) {\n nextWeekData.days.forEach(day => {\n if (day.items && day.items.length > 0) {\n totalDataCount++;\n const isOrderable = day.items.some(item => item.available);\n if (isOrderable) orderableCount++;\n\n let hasOrder = false;\n day.items.forEach(item => {\n const articleId = item.articleId || parseInt(item.id.split('_')[1]);\n const key = `${day.date}_${articleId}`;\n if (orderMap.has(key) && orderMap.get(key).length > 0) hasOrder = true;\n });\n\n if (hasOrder) daysWithOrders++;\n if (isOrderable && !hasOrder) daysWithOrderableAndNoOrder++;\n }\n });\n }\n\n let badge = btnNextWeek.querySelector('.nav-badge');\n if (totalDataCount > 0) {\n if (!badge) {\n badge = document.createElement('span');\n badge.className = 'nav-badge';\n btnNextWeek.appendChild(badge);\n }\n\n // Format: ( Ordered / Orderable / Total )\n badge.title = `${daysWithOrders} bestellt / ${orderableCount} bestellbar / ${totalDataCount} gesamt`;\n badge.innerHTML = `<span class=\"ordered\">${daysWithOrders}</span><span class=\"separator\">/</span><span class=\"orderable\">${orderableCount}</span><span class=\"separator\">/</span><span class=\"total\">${totalDataCount}</span>`;\n\n // Color Logic\n badge.classList.remove('badge-violet', 'badge-green', 'badge-red', 'badge-blue');\n\n // Refined Logic (v1.7.4):\n // Violet: If we have orders AND there are no DAYS left that are orderable but un-ordered.\n // (i.e. \"I have ordered everything I can\")\n if (daysWithOrders > 0 && daysWithOrderableAndNoOrder === 0) {\n badge.classList.add('badge-violet');\n } else if (daysWithOrderableAndNoOrder > 0) {\n badge.classList.add('badge-green'); // Orderable days exist without order\n } else if (orderableCount === 0) {\n badge.classList.add('badge-red'); // No orderable days at all & no orders\n } else {\n badge.classList.add('badge-blue'); // Default / partial state\n }\n\n // Advanced Feature: Highlight Count\n let highlightCount = 0;\n if (nextWeekData && nextWeekData.days) {\n nextWeekData.days.forEach(day => {\n day.items.forEach(item => {\n if (checkHighlight(item.name) || checkHighlight(item.description)) {\n highlightCount++;\n }\n });\n });\n }\n\n if (highlightCount > 0) {\n // Append blue count\n badge.innerHTML += `<span class=\"highlight-count\" title=\"${highlightCount} Highlight Men\u00fcs\">(${highlightCount})</span>`;\n badge.title += ` \u2022 ${highlightCount} Highlights gefunden`;\n badge.classList.add('has-highlights');\n }\n\n } else if (badge) {\n badge.remove();\n }\n }\n\n // === Weekly Cost ===\n function updateWeeklyCost(days) {\n let totalCost = 0;\n if (days && days.length > 0) {\n days.forEach(day => {\n if (day.items) {\n day.items.forEach(item => {\n const articleId = item.articleId || parseInt(item.id.split('_')[1]);\n const key = `${day.date}_${articleId}`;\n const orders = orderMap.get(key) || [];\n if (orders.length > 0) totalCost += item.price * orders.length;\n });\n }\n });\n }\n\n const costDisplay = document.getElementById('weekly-cost-display');\n if (totalCost > 0) {\n costDisplay.innerHTML = `<span class=\"material-icons-round\">shopping_bag</span> <span>Gesamt: ${totalCost.toFixed(2).replace('.', ',')} \u20ac</span>`;\n costDisplay.classList.remove('hidden');\n } else {\n costDisplay.classList.add('hidden');\n }\n }\n\n // === Render Weeks ===\n function renderVisibleWeeks() {\n const menuContainer = document.getElementById('menu-container');\n if (!menuContainer) return;\n menuContainer.innerHTML = '';\n\n let targetWeek = currentWeekNumber;\n let targetYear = currentYear;\n\n if (displayMode === 'next-week') {\n targetWeek++;\n if (targetWeek > 52) { targetWeek = 1; targetYear++; }\n }\n\n // Flatten & filter by week + year\n const allDays = allWeeks.flatMap(w => w.days || []);\n const daysInTargetWeek = allDays.filter(day => {\n const d = new Date(day.date);\n return getISOWeek(d) === targetWeek && getWeekYear(d) === targetYear;\n });\n\n if (daysInTargetWeek.length === 0) {\n menuContainer.innerHTML = `\n <div class=\"empty-state\">\n <p>Keine Men\u00fcdaten f\u00fcr KW ${targetWeek} (${targetYear}) verf\u00fcgbar.</p>\n <small>Versuchen Sie eine andere Woche oder schauen Sie sp\u00e4ter vorbei.</small>\n </div>`;\n document.getElementById('weekly-cost-display').classList.add('hidden');\n return;\n }\n\n updateWeeklyCost(daysInTargetWeek);\n\n // Update header\n const headerWeekInfo = document.getElementById('header-week-info');\n const weekTitle = displayMode === 'this-week' ? 'Diese Woche' : 'N\u00e4chste Woche';\n headerWeekInfo.innerHTML = `\n <div class=\"header-week-title\">${weekTitle}</div>\n <div class=\"header-week-subtitle\">Week ${targetWeek} \u2022 ${targetYear}</div>`;\n\n const grid = document.createElement('div');\n grid.className = 'days-grid';\n\n daysInTargetWeek.sort((a, b) => a.date.localeCompare(b.date));\n\n // Filter weekends\n const workingDays = daysInTargetWeek.filter(d => {\n const date = new Date(d.date);\n const day = date.getDay();\n return day !== 0 && day !== 6;\n });\n\n workingDays.forEach(day => {\n const card = createDayCard(day);\n if (card) grid.appendChild(card);\n });\n\n menuContainer.appendChild(grid);\n setTimeout(() => syncMenuItemHeights(grid), 0);\n }\n\n // === Sync Item Heights ===\n function syncMenuItemHeights(grid) {\n const cards = grid.querySelectorAll('.menu-card');\n if (cards.length === 0) return;\n let maxItems = 0;\n cards.forEach(card => {\n maxItems = Math.max(maxItems, card.querySelectorAll('.menu-item').length);\n });\n for (let i = 0; i < maxItems; i++) {\n let maxHeight = 0;\n const itemsAtPos = [];\n cards.forEach(card => {\n const items = card.querySelectorAll('.menu-item');\n if (items[i]) {\n items[i].style.height = 'auto';\n maxHeight = Math.max(maxHeight, items[i].offsetHeight);\n itemsAtPos.push(items[i]);\n }\n });\n itemsAtPos.forEach(item => { item.style.height = `${maxHeight}px`; });\n }\n }\n\n // === Create Day Card ===\n function createDayCard(day) {\n if (!day.items || day.items.length === 0) return null;\n\n const card = document.createElement('div');\n card.className = 'menu-card';\n\n const now = new Date();\n const cardDate = new Date(day.date);\n\n let isPastCutoff = false;\n if (day.orderCutoff) {\n isPastCutoff = now >= new Date(day.orderCutoff);\n } else {\n const today = new Date();\n today.setHours(0, 0, 0, 0);\n const cd = new Date(day.date);\n cd.setHours(0, 0, 0, 0);\n isPastCutoff = cd < today;\n }\n\n if (isPastCutoff) card.classList.add('past-day');\n\n // Collect ordered menu codes\n const menuBadges = [];\n if (day.items) {\n day.items.forEach(item => {\n const articleId = item.articleId || parseInt(item.id.split('_')[1]);\n const orderKey = `${day.date}_${articleId}`;\n const orders = orderMap.get(orderKey) || [];\n const count = orders.length;\n\n if (count > 0) {\n // Regex for M1, M2, M1F etc.\n const match = item.name.match(/([M][1-9][Ff]?)/);\n if (match) {\n let code = match[1];\n if (count > 1) code += '+';\n menuBadges.push(code);\n }\n }\n });\n }\n\n // Header\n const header = document.createElement('div');\n header.className = 'card-header';\n const dateStr = cardDate.toLocaleDateString('de-DE', { day: '2-digit', month: '2-digit' });\n\n const badgesHtml = menuBadges.map(code => `<span class=\"menu-code-badge\">${code}</span>`).join('');\n\n // Determine Day Status for Header Color\n // Violet: Has Order\n // Green: No Order but Orderable\n // Red: No Order and Not Orderable (Locked/Sold Out)\n let headerClass = '';\n const hasAnyOrder = day.items && day.items.some(item => {\n const articleId = item.articleId || parseInt(item.id.split('_')[1]);\n const key = `${day.date}_${articleId}`;\n return orderMap.has(key) && orderMap.get(key).length > 0;\n });\n\n const hasOrderable = day.items && day.items.some(item => {\n // Use pre-calculated available flag from loadMenuDataFromAPI calculation\n return item.available;\n });\n\n if (hasAnyOrder) {\n headerClass = 'header-violet';\n } else if (hasOrderable && !isPastCutoff) {\n headerClass = 'header-green';\n } else {\n // Red if not orderable (or past cutoff)\n headerClass = 'header-red';\n }\n\n if (headerClass) header.classList.add(headerClass);\n\n header.innerHTML = `\n <div class=\"day-header-left\">\n <span class=\"day-name\">${translateDay(day.weekday)}</span>\n <div class=\"day-badges\">${badgesHtml}</div>\n </div>\n <span class=\"day-date\">${dateStr}</span>`;\n card.appendChild(header);\n\n // Body\n const body = document.createElement('div');\n body.className = 'card-body';\n\n const todayDateStr = new Date().toISOString().split('T')[0];\n const isToday = day.date === todayDateStr;\n\n const sortedItems = [...day.items].sort((a, b) => {\n if (isToday) {\n const aId = a.articleId || parseInt(a.id.split('_')[1]);\n const bId = b.articleId || parseInt(b.id.split('_')[1]);\n const aOrdered = orderMap.has(`${day.date}_${aId}`);\n const bOrdered = orderMap.has(`${day.date}_${bId}`);\n\n if (aOrdered && !bOrdered) return -1;\n if (!aOrdered && bOrdered) return 1;\n }\n return a.name.localeCompare(b.name);\n });\n\n sortedItems.forEach(item => {\n const itemEl = document.createElement('div');\n itemEl.className = 'menu-item';\n\n const articleId = item.articleId || parseInt(item.id.split('_')[1]);\n const orderKey = `${day.date}_${articleId}`;\n const orderIds = orderMap.get(orderKey) || [];\n const orderCount = orderIds.length;\n\n // Status badge\n let statusBadge = '';\n if (item.available) {\n statusBadge = item.amountTracking\n ? `<span class=\"badge available\">Verf\u00fcgbar (${item.availableAmount})</span>`\n : `<span class=\"badge available\">Verf\u00fcgbar</span>`;\n } else {\n statusBadge = `<span class=\"badge sold-out\">Ausverkauft</span>`;\n }\n\n // Order badge\n let orderedBadge = '';\n if (orderCount > 0) {\n const countBadge = orderCount > 1 ? `<span class=\"order-count-badge\">${orderCount}</span>` : '';\n orderedBadge = `<span class=\"badge ordered\"><span class=\"material-icons-round\">check_circle</span> Bestellt${countBadge}</span>`;\n itemEl.classList.add('ordered');\n if (new Date(day.date).toDateString() === now.toDateString()) {\n itemEl.classList.add('today-ordered');\n }\n }\n\n // Flagged styles\n const flagId = `${day.date}_${articleId}`;\n const isFlagged = userFlags.has(flagId);\n if (isFlagged) {\n itemEl.classList.add(item.available ? 'flagged-available' : 'flagged-sold-out');\n }\n\n // Highlight matching menu items based on user tags\n if (checkHighlight(item.name) || checkHighlight(item.description)) {\n itemEl.classList.add('highlight-glow');\n }\n\n // Action buttons\n let orderButton = '';\n let cancelButton = '';\n let flagButton = '';\n\n if (authToken && !isPastCutoff) {\n // Flag button\n const flagIcon = isFlagged ? 'notifications_active' : 'notifications_none';\n const flagClass = isFlagged ? 'btn-flag active' : 'btn-flag';\n const flagTitle = isFlagged ? 'Benachrichtigung deaktivieren' : 'Benachrichtigen wenn verf\u00fcgbar';\n if (!item.available || isFlagged) {\n flagButton = `<button class=\"${flagClass}\" data-date=\"${day.date}\" data-article=\"${articleId}\" data-name=\"${escapeHtml(item.name)}\" data-cutoff=\"${day.orderCutoff}\" title=\"${flagTitle}\"><span class=\"material-icons-round\">${flagIcon}</span></button>`;\n }\n\n // Order button\n if (item.available) {\n if (orderCount > 0) {\n orderButton = `<button class=\"btn-order btn-order-compact\" data-date=\"${day.date}\" data-article=\"${articleId}\" data-name=\"${escapeHtml(item.name)}\" data-price=\"${item.price}\" data-desc=\"${escapeHtml(item.description || '')}\" title=\"${escapeHtml(item.name)} nochmal bestellen\"><span class=\"material-icons-round\">add</span></button>`;\n } else {\n orderButton = `<button class=\"btn-order\" data-date=\"${day.date}\" data-article=\"${articleId}\" data-name=\"${escapeHtml(item.name)}\" data-price=\"${item.price}\" data-desc=\"${escapeHtml(item.description || '')}\" title=\"${escapeHtml(item.name)} bestellen\"><span class=\"material-icons-round\">add_shopping_cart</span> Bestellen</button>`;\n }\n }\n\n // Cancel button\n if (orderCount > 0) {\n const cancelIcon = orderCount === 1 ? 'close' : 'remove';\n const cancelTitle = orderCount === 1 ? 'Bestellung stornieren' : 'Eine Bestellung stornieren';\n cancelButton = `<button class=\"btn-cancel\" data-date=\"${day.date}\" data-article=\"${articleId}\" data-name=\"${escapeHtml(item.name)}\" title=\"${cancelTitle}\"><span class=\"material-icons-round\">${cancelIcon}</span></button>`;\n }\n }\n\n itemEl.innerHTML = `\n <div class=\"item-header\">\n <span class=\"item-name\">${escapeHtml(item.name)}</span>\n <span class=\"item-price\">${item.price.toFixed(2)} \u20ac</span>\n </div>\n <div class=\"item-status-row\">\n ${orderedBadge}\n ${cancelButton}\n ${orderButton}\n ${flagButton}\n <div class=\"badges\">${statusBadge}</div>\n </div>\n <p class=\"item-desc\">${escapeHtml(item.description)}</p>`;\n\n // Event: Order\n const orderBtn = itemEl.querySelector('.btn-order');\n if (orderBtn) {\n orderBtn.addEventListener('click', (e) => {\n e.stopPropagation();\n const btn = e.currentTarget;\n btn.disabled = true;\n btn.classList.add('loading');\n placeOrder(btn.dataset.date, parseInt(btn.dataset.article), btn.dataset.name, parseFloat(btn.dataset.price), btn.dataset.desc || '')\n .finally(() => { btn.disabled = false; btn.classList.remove('loading'); });\n });\n }\n\n // Event: Cancel\n const cancelBtn = itemEl.querySelector('.btn-cancel');\n if (cancelBtn) {\n cancelBtn.addEventListener('click', (e) => {\n e.stopPropagation();\n const btn = e.currentTarget;\n btn.disabled = true;\n cancelOrder(btn.dataset.date, parseInt(btn.dataset.article), btn.dataset.name)\n .finally(() => { btn.disabled = false; });\n });\n }\n\n // Event: Flag\n const flagBtn = itemEl.querySelector('.btn-flag');\n if (flagBtn) {\n flagBtn.addEventListener('click', (e) => {\n e.stopPropagation();\n const btn = e.currentTarget;\n toggleFlag(btn.dataset.date, parseInt(btn.dataset.article), btn.dataset.name, btn.dataset.cutoff);\n });\n }\n\n body.appendChild(itemEl);\n });\n\n card.appendChild(body);\n return card;\n }\n\n // === Version Check ===\n async function checkForUpdates() {\n const CurrentVersion = 'v1.2.1';\n const VersionUrl = 'https://raw.githubusercontent.com/TauNeutrino/kantine-overview/main/version.txt';\n const InstallerUrl = 'https://htmlpreview.github.io/?https://github.com/TauNeutrino/kantine-overview/blob/main/dist/install.html';\n\n console.log(`[Kantine] Checking for updates... (Current: ${CurrentVersion})`);\n\n try {\n const response = await fetch(VersionUrl, { cache: 'no-cache' });\n if (!response.ok) return;\n\n const remoteVersion = (await response.text()).trim();\n\n if (remoteVersion && remoteVersion !== CurrentVersion) {\n console.log(`[Kantine] New version available: ${remoteVersion}`);\n\n // Fetch Changelog content\n let changeSummary = '';\n try {\n const clResp = await fetch('https://raw.githubusercontent.com/TauNeutrino/kantine-overview/main/changelog.md');\n if (clResp.ok) {\n const clText = await clResp.text();\n const match = clText.match(/## (v[^\\n]+)\\n((?:-[^\\n]+\\n)+)/);\n if (match && match[1].includes(remoteVersion)) {\n changeSummary = match[2].replace(/- /g, '\u2022 ').trim();\n }\n }\n } catch (e) { console.warn('No changelog', e); }\n\n // Create Banner\n const updateBanner = document.createElement('div');\n updateBanner.className = 'update-banner';\n updateBanner.innerHTML = `\n <div class=\"update-content\">\n <strong>Update verf\u00fcgbar: ${remoteVersion}</strong>\n ${changeSummary ? `<pre class=\"change-summary\">${changeSummary}</pre>` : ''}\n <a href=\"${InstallerUrl}\" target=\"_blank\" class=\"update-link\">\n <span class=\"material-icons-round\">system_update_alt</span>\n Jetzt aktualisieren\n </a>\n </div>\n <button class=\"icon-btn-small close-update\">&times;</button>\n `;\n\n document.body.appendChild(updateBanner);\n updateBanner.querySelector('.close-update').addEventListener('click', () => updateBanner.remove());\n\n // Highlight Header Icon\n const lastUpdatedIcon = document.querySelector('.material-icons-round.logo-icon');\n if (lastUpdatedIcon) {\n lastUpdatedIcon.style.color = 'var(--accent-color)';\n lastUpdatedIcon.parentElement.title = `Update verf\u00fcgbar: ${remoteVersion}`;\n }\n }\n } catch (error) {\n console.warn('[Kantine] Version check failed:', error);\n }\n }\n\n // === Order Countdown ===\n function updateCountdown() {\n const now = new Date();\n const currentDay = now.getDay();\n // Skip weekends (0=Sun, 6=Sat)\n if (currentDay === 0 || currentDay === 6) {\n removeCountdown();\n return;\n }\n\n const todayStr = now.toISOString().split('T')[0];\n\n // 1. Check if we already ordered for today\n let hasOrder = false;\n // Optimization: Check orderMap for today's date\n // Keys are \"YYYY-MM-DD_ArticleID\"\n for (const key of orderMap.keys()) {\n if (key.startsWith(todayStr)) {\n hasOrder = true;\n break;\n }\n }\n\n if (hasOrder) {\n removeCountdown();\n return;\n }\n\n // 2. Calculate time to cutoff (10:00 AM)\n const cutoff = new Date();\n cutoff.setHours(10, 0, 0, 0);\n\n const diff = cutoff - now;\n\n // If passed cutoff or more than 3 hours away (e.g. 07:00), maybe don't show?\n // User req: \"heute noch keine bestellung... countdown erscheinen\"\n // Let's show it if within valid order window (e.g. 00:00 - 10:00)\n\n if (diff <= 0) {\n removeCountdown();\n return;\n }\n\n // 3. Render Countdown\n const diffHrs = Math.floor(diff / 3600000);\n const diffMins = Math.floor((diff % 3600000) / 60000);\n\n const headerCenter = document.querySelector('.header-center-wrapper');\n if (!headerCenter) return;\n\n let countdownEl = document.getElementById('order-countdown');\n if (!countdownEl) {\n countdownEl = document.createElement('div');\n countdownEl.id = 'order-countdown';\n // Insert before cost display or append\n headerCenter.insertBefore(countdownEl, headerCenter.firstChild);\n }\n\n countdownEl.innerHTML = `<span>Bestellschluss:</span> <strong>${diffHrs}h ${diffMins}m</strong>`;\n\n // Red Alert if < 1 hour\n if (diff < 3600000) { // 1 hour\n countdownEl.classList.add('urgent');\n\n // Notification logic (One time)\n const notifiedKey = `kantine_notified_${todayStr}`;\n if (!sessionStorage.getItem(notifiedKey)) {\n if (Notification.permission === 'granted') {\n new Notification('Kantine: Bestellschluss naht!', {\n body: 'Du hast heute noch nichts bestellt. Nur noch 1 Stunde!',\n icon: '\u23f3'\n });\n } else if (Notification.permission === 'default') {\n Notification.requestPermission();\n }\n sessionStorage.setItem(notifiedKey, 'true');\n }\n } else {\n countdownEl.classList.remove('urgent');\n }\n }\n\n function removeCountdown() {\n const el = document.getElementById('order-countdown');\n if (el) el.remove();\n }\n\n // Update countdown every minute\n setInterval(updateCountdown, 60000);\n // Also update on load\n setTimeout(updateCountdown, 1000);\n\n // === Helpers === \n function getISOWeek(date) {\n const d = new Date(Date.UTC(date.getFullYear(), date.getMonth(), date.getDate()));\n const dayNum = d.getUTCDay() || 7;\n d.setUTCDate(d.getUTCDate() + 4 - dayNum);\n const yearStart = new Date(Date.UTC(d.getUTCFullYear(), 0, 1));\n return Math.ceil(((d - yearStart) / 86400000 + 1) / 7);\n }\n\n function getWeekYear(d) {\n const date = new Date(d.getTime());\n date.setDate(date.getDate() + 3 - (date.getDay() + 6) % 7);\n return date.getFullYear();\n }\n\n\n function translateDay(englishDay) {\n const map = { Monday: 'Montag', Tuesday: 'Dienstag', Wednesday: 'Mittwoch', Thursday: 'Donnerstag', Friday: 'Freitag', Saturday: 'Samstag', Sunday: 'Sonntag' };\n return map[englishDay] || englishDay;\n }\n\n function escapeHtml(text) {\n const div = document.createElement('div');\n div.textContent = text || '';\n return div.innerHTML;\n }\n\n // === Bootstrap ===\n injectUI();\n bindEvents();\n updateAuthUI();\n cleanupExpiredFlags();\n\n // Load cached data first for instant UI, then refresh from API\n const hadCache = loadMenuCache();\n if (hadCache) {\n // Hide loading spinner since cache is shown\n document.getElementById('loading').classList.add('hidden');\n }\n loadMenuDataFromAPI();\n\n // Auto-start polling if already logged in\n if (authToken) {\n startPolling();\n }\n\n // Check for updates\n checkForUpdates();\n\n console.log('Kantine Wrapper loaded \u2705');\n})();\n\n// === Error Modal ===\nfunction showErrorModal(title, htmlContent, btnText, url) {\n const modalId = 'error-modal';\n let modal = document.getElementById(modalId);\n if (modal) modal.remove();\n\n modal = document.createElement('div');\n modal.id = modalId;\n modal.className = 'modal hidden';\n modal.innerHTML = `\n <div class=\"modal-content\">\n <div class=\"modal-header\">\n <h2 style=\"color: var(--error-color); display: flex; align-items: center; gap: 10px;\">\n <span class=\"material-icons-round\">signal_wifi_off</span>\n ${title}\n </h2>\n </div>\n <div style=\"padding: 20px;\">\n <p style=\"margin-bottom: 15px; color: var(--text-primary);\">${htmlContent}</p>\n <div style=\"margin-top: 20px; display: flex; justify-content: center;\">\n <button id=\"btn-error-redirect\" style=\"\n background-color: var(--accent-color); \n color: white; \n padding: 12px 24px; \n border-radius: 8px; \n border: none; \n font-weight: 600; \n cursor: pointer;\n display: flex;\n align-items: center;\n gap: 8px;\n width: 100%;\n justify-content: center;\n transition: transform 0.1s;\n \">\n ${btnText}\n <span class=\"material-icons-round\">open_in_new</span>\n </button>\n </div>\n </div>\n </div>\n `;\n document.body.appendChild(modal);\n\n document.getElementById('btn-error-redirect').addEventListener('click', () => {\n window.location.href = url;\n });\n\n requestAnimationFrame(() => {\n modal.classList.remove('hidden');\n });\n}\n"; document.head.appendChild(sc); })(); 
diff --git a/dist/install.html b/dist/install.html
index 6a61c61..8bd4e9b 100755
--- a/dist/install.html
+++ b/dist/install.html
@@ -2,7 +2,7 @@
 <html lang="de">
 <head>
     <meta charset="UTF-8">
-    <title>Kantine Wrapper Installer (v1.2.0)</title>
+    <title>Kantine Wrapper Installer (v1.2.1)</title>
     <style>
         body { font-family: 'Inter', sans-serif; max-width: 600px; margin: 40px auto; padding: 20px; background: #1a1a2e; color: #eee; }
         h1 { color: #029AA8; } /* Knapp Teal */
@@ -14,7 +14,7 @@
     </style>
 </head>
 <body>
-    <h1>🍽️ Kantine Wrapper <span style="font-size:0.5em; opacity:0.6; font-weight:400; vertical-align:middle; margin-left:10px;">v1.2.0</span></h1>
+    <h1>🍽️ Kantine Wrapper <span style="font-size:0.5em; opacity:0.6; font-weight:400; vertical-align:middle; margin-left:10px;">v1.2.1</span></h1>
     
     <!-- 1. BUTTON (Top Priority) -->
     <div class="card" style="text-align: center; border: 2px solid #029AA8;">
@@ -28,7 +28,7 @@
     <ol>
         <li>Ziehe den Button oben in deine <strong>Lesezeichen-Leiste</strong> (Drag & Drop)</li>
         <li>Navigiere zu <a href="https://web.bessa.app/knapp-kantine" style="color:#029AA8">web.bessa.app/knapp-kantine</a></li>
-        <li>Klicke auf das Lesezeichen <code>Kantine v1.2.0</code></li>
+        <li>Klicke auf das Lesezeichen <code>Kantine v1.2.1</code></li>
     </ol>
     </div>
 
@@ -54,7 +54,17 @@
     <div class="card">
         <h2>Changelog</h2>
         <div class="changelog-container">
-            <h3>v1.2.0 (2026-02-16)</h3>
+            <h3>v1.2.1 (2026-02-16)</h3>
+<ul>
+<li>**Fix**: Smart Highlights werden jetzt korrekt auf Menü-Items angewendet (`checkHighlight` in `createDayCard`). 🌟</li>
+<li>**Feature**: Mock-Daten (`mock-data.js`) für Standalone-Tests eingebaut. 🧪</li>
+<li>**Style**: Highlight-Glow mit blauer Puls-Animation (`blue-pulse`) überarbeitet. 💎</li>
+<li>**Style**: Tag-Badges konsistent mit Badge-System gestaltet. 🏷️</li>
+<li>**Style**: "Hinzufügen"-Button (`#btn-add-tag`) als Primary-Button gestylt. 🎨</li>
+<li>**Style**: Modal-Body Padding und Input-Font korrigiert. 🔧</li>
+<li>**Docs**: README Projektstruktur mit Tabelle für `dist/`-Artefakte ergänzt. 📖</li>
+</ul>
+<h3>v1.2.0 (2026-02-16)</h3>
 <ul>
 <li>**Feature**: Bessere UX im Installer (Button oben, Log unten, Features aktualisiert). 💅</li>
 <li>**Tech**: Build-Tests hinzugefügt. 🧪</li>
@@ -93,8 +103,8 @@
 
     <script>
 document.getElementById('bookmarklet-link').href = 
-"javascript:(function()%7Bvar%20s=document.createElement(%27style%27);s.textContent=%27:root%20%7B%20%20%20/%2A%20Premium%20Slate/Gray-Blue%20Palette%20-%20Light%20Mode%20%2A/%20%20%20--bg-body:%20%23f1f5f9;%20%20%20/%2A%20Slate%20100%20%2A/%20%20%20--bg-card:%20%23ffffff;%20%20%20--text-primary:%20%23334155;%20%20%20/%2A%20Slate%20700%20%2A/%20%20%20--text-secondary:%20%2364748b;%20%20%20--accent-color:%20%230f172a;%20%20%20/%2A%20Slate%20900%20(High%20contrast)%20%2A/%20%20%20--border-color:%20%23cbd5e1;%20%20%20/%2A%20Slate%20300%20%2A/%20%20%20--banner-bg:%20%23e2e8f0;%20%20%20--banner-text:%20%231e293b;%20%20%20--success-color:%20%23059669;%20%20%20--error-color:%20%23dc2626;%20%20%20--card-shadow:%200%204px%206px%20-1px%20rgb(0%200%200%20/%200.05),%200%202px%204px%20-2px%20rgb(0%200%200%20/%200.05);%20%20%20--header-bg:%20rgba(255,%20255,%20255,%200.9);%20%20%20--header-border:%201px%20solid%20rgba(203,%20213,%20225,%200.6);%20%7D%20%5Bdata-theme=%5C%22dark%5C%22%5D%20%7B%20%20%20/%2A%20Premium%20Slate/Gray-Blue%20Palette%20-%20Dark%20Mode%20%2A/%20%20%20--bg-body:%20%231e293b;%20%20%20/%2A%20Deep%20Slate%20Gray%20(Requested)%20%2A/%20%20%20--bg-card:%20%23334155;%20%20%20/%2A%20Slate%20700%20%2A/%20%20%20--text-primary:%20%23f8fafc;%20%20%20/%2A%20Slate%2050%20%2A/%20%20%20--text-secondary:%20%23cbd5e1;%20%20%20/%2A%20Slate%20300%20%2A/%20%20%20--accent-color:%20%2360a5fa;%20%20%20/%2A%20Blue%20400%20%2A/%20%20%20--border-color:%20%23475569;%20%20%20/%2A%20Slate%20600%20%2A/%20%20%20--banner-bg:%20%23475569;%20%20%20--banner-text:%20%23e2e8f0;%20%20%20--header-bg:%20rgba(30,%2041,%2059,%200.9);%20%20%20--header-border:%201px%20solid%20rgba(71,%2085,%20105,%200.6);%20%20%20--card-shadow:%200%2010px%2015px%20-3px%20rgb(0%200%200%20/%200.4);%20%7D%20%2A%20%7B%20%20%20box-sizing:%20border-box;%20%20%20margin:%200;%20%20%20padding:%200;%20%7D%20body%20%7B%20%20%20font-family:%20%5C%27Inter%5C%27,%20system-ui,%20-apple-system,%20sans-serif;%20%20%20background-color:%20var(--bg-body);%20%20%20color:%20var(--text-primary);%20%20%20transition:%20background-color%200.3s%20ease,%20color%200.3s%20ease;%20%20%20line-height:%201.5;%20%20%20-webkit-font-smoothing:%20antialiased;%20%7D%20/%2A%20Fix%20scrolling%20bug:%20Reset%20html/body%20styles%20from%20host%20page%20%2A/%20html,%20body%20%7B%20%20%20height:%20auto%20!important;%20%20%20min-height:%20100%25%20!important;%20%20%20overflow-y:%20auto%20!important;%20%20%20overflow-x:%20hidden%20!important;%20%20%20position:%20static%20!important;%20%20%20margin:%200%20!important;%20%20%20padding:%200%20!important;%20%7D%20/%2A%20Header%20%2A/%20.app-header%20%7B%20%20%20position:%20sticky;%20%20%20top:%200;%20%20%20z-index:%20100;%20%20%20backdrop-filter:%20blur(12px);%20%20%20background-color:%20var(--header-bg);%20%20%20border-bottom:%20var(--header-border);%20%20%20padding:%201rem%200;%20%7D%20.header-content%20%7B%20%20%20width:%20100%25;%20%20%20/%2A%20Full%20width%20%2A/%20%20%20padding:%200%202rem;%20%20%20/%2A%20Comfortable%20padding%20%2A/%20%20%20display:%20grid;%20%20%20grid-template-columns:%201fr%20auto%201fr;%20%20%20align-items:%20center;%20%20%20gap:%201rem;%20%7D%20.brand%20%7B%20%20%20display:%20flex;%20%20%20align-items:%20center;%20%20%20gap:%200.75rem;%20%7D%20.brand-text%20%7B%20%20%20display:%20flex;%20%20%20flex-direction:%20column;%20%7D%20.brand%20h1%20%7B%20%20%20font-size:%201.25rem;%20%20%20font-weight:%20700;%20%20%20letter-spacing:%20-0.025em;%20%20%20margin-bottom:%200;%20%7D%20.subtitle%20%7B%20%20%20font-size:%200.85rem;%20%20%20color:%20var(--text-secondary);%20%20%20font-weight:%20400;%20%20%20margin-left:%202px;%20%7D%20.logo-icon%20%7B%20%20%20font-size:%201.5rem;%20%20%20color:%20var(--accent-color);%20%7D%20/%2A%20Controls%20%2A/%20.controls%20%7B%20%20%20display:%20flex;%20%20%20align-items:%20center;%20%20%20gap:%201.5rem;%20%20%20justify-self:%20end;%20%7D%20/%2A%20Header%20Week%20Info%20(centered)%20%2A/%20.header-week-info%20%7B%20%20%20text-align:%20center;%20%20%20line-height:%201.3;%20%7D%20.header-center-wrapper%20%7B%20%20%20display:%20flex;%20%20%20flex-direction:%20row;%20%20%20align-items:%20center;%20%20%20gap:%201.5rem;%20%20%20justify-content:%20center;%20%7D%20%20.header-week-title%20%7B%20%20%20font-size:%201.1rem;%20%20%20font-weight:%20600;%20%20%20color:%20var(--text-primary);%20%7D%20.header-week-subtitle%20%7B%20%20%20font-size:%200.85rem;%20%20%20color:%20var(--text-secondary);%20%7D%20.nav-group%20%7B%20%20%20display:%20flex;%20%20%20background-color:%20var(--bg-card);%20%20%20border:%201px%20solid%20var(--border-color);%20%20%20padding:%200.25rem;%20%20%20border-radius:%208px;%20%7D%20.nav-btn%20%7B%20%20%20background:%20none;%20%20%20border:%20none;%20%20%20padding:%200.5rem%201rem;%20%20%20font-size:%200.875rem;%20%20%20font-weight:%20500;%20%20%20color:%20var(--text-secondary);%20%20%20cursor:%20pointer;%20%20%20border-radius:%206px;%20%20%20transition:%20all%200.2s;%20%20%20display:%20flex;%20%20%20align-items:%20center;%20%20%20gap:%200.5rem;%20%7D%20.nav-btn:hover%20%7B%20%20%20color:%20var(--text-primary);%20%20%20background-color:%20rgba(100,%20116,%20139,%200.1);%20%7D%20.nav-btn.active%20%7B%20%20%20background-color:%20var(--accent-color);%20%20%20color:%20white;%20%7D%20/%2A%20Badge%20for%20nav%20buttons%20(day%20count%20indicator)%20%2A/%20.nav-badge%20%7B%20%20%20background-color:%20var(--error-color);%20%20%20color:%20white;%20%20%20font-size:%200.75rem;%20%20%20font-weight:%20600;%20%20%20padding:%200%206px;%20%20%20border-radius:%2010px;%20%20%20min-width:%2018px;%20%20%20height:%2018px;%20%20%20display:%20inline-flex;%20%20%20align-items:%20center;%20%20%20justify-content:%20center;%20%20%20margin-left:%208px;%20%20%20gap:%203px;%20%20%20line-height:%201;%20%7D%20.nav-badge%20.orderable%20%7B%20%20%20color:%20%23fff;%20%20%20font-weight:%20800;%20%7D%20.nav-badge%20.separator%20%7B%20%20%20opacity:%200.6;%20%20%20font-weight:%20400;%20%7D%20.nav-badge%20.total%20%7B%20%20%20opacity:%200.8;%20%20%20font-weight:%20400;%20%7D%20.nav-btn.active%20.nav-badge%20%7B%20%20%20background:%20rgba(255,%20255,%20255,%200.3);%20%7D%20/%2A%20Primary%20style%20for%20Login%20Button%20to%20match%20header%20%2A/%20%23btn-login-open%20%7B%20%20%20background-color:%20var(--accent-color);%20%20%20color:%20white;%20%20%20padding:%200.5rem%201.25rem;%20%20%20border-radius:%208px;%20%20%20font-weight:%20600;%20%20%20letter-spacing:%200.025em;%20%20%20box-shadow:%200%202px%204px%20rgba(0,%200,%200,%200.1);%20%7D%20%23btn-login-open:hover%20%7B%20%20%20background-color:%20%23334155;%20%20%20/%2A%20Slightly%20lighter%20than%20slate-900%20%2A/%20%20%20transform:%20translateY(-1px);%20%20%20box-shadow:%200%204px%206px%20rgba(0,%200,%200,%200.1);%20%7D%20/%2A%20User%20Badge%20Button%20(Login)%20%2A/%20.user-badge-btn%20%7B%20%20%20display:%20flex;%20%20%20align-items:%20center;%20%20%20gap:%208px;%20%20%20padding:%206px%2012px;%20%20%20background:%20var(--bg-card);%20%20%20border:%201px%20solid%20var(--border-color);%20%20%20border-radius:%2020px;%20%20%20font-size:%200.9rem;%20%20%20font-weight:%20500;%20%20%20color:%20var(--text-primary);%20%20%20cursor:%20pointer;%20%20%20transition:%20all%200.2s;%20%7D%20.user-badge-btn:hover%20%7B%20%20%20background:%20rgba(100,%20116,%20139,%200.1);%20%20%20border-color:%20var(--accent-color);%20%7D%20.user-badge-btn%20.material-icons-round%20%7B%20%20%20font-size:%201.25rem;%20%20%20color:%20var(--accent-color);%20%7D%20.icon-btn%20%7B%20%20%20background:%20none;%20%20%20border:%20none;%20%20%20color:%20var(--text-primary);%20%20%20cursor:%20pointer;%20%20%20padding:%200.5rem;%20%20%20border-radius:%2050%25;%20%20%20transition:%20background-color%200.2s;%20%20%20display:%20flex;%20%20%20align-items:%20center;%20%20%20justify-content:%20center;%20%7D%20.icon-btn:hover%20%7B%20%20%20background-color:%20rgba(100,%20116,%20139,%200.1);%20%7D%20/%2A%20Refresh%20button%20animation%20%2A/%20%23btn-refresh.refreshing%20.material-icons-round%20%7B%20%20%20animation:%20rotate%201s%20linear%20infinite;%20%7D%20%40keyframes%20rotate%20%7B%20%20%20from%20%7B%20%20%20%20%20transform:%20rotate(0deg);%20%20%20%7D%20%20%20to%20%7B%20%20%20%20%20transform:%20rotate(360deg);%20%20%20%7D%20%7D%20/%2A%20Progress%20Modal%20%2A/%20.progress-container%20%7B%20%20%20margin-bottom:%201.5rem;%20%7D%20.progress-bar%20%7B%20%20%20width:%20100%25;%20%20%20height:%208px;%20%20%20background-color:%20var(--border-color);%20%20%20border-radius:%204px;%20%20%20overflow:%20hidden;%20%20%20margin-bottom:%200.75rem;%20%7D%20.progress-fill%20%7B%20%20%20height:%20100%25;%20%20%20background:%20linear-gradient(90deg,%20var(--accent-color)%200%25,%20%2360a5fa%20100%25);%20%20%20width:%200%25;%20%20%20transition:%20width%200.3s%20ease;%20%20%20border-radius:%204px;%20%7D%20.progress-percent%20%7B%20%20%20text-align:%20center;%20%20%20font-size:%201.5rem;%20%20%20font-weight:%20700;%20%20%20color:%20var(--text-primary);%20%20%20margin-bottom:%200.5rem;%20%7D%20.progress-message%20%7B%20%20%20text-align:%20center;%20%20%20color:%20var(--text-secondary);%20%20%20font-size:%200.9rem;%20%20%20font-weight:%20500;%20%7D%20.weekly-cost%20%7B%20%20%20background-color:%20rgba(59,%20130,%20246,%200.1);%20%20%20/%2A%20Blue%20tint%20%2A/%20%20%20color:%20var(--accent-color);%20%20%20padding:%200.4rem%200.8rem;%20%20%20border-radius:%208px;%20%20%20font-weight:%20600;%20%20%20font-size:%200.9rem;%20%20%20display:%20flex;%20%20%20align-items:%20center;%20%20%20gap:%200.5rem;%20%20%20border:%201px%20solid%20rgba(59,%20130,%20246,%200.2);%20%7D%20.weekly-cost%20.material-icons-round%20%7B%20%20%20font-size:%2018px;%20%7D%20/%2A%20Container%20%2A/%20.container%20%7B%20%20%20width:%20100%25;%20%20%20/%2A%20Full%20width%20%2A/%20%20%20margin:%202rem%20auto;%20%20%20padding:%200%202rem;%20%20%20min-height:%2080vh;%20%7D%20/%2A%20Banner%20%2A/%20.banner%20%7B%20%20%20background-color:%20var(--banner-bg);%20%20%20color:%20var(--banner-text);%20%20%20padding:%200.75rem%201rem;%20%20%20border-radius:%208px;%20%20%20display:%20flex;%20%20%20align-items:%20center;%20%20%20gap:%200.5rem;%20%20%20margin-bottom:%202rem;%20%20%20font-size:%200.875rem;%20%20%20font-weight:%20500;%20%20%20border:%201px%20solid%20var(--border-color);%20%20%20max-width:%20fit-content;%20%7D%20/%2A%20User%20Badge%20%2A/%20.user-badge%20%7B%20%20%20display:%20flex;%20%20%20align-items:%20center;%20%20%20gap:%208px;%20%20%20padding:%206px%2012px;%20%20%20background:%20var(--bg-card);%20%20%20/%2A%20Changed%20from%20--surface%20%2A/%20%20%20border:%201px%20solid%20var(--border-color);%20%20%20/%2A%20Changed%20from%20--border%20%2A/%20%20%20border-radius:%2020px;%20%20%20font-size:%200.9rem;%20%20%20font-weight:%20500;%20%7D%20.icon-btn-small%20%7B%20%20%20background:%20none;%20%20%20border:%20none;%20%20%20padding:%204px;%20%20%20cursor:%20pointer;%20%20%20color:%20var(--text-secondary);%20%20%20/%2A%20Changed%20from%20--text-muted%20%2A/%20%20%20display:%20flex;%20%20%20align-items:%20center;%20%20%20justify-content:%20center;%20%20%20border-radius:%2050%25;%20%20%20transition:%20all%200.2s;%20%7D%20.icon-btn-small:hover%20%7B%20%20%20color:%20var(--error-color);%20%20%20/%2A%20Changed%20from%20--danger%20%2A/%20%20%20background:%20rgba(239,%2068,%2068,%200.1);%20%7D%20/%2A%20Modal%20%2A/%20.modal%20%7B%20%20%20position:%20fixed;%20%20%20top:%200;%20%20%20left:%200;%20%20%20width:%20100%25;%20%20%20height:%20100%25;%20%20%20background:%20rgba(0,%200,%200,%200.5);%20%20%20backdrop-filter:%20blur(4px);%20%20%20display:%20flex;%20%20%20align-items:%20center;%20%20%20justify-content:%20center;%20%20%20z-index:%201000;%20%20%20transition:%20all%200.3s;%20%7D%20.modal.hidden%20%7B%20%20%20opacity:%200;%20%20%20pointer-events:%20none;%20%7D%20.modal-content%20%7B%20%20%20background:%20var(--bg-card);%20%20%20/%2A%20Changed%20from%20--surface%20%2A/%20%20%20width:%2090%25;%20%20%20max-width:%20400px;%20%20%20border-radius:%2016px;%20%20%20box-shadow:%200%2020px%2025px%20-5px%20rgba(0,%200,%200,%200.1),%200%2010px%2010px%20-5px%20rgba(0,%200,%200,%200.04);%20%20%20overflow:%20hidden;%20%20%20animation:%20modalSlide%200.3s%20ease-out;%20%7D%20%40keyframes%20modalSlide%20%7B%20%20%20from%20%7B%20%20%20%20%20transform:%20translateY(20px);%20%20%20%20%20opacity:%200;%20%20%20%7D%20%20%20to%20%7B%20%20%20%20%20transform:%20translateY(0);%20%20%20%20%20opacity:%201;%20%20%20%7D%20%7D%20.modal-header%20%7B%20%20%20display:%20flex;%20%20%20align-items:%20center;%20%20%20justify-content:%20space-between;%20%20%20padding:%2020px;%20%20%20border-bottom:%201px%20solid%20var(--border-color);%20%20%20/%2A%20Changed%20from%20--border%20%2A/%20%7D%20.modal-header%20h2%20%7B%20%20%20margin:%200;%20%20%20font-size:%201.25rem;%20%7D%20%23login-form%20%7B%20%20%20padding:%2020px;%20%7D%20.form-group%20%7B%20%20%20margin-bottom:%2020px;%20%7D%20.form-group%20label%20%7B%20%20%20display:%20block;%20%20%20margin-bottom:%206px;%20%20%20font-weight:%20500;%20%20%20font-size:%200.9rem;%20%7D%20.form-group%20input%20%7B%20%20%20width:%20100%25;%20%20%20padding:%2010px%2012px;%20%20%20border:%201px%20solid%20var(--border-color);%20%20%20/%2A%20Changed%20from%20--border%20%2A/%20%20%20border-radius:%208px;%20%20%20background:%20var(--bg-body);%20%20%20/%2A%20Changed%20from%20--bg%20%2A/%20%20%20color:%20var(--text-primary);%20%20%20/%2A%20Changed%20from%20--text%20%2A/%20%20%20font-family:%20inherit;%20%20%20transition:%20border-color%200.2s;%20%7D%20.form-group%20input:focus%20%7B%20%20%20outline:%20none;%20%20%20border-color:%20var(--accent-color);%20%20%20/%2A%20Changed%20from%20--primary%20%2A/%20%7D%20.help-text%20%7B%20%20%20display:%20block;%20%20%20margin-top:%204px;%20%20%20color:%20var(--text-secondary);%20%20%20/%2A%20Changed%20from%20--text-muted%20%2A/%20%20%20font-size:%200.75rem;%20%7D%20.error-msg%20%7B%20%20%20margin-bottom:%2016px;%20%20%20padding:%2010px;%20%20%20background:%20rgba(239,%2068,%2068,%200.1);%20%20%20color:%20var(--error-color);%20%20%20/%2A%20Changed%20from%20--danger%20%2A/%20%20%20border-radius:%208px;%20%20%20font-size:%200.85rem;%20%20%20text-align:%20center;%20%7D%20.modal-actions%20%7B%20%20%20margin-top:%2024px;%20%7D%20.btn-primary.wide%20%7B%20%20%20width:%20100%25;%20%20%20justify-content:%20center;%20%7D%20.hidden%20%7B%20%20%20display:%20none%20!important;%20%7D%20/%2A%20Menu%20Grid%20%2A/%20.menu-grid%20%7B%20%20%20display:%20grid;%20%20%20gap:%202rem;%20%7D%20.week-section%20%7B%20%20%20margin-bottom:%203rem;%20%7D%20.week-header%20%7B%20%20%20margin-bottom:%201.5rem;%20%20%20border-bottom:%201px%20solid%20var(--border-color);%20%20%20padding-bottom:%201rem;%20%20%20text-align:%20center;%20%7D%20.week-title%20%7B%20%20%20font-size:%201.75rem;%20%20%20font-weight:%20700;%20%20%20color:%20var(--text-primary);%20%7D%20.week-range%20%7B%20%20%20color:%20var(--text-secondary);%20%20%20font-size:%200.9rem;%20%20%20margin-top:%200.25rem;%20%7D%20.days-grid%20%7B%20%20%20display:%20grid;%20%20%20grid-template-columns:%20repeat(auto-fit,%20minmax(180px,%201fr));%20%20%20gap:%200.75rem;%20%7D%20/%2A%20Card%20%2A/%20.menu-card%20%7B%20%20%20background-color:%20var(--bg-card);%20%20%20border-radius:%2012px;%20%20%20border:%201px%20solid%20var(--border-color);%20%20%20box-shadow:%20var(--card-shadow);%20%20%20overflow:%20hidden;%20%20%20transition:%20transform%200.2s%20ease,%20box-shadow%200.2s%20ease;%20%20%20display:%20flex;%20%20%20flex-direction:%20column;%20%7D%20/%2A%20Past%20Day%20Styling%20-%20Target%20specific%20elements%20so%20ordered%20items%20can%20remain%20visible%20%2A/%20.menu-card.past-day%20.card-header,%20.menu-card.past-day%20.menu-item:not(.ordered)%20%7B%20%20%20opacity:%200.6;%20%20%20filter:%20grayscale(0.8);%20%20%20transition:%20opacity%200.3s,%20filter%200.3s;%20%7D%20.menu-card.past-day:hover%20.card-header,%20.menu-card.past-day:hover%20.menu-item:not(.ordered)%20%7B%20%20%20opacity:%200.8;%20%20%20filter:%20grayscale(0.4);%20%7D%20/%2A%20Enhancements%20for%20ordered%20items%20%2A/%20.menu-card.past-day%20.menu-item.ordered%20%7B%20%20%20/%2A%20No%20opacity/filter%20here%20-%20fully%20visible%20%2A/%20%20%20background:%20var(--bg-card);%20%20%20box-shadow:%200%204px%2012px%20rgba(0,%200,%200,%200.15);%20%20%20border:%201px%20solid%20var(--accent-color);%20%20%20border-radius:%208px;%20%20%20padding:%201rem;%20%20%20margin:%200%20-1rem%201.5rem%20-1rem;%20%20%20position:%20relative;%20%20%20z-index:%2010;%20%7D%20.menu-item.today-ordered%20%7B%20%20%20border:%202px%20solid%20var(--accent-color);%20%20%20box-shadow:%200%200%2020px%20rgba(96,%20165,%20250,%200.4);%20%20%20border-radius:%208px;%20%20%20padding:%201rem;%20%20%20margin:%200%20-1rem%201.5rem%20-1rem;%20%20%20background:%20var(--bg-card);%20%20%20position:%20relative;%20%20%20z-index:%205;%20%20%20animation:%20pulse-glow%203s%20infinite;%20%7D%20%40keyframes%20pulse-glow%20%7B%20%20%200%25%20%7B%20%20%20%20%20box-shadow:%200%200%2015px%20rgba(96,%20165,%20250,%200.3);%20%20%20%7D%20%20%2050%25%20%7B%20%20%20%20%20box-shadow:%200%200%2025px%20rgba(96,%20165,%20250,%200.6);%20%20%20%7D%20%20%20100%25%20%7B%20%20%20%20%20box-shadow:%200%200%2015px%20rgba(96,%20165,%20250,%200.3);%20%20%20%7D%20%7D%20%20.menu-card:hover%20%7B%20%20%20transform:%20translateY(-2px);%20%20%20box-shadow:%200%2020px%2025px%20-5px%20rgb(0%200%200%20/%200.1),%200%208px%2010px%20-6px%20rgb(0%200%200%20/%200.1);%20%7D%20.card-header%20%7B%20%20%20padding:%201rem%201.25rem;%20%20%20border-bottom:%201px%20solid%20var(--border-color);%20%20%20display:%20flex;%20%20%20justify-content:%20space-between;%20%20%20align-items:%20baseline;%20%20%20background-color:%20rgba(100,%20116,%20139,%200.05);%20%7D%20.day-name%20%7B%20%20%20font-size:%201.125rem;%20%20%20font-weight:%20600;%20%7D%20.day-date%20%7B%20%20%20font-size:%200.875rem;%20%20%20color:%20var(--text-secondary);%20%7D%20.card-body%20%7B%20%20%20padding:%201.25rem;%20%20%20display:%20grid;%20%20%20grid-template-rows:%20auto;%20%20%20/%2A%20Each%20menu%20item%20gets%20its%20own%20row%20%2A/%20%20%20align-content:%20start;%20%7D%20.empty-state%20%7B%20%20%20color:%20var(--text-secondary);%20%20%20font-style:%20italic;%20%20%20text-align:%20center;%20%20%20padding:%201rem;%20%7D%20/%2A%20Menu%20Items%20%2A/%20.menu-item%20%7B%20%20%20margin-bottom:%201.5rem;%20%20%20padding-bottom:%201.5rem;%20%20%20border-bottom:%201px%20solid%20var(--border-color);%20%7D%20.menu-item:last-child%20%7B%20%20%20margin-bottom:%200;%20%20%20padding-bottom:%200;%20%20%20border-bottom:%20none;%20%7D%20.item-header%20%7B%20%20%20display:%20flex;%20%20%20justify-content:%20space-between;%20%20%20align-items:%20flex-start;%20%20%20margin-bottom:%200.5rem;%20%20%20gap:%201rem;%20%7D%20.item-name%20%7B%20%20%20font-weight:%20600;%20%20%20color:%20var(--text-primary);%20%20%20font-size:%201rem;%20%7D%20.item-price%20%7B%20%20%20font-weight:%20700;%20%20%20color:%20var(--accent-color);%20%20%20white-space:%20nowrap;%20%7D%20.item-desc%20%7B%20%20%20font-size:%200.875rem;%20%20%20color:%20var(--text-secondary);%20%20%20line-height:%201.6;%20%20%20margin-bottom:%200.75rem;%20%7D%20.badges%20%7B%20%20%20display:%20flex;%20%20%20gap:%200.5rem;%20%20%20margin-left:%20auto;%20%7D%20.item-status-row%20%7B%20%20%20display:%20flex;%20%20%20align-items:%20center;%20%20%20gap:%200.5rem;%20%20%20margin-bottom:%200.75rem;%20%7D%20.badge%20%7B%20%20%20display:%20inline-flex;%20%20%20align-items:%20center;%20%20%20justify-content:%20center;%20%20%20height:%2024px;%20%20%20font-size:%200.75rem;%20%20%20padding:%200%2010px;%20%20%20border-radius:%204px;%20%20%20font-weight:%20600;%20%20%20text-transform:%20uppercase;%20%20%20letter-spacing:%200.05em;%20%20%20line-height:%20normal;%20%20%20white-space:%20nowrap;%20%7D%20.badge.available%20%7B%20%20%20background-color:%20rgba(16,%20185,%20129,%200.1);%20%20%20/%2A%20Emerald%20500%20/%2010%25%20%2A/%20%20%20color:%20var(--success-color);%20%20%20border:%201px%20solid%20rgba(16,%20185,%20129,%200.2);%20%7D%20.badge.sold-out%20%7B%20%20%20background-color:%20rgba(239,%2068,%2068,%200.1);%20%20%20/%2A%20Red%20500%20/%2010%25%20%2A/%20%20%20color:%20var(--error-color);%20%20%20border:%201px%20solid%20rgba(239,%2068,%2068,%200.2);%20%7D%20.badge.ordered%20%7B%20%20%20background-color:%20rgba(139,%2092,%20246,%200.1);%20%20%20/%2A%20Violet%20500%20/%2010%25%20%2A/%20%20%20color:%20%238b5cf6;%20%20%20border:%201px%20solid%20rgba(139,%2092,%20246,%200.2);%20%20%20gap:%204px;%20%7D%20.badge.ordered%20.material-icons-round%20%7B%20%20%20font-size:%201rem;%20%7D%20/%2A%20Loading%20%2A/%20.loading-state%20%7B%20%20%20text-align:%20center;%20%20%20padding:%204rem;%20%20%20color:%20var(--text-secondary);%20%7D%20.spinner%20%7B%20%20%20width:%2040px;%20%20%20height:%2040px;%20%20%20border:%203px%20solid%20var(--border-color);%20%20%20border-top-color:%20var(--accent-color);%20%20%20border-radius:%2050%25;%20%20%20margin:%200%20auto%201rem;%20%20%20animation:%20spin%201s%20linear%20infinite;%20%7D%20%40keyframes%20spin%20%7B%20%20%20to%20%7B%20%20%20%20%20transform:%20rotate(360deg);%20%20%20%7D%20%7D%20/%2A%20Footer%20%2A/%20.app-footer%20%7B%20%20%20text-align:%20center;%20%20%20padding:%202rem;%20%20%20color:%20var(--text-secondary);%20%20%20font-size:%200.875rem;%20%20%20border-top:%201px%20solid%20var(--border-color);%20%20%20margin-top:%20auto;%20%7D%20/%2A%20===%20Order%20/%20Cancel%20Buttons%20(inline%20in%20status%20row)%20===%20%2A/%20.btn-order%20%7B%20%20%20display:%20inline-flex;%20%20%20align-items:%20center;%20%20%20gap:%204px;%20%20%20padding:%204px%2010px;%20%20%20border:%20none;%20%20%20border-radius:%206px;%20%20%20background:%20var(--success-color);%20%20%20color:%20white;%20%20%20font-size:%200.75rem;%20%20%20font-weight:%20600;%20%20%20cursor:%20pointer;%20%20%20transition:%20all%200.2s%20ease;%20%20%20font-family:%20inherit;%20%7D%20.btn-order%20.material-icons-round%20%7B%20%20%20font-size:%2016px;%20%7D%20.btn-order:hover:not(:disabled)%20%7B%20%20%20filter:%20brightness(1.15);%20%20%20transform:%20translateY(-1px);%20%7D%20.btn-order:disabled%20%7B%20%20%20opacity:%200.5;%20%20%20cursor:%20not-allowed;%20%7D%20.btn-order.loading%20%7B%20%20%20pointer-events:%20none;%20%20%20opacity:%200.6;%20%7D%20.btn-order-compact%20%7B%20%20%20padding:%202px%204px;%20%20%20gap:%200;%20%7D%20.btn-order-compact%20.material-icons-round%20%7B%20%20%20font-size:%2016px;%20%7D%20.btn-cancel%20%7B%20%20%20display:%20inline-flex;%20%20%20align-items:%20center;%20%20%20justify-content:%20center;%20%20%20padding:%204px%206px;%20%20%20border:%20none;%20%20%20border-radius:%206px;%20%20%20background:%20var(--error-color);%20%20%20color:%20white;%20%20%20font-size:%200.75rem;%20%20%20cursor:%20pointer;%20%20%20transition:%20all%200.2s%20ease;%20%20%20font-family:%20inherit;%20%7D%20.btn-cancel%20.material-icons-round%20%7B%20%20%20font-size:%2016px;%20%7D%20.btn-cancel:hover:not(:disabled)%20%7B%20%20%20filter:%20brightness(1.15);%20%20%20transform:%20translateY(-1px);%20%7D%20.btn-cancel:disabled%20%7B%20%20%20opacity:%200.5;%20%20%20cursor:%20not-allowed;%20%7D%20/%2A%20Past%20days:%20hide%20action%20buttons%20%2A/%20.past-day%20.item-actions%20%7B%20%20%20display:%20none;%20%7D%20/%2A%20Order%20count%20badge%20(for%20multi-orders)%20%2A/%20.order-count-badge%20%7B%20%20%20display:%20inline-flex;%20%20%20align-items:%20center;%20%20%20justify-content:%20center;%20%20%20background:%20rgba(255,%20255,%20255,%200.3);%20%20%20color:%20white;%20%20%20font-size:%200.65rem;%20%20%20font-weight:%20700;%20%20%20min-width:%2016px;%20%20%20height:%2016px;%20%20%20padding:%200%204px;%20%20%20border-radius:%208px;%20%20%20margin-left:%204px;%20%20%20line-height:%201;%20%7D%20/%2A%20===%20Toast%20Notifications%20===%20%2A/%20%23toast-container%20%7B%20%20%20position:%20fixed;%20%20%20bottom:%2020px;%20%20%20right:%2020px;%20%20%20z-index:%2010000;%20%20%20display:%20flex;%20%20%20flex-direction:%20column;%20%20%20gap:%208px;%20%20%20pointer-events:%20none;%20%7D%20.toast%20%7B%20%20%20display:%20flex;%20%20%20align-items:%20center;%20%20%20gap:%208px;%20%20%20padding:%2010px%2016px;%20%20%20border-radius:%208px;%20%20%20font-size:%200.85rem;%20%20%20font-weight:%20500;%20%20%20font-family:%20%5C%27Inter%5C%27,%20sans-serif;%20%20%20color:%20white;%20%20%20backdrop-filter:%20blur(10px);%20%20%20box-shadow:%200%204px%2012px%20rgba(0,%200,%200,%200.3);%20%20%20pointer-events:%20auto;%20%20%20transform:%20translateX(120%25);%20%20%20opacity:%200;%20%20%20transition:%20transform%200.3s%20ease,%20opacity%200.3s%20ease;%20%7D%20.toast.show%20%7B%20%20%20transform:%20translateX(0);%20%20%20opacity:%201;%20%7D%20.toast%20.material-icons-round%20%7B%20%20%20font-size:%2018px;%20%7D%20.toast-success%20%7B%20%20%20background:%20rgba(5,%20150,%20105,%200.95);%20%7D%20.toast-error%20%7B%20%20%20background:%20rgba(220,%2038,%2038,%200.95);%20%7D%20.toast-info%20%7B%20%20%20background:%20rgba(59,%20130,%20246,%200.95);%20%7D%20/%2A%20===%20Mobile%20Responsiveness%20===%20%2A/%20%40media%20(max-width:%20600px)%20%7B%20%20%20.header-content%20%7B%20%20%20%20%20flex-direction:%20column;%20%20%20%20%20gap:%201rem;%20%20%20%20%20padding:%200.75rem;%20%20%20%7D%20%20%20.week-nav%20%7B%20%20%20%20%20width:%20100%25;%20%20%20%20%20justify-content:%20center;%20%20%20%7D%20%20%20.nav-pills%20%7B%20%20%20%20%20width:%20100%25;%20%20%20%20%20justify-content:%20space-between;%20%20%20%7D%20%20%20.nav-btn%20%7B%20%20%20%20%20flex:%201;%20%20%20%20%20justify-content:%20center;%20%20%20%20%20padding:%200.5rem;%20%20%20%20%20font-size:%200.85rem;%20%20%20%7D%20%20%20.days-grid%20%7B%20%20%20%20%20grid-template-columns:%201fr;%20%20%20%20%20/%2A%20Force%20single%20column%20%2A/%20%20%20%7D%20%20%20.main-content%20%7B%20%20%20%20%20padding:%201rem;%20%20%20%7D%20%20%20.week-title%20%7B%20%20%20%20%20font-size:%201.5rem;%20%20%20%7D%20%20%20/%2A%20Adjust%20toast%20position%20for%20mobile%20%2A/%20%20%20.toast-container%20%7B%20%20%20%20%20bottom:%201rem;%20%20%20%20%20right:%201rem;%20%20%20%20%20left:%201rem;%20%20%20%20%20/%2A%20Center%20on%20mobile%20%2A/%20%20%20%20%20width:%20auto;%20%20%20%7D%20%20%20.menu-card%20%7B%20%20%20%20%20margin-bottom:%201rem;%20%20%20%7D%20%7D%20/%2A%20===%20Flagging%20%26%20Notification%20Styles%20===%20%2A/%20.btn-flag%20%7B%20%20%20display:%20inline-flex;%20%20%20align-items:%20center;%20%20%20justify-content:%20center;%20%20%20background:%20transparent;%20%20%20border:%201px%20solid%20var(--text-secondary);%20%20%20color:%20var(--text-secondary);%20%20%20border-radius:%206px;%20%20%20padding:%204px;%20%20%20cursor:%20pointer;%20%20%20transition:%20all%200.2s;%20%20%20margin-right:%200.5rem;%20%20%20width:%2028px;%20%20%20height:%2028px;%20%7D%20.btn-flag:hover%20%7B%20%20%20background:%20rgba(234,%20179,%208,%200.1);%20%20%20/%2A%20Yellow-500%20/%2010%25%20%2A/%20%20%20color:%20%23eab308;%20%20%20border-color:%20%23eab308;%20%7D%20.btn-flag.active%20%7B%20%20%20background:%20rgba(234,%20179,%208,%200.1);%20%20%20color:%20%23eab308;%20%20%20border-color:%20%23eab308;%20%7D%20.btn-flag%20.material-icons-round%20%7B%20%20%20font-size:%201.1rem;%20%7D%20/%2A%20Flagged%20%26%20Sold%20Out%20(Yellow%20Glow)%20%2A/%20.menu-item.flagged-sold-out%20%7B%20%20%20border:%201px%20solid%20%23eab308;%20%20%20box-shadow:%200%200%2010px%20rgba(234,%20179,%208,%200.2);%20%20%20border-radius:%208px;%20%20%20padding:%201rem;%20%20%20margin:%200%20-1rem%201.5rem%20-1rem;%20%20%20background:%20var(--bg-card);%20%20%20position:%20relative;%20%20%20z-index:%205;%20%20%20animation:%20yellow-pulse%203s%20infinite;%20%7D%20%40keyframes%20yellow-pulse%20%7B%20%20%200%25%20%7B%20%20%20%20%20box-shadow:%200%200%208px%20rgba(234,%20179,%208,%200.2);%20%20%20%7D%20%20%2050%25%20%7B%20%20%20%20%20box-shadow:%200%200%2016px%20rgba(234,%20179,%208,%200.5);%20%20%20%7D%20%20%20100%25%20%7B%20%20%20%20%20box-shadow:%200%200%208px%20rgba(234,%20179,%208,%200.2);%20%20%20%7D%20%7D%20/%2A%20Flagged%20%26%20Available%20(Green%20Glow)%20%2A/%20.menu-item.flagged-available%20%7B%20%20%20border:%202px%20solid%20var(--success-color);%20%20%20box-shadow:%200%200%2015px%20rgba(16,%20185,%20129,%200.3);%20%20%20border-radius:%208px;%20%20%20padding:%201rem;%20%20%20margin:%200%20-1rem%201.5rem%20-1rem;%20%20%20background:%20var(--bg-card);%20%20%20position:%20relative;%20%20%20z-index:%205;%20%20%20animation:%20green-pulse%203s%20infinite;%20%7D%20%40keyframes%20green-pulse%20%7B%20%20%200%25%20%7B%20%20%20%20%20box-shadow:%200%200%2010px%20rgba(16,%20185,%20129,%200.3);%20%20%20%7D%20%20%2050%25%20%7B%20%20%20%20%20box-shadow:%200%200%2020px%20rgba(16,%20185,%20129,%200.6);%20%20%20%7D%20%20%20100%25%20%7B%20%20%20%20%20box-shadow:%200%200%2010px%20rgba(16,%20185,%20129,%200.3);%20%20%20%7D%20%7D%20/%2A%20Day%20Header%20Badges%20%2A/%20.day-header-left%20%7B%20%20%20display:%20flex;%20%20%20align-items:%20center;%20%20%20gap:%200.75rem;%20%7D%20.menu-code-badge%20%7B%20%20%20font-size:%200.75rem;%20%20%20font-weight:%20700;%20%20%20color:%20%238b5cf6;%20%20%20/%2A%20Violet%20500%20%2A/%20%20%20background-color:%20rgba(139,%2092,%20246,%200.15);%20%20%20border:%201px%20solid%20rgba(139,%2092,%20246,%200.3);%20%20%20padding:%202px%206px;%20%20%20border-radius:%206px;%20%20%20line-height:%20normal;%20%20%20display:%20inline-block;%20%7D%20/%2A%20Detailed%20Badge%20Colors%20%2A/%20.nav-badge.badge-violet%20%7B%20%20%20background-color:%20%238b5cf6;%20%7D%20.nav-badge.badge-green%20%7B%20%20%20background-color:%20var(--success-color);%20%7D%20.nav-badge.badge-red%20%7B%20%20%20background-color:%20var(--error-color);%20%7D%20.nav-badge.badge-blue%20%7B%20%20%20background-color:%20var(--accent-color);%20%7D%20/%2A%20Day%20Header%20Status%20Colors%20(User%20Request)%20%2A/%20.card-header.header-violet%20%7B%20%20%20background-color:%20rgba(139,%2092,%20246,%200.15);%20%20%20border-bottom:%202px%20solid%20%238b5cf6;%20%7D%20.card-header.header-green%20%7B%20%20%20background-color:%20rgba(16,%20185,%20129,%200.15);%20%20%20border-bottom:%202px%20solid%20var(--success-color);%20%7D%20.card-header.header-red%20%7B%20%20%20background-color:%20rgba(239,%2068,%2068,%200.15);%20%20%20border-bottom:%202px%20solid%20var(--error-color);%20%7D%20.card-header.header-violet%20.day-name,%20.card-header.header-green%20.day-name,%20.card-header.header-red%20.day-name%20%7B%20%20%20font-weight:%20700;%20%20%20color:%20var(--text-primary);%20%20%20/%2A%20Ensure%20text%20remains%20standard%20color%20%2A/%20%7D%20/%2A%20Update%20Icon%20%2A/%20.update-icon%20%7B%20%20%20display:%20inline-flex;%20%20%20align-items:%20center;%20%20%20justify-content:%20center;%20%20%20margin-left:%208px;%20%20%20background-color:%20rgba(16,%20185,%20129,%200.2);%20%20%20/%2A%20Green%20tint%20%2A/%20%20%20color:%20var(--success-color);%20%20%20border-radius:%2050%25;%20%20%20width:%2024px;%20%20%20height:%2024px;%20%20%20cursor:%20pointer;%20%20%20font-size:%2014px;%20%20%20transition:%20all%200.2s;%20%20%20text-decoration:%20none;%20%20%20animation:%20pulse%202s%20infinite;%20%7D%20.update-icon:hover%20%7B%20%20%20background-color:%20var(--success-color);%20%20%20color:%20white;%20%20%20transform:%20scale(1.1);%20%7D%20%40keyframes%20pulse%20%7B%20%20%200%25%20%7B%20%20%20%20%20box-shadow:%200%200%200%200%20rgba(16,%20185,%20129,%200.4);%20%20%20%7D%20%20%2070%25%20%7B%20%20%20%20%20box-shadow:%200%200%200%206px%20rgba(16,%20185,%20129,%200);%20%20%20%7D%20%20%20100%25%20%7B%20%20%20%20%20box-shadow:%200%200%200%200%20rgba(16,%20185,%20129,%200);%20%20%20%7D%20%7D%20/%2A%20Order%20Countdown%20%2A/%20%23order-countdown%20%7B%20%20%20background:%20rgba(255,%20255,%20255,%200.1);%20%20%20padding:%200.25rem%200.75rem;%20%20%20border-radius:%2099px;%20%20%20font-size:%200.85rem;%20%20%20display:%20flex;%20%20%20align-items:%20center;%20%20%20gap:%200.5rem;%20%20%20white-space:%20nowrap;%20%20%20border:%201px%20solid%20var(--border-color);%20%7D%20%23order-countdown%20span%20%7B%20%20%20opacity:%200.7;%20%20%20font-size:%200.75rem;%20%20%20text-transform:%20uppercase;%20%20%20letter-spacing:%200.5px;%20%7D%20%23order-countdown.urgent%20%7B%20%20%20background:%20rgba(239,%2068,%2068,%200.2);%20%20%20border-color:%20rgba(239,%2068,%2068,%200.5);%20%20%20color:%20%23ef4444;%20%20%20animation:%20pulse-red%202s%20infinite;%20%7D%20%40keyframes%20pulse-red%20%7B%20%20%200%25%20%7B%20%20%20%20%20box-shadow:%200%200%200%200%20rgba(239,%2068,%2068,%200.4);%20%20%20%7D%20%20%2070%25%20%7B%20%20%20%20%20box-shadow:%200%200%200%206px%20rgba(239,%2068,%2068,%200);%20%20%20%7D%20%20%20100%25%20%7B%20%20%20%20%20box-shadow:%200%200%200%200%20rgba(239,%2068,%2068,%200);%20%20%20%7D%20%7D%20/%2A%20Smart%20Highlights%20%2A/%20.highlight-glow%20%7B%20%20%20box-shadow:%200%200%2015px%20rgba(59,%20130,%20246,%200.5);%20%20%20/%2A%20Blue%20glow%20%2A/%20%20%20border:%201px%20solid%20rgba(59,%20130,%20246,%200.8);%20%20%20background:%20rgba(59,%20130,%20246,%200.05);%20%20%20position:%20relative;%20%20%20z-index:%201;%20%7D%20/%2A%20Nav%20Badge%20with%20Count%20%2A/%20.nav-badge.has-highlights%20%7B%20%20%20background-color:%20var(--bg-card);%20%20%20/%2A%20Neutral%20background%20%2A/%20%20%20color:%20var(--text-primary);%20%20%20border:%201px%20solid%20var(--border-color);%20%20%20padding:%202px%206px;%20%7D%20.nav-badge%20.highlight-count%20%7B%20%20%20color:%20%233b82f6;%20%20%20/%2A%20Blue%20500%20%2A/%20%20%20font-weight:%20700;%20%20%20margin-left:%204px;%20%7D%20/%2A%20Tag%20Management%20Modal%20%2A/%20%23tags-list%20%7B%20%20%20display:%20flex;%20%20%20flex-wrap:%20wrap;%20%20%20gap:%200.5rem;%20%20%20margin-top:%201rem;%20%20%20min-height:%2050px;%20%7D%20.tag-badge%20%7B%20%20%20display:%20inline-flex;%20%20%20align-items:%20center;%20%20%20background:%20rgba(59,%20130,%20246,%200.15);%20%20%20color:%20%233b82f6;%20%20%20padding:%204px%2010px;%20%20%20border-radius:%2099px;%20%20%20font-size:%200.85rem;%20%20%20font-weight:%20500;%20%7D%20.tag-remove%20%7B%20%20%20margin-left:%206px;%20%20%20cursor:%20pointer;%20%20%20opacity:%200.7;%20%20%20font-size:%201.1em;%20%20%20line-height:%201;%20%7D%20.tag-remove:hover%20%7B%20%20%20opacity:%201;%20%20%20color:%20%23ef4444;%20%7D%20.input-group%20%7B%20%20%20display:%20flex;%20%20%20gap:%200.5rem;%20%7D%20.input-group%20input%20%7B%20%20%20flex:%201;%20%20%20padding:%200.75rem;%20%20%20background:%20var(--bg-body);%20%20%20border:%201px%20solid%20var(--border-color);%20%20%20color:%20var(--text-primary);%20%20%20border-radius:%208px;%20%7D%20/%2A%20Update%20Banner%20Enhanced%20%2A/%20.change-summary%20%7B%20%20%20font-size:%200.8rem;%20%20%20background:%20rgba(0,%200,%200,%200.1);%20%20%20padding:%200.5rem;%20%20%20border-radius:%204px;%20%20%20margin:%200.5rem%200;%20%20%20white-space:%20pre-wrap;%20%20%20font-family:%20inherit;%20%20%20line-height:%201.4;%20%20%20max-height:%20100px;%20%20%20overflow-y:%20auto;%20%7D%20.update-content%20%7B%20%20%20display:%20flex;%20%20%20flex-direction:%20column;%20%20%20gap:%204px;%20%20%20flex:%201;%20%7D%20/%2A%20Installer%20Changelog%20%2A/%20.changelog-container%20ul%20%7B%20%20%20padding-left:%201.5rem;%20%20%20margin:%200.5rem%200;%20%7D%20.changelog-container%20li%20%7B%20%20%20margin-bottom:%200.4rem;%20%20%20line-height:%201.5;%20%7D%20.changelog-container%20h3%20%7B%20%20%20margin-top:%201.5rem;%20%20%20margin-bottom:%200.5rem;%20%20%20font-size:%201.1em;%20%20%20color:%20var(--accent-color);%20%7D%27;document.head.appendChild(s);/%2A%2A%0A%20%2A%20Kantine%20Wrapper%20%E2%80%93%20Client-Only%20Bookmarklet%0A%20%2A%20Replaces%20Bessa%20page%20content%20with%20enhanced%20weekly%20menu%20view.%0A%20%2A%20All%20API%20calls%20go%20directly%20to%20api.bessa.app%20(same%20origin).%0A%20%2A%20Data%20stored%20in%20localStorage%20(flags,%20theme,%20auth).%0A%20%2A/%0A(function%20()%20%7B%0A%20%20%20%20%27use%20strict%27;%0A%0A%20%20%20%20//%20Prevent%20double%20injection%0A%20%20%20%20if%20(window.__KANTINE_LOADED)%20return;%0A%20%20%20%20window.__KANTINE_LOADED%20=%20true;%0A%0A%20%20%20%20//%20===%20Constants%20===%0A%20%20%20%20const%20API_BASE%20=%20%27https://api.bessa.app/v1%27;%0A%20%20%20%20const%20GUEST_TOKEN%20=%20%27c3418725e95a9f90e3645cbc846b4d67c7c66131%27;%0A%20%20%20%20const%20CLIENT_VERSION%20=%20%271.7.0_prod/2026-01-26%27;%0A%20%20%20%20const%20VENUE_ID%20=%20591;%0A%20%20%20%20const%20MENU_ID%20=%207;%0A%20%20%20%20const%20POLL_INTERVAL_MS%20=%205%20%2A%2060%20%2A%201000;%20//%205%20minutes%0A%0A%20%20%20%20//%20===%20State%20===%0A%20%20%20%20let%20allWeeks%20=%20%5B%5D;%0A%20%20%20%20let%20currentWeekNumber%20=%20getISOWeek(new%20Date());%0A%20%20%20%20let%20currentYear%20=%20new%20Date().getFullYear();%0A%20%20%20%20let%20displayMode%20=%20%27this-week%27;%0A%20%20%20%20let%20authToken%20=%20sessionStorage.getItem(%27kantine_authToken%27);%0A%20%20%20%20let%20currentUser%20=%20sessionStorage.getItem(%27kantine_currentUser%27);%0A%20%20%20%20let%20orderMap%20=%20new%20Map();%0A%20%20%20%20let%20userFlags%20=%20new%20Set(JSON.parse(localStorage.getItem(%27kantine_flags%27)%20%7C%7C%20%27%5B%5D%27));%0A%20%20%20%20let%20pollIntervalId%20=%20null;%0A%0A%20%20%20%20//%20===%20API%20Helpers%20===%0A%20%20%20%20function%20apiHeaders(token)%20%7B%0A%20%20%20%20%20%20%20%20return%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%27Authorization%27:%20%60Token%20%24%7Btoken%20%7C%7C%20GUEST_TOKEN%7D%60,%0A%20%20%20%20%20%20%20%20%20%20%20%20%27Accept%27:%20%27application/json%27,%0A%20%20%20%20%20%20%20%20%20%20%20%20%27Content-Type%27:%20%27application/json%27,%0A%20%20%20%20%20%20%20%20%20%20%20%20%27X-Client-Version%27:%20CLIENT_VERSION%0A%20%20%20%20%20%20%20%20%7D;%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Inject%20UI%20===%0A%20%20%20%20function%20injectUI()%20%7B%0A%20%20%20%20%20%20%20%20//%20Replace%20entire%20page%20content%0A%20%20%20%20%20%20%20%20document.title%20=%20%27Kantine%20Weekly%20Menu%27;%0A%0A%20%20%20%20%20%20%20%20//%20Inject%20Google%20Fonts%20if%20not%20already%20present%0A%20%20%20%20%20%20%20%20if%20(!document.querySelector(%27link%5Bhref%2A=%22fonts.googleapis.com/css2%3Ffamily=Inter%22%5D%27))%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20fontLink%20=%20document.createElement(%27link%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20fontLink.rel%20=%20%27stylesheet%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20fontLink.href%20=%20%27https://fonts.googleapis.com/css2%3Ffamily=Inter:wght%40300;400;500;600;700%26display=swap%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20document.head.appendChild(fontLink);%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20if%20(!document.querySelector(%27link%5Bhref%2A=%22Material+Icons+Round%22%5D%27))%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20iconLink%20=%20document.createElement(%27link%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20iconLink.rel%20=%20%27stylesheet%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20iconLink.href%20=%20%27https://fonts.googleapis.com/icon%3Ffamily=Material+Icons+Round%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20document.head.appendChild(iconLink);%0A%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20document.body.innerHTML%20=%20%60%0A%20%20%20%20%20%20%20%20%3Cdiv%20id=%22kantine-wrapper%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3Cheader%20class=%22app-header%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22header-content%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22brand%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cspan%20class=%22material-icons-round%20logo-icon%22%3Erestaurant_menu%3C/span%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22header-left%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Ch1%3EKantinen%20%C3%9Cbersicht%20%3Csmall%20style=%22font-size:%200.6em;%20opacity:%200.7;%20font-weight:%20400;%22%3Ev1.2.0%3C/small%3E%3C/h1%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20id=%22last-updated-subtitle%22%20class=%22subtitle%22%3E%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22header-center-wrapper%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20id=%22header-week-info%22%20class=%22header-week-info%22%3E%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20id=%22weekly-cost-display%22%20class=%22weekly-cost%20hidden%22%3E%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22controls%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cbutton%20id=%22btn-refresh%22%20class=%22icon-btn%22%20aria-label=%22Men%C3%BCdaten%20aktualisieren%22%20title=%22Men%C3%BCdaten%20neu%20laden%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cspan%20class=%22material-icons-round%22%3Erefresh%3C/span%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/button%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cbutton%20id=%22btn-highlights%22%20class=%22icon-btn%22%20aria-label=%22Pers%C3%B6nliche%20Highlights%20verwalten%22%20title=%22Pers%C3%B6nliche%20Highlights%20verwalten%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cspan%20class=%22material-icons-round%22%3Elabel%3C/span%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/button%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22nav-group%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cbutton%20id=%22btn-this-week%22%20class=%22nav-btn%20active%22%3EDiese%20Woche%3C/button%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cbutton%20id=%22btn-next-week%22%20class=%22nav-btn%22%3EN%C3%A4chste%20Woche%3C/button%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cbutton%20id=%22theme-toggle%22%20class=%22icon-btn%22%20aria-label=%22Toggle%20Theme%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cspan%20class=%22material-icons-round%20theme-icon%22%3Elight_mode%3C/span%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/button%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cbutton%20id=%22btn-login-open%22%20class=%22user-badge-btn%20icon-btn-small%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cspan%20class=%22material-icons-round%22%3Elogin%3C/span%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cspan%3EAnmelden%3C/span%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/button%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20id=%22user-info%22%20class=%22user-badge%20hidden%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cspan%20class=%22material-icons-round%22%3Eperson%3C/span%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cspan%20id=%22user-id-display%22%3E%3C/span%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cbutton%20id=%22btn-logout%22%20class=%22icon-btn-small%22%20aria-label=%22Logout%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cspan%20class=%22material-icons-round%22%3Elogout%3C/span%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/button%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3C/header%3E%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20id=%22login-modal%22%20class=%22modal%20hidden%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22modal-content%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22modal-header%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Ch2%3ELogin%3C/h2%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cbutton%20id=%22btn-login-close%22%20class=%22icon-btn%22%20aria-label=%22Close%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cspan%20class=%22material-icons-round%22%3Eclose%3C/span%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/button%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cform%20id=%22login-form%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22form-group%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Clabel%20for=%22employee-id%22%3EMitarbeiternummer%3C/label%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cinput%20type=%22text%22%20id=%22employee-id%22%20name=%22employee-id%22%20placeholder=%22z.B.%202041%22%20required%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Csmall%20class=%22help-text%22%3EDeine%20offizielle%20Knapp%20Mitarbeiternummer.%3C/small%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22form-group%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Clabel%20for=%22password%22%3EPasswort%3C/label%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cinput%20type=%22password%22%20id=%22password%22%20name=%22password%22%20placeholder=%22Bessa%20Passwort%22%20required%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Csmall%20class=%22help-text%22%3EDas%20Passwort%20f%C3%BCr%20deinen%20Bessa%20Account.%3C/small%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20id=%22login-error%22%20class=%22error-msg%20hidden%22%3E%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22modal-actions%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cbutton%20type=%22submit%22%20class=%22btn-primary%20wide%22%3EEinloggen%3C/button%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/form%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20id=%22progress-modal%22%20class=%22modal%20hidden%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22modal-content%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22modal-header%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Ch2%3EMen%C3%BCdaten%20aktualisieren%3C/h2%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22modal-body%22%20style=%22padding:%2020px;%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22progress-container%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22progress-bar%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20id=%22progress-fill%22%20class=%22progress-fill%22%3E%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20id=%22progress-percent%22%20class=%22progress-percent%22%3E0%25%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cp%20id=%22progress-message%22%20class=%22progress-message%22%3EInitialisierung...%3C/p%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20id=%22highlights-modal%22%20class=%22modal%20hidden%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22modal-content%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22modal-header%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Ch2%3EMeine%20Highlights%3C/h2%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cbutton%20id=%22btn-highlights-close%22%20class=%22icon-btn%22%20aria-label=%22Close%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cspan%20class=%22material-icons-round%22%3Eclose%3C/span%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/button%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22modal-body%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cp%20style=%22margin-bottom:%201rem;%20color:%20var(--text-secondary);%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20Markiere%20Men%C3%BCs%20automatisch,%20wenn%20sie%20diese%20Schlagw%C3%B6rter%20enthalten.%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/p%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22input-group%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cinput%20type=%22text%22%20id=%22tag-input%22%20placeholder=%22z.B.%20Schnitzel,%20Vegetarisch...%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cbutton%20id=%22btn-add-tag%22%20class=%22btn-primary%22%3EHinzuf%C3%BCgen%3C/button%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20id=%22tags-list%22%3E%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%3Cmain%20class=%22container%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20id=%22last-updated-banner%22%20class=%22banner%20hidden%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cspan%20class=%22material-icons-round%22%3Eupdate%3C/span%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cspan%20id=%22last-updated-text%22%3EGerade%20aktualisiert%3C/span%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20id=%22loading%22%20class=%22loading-state%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22spinner%22%3E%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cp%3ELade%20Men%C3%BCdaten...%3C/p%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20id=%22menu-container%22%20class=%22menu-grid%22%3E%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3C/main%3E%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%3Cfooter%20class=%22app-footer%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cp%3EBessa%20Knapp-Kantine%20Wrapper%20%26bull;%20%3Cspan%20id=%22current-year%22%3E%24%7Bnew%20Date().getFullYear()%7D%3C/span%3E%3C/p%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3C/footer%3E%0A%20%20%20%20%20%20%20%20%3C/div%3E%60;%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Bind%20Events%20===%0A%20%20%20%20function%20bindEvents()%20%7B%0A%20%20%20%20%20%20%20%20const%20btnThisWeek%20=%20document.getElementById(%27btn-this-week%27);%0A%20%20%20%20%20%20%20%20const%20btnNextWeek%20=%20document.getElementById(%27btn-next-week%27);%0A%20%20%20%20%20%20%20%20const%20btnRefresh%20=%20document.getElementById(%27btn-refresh%27);%0A%20%20%20%20%20%20%20%20const%20themeToggle%20=%20document.getElementById(%27theme-toggle%27);%0A%20%20%20%20%20%20%20%20const%20btnLoginOpen%20=%20document.getElementById(%27btn-login-open%27);%0A%20%20%20%20%20%20%20%20const%20btnLoginClose%20=%20document.getElementById(%27btn-login-close%27);%0A%20%20%20%20%20%20%20%20const%20btnLogout%20=%20document.getElementById(%27btn-logout%27);%0A%20%20%20%20%20%20%20%20const%20loginForm%20=%20document.getElementById(%27login-form%27);%0A%20%20%20%20%20%20%20%20const%20loginModal%20=%20document.getElementById(%27login-modal%27);%0A%0A%20%20%20%20%20%20%20%20//%20Highlights%20Modal%0A%20%20%20%20%20%20%20%20const%20btnHighlights%20=%20document.getElementById(%27btn-highlights%27);%0A%20%20%20%20%20%20%20%20const%20highlightsModal%20=%20document.getElementById(%27highlights-modal%27);%0A%20%20%20%20%20%20%20%20const%20btnHighlightsClose%20=%20document.getElementById(%27btn-highlights-close%27);%0A%20%20%20%20%20%20%20%20const%20btnAddTag%20=%20document.getElementById(%27btn-add-tag%27);%0A%20%20%20%20%20%20%20%20const%20tagInput%20=%20document.getElementById(%27tag-input%27);%0A%0A%20%20%20%20%20%20%20%20btnHighlights.addEventListener(%27click%27,%20()%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20highlightsModal.classList.remove(%27hidden%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20renderTagsList();%0A%20%20%20%20%20%20%20%20%20%20%20%20tagInput.focus();%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20btnHighlightsClose.addEventListener(%27click%27,%20()%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20highlightsModal.classList.add(%27hidden%27);%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20window.addEventListener(%27click%27,%20(e)%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(e.target%20===%20highlightsModal)%20highlightsModal.classList.add(%27hidden%27);%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20btnAddTag.addEventListener(%27click%27,%20()%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20tag%20=%20tagInput.value;%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(addHighlightTag(tag))%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20tagInput.value%20=%20%27%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20renderTagsList();%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20tagInput.addEventListener(%27keypress%27,%20(e)%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(e.key%20===%20%27Enter%27)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20btnAddTag.click();%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20//%20Theme%0A%20%20%20%20%20%20%20%20const%20savedTheme%20=%20localStorage.getItem(%27theme%27);%0A%20%20%20%20%20%20%20%20const%20prefersDark%20=%20window.matchMedia(%27(prefers-color-scheme:%20dark)%27).matches;%0A%20%20%20%20%20%20%20%20const%20themeIcon%20=%20themeToggle.querySelector(%27.theme-icon%27);%0A%0A%20%20%20%20%20%20%20%20if%20(savedTheme%20===%20%27dark%27%20%7C%7C%20(!savedTheme%20%26%26%20prefersDark))%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20document.documentElement.setAttribute(%27data-theme%27,%20%27dark%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20themeIcon.textContent%20=%20%27dark_mode%27;%0A%20%20%20%20%20%20%20%20%7D%20else%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20document.documentElement.setAttribute(%27data-theme%27,%20%27light%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20themeIcon.textContent%20=%20%27light_mode%27;%0A%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20themeToggle.addEventListener(%27click%27,%20()%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20current%20=%20document.documentElement.getAttribute(%27data-theme%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20next%20=%20current%20===%20%27dark%27%20%3F%20%27light%27%20:%20%27dark%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20document.documentElement.setAttribute(%27data-theme%27,%20next);%0A%20%20%20%20%20%20%20%20%20%20%20%20localStorage.setItem(%27theme%27,%20next);%0A%20%20%20%20%20%20%20%20%20%20%20%20themeIcon.textContent%20=%20next%20===%20%27dark%27%20%3F%20%27dark_mode%27%20:%20%27light_mode%27;%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20//%20Navigation%0A%20%20%20%20%20%20%20%20btnThisWeek.addEventListener(%27click%27,%20()%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(displayMode%20!==%20%27this-week%27)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20displayMode%20=%20%27this-week%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20btnThisWeek.classList.add(%27active%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20btnNextWeek.classList.remove(%27active%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20renderVisibleWeeks();%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20btnNextWeek.addEventListener(%27click%27,%20()%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(displayMode%20!==%20%27next-week%27)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20displayMode%20=%20%27next-week%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20btnNextWeek.classList.add(%27active%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20btnThisWeek.classList.remove(%27active%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20renderVisibleWeeks();%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20//%20Refresh%20%E2%80%93%20fetch%20fresh%20data%20from%20Bessa%20API%0A%20%20%20%20%20%20%20%20btnRefresh.addEventListener(%27click%27,%20()%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(!authToken)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20loginModal.classList.remove(%27hidden%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20return;%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20loadMenuDataFromAPI();%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20//%20Login%20Modal%0A%20%20%20%20%20%20%20%20btnLoginOpen.addEventListener(%27click%27,%20()%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20loginModal.classList.remove(%27hidden%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20document.getElementById(%27login-error%27).classList.add(%27hidden%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20loginForm.reset();%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20btnLoginClose.addEventListener(%27click%27,%20()%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20loginModal.classList.add(%27hidden%27);%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20window.addEventListener(%27click%27,%20(e)%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(e.target%20===%20loginModal)%20loginModal.classList.add(%27hidden%27);%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20//%20Login%20Form%20Submit%0A%20%20%20%20%20%20%20%20loginForm.addEventListener(%27submit%27,%20async%20(e)%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20e.preventDefault();%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20employeeId%20=%20document.getElementById(%27employee-id%27).value.trim();%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20password%20=%20document.getElementById(%27password%27).value;%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20loginError%20=%20document.getElementById(%27login-error%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20submitBtn%20=%20loginForm.querySelector(%27button%5Btype=%22submit%22%5D%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20originalText%20=%20submitBtn.textContent;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20submitBtn.disabled%20=%20true;%0A%20%20%20%20%20%20%20%20%20%20%20%20submitBtn.textContent%20=%20%27Wird%20eingeloggt...%27;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20try%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20email%20=%20%60knapp-%24%7BemployeeId%7D%40bessa.app%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20response%20=%20await%20fetch(%60%24%7BAPI_BASE%7D/auth/login/%60,%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20method:%20%27POST%27,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20headers:%20apiHeaders(GUEST_TOKEN),%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20body:%20JSON.stringify(%7B%20email,%20password%20%7D)%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20data%20=%20await%20response.json();%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(response.ok)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20authToken%20=%20data.key;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20currentUser%20=%20employeeId;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20sessionStorage.setItem(%27kantine_authToken%27,%20data.key);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20sessionStorage.setItem(%27kantine_currentUser%27,%20employeeId);%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20//%20Fetch%20user%20name%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20try%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20userResp%20=%20await%20fetch(%60%24%7BAPI_BASE%7D/auth/user/%60,%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20headers:%20apiHeaders(authToken)%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(userResp.ok)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20userData%20=%20await%20userResp.json();%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(userData.first_name)%20sessionStorage.setItem(%27kantine_firstName%27,%20userData.first_name);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(userData.last_name)%20sessionStorage.setItem(%27kantine_lastName%27,%20userData.last_name);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%20catch%20(err)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20console.error(%27Failed%20to%20fetch%20user%20info:%27,%20err);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20updateAuthUI();%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20loginModal.classList.add(%27hidden%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20fetchOrders();%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20loginForm.reset();%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20startPolling();%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20//%20Reload%20menu%20data%20with%20auth%20for%20full%20details%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20loadMenuDataFromAPI();%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%20else%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20loginError.textContent%20=%20data.non_field_errors%3F.%5B0%5D%20%7C%7C%20data.error%20%7C%7C%20%27Login%20fehlgeschlagen%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20loginError.classList.remove(%27hidden%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%20catch%20(error)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20console.error(%27Login%20error:%27,%20error);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20loginError.textContent%20=%20%27Ein%20Fehler%20ist%20aufgetreten%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20loginError.classList.remove(%27hidden%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%20finally%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20submitBtn.disabled%20=%20false;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20submitBtn.textContent%20=%20originalText;%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20//%20Logout%0A%20%20%20%20%20%20%20%20btnLogout.addEventListener(%27click%27,%20()%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20sessionStorage.removeItem(%27kantine_authToken%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20sessionStorage.removeItem(%27kantine_currentUser%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20sessionStorage.removeItem(%27kantine_firstName%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20sessionStorage.removeItem(%27kantine_lastName%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20authToken%20=%20null;%0A%20%20%20%20%20%20%20%20%20%20%20%20currentUser%20=%20null;%0A%20%20%20%20%20%20%20%20%20%20%20%20orderMap%20=%20new%20Map();%0A%20%20%20%20%20%20%20%20%20%20%20%20stopPolling();%0A%20%20%20%20%20%20%20%20%20%20%20%20updateAuthUI();%0A%20%20%20%20%20%20%20%20%20%20%20%20renderVisibleWeeks();%0A%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Auth%20UI%20===%0A%20%20%20%20function%20updateAuthUI()%20%7B%0A%20%20%20%20%20%20%20%20//%20Try%20to%20recover%20session%20from%20Bessa%27s%20storage%20if%20not%20already%20logged%20in%0A%20%20%20%20%20%20%20%20if%20(!authToken)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20try%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20akita%20=%20localStorage.getItem(%27AkitaStores%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(akita)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20parsed%20=%20JSON.parse(akita);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(parsed.auth%20%26%26%20parsed.auth.token)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20console.log(%27Found%20existing%20Bessa%20session!%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20authToken%20=%20parsed.auth.token;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20sessionStorage.setItem(%27kantine_authToken%27,%20authToken);%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(parsed.auth.user)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20currentUser%20=%20parsed.auth.user.id%20%7C%7C%20%27unknown%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20sessionStorage.setItem(%27kantine_currentUser%27,%20currentUser);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(parsed.auth.user.firstName)%20sessionStorage.setItem(%27kantine_firstName%27,%20parsed.auth.user.firstName);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(parsed.auth.user.lastName)%20sessionStorage.setItem(%27kantine_lastName%27,%20parsed.auth.user.lastName);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%20catch%20(e)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20console.warn(%27Failed%20to%20parse%20AkitaStores:%27,%20e);%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20authToken%20=%20sessionStorage.getItem(%27kantine_authToken%27);%0A%20%20%20%20%20%20%20%20currentUser%20=%20sessionStorage.getItem(%27kantine_currentUser%27);%0A%20%20%20%20%20%20%20%20const%20firstName%20=%20sessionStorage.getItem(%27kantine_firstName%27);%0A%20%20%20%20%20%20%20%20const%20btnLoginOpen%20=%20document.getElementById(%27btn-login-open%27);%0A%20%20%20%20%20%20%20%20const%20userInfo%20=%20document.getElementById(%27user-info%27);%0A%20%20%20%20%20%20%20%20const%20userIdDisplay%20=%20document.getElementById(%27user-id-display%27);%0A%0A%20%20%20%20%20%20%20%20if%20(authToken)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20btnLoginOpen.classList.add(%27hidden%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20userInfo.classList.remove(%27hidden%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20userIdDisplay.textContent%20=%20firstName%20%7C%7C%20(currentUser%20%3F%20%60User%20%24%7BcurrentUser%7D%60%20:%20%27Angemeldet%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20fetchOrders();%20//%20Always%20fetch%20fresh%20orders%20on%20auth%20update%0A%20%20%20%20%20%20%20%20%7D%20else%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20btnLoginOpen.classList.remove(%27hidden%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20userInfo.classList.add(%27hidden%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20userIdDisplay.textContent%20=%20%27%27;%0A%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20renderVisibleWeeks();%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Fetch%20Orders%20from%20Bessa%20===%0A%20%20%20%20async%20function%20fetchOrders()%20%7B%0A%20%20%20%20%20%20%20%20if%20(!authToken)%20return;%0A%20%20%20%20%20%20%20%20try%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Use%20user/orders%20endpoint%20for%20reliable%20history%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20response%20=%20await%20fetch(%60%24%7BAPI_BASE%7D/user/orders/%3Fvenue=%24%7BVENUE_ID%7D%26ordering=-created%26limit=50%60,%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20headers:%20apiHeaders(authToken)%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20data%20=%20await%20response.json();%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(response.ok)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20orderMap%20=%20new%20Map();%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20results%20=%20data.results%20%7C%7C%20%5B%5D;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20for%20(const%20order%20of%20results)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20//%20Filter%20out%20cancelled%20orders%20(State%209)%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20//%20Accepting%20State%201%20(Created%3F),%205%20(Placed%3F),%208%20(Completed)%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20//%20TODO:%20Verify%20exact%20states.%20Subagent%20saw%205=Active,%208=Completed,%209=Cancelled.%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(order.order_state%20===%209)%20continue;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20//%20Extract%20date%20properly%20(it%20comes%20as%20ISO%20string)%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20orderDate%20=%20order.date.split(%27T%27)%5B0%5D;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20for%20(const%20item%20of%20(order.items%20%7C%7C%20%5B%5D))%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20key%20=%20%60%24%7BorderDate%7D_%24%7Bitem.article%7D%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(!orderMap.has(key))%20orderMap.set(key,%20%5B%5D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20orderMap.get(key).push(order.id);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20console.log(%60Fetched%20%24%7Bresults.length%7D%20orders,%20mapped%20active%20ones.%60);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20renderVisibleWeeks();%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%7D%20catch%20(error)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20console.error(%27Error%20fetching%20orders:%27,%20error);%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Place%20Order%20===%0A%20%20%20%20async%20function%20placeOrder(date,%20articleId,%20name,%20price,%20description)%20%7B%0A%20%20%20%20%20%20%20%20if%20(!authToken)%20return;%0A%20%20%20%20%20%20%20%20try%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Get%20user%20data%20for%20customer%20object%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20userResp%20=%20await%20fetch(%60%24%7BAPI_BASE%7D/auth/user/%60,%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20headers:%20apiHeaders(authToken)%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(!userResp.ok)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20showToast(%27Fehler:%20Benutzerdaten%20konnten%20nicht%20geladen%20werden%27,%20%27error%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20return;%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20userData%20=%20await%20userResp.json();%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20now%20=%20new%20Date().toISOString();%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20orderPayload%20=%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20uuid:%20crypto.randomUUID(),%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20created:%20now,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20updated:%20now,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20order_type:%207,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20items:%20%5B%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20article:%20articleId,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20course_group:%20null,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20modifiers:%20%5B%5D,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20uuid:%20crypto.randomUUID(),%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20name:%20name,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20description:%20description%20%7C%7C%20%27%27,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20price:%20String(parseFloat(price)),%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20amount:%201,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20vat:%20%2710.00%27,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20comment:%20%27%27%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%5D,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20table:%20null,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20total:%20parseFloat(price),%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20tip:%200,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20currency:%20%27EUR%27,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20venue:%20VENUE_ID,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20states:%20%5B%5D,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20order_state:%201,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20date:%20%60%24%7Bdate%7DT10:00:00.000Z%60,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20payment_method:%20%27payroll%27,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20customer:%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20first_name:%20userData.first_name,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20last_name:%20userData.last_name,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20email:%20userData.email,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20newsletter:%20false%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20preorder:%20false,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20delivery_fee:%200,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20cash_box_table_name:%20null,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20take_away:%20false%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20response%20=%20await%20fetch(%60%24%7BAPI_BASE%7D/user/orders/%60,%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20method:%20%27POST%27,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20headers:%20apiHeaders(authToken),%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20body:%20JSON.stringify(orderPayload)%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(response.ok%20%7C%7C%20response.status%20===%20201)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20showToast(%60Bestellt:%20%24%7Bname%7D%60,%20%27success%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20await%20fetchOrders();%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%20else%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20data%20=%20await%20response.json();%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20showToast(%60Fehler:%20%24%7Bdata.detail%20%7C%7C%20data.non_field_errors%3F.%5B0%5D%20%7C%7C%20%27Bestellung%20fehlgeschlagen%27%7D%60,%20%27error%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%7D%20catch%20(error)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20console.error(%27Order%20error:%27,%20error);%0A%20%20%20%20%20%20%20%20%20%20%20%20showToast(%27Netzwerkfehler%20bei%20Bestellung%27,%20%27error%27);%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Cancel%20Order%20===%0A%20%20%20%20async%20function%20cancelOrder(date,%20articleId,%20name)%20%7B%0A%20%20%20%20%20%20%20%20if%20(!authToken)%20return;%0A%20%20%20%20%20%20%20%20const%20key%20=%20%60%24%7Bdate%7D_%24%7BarticleId%7D%60;%0A%20%20%20%20%20%20%20%20const%20orderIds%20=%20orderMap.get(key);%0A%20%20%20%20%20%20%20%20if%20(!orderIds%20%7C%7C%20orderIds.length%20===%200)%20return;%0A%0A%20%20%20%20%20%20%20%20//%20LIFO:%20cancel%20most%20recent%0A%20%20%20%20%20%20%20%20const%20orderId%20=%20orderIds%5BorderIds.length%20-%201%5D;%0A%20%20%20%20%20%20%20%20try%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20response%20=%20await%20fetch(%60%24%7BAPI_BASE%7D/user/orders/%24%7BorderId%7D/cancel/%60,%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20method:%20%27PATCH%27,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20headers:%20apiHeaders(authToken),%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20body:%20JSON.stringify(%7B%7D)%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(response.ok)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20showToast(%60Storniert:%20%24%7Bname%7D%60,%20%27success%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20await%20fetchOrders();%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%20else%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20data%20=%20await%20response.json();%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20showToast(%60Fehler:%20%24%7Bdata.detail%20%7C%7C%20%27Stornierung%20fehlgeschlagen%27%7D%60,%20%27error%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%7D%20catch%20(error)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20console.error(%27Cancel%20error:%27,%20error);%0A%20%20%20%20%20%20%20%20%20%20%20%20showToast(%27Netzwerkfehler%20bei%20Stornierung%27,%20%27error%27);%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Flag%20Management%20(localStorage)%20===%0A%20%20%20%20function%20saveFlags()%20%7B%0A%20%20%20%20%20%20%20%20localStorage.setItem(%27kantine_flags%27,%20JSON.stringify(%5B...userFlags%5D));%0A%20%20%20%20%7D%0A%0A%20%20%20%20function%20toggleFlag(date,%20articleId,%20name,%20cutoff)%20%7B%0A%20%20%20%20%20%20%20%20const%20id%20=%20%60%24%7Bdate%7D_%24%7BarticleId%7D%60;%0A%20%20%20%20%20%20%20%20if%20(userFlags.has(id))%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20userFlags.delete(id);%0A%20%20%20%20%20%20%20%20%20%20%20%20showToast(%60Flag%20entfernt%20f%C3%BCr%20%24%7Bname%7D%60,%20%27success%27);%0A%20%20%20%20%20%20%20%20%7D%20else%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20userFlags.add(id);%0A%20%20%20%20%20%20%20%20%20%20%20%20showToast(%60Benachrichtigung%20aktiviert%20f%C3%BCr%20%24%7Bname%7D%60,%20%27success%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(Notification.permission%20===%20%27default%27)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20Notification.requestPermission();%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20saveFlags();%0A%20%20%20%20%20%20%20%20renderVisibleWeeks();%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20FR-019:%20Auto-remove%20flags%20whose%20cutoff%20has%20passed%0A%20%20%20%20function%20cleanupExpiredFlags()%20%7B%0A%20%20%20%20%20%20%20%20const%20now%20=%20new%20Date();%0A%20%20%20%20%20%20%20%20let%20changed%20=%20false;%0A%20%20%20%20%20%20%20%20for%20(const%20flagId%20of%20%5B...userFlags%5D)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20%5Bdate%5D%20=%20flagId.split(%27_%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20cutoff%20=%20new%20Date(date);%0A%20%20%20%20%20%20%20%20%20%20%20%20cutoff.setHours(10,%200,%200,%200);%20//%20Standard%20cutoff%2010:00%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(now%20%3E=%20cutoff)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20userFlags.delete(flagId);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20changed%20=%20true;%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20if%20(changed)%20saveFlags();%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Polling%20(Client-Side)%20===%0A%20%20%20%20function%20startPolling()%20%7B%0A%20%20%20%20%20%20%20%20if%20(pollIntervalId)%20return;%0A%20%20%20%20%20%20%20%20if%20(!authToken)%20return;%0A%20%20%20%20%20%20%20%20pollIntervalId%20=%20setInterval(()%20=%3E%20pollFlaggedItems(),%20POLL_INTERVAL_MS);%0A%20%20%20%20%20%20%20%20console.log(%27Polling%20started%20(every%205%20min)%27);%0A%20%20%20%20%7D%0A%0A%20%20%20%20function%20stopPolling()%20%7B%0A%20%20%20%20%20%20%20%20if%20(pollIntervalId)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20clearInterval(pollIntervalId);%0A%20%20%20%20%20%20%20%20%20%20%20%20pollIntervalId%20=%20null;%0A%20%20%20%20%20%20%20%20%20%20%20%20console.log(%27Polling%20stopped%27);%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%0A%20%20%20%20async%20function%20pollFlaggedItems()%20%7B%0A%20%20%20%20%20%20%20%20if%20(userFlags.size%20===%200%20%7C%7C%20!authToken)%20return;%0A%20%20%20%20%20%20%20%20console.log(%60Polling%20%24%7BuserFlags.size%7D%20flagged%20items...%60);%0A%0A%20%20%20%20%20%20%20%20for%20(const%20flagId%20of%20userFlags)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20%5Bdate,%20articleIdStr%5D%20=%20flagId.split(%27_%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20articleId%20=%20parseInt(articleIdStr);%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20try%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20response%20=%20await%20fetch(%60%24%7BAPI_BASE%7D/venues/%24%7BVENUE_ID%7D/menu/%24%7BMENU_ID%7D/%24%7Bdate%7D/%60,%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20headers:%20apiHeaders(authToken)%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(!response.ok)%20continue;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20data%20=%20await%20response.json();%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20groups%20=%20data.results%20%7C%7C%20%5B%5D;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20let%20foundItem%20=%20null;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20for%20(const%20group%20of%20groups)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(group.items)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20foundItem%20=%20group.items.find(i%20=%3E%20i.id%20===%20articleId%20%7C%7C%20i.article%20===%20articleId);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(foundItem)%20break;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(foundItem)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20isAvailable%20=%20(foundItem.amount_tracking%20===%20false)%20%7C%7C%20(parseInt(foundItem.available_amount)%20%3E%200);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(isAvailable)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20itemName%20=%20foundItem.name%20%7C%7C%20%27Unbekannt%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20showToast(%60%24%7BitemName%7D%20ist%20jetzt%20verf%C3%BCgbar!%60,%20%27success%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(Notification.permission%20===%20%27granted%27)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20new%20Notification(%27Kantine%20Wrapper%27,%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20body:%20%60%24%7BitemName%7D%20ist%20jetzt%20verf%C3%BCgbar!%60,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20icon:%20%27%F0%9F%8D%BD%EF%B8%8F%27%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20//%20Refresh%20menu%20data%20to%20update%20UI%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20loadMenuDataFromAPI();%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%20catch%20(err)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20console.error(%60Poll%20error%20for%20%24%7BflagId%7D:%60,%20err);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20//%20Small%20delay%20between%20checks%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20await%20new%20Promise(r%20=%3E%20setTimeout(r,%20200));%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Highlight%20Management%20===%0A%20%20%20%20let%20highlightTags%20=%20JSON.parse(localStorage.getItem(%27kantine_highlightTags%27)%20%7C%7C%20%27%5B%5D%27);%0A%0A%20%20%20%20function%20saveHighlightTags()%20%7B%0A%20%20%20%20%20%20%20%20localStorage.setItem(%27kantine_highlightTags%27,%20JSON.stringify(highlightTags));%0A%20%20%20%20%20%20%20%20renderVisibleWeeks();%20//%20Refresh%20UI%20to%20apply%20changes%0A%20%20%20%20%20%20%20%20updateNextWeekBadge();%0A%20%20%20%20%7D%0A%0A%20%20%20%20function%20addHighlightTag(tag)%20%7B%0A%20%20%20%20%20%20%20%20tag%20=%20tag.trim().toLowerCase();%0A%20%20%20%20%20%20%20%20if%20(tag%20%26%26%20!highlightTags.includes(tag))%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20highlightTags.push(tag);%0A%20%20%20%20%20%20%20%20%20%20%20%20saveHighlightTags();%0A%20%20%20%20%20%20%20%20%20%20%20%20return%20true;%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20return%20false;%0A%20%20%20%20%7D%0A%0A%20%20%20%20function%20removeHighlightTag(tag)%20%7B%0A%20%20%20%20%20%20%20%20highlightTags%20=%20highlightTags.filter(t%20=%3E%20t%20!==%20tag);%0A%20%20%20%20%20%20%20%20saveHighlightTags();%0A%20%20%20%20%7D%0A%0A%20%20%20%20function%20renderTagsList()%20%7B%0A%20%20%20%20%20%20%20%20const%20list%20=%20document.getElementById(%27tags-list%27);%0A%20%20%20%20%20%20%20%20list.innerHTML%20=%20%27%27;%0A%20%20%20%20%20%20%20%20highlightTags.forEach(tag%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20badge%20=%20document.createElement(%27span%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20badge.className%20=%20%27tag-badge%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20badge.innerHTML%20=%20%60%24%7Btag%7D%20%3Cspan%20class=%22tag-remove%22%20data-tag=%22%24%7Btag%7D%22%3E%26times;%3C/span%3E%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20list.appendChild(badge);%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20//%20Bind%20remove%20events%0A%20%20%20%20%20%20%20%20list.querySelectorAll(%27.tag-remove%27).forEach(btn%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20btn.addEventListener(%27click%27,%20(e)%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20removeHighlightTag(e.target.dataset.tag);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20renderTagsList();%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%7D%0A%0A%20%20%20%20function%20checkHighlight(text)%20%7B%0A%20%20%20%20%20%20%20%20if%20(!text)%20return%20false;%0A%20%20%20%20%20%20%20%20text%20=%20text.toLowerCase();%0A%20%20%20%20%20%20%20%20return%20highlightTags.some(tag%20=%3E%20text.includes(tag));%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Local%20Menu%20Cache%20(localStorage)%20===%0A%20%20%20%20const%20CACHE_KEY%20=%20%27kantine_menuCache%27;%0A%20%20%20%20const%20CACHE_TS_KEY%20=%20%27kantine_menuCacheTs%27;%0A%0A%20%20%20%20function%20saveMenuCache()%20%7B%0A%20%20%20%20%20%20%20%20try%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20localStorage.setItem(CACHE_KEY,%20JSON.stringify(allWeeks));%0A%20%20%20%20%20%20%20%20%20%20%20%20localStorage.setItem(CACHE_TS_KEY,%20new%20Date().toISOString());%0A%20%20%20%20%20%20%20%20%7D%20catch%20(e)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20console.warn(%27Failed%20to%20cache%20menu%20data:%27,%20e);%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%0A%20%20%20%20function%20loadMenuCache()%20%7B%0A%20%20%20%20%20%20%20%20try%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20cached%20=%20localStorage.getItem(CACHE_KEY);%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20cachedTs%20=%20localStorage.getItem(CACHE_TS_KEY);%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(cached)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20allWeeks%20=%20JSON.parse(cached);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20currentWeekNumber%20=%20getISOWeek(new%20Date());%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20currentYear%20=%20new%20Date().getFullYear();%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20renderVisibleWeeks();%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20updateNextWeekBadge();%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(cachedTs)%20updateLastUpdatedTime(cachedTs);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20console.log(%27Loaded%20menu%20from%20cache%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20return%20true;%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%7D%20catch%20(e)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20console.warn(%27Failed%20to%20load%20cached%20menu:%27,%20e);%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20return%20false;%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Menu%20Data%20Fetching%20(Direct%20from%20Bessa%20API)%20===%0A%20%20%20%20async%20function%20loadMenuDataFromAPI()%20%7B%0A%20%20%20%20%20%20%20%20const%20loading%20=%20document.getElementById(%27loading%27);%0A%20%20%20%20%20%20%20%20const%20progressModal%20=%20document.getElementById(%27progress-modal%27);%0A%20%20%20%20%20%20%20%20const%20progressFill%20=%20document.getElementById(%27progress-fill%27);%0A%20%20%20%20%20%20%20%20const%20progressPercent%20=%20document.getElementById(%27progress-percent%27);%0A%20%20%20%20%20%20%20%20const%20progressMessage%20=%20document.getElementById(%27progress-message%27);%0A%0A%20%20%20%20%20%20%20%20loading.classList.remove(%27hidden%27);%0A%0A%20%20%20%20%20%20%20%20const%20token%20=%20authToken%20%7C%7C%20GUEST_TOKEN;%0A%0A%20%20%20%20%20%20%20%20try%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Show%20progress%20modal%0A%20%20%20%20%20%20%20%20%20%20%20%20progressModal.classList.remove(%27hidden%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20progressMessage.textContent%20=%20%27Hole%20verf%C3%BCgbare%20Daten...%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20progressFill.style.width%20=%20%270%25%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20progressPercent.textContent%20=%20%270%25%27;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20//%201.%20Fetch%20available%20dates%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20datesResponse%20=%20await%20fetch(%60%24%7BAPI_BASE%7D/venues/%24%7BVENUE_ID%7D/menu/dates/%60,%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20headers:%20apiHeaders(token)%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(!datesResponse.ok)%20throw%20new%20Error(%60Failed%20to%20fetch%20dates:%20%24%7BdatesResponse.status%7D%60);%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20datesData%20=%20await%20datesResponse.json();%0A%20%20%20%20%20%20%20%20%20%20%20%20let%20availableDates%20=%20datesData.results%20%7C%7C%20%5B%5D;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Filter%20%E2%80%93%20last%207%20days%20+%20future,%20limit%2030%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20cutoff%20=%20new%20Date();%0A%20%20%20%20%20%20%20%20%20%20%20%20cutoff.setDate(cutoff.getDate()%20-%207);%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20cutoffStr%20=%20cutoff.toISOString().split(%27T%27)%5B0%5D;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20availableDates%20=%20availableDates%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20.filter(d%20=%3E%20d.date%20%3E=%20cutoffStr)%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20.sort((a,%20b)%20=%3E%20a.date.localeCompare(b.date))%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20.slice(0,%2030);%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20totalDates%20=%20availableDates.length;%0A%20%20%20%20%20%20%20%20%20%20%20%20progressMessage.textContent%20=%20%60%24%7BtotalDates%7D%20Tage%20gefunden.%20Lade%20Details...%60;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20//%202.%20Fetch%20details%20for%20each%20date%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20allDays%20=%20%5B%5D;%0A%20%20%20%20%20%20%20%20%20%20%20%20let%20completed%20=%200;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20for%20(const%20dateObj%20of%20availableDates)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20dateStr%20=%20dateObj.date;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20pct%20=%20Math.round(((completed%20+%201)%20/%20totalDates)%20%2A%20100);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20progressFill.style.width%20=%20%60%24%7Bpct%7D%25%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20progressPercent.textContent%20=%20%60%24%7Bpct%7D%25%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20progressMessage.textContent%20=%20%60Lade%20Men%C3%BC%20f%C3%BCr%20%24%7BdateStr%7D...%60;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20try%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20detailResp%20=%20await%20fetch(%60%24%7BAPI_BASE%7D/venues/%24%7BVENUE_ID%7D/menu/%24%7BMENU_ID%7D/%24%7BdateStr%7D/%60,%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20headers:%20apiHeaders(token)%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(detailResp.ok)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20detailData%20=%20await%20detailResp.json();%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20//%20Debug:%20log%20raw%20API%20response%20for%20first%20date%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(completed%20===%200)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20console.log(%27%5BKantine%20Debug%5D%20Raw%20API%20response%20for%27,%20dateStr,%20%27:%27,%20JSON.stringify(detailData).substring(0,%202000));%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20menuGroups%20=%20detailData.results%20%7C%7C%20%5B%5D;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20let%20dayItems%20=%20%5B%5D;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20for%20(const%20group%20of%20menuGroups)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(group.items%20%26%26%20Array.isArray(group.items))%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20dayItems%20=%20dayItems.concat(group.items);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(dayItems.length%20%3E%200)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20//%20Debug:%20log%20first%20item%20structure%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(completed%20===%200)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20console.log(%27%5BKantine%20Debug%5D%20First%20item%20keys:%27,%20Object.keys(dayItems%5B0%5D));%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20console.log(%27%5BKantine%20Debug%5D%20First%20item:%27,%20JSON.stringify(dayItems%5B0%5D).substring(0,%20500));%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20allDays.push(%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20date:%20dateStr,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20menu_items:%20dayItems,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20orders:%20dateObj.orders%20%7C%7C%20%5B%5D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%20catch%20(err)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20console.error(%60Failed%20to%20fetch%20details%20for%20%24%7BdateStr%7D:%60,%20err);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20completed++;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20//%20Small%20delay%20to%20avoid%20rate%20limiting%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20await%20new%20Promise(r%20=%3E%20setTimeout(r,%20100));%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20//%203.%20Group%20by%20ISO%20week%20(Merge%20with%20existing%20to%20preserve%20past%20days)%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20weeksMap%20=%20new%20Map();%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Hydrate%20from%20existing%20cache%20(preserve%20past%20data)%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(allWeeks%20%26%26%20allWeeks.length%20%3E%200)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20allWeeks.forEach(w%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20key%20=%20%60%24%7Bw.year%7D-%24%7Bw.weekNumber%7D%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20try%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20weeksMap.set(key,%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20year:%20w.year,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20weekNumber:%20w.weekNumber,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20days:%20w.days%20%3F%20w.days.map(d%20=%3E%20(%7B%20...d,%20items:%20d.items%20%3F%20%5B...d.items%5D%20:%20%5B%5D%20%7D))%20:%20%5B%5D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%20catch%20(e)%20%7B%20console.warn(%27Error%20hydrating%20week:%27,%20e);%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20for%20(const%20day%20of%20allDays)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20d%20=%20new%20Date(day.date);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20weekNum%20=%20getISOWeek(d);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20year%20=%20getWeekYear(d);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20key%20=%20%60%24%7Byear%7D-%24%7BweekNum%7D%60;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(!weeksMap.has(key))%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20weeksMap.set(key,%20%7B%20year,%20weekNumber:%20weekNum,%20days:%20%5B%5D%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20weekObj%20=%20weeksMap.get(key);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20weekday%20=%20d.toLocaleDateString(%27en-US%27,%20%7B%20weekday:%20%27long%27%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20orderCutoffDate%20=%20new%20Date(day.date);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20orderCutoffDate.setHours(10,%200,%200,%200);%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20newDayObj%20=%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20date:%20day.date,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20weekday:%20weekday,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20orderCutoff:%20orderCutoffDate.toISOString(),%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20items:%20day.menu_items.map(item%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20isUnlimited%20=%20item.amount_tracking%20===%20false;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20hasStock%20=%20parseInt(item.available_amount)%20%3E%200;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20return%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20id:%20%60%24%7Bday.date%7D_%24%7Bitem.id%7D%60,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20articleId:%20item.id,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20name:%20item.name%20%7C%7C%20%27Unknown%27,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20description:%20item.description%20%7C%7C%20%27%27,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20price:%20parseFloat(item.price)%20%7C%7C%200,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20available:%20isUnlimited%20%7C%7C%20hasStock,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20availableAmount:%20parseInt(item.available_amount)%20%7C%7C%200,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20amountTracking:%20item.amount_tracking%20!==%20false%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D)%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20//%20Merge:%20Overwrite%20if%20exists,%20push%20if%20new%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20existingIndex%20=%20weekObj.days.findIndex(existing%20=%3E%20existing.date%20===%20day.date);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(existingIndex%20%3E=%200)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20weekObj.days%5BexistingIndex%5D%20=%20newDayObj;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%20else%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20weekObj.days.push(newDayObj);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Sort%20weeks%20and%20days%0A%20%20%20%20%20%20%20%20%20%20%20%20allWeeks%20=%20Array.from(weeksMap.values()).sort((a,%20b)%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(a.year%20!==%20b.year)%20return%20a.year%20-%20b.year;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20return%20a.weekNumber%20-%20b.weekNumber;%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20allWeeks.forEach(w%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(w.days)%20w.days.sort((a,%20b)%20=%3E%20a.date.localeCompare(b.date));%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Save%20to%20localStorage%20cache%0A%20%20%20%20%20%20%20%20%20%20%20%20saveMenuCache();%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Update%20timestamp%0A%20%20%20%20%20%20%20%20%20%20%20%20updateLastUpdatedTime(new%20Date().toISOString());%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20currentWeekNumber%20=%20getISOWeek(new%20Date());%0A%20%20%20%20%20%20%20%20%20%20%20%20currentYear%20=%20new%20Date().getFullYear();%0A%0A%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20updateAuthUI();%20//%20This%20will%20trigger%20fetchOrders%20if%20logged%20in%0A%20%20%20%20%20%20%20%20%20%20%20%20renderVisibleWeeks();%0A%20%20%20%20%20%20%20%20%20%20%20%20updateNextWeekBadge();%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20progressMessage.textContent%20=%20%27Fertig!%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20setTimeout(()%20=%3E%20progressModal.classList.add(%27hidden%27),%20500);%0A%0A%20%20%20%20%20%20%20%20%7D%20catch%20(error)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20console.error(%27Error%20fetching%20menu:%27,%20error);%0A%20%20%20%20%20%20%20%20%20%20%20%20progressModal.classList.add(%27hidden%27);%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20showErrorModal(%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%27Keine%20Verbindung%27,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%60Die%20Men%C3%BCdaten%20konnten%20nicht%20geladen%20werden.%20M%C3%B6glicherweise%20besteht%20keine%20Verbindung%20zur%20API%20oder%20zur%20Bessa-Webseite.%3Cbr%3E%3Cbr%3E%3Csmall%20style=%22color:var(--text-secondary)%22%3E%24%7Berror.message%7D%3C/small%3E%60,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%27Zur%20Original-Seite%27,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%27https://web.bessa.app/knapp-kantine%27%0A%20%20%20%20%20%20%20%20%20%20%20%20);%0A%20%20%20%20%20%20%20%20%7D%20finally%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20loading.classList.add(%27hidden%27);%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Last%20Updated%20Display%20===%0A%20%20%20%20function%20updateLastUpdatedTime(isoTimestamp)%20%7B%0A%20%20%20%20%20%20%20%20const%20subtitle%20=%20document.getElementById(%27last-updated-subtitle%27);%0A%20%20%20%20%20%20%20%20if%20(!isoTimestamp)%20return;%0A%20%20%20%20%20%20%20%20try%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20date%20=%20new%20Date(isoTimestamp);%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20timeStr%20=%20date.toLocaleTimeString(%27de-DE%27,%20%7B%20hour:%20%272-digit%27,%20minute:%20%272-digit%27%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20dateStr%20=%20date.toLocaleDateString(%27de-DE%27,%20%7B%20day:%20%272-digit%27,%20month:%20%272-digit%27%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20subtitle.textContent%20=%20%60Aktualisiert:%20%24%7BdateStr%7D%20%24%7BtimeStr%7D%60;%0A%20%20%20%20%20%20%20%20%7D%20catch%20(e)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20subtitle.textContent%20=%20%27%27;%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Toast%20Notification%20===%0A%20%20%20%20function%20showToast(message,%20type%20=%20%27info%27)%20%7B%0A%20%20%20%20%20%20%20%20let%20container%20=%20document.getElementById(%27toast-container%27);%0A%20%20%20%20%20%20%20%20if%20(!container)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20container%20=%20document.createElement(%27div%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20container.id%20=%20%27toast-container%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20document.body.appendChild(container);%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20const%20toast%20=%20document.createElement(%27div%27);%0A%20%20%20%20%20%20%20%20toast.className%20=%20%60toast%20toast-%24%7Btype%7D%60;%0A%20%20%20%20%20%20%20%20const%20icon%20=%20type%20===%20%27success%27%20%3F%20%27check_circle%27%20:%20type%20===%20%27error%27%20%3F%20%27error%27%20:%20%27info%27;%0A%20%20%20%20%20%20%20%20toast.innerHTML%20=%20%60%3Cspan%20class=%22material-icons-round%22%3E%24%7Bicon%7D%3C/span%3E%3Cspan%3E%24%7Bmessage%7D%3C/span%3E%60;%0A%20%20%20%20%20%20%20%20container.appendChild(toast);%0A%20%20%20%20%20%20%20%20requestAnimationFrame(()%20=%3E%20toast.classList.add(%27show%27));%0A%20%20%20%20%20%20%20%20setTimeout(()%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20toast.classList.remove(%27show%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20setTimeout(()%20=%3E%20toast.remove(),%20300);%0A%20%20%20%20%20%20%20%20%7D,%203000);%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Next%20Week%20Badge%20===%0A%20%20%20%20function%20updateNextWeekBadge()%20%7B%0A%20%20%20%20%20%20%20%20const%20btnNextWeek%20=%20document.getElementById(%27btn-next-week%27);%0A%20%20%20%20%20%20%20%20let%20nextWeek%20=%20currentWeekNumber%20+%201;%0A%20%20%20%20%20%20%20%20let%20nextYear%20=%20currentYear;%0A%20%20%20%20%20%20%20%20if%20(nextWeek%20%3E%2052)%20%7B%20nextWeek%20=%201;%20nextYear++;%20%7D%0A%0A%20%20%20%20%20%20%20%20const%20nextWeekData%20=%20allWeeks.find(w%20=%3E%20w.weekNumber%20===%20nextWeek%20%26%26%20w.year%20===%20nextYear);%0A%20%20%20%20%20%20%20%20let%20totalDataCount%20=%200;%0A%20%20%20%20%20%20%20%20let%20orderableCount%20=%200;%0A%20%20%20%20%20%20%20%20let%20daysWithOrders%20=%200;%0A%20%20%20%20%20%20%20%20let%20daysWithOrderableAndNoOrder%20=%200;%0A%0A%20%20%20%20%20%20%20%20if%20(nextWeekData%20%26%26%20nextWeekData.days)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20nextWeekData.days.forEach(day%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(day.items%20%26%26%20day.items.length%20%3E%200)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20totalDataCount++;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20isOrderable%20=%20day.items.some(item%20=%3E%20item.available);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(isOrderable)%20orderableCount++;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20let%20hasOrder%20=%20false;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20day.items.forEach(item%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20articleId%20=%20item.articleId%20%7C%7C%20parseInt(item.id.split(%27_%27)%5B1%5D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20key%20=%20%60%24%7Bday.date%7D_%24%7BarticleId%7D%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(orderMap.has(key)%20%26%26%20orderMap.get(key).length%20%3E%200)%20hasOrder%20=%20true;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(hasOrder)%20daysWithOrders++;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(isOrderable%20%26%26%20!hasOrder)%20daysWithOrderableAndNoOrder++;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20let%20badge%20=%20btnNextWeek.querySelector(%27.nav-badge%27);%0A%20%20%20%20%20%20%20%20if%20(totalDataCount%20%3E%200)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(!badge)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20badge%20=%20document.createElement(%27span%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20badge.className%20=%20%27nav-badge%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20btnNextWeek.appendChild(badge);%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Format:%20(%20Ordered%20/%20Orderable%20/%20Total%20)%0A%20%20%20%20%20%20%20%20%20%20%20%20badge.title%20=%20%60%24%7BdaysWithOrders%7D%20bestellt%20/%20%24%7BorderableCount%7D%20bestellbar%20/%20%24%7BtotalDataCount%7D%20gesamt%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20badge.innerHTML%20=%20%60%3Cspan%20class=%22ordered%22%3E%24%7BdaysWithOrders%7D%3C/span%3E%3Cspan%20class=%22separator%22%3E/%3C/span%3E%3Cspan%20class=%22orderable%22%3E%24%7BorderableCount%7D%3C/span%3E%3Cspan%20class=%22separator%22%3E/%3C/span%3E%3Cspan%20class=%22total%22%3E%24%7BtotalDataCount%7D%3C/span%3E%60;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Color%20Logic%0A%20%20%20%20%20%20%20%20%20%20%20%20badge.classList.remove(%27badge-violet%27,%20%27badge-green%27,%20%27badge-red%27,%20%27badge-blue%27);%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Refined%20Logic%20(v1.7.4):%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Violet:%20If%20we%20have%20orders%20AND%20there%20are%20no%20DAYS%20left%20that%20are%20orderable%20but%20un-ordered.%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20(i.e.%20%22I%20have%20ordered%20everything%20I%20can%22)%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(daysWithOrders%20%3E%200%20%26%26%20daysWithOrderableAndNoOrder%20===%200)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20badge.classList.add(%27badge-violet%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%20else%20if%20(daysWithOrderableAndNoOrder%20%3E%200)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20badge.classList.add(%27badge-green%27);%20//%20Orderable%20days%20exist%20without%20order%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%20else%20if%20(orderableCount%20===%200)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20badge.classList.add(%27badge-red%27);%20//%20No%20orderable%20days%20at%20all%20%26%20no%20orders%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%20else%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20badge.classList.add(%27badge-blue%27);%20//%20Default%20/%20partial%20state%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Advanced%20Feature:%20Highlight%20Count%0A%20%20%20%20%20%20%20%20%20%20%20%20let%20highlightCount%20=%200;%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(nextWeekData%20%26%26%20nextWeekData.days)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20nextWeekData.days.forEach(day%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20day.items.forEach(item%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(checkHighlight(item.name)%20%7C%7C%20checkHighlight(item.description))%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20highlightCount++;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(highlightCount%20%3E%200)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20//%20Append%20blue%20count%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20badge.innerHTML%20+=%20%60%3Cspan%20class=%22highlight-count%22%20title=%22%24%7BhighlightCount%7D%20Highlight%20Men%C3%BCs%22%3E(%24%7BhighlightCount%7D)%3C/span%3E%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20badge.title%20+=%20%60%20%E2%80%A2%20%24%7BhighlightCount%7D%20Highlights%20gefunden%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20badge.classList.add(%27has-highlights%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20%7D%20else%20if%20(badge)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20badge.remove();%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Weekly%20Cost%20===%0A%20%20%20%20function%20updateWeeklyCost(days)%20%7B%0A%20%20%20%20%20%20%20%20let%20totalCost%20=%200;%0A%20%20%20%20%20%20%20%20if%20(days%20%26%26%20days.length%20%3E%200)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20days.forEach(day%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(day.items)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20day.items.forEach(item%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20articleId%20=%20item.articleId%20%7C%7C%20parseInt(item.id.split(%27_%27)%5B1%5D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20key%20=%20%60%24%7Bday.date%7D_%24%7BarticleId%7D%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20orders%20=%20orderMap.get(key)%20%7C%7C%20%5B%5D;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(orders.length%20%3E%200)%20totalCost%20+=%20item.price%20%2A%20orders.length;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20const%20costDisplay%20=%20document.getElementById(%27weekly-cost-display%27);%0A%20%20%20%20%20%20%20%20if%20(totalCost%20%3E%200)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20costDisplay.innerHTML%20=%20%60%3Cspan%20class=%22material-icons-round%22%3Eshopping_bag%3C/span%3E%20%3Cspan%3EGesamt:%20%24%7BtotalCost.toFixed(2).replace(%27.%27,%20%27,%27)%7D%20%E2%82%AC%3C/span%3E%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20costDisplay.classList.remove(%27hidden%27);%0A%20%20%20%20%20%20%20%20%7D%20else%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20costDisplay.classList.add(%27hidden%27);%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Render%20Weeks%20===%0A%20%20%20%20function%20renderVisibleWeeks()%20%7B%0A%20%20%20%20%20%20%20%20const%20menuContainer%20=%20document.getElementById(%27menu-container%27);%0A%20%20%20%20%20%20%20%20if%20(!menuContainer)%20return;%0A%20%20%20%20%20%20%20%20menuContainer.innerHTML%20=%20%27%27;%0A%0A%20%20%20%20%20%20%20%20let%20targetWeek%20=%20currentWeekNumber;%0A%20%20%20%20%20%20%20%20let%20targetYear%20=%20currentYear;%0A%0A%20%20%20%20%20%20%20%20if%20(displayMode%20===%20%27next-week%27)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20targetWeek++;%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(targetWeek%20%3E%2052)%20%7B%20targetWeek%20=%201;%20targetYear++;%20%7D%0A%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20//%20Flatten%20%26%20filter%20by%20week%20+%20year%0A%20%20%20%20%20%20%20%20const%20allDays%20=%20allWeeks.flatMap(w%20=%3E%20w.days%20%7C%7C%20%5B%5D);%0A%20%20%20%20%20%20%20%20const%20daysInTargetWeek%20=%20allDays.filter(day%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20d%20=%20new%20Date(day.date);%0A%20%20%20%20%20%20%20%20%20%20%20%20return%20getISOWeek(d)%20===%20targetWeek%20%26%26%20getWeekYear(d)%20===%20targetYear;%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20if%20(daysInTargetWeek.length%20===%200)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20menuContainer.innerHTML%20=%20%60%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22empty-state%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cp%3EKeine%20Men%C3%BCdaten%20f%C3%BCr%20KW%20%24%7BtargetWeek%7D%20(%24%7BtargetYear%7D)%20verf%C3%BCgbar.%3C/p%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Csmall%3EVersuchen%20Sie%20eine%20andere%20Woche%20oder%20schauen%20Sie%20sp%C3%A4ter%20vorbei.%3C/small%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20document.getElementById(%27weekly-cost-display%27).classList.add(%27hidden%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20return;%0A%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20updateWeeklyCost(daysInTargetWeek);%0A%0A%20%20%20%20%20%20%20%20//%20Update%20header%0A%20%20%20%20%20%20%20%20const%20headerWeekInfo%20=%20document.getElementById(%27header-week-info%27);%0A%20%20%20%20%20%20%20%20const%20weekTitle%20=%20displayMode%20===%20%27this-week%27%20%3F%20%27Diese%20Woche%27%20:%20%27N%C3%A4chste%20Woche%27;%0A%20%20%20%20%20%20%20%20headerWeekInfo.innerHTML%20=%20%60%0A%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22header-week-title%22%3E%24%7BweekTitle%7D%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22header-week-subtitle%22%3EWeek%20%24%7BtargetWeek%7D%20%E2%80%A2%20%24%7BtargetYear%7D%3C/div%3E%60;%0A%0A%20%20%20%20%20%20%20%20const%20grid%20=%20document.createElement(%27div%27);%0A%20%20%20%20%20%20%20%20grid.className%20=%20%27days-grid%27;%0A%0A%20%20%20%20%20%20%20%20daysInTargetWeek.sort((a,%20b)%20=%3E%20a.date.localeCompare(b.date));%0A%0A%20%20%20%20%20%20%20%20//%20Filter%20weekends%0A%20%20%20%20%20%20%20%20const%20workingDays%20=%20daysInTargetWeek.filter(d%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20date%20=%20new%20Date(d.date);%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20day%20=%20date.getDay();%0A%20%20%20%20%20%20%20%20%20%20%20%20return%20day%20!==%200%20%26%26%20day%20!==%206;%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20workingDays.forEach(day%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20card%20=%20createDayCard(day);%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(card)%20grid.appendChild(card);%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20menuContainer.appendChild(grid);%0A%20%20%20%20%20%20%20%20setTimeout(()%20=%3E%20syncMenuItemHeights(grid),%200);%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Sync%20Item%20Heights%20===%0A%20%20%20%20function%20syncMenuItemHeights(grid)%20%7B%0A%20%20%20%20%20%20%20%20const%20cards%20=%20grid.querySelectorAll(%27.menu-card%27);%0A%20%20%20%20%20%20%20%20if%20(cards.length%20===%200)%20return;%0A%20%20%20%20%20%20%20%20let%20maxItems%20=%200;%0A%20%20%20%20%20%20%20%20cards.forEach(card%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20maxItems%20=%20Math.max(maxItems,%20card.querySelectorAll(%27.menu-item%27).length);%0A%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20for%20(let%20i%20=%200;%20i%20%3C%20maxItems;%20i++)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20let%20maxHeight%20=%200;%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20itemsAtPos%20=%20%5B%5D;%0A%20%20%20%20%20%20%20%20%20%20%20%20cards.forEach(card%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20items%20=%20card.querySelectorAll(%27.menu-item%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(items%5Bi%5D)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20items%5Bi%5D.style.height%20=%20%27auto%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20maxHeight%20=%20Math.max(maxHeight,%20items%5Bi%5D.offsetHeight);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20itemsAtPos.push(items%5Bi%5D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20itemsAtPos.forEach(item%20=%3E%20%7B%20item.style.height%20=%20%60%24%7BmaxHeight%7Dpx%60;%20%7D);%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Create%20Day%20Card%20===%0A%20%20%20%20function%20createDayCard(day)%20%7B%0A%20%20%20%20%20%20%20%20if%20(!day.items%20%7C%7C%20day.items.length%20===%200)%20return%20null;%0A%0A%20%20%20%20%20%20%20%20const%20card%20=%20document.createElement(%27div%27);%0A%20%20%20%20%20%20%20%20card.className%20=%20%27menu-card%27;%0A%0A%20%20%20%20%20%20%20%20const%20now%20=%20new%20Date();%0A%20%20%20%20%20%20%20%20const%20cardDate%20=%20new%20Date(day.date);%0A%0A%20%20%20%20%20%20%20%20let%20isPastCutoff%20=%20false;%0A%20%20%20%20%20%20%20%20if%20(day.orderCutoff)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20isPastCutoff%20=%20now%20%3E=%20new%20Date(day.orderCutoff);%0A%20%20%20%20%20%20%20%20%7D%20else%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20today%20=%20new%20Date();%0A%20%20%20%20%20%20%20%20%20%20%20%20today.setHours(0,%200,%200,%200);%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20cd%20=%20new%20Date(day.date);%0A%20%20%20%20%20%20%20%20%20%20%20%20cd.setHours(0,%200,%200,%200);%0A%20%20%20%20%20%20%20%20%20%20%20%20isPastCutoff%20=%20cd%20%3C%20today;%0A%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20if%20(isPastCutoff)%20card.classList.add(%27past-day%27);%0A%0A%20%20%20%20%20%20%20%20//%20Collect%20ordered%20menu%20codes%0A%20%20%20%20%20%20%20%20const%20menuBadges%20=%20%5B%5D;%0A%20%20%20%20%20%20%20%20if%20(day.items)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20day.items.forEach(item%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20articleId%20=%20item.articleId%20%7C%7C%20parseInt(item.id.split(%27_%27)%5B1%5D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20orderKey%20=%20%60%24%7Bday.date%7D_%24%7BarticleId%7D%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20orders%20=%20orderMap.get(orderKey)%20%7C%7C%20%5B%5D;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20count%20=%20orders.length;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(count%20%3E%200)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20//%20Regex%20for%20M1,%20M2,%20M1F%20etc.%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20match%20=%20item.name.match(/(%5BM%5D%5B1-9%5D%5BFf%5D%3F)/);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(match)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20let%20code%20=%20match%5B1%5D;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(count%20%3E%201)%20code%20+=%20%27+%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20menuBadges.push(code);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20//%20Header%0A%20%20%20%20%20%20%20%20const%20header%20=%20document.createElement(%27div%27);%0A%20%20%20%20%20%20%20%20header.className%20=%20%27card-header%27;%0A%20%20%20%20%20%20%20%20const%20dateStr%20=%20cardDate.toLocaleDateString(%27de-DE%27,%20%7B%20day:%20%272-digit%27,%20month:%20%272-digit%27%20%7D);%0A%0A%20%20%20%20%20%20%20%20const%20badgesHtml%20=%20menuBadges.map(code%20=%3E%20%60%3Cspan%20class=%22menu-code-badge%22%3E%24%7Bcode%7D%3C/span%3E%60).join(%27%27);%0A%0A%20%20%20%20%20%20%20%20//%20Determine%20Day%20Status%20for%20Header%20Color%0A%20%20%20%20%20%20%20%20//%20Violet:%20Has%20Order%0A%20%20%20%20%20%20%20%20//%20Green:%20No%20Order%20but%20Orderable%0A%20%20%20%20%20%20%20%20//%20Red:%20No%20Order%20and%20Not%20Orderable%20(Locked/Sold%20Out)%0A%20%20%20%20%20%20%20%20let%20headerClass%20=%20%27%27;%0A%20%20%20%20%20%20%20%20const%20hasAnyOrder%20=%20day.items%20%26%26%20day.items.some(item%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20articleId%20=%20item.articleId%20%7C%7C%20parseInt(item.id.split(%27_%27)%5B1%5D);%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20key%20=%20%60%24%7Bday.date%7D_%24%7BarticleId%7D%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20return%20orderMap.has(key)%20%26%26%20orderMap.get(key).length%20%3E%200;%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20const%20hasOrderable%20=%20day.items%20%26%26%20day.items.some(item%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Use%20pre-calculated%20available%20flag%20from%20loadMenuDataFromAPI%20calculation%0A%20%20%20%20%20%20%20%20%20%20%20%20return%20item.available;%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20if%20(hasAnyOrder)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20headerClass%20=%20%27header-violet%27;%0A%20%20%20%20%20%20%20%20%7D%20else%20if%20(hasOrderable%20%26%26%20!isPastCutoff)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20headerClass%20=%20%27header-green%27;%0A%20%20%20%20%20%20%20%20%7D%20else%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Red%20if%20not%20orderable%20(or%20past%20cutoff)%0A%20%20%20%20%20%20%20%20%20%20%20%20headerClass%20=%20%27header-red%27;%0A%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20if%20(headerClass)%20header.classList.add(headerClass);%0A%0A%20%20%20%20%20%20%20%20header.innerHTML%20=%20%60%0A%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22day-header-left%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cspan%20class=%22day-name%22%3E%24%7BtranslateDay(day.weekday)%7D%3C/span%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22day-badges%22%3E%24%7BbadgesHtml%7D%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3Cspan%20class=%22day-date%22%3E%24%7BdateStr%7D%3C/span%3E%60;%0A%20%20%20%20%20%20%20%20card.appendChild(header);%0A%0A%20%20%20%20%20%20%20%20//%20Body%0A%20%20%20%20%20%20%20%20const%20body%20=%20document.createElement(%27div%27);%0A%20%20%20%20%20%20%20%20body.className%20=%20%27card-body%27;%0A%0A%20%20%20%20%20%20%20%20const%20todayDateStr%20=%20new%20Date().toISOString().split(%27T%27)%5B0%5D;%0A%20%20%20%20%20%20%20%20const%20isToday%20=%20day.date%20===%20todayDateStr;%0A%0A%20%20%20%20%20%20%20%20const%20sortedItems%20=%20%5B...day.items%5D.sort((a,%20b)%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(isToday)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20aId%20=%20a.articleId%20%7C%7C%20parseInt(a.id.split(%27_%27)%5B1%5D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20bId%20=%20b.articleId%20%7C%7C%20parseInt(b.id.split(%27_%27)%5B1%5D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20aOrdered%20=%20orderMap.has(%60%24%7Bday.date%7D_%24%7BaId%7D%60);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20bOrdered%20=%20orderMap.has(%60%24%7Bday.date%7D_%24%7BbId%7D%60);%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(aOrdered%20%26%26%20!bOrdered)%20return%20-1;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(!aOrdered%20%26%26%20bOrdered)%20return%201;%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20return%20a.name.localeCompare(b.name);%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20sortedItems.forEach(item%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20itemEl%20=%20document.createElement(%27div%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20itemEl.className%20=%20%27menu-item%27;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20articleId%20=%20item.articleId%20%7C%7C%20parseInt(item.id.split(%27_%27)%5B1%5D);%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20orderKey%20=%20%60%24%7Bday.date%7D_%24%7BarticleId%7D%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20orderIds%20=%20orderMap.get(orderKey)%20%7C%7C%20%5B%5D;%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20orderCount%20=%20orderIds.length;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Status%20badge%0A%20%20%20%20%20%20%20%20%20%20%20%20let%20statusBadge%20=%20%27%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(item.available)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20statusBadge%20=%20item.amountTracking%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3F%20%60%3Cspan%20class=%22badge%20available%22%3EVerf%C3%BCgbar%20(%24%7Bitem.availableAmount%7D)%3C/span%3E%60%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20:%20%60%3Cspan%20class=%22badge%20available%22%3EVerf%C3%BCgbar%3C/span%3E%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%20else%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20statusBadge%20=%20%60%3Cspan%20class=%22badge%20sold-out%22%3EAusverkauft%3C/span%3E%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Order%20badge%0A%20%20%20%20%20%20%20%20%20%20%20%20let%20orderedBadge%20=%20%27%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(orderCount%20%3E%200)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20countBadge%20=%20orderCount%20%3E%201%20%3F%20%60%3Cspan%20class=%22order-count-badge%22%3E%24%7BorderCount%7D%3C/span%3E%60%20:%20%27%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20orderedBadge%20=%20%60%3Cspan%20class=%22badge%20ordered%22%3E%3Cspan%20class=%22material-icons-round%22%3Echeck_circle%3C/span%3E%20Bestellt%24%7BcountBadge%7D%3C/span%3E%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20itemEl.classList.add(%27ordered%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(new%20Date(day.date).toDateString()%20===%20now.toDateString())%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20itemEl.classList.add(%27today-ordered%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Flagged%20styles%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20flagId%20=%20%60%24%7Bday.date%7D_%24%7BarticleId%7D%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20isFlagged%20=%20userFlags.has(flagId);%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(isFlagged)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20itemEl.classList.add(item.available%20%3F%20%27flagged-available%27%20:%20%27flagged-sold-out%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Action%20buttons%0A%20%20%20%20%20%20%20%20%20%20%20%20let%20orderButton%20=%20%27%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20let%20cancelButton%20=%20%27%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20let%20flagButton%20=%20%27%27;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(authToken%20%26%26%20!isPastCutoff)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20//%20Flag%20button%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20flagIcon%20=%20isFlagged%20%3F%20%27notifications_active%27%20:%20%27notifications_none%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20flagClass%20=%20isFlagged%20%3F%20%27btn-flag%20active%27%20:%20%27btn-flag%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20flagTitle%20=%20isFlagged%20%3F%20%27Benachrichtigung%20deaktivieren%27%20:%20%27Benachrichtigen%20wenn%20verf%C3%BCgbar%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(!item.available%20%7C%7C%20isFlagged)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20flagButton%20=%20%60%3Cbutton%20class=%22%24%7BflagClass%7D%22%20data-date=%22%24%7Bday.date%7D%22%20data-article=%22%24%7BarticleId%7D%22%20data-name=%22%24%7BescapeHtml(item.name)%7D%22%20data-cutoff=%22%24%7Bday.orderCutoff%7D%22%20title=%22%24%7BflagTitle%7D%22%3E%3Cspan%20class=%22material-icons-round%22%3E%24%7BflagIcon%7D%3C/span%3E%3C/button%3E%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20//%20Order%20button%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(item.available)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(orderCount%20%3E%200)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20orderButton%20=%20%60%3Cbutton%20class=%22btn-order%20btn-order-compact%22%20data-date=%22%24%7Bday.date%7D%22%20data-article=%22%24%7BarticleId%7D%22%20data-name=%22%24%7BescapeHtml(item.name)%7D%22%20data-price=%22%24%7Bitem.price%7D%22%20data-desc=%22%24%7BescapeHtml(item.description%20%7C%7C%20%27%27)%7D%22%20title=%22%24%7BescapeHtml(item.name)%7D%20nochmal%20bestellen%22%3E%3Cspan%20class=%22material-icons-round%22%3Eadd%3C/span%3E%3C/button%3E%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%20else%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20orderButton%20=%20%60%3Cbutton%20class=%22btn-order%22%20data-date=%22%24%7Bday.date%7D%22%20data-article=%22%24%7BarticleId%7D%22%20data-name=%22%24%7BescapeHtml(item.name)%7D%22%20data-price=%22%24%7Bitem.price%7D%22%20data-desc=%22%24%7BescapeHtml(item.description%20%7C%7C%20%27%27)%7D%22%20title=%22%24%7BescapeHtml(item.name)%7D%20bestellen%22%3E%3Cspan%20class=%22material-icons-round%22%3Eadd_shopping_cart%3C/span%3E%20Bestellen%3C/button%3E%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20//%20Cancel%20button%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(orderCount%20%3E%200)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20cancelIcon%20=%20orderCount%20===%201%20%3F%20%27close%27%20:%20%27remove%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20cancelTitle%20=%20orderCount%20===%201%20%3F%20%27Bestellung%20stornieren%27%20:%20%27Eine%20Bestellung%20stornieren%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20cancelButton%20=%20%60%3Cbutton%20class=%22btn-cancel%22%20data-date=%22%24%7Bday.date%7D%22%20data-article=%22%24%7BarticleId%7D%22%20data-name=%22%24%7BescapeHtml(item.name)%7D%22%20title=%22%24%7BcancelTitle%7D%22%3E%3Cspan%20class=%22material-icons-round%22%3E%24%7BcancelIcon%7D%3C/span%3E%3C/button%3E%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20itemEl.innerHTML%20=%20%60%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22item-header%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cspan%20class=%22item-name%22%3E%24%7BescapeHtml(item.name)%7D%3C/span%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cspan%20class=%22item-price%22%3E%24%7Bitem.price.toFixed(2)%7D%20%E2%82%AC%3C/span%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22item-status-row%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%24%7BorderedBadge%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%24%7BcancelButton%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%24%7BorderButton%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%24%7BflagButton%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22badges%22%3E%24%7BstatusBadge%7D%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cp%20class=%22item-desc%22%3E%24%7BescapeHtml(item.description)%7D%3C/p%3E%60;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Event:%20Order%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20orderBtn%20=%20itemEl.querySelector(%27.btn-order%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(orderBtn)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20orderBtn.addEventListener(%27click%27,%20(e)%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20e.stopPropagation();%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20btn%20=%20e.currentTarget;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20btn.disabled%20=%20true;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20btn.classList.add(%27loading%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20placeOrder(btn.dataset.date,%20parseInt(btn.dataset.article),%20btn.dataset.name,%20parseFloat(btn.dataset.price),%20btn.dataset.desc%20%7C%7C%20%27%27)%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20.finally(()%20=%3E%20%7B%20btn.disabled%20=%20false;%20btn.classList.remove(%27loading%27);%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Event:%20Cancel%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20cancelBtn%20=%20itemEl.querySelector(%27.btn-cancel%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(cancelBtn)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20cancelBtn.addEventListener(%27click%27,%20(e)%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20e.stopPropagation();%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20btn%20=%20e.currentTarget;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20btn.disabled%20=%20true;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20cancelOrder(btn.dataset.date,%20parseInt(btn.dataset.article),%20btn.dataset.name)%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20.finally(()%20=%3E%20%7B%20btn.disabled%20=%20false;%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Event:%20Flag%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20flagBtn%20=%20itemEl.querySelector(%27.btn-flag%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(flagBtn)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20flagBtn.addEventListener(%27click%27,%20(e)%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20e.stopPropagation();%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20btn%20=%20e.currentTarget;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20toggleFlag(btn.dataset.date,%20parseInt(btn.dataset.article),%20btn.dataset.name,%20btn.dataset.cutoff);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20body.appendChild(itemEl);%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20card.appendChild(body);%0A%20%20%20%20%20%20%20%20return%20card;%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Version%20Check%20===%0A%20%20%20%20async%20function%20checkForUpdates()%20%7B%0A%20%20%20%20%20%20%20%20const%20CurrentVersion%20=%20%27v1.2.0%27;%0A%20%20%20%20%20%20%20%20const%20VersionUrl%20=%20%27https://raw.githubusercontent.com/TauNeutrino/kantine-overview/main/version.txt%27;%0A%20%20%20%20%20%20%20%20const%20InstallerUrl%20=%20%27https://htmlpreview.github.io/%3Fhttps://github.com/TauNeutrino/kantine-overview/blob/main/dist/install.html%27;%0A%0A%20%20%20%20%20%20%20%20console.log(%60%5BKantine%5D%20Checking%20for%20updates...%20(Current:%20%24%7BCurrentVersion%7D)%60);%0A%0A%20%20%20%20%20%20%20%20try%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20response%20=%20await%20fetch(VersionUrl,%20%7B%20cache:%20%27no-cache%27%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(!response.ok)%20return;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20remoteVersion%20=%20(await%20response.text()).trim();%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(remoteVersion%20%26%26%20remoteVersion%20!==%20CurrentVersion)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20console.log(%60%5BKantine%5D%20New%20version%20available:%20%24%7BremoteVersion%7D%60);%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20//%20Fetch%20Changelog%20content%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20let%20changeSummary%20=%20%27%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20try%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20clResp%20=%20await%20fetch(%27https://raw.githubusercontent.com/TauNeutrino/kantine-overview/main/changelog.md%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(clResp.ok)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20clText%20=%20await%20clResp.text();%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20match%20=%20clText.match(/%23%23%20(v%5B%5E%5Cn%5D+)%5Cn((%3F:-%5B%5E%5Cn%5D+%5Cn)+)/);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(match%20%26%26%20match%5B1%5D.includes(remoteVersion))%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20changeSummary%20=%20match%5B2%5D.replace(/-%20/g,%20%27%E2%80%A2%20%27).trim();%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%20catch%20(e)%20%7B%20console.warn(%27No%20changelog%27,%20e);%20%7D%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20//%20Create%20Banner%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20updateBanner%20=%20document.createElement(%27div%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20updateBanner.className%20=%20%27update-banner%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20updateBanner.innerHTML%20=%20%60%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22update-content%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cstrong%3EUpdate%20verf%C3%BCgbar:%20%24%7BremoteVersion%7D%3C/strong%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%24%7BchangeSummary%20%3F%20%60%3Cpre%20class=%22change-summary%22%3E%24%7BchangeSummary%7D%3C/pre%3E%60%20:%20%27%27%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Ca%20href=%22%24%7BInstallerUrl%7D%22%20target=%22_blank%22%20class=%22update-link%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cspan%20class=%22material-icons-round%22%3Esystem_update_alt%3C/span%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20Jetzt%20aktualisieren%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/a%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cbutton%20class=%22icon-btn-small%20close-update%22%3E%26times;%3C/button%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%60;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20document.body.appendChild(updateBanner);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20updateBanner.querySelector(%27.close-update%27).addEventListener(%27click%27,%20()%20=%3E%20updateBanner.remove());%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20//%20Highlight%20Header%20Icon%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20lastUpdatedIcon%20=%20document.querySelector(%27.material-icons-round.logo-icon%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(lastUpdatedIcon)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20lastUpdatedIcon.style.color%20=%20%27var(--accent-color)%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20lastUpdatedIcon.parentElement.title%20=%20%60Update%20verf%C3%BCgbar:%20%24%7BremoteVersion%7D%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%7D%20catch%20(error)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20console.warn(%27%5BKantine%5D%20Version%20check%20failed:%27,%20error);%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Order%20Countdown%20===%0A%20%20%20%20function%20updateCountdown()%20%7B%0A%20%20%20%20%20%20%20%20const%20now%20=%20new%20Date();%0A%20%20%20%20%20%20%20%20const%20currentDay%20=%20now.getDay();%0A%20%20%20%20%20%20%20%20//%20Skip%20weekends%20(0=Sun,%206=Sat)%0A%20%20%20%20%20%20%20%20if%20(currentDay%20===%200%20%7C%7C%20currentDay%20===%206)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20removeCountdown();%0A%20%20%20%20%20%20%20%20%20%20%20%20return;%0A%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20const%20todayStr%20=%20now.toISOString().split(%27T%27)%5B0%5D;%0A%0A%20%20%20%20%20%20%20%20//%201.%20Check%20if%20we%20already%20ordered%20for%20today%0A%20%20%20%20%20%20%20%20let%20hasOrder%20=%20false;%0A%20%20%20%20%20%20%20%20//%20Optimization:%20Check%20orderMap%20for%20today%27s%20date%0A%20%20%20%20%20%20%20%20//%20Keys%20are%20%22YYYY-MM-DD_ArticleID%22%0A%20%20%20%20%20%20%20%20for%20(const%20key%20of%20orderMap.keys())%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(key.startsWith(todayStr))%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20hasOrder%20=%20true;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20break;%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20if%20(hasOrder)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20removeCountdown();%0A%20%20%20%20%20%20%20%20%20%20%20%20return;%0A%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20//%202.%20Calculate%20time%20to%20cutoff%20(10:00%20AM)%0A%20%20%20%20%20%20%20%20const%20cutoff%20=%20new%20Date();%0A%20%20%20%20%20%20%20%20cutoff.setHours(10,%200,%200,%200);%0A%0A%20%20%20%20%20%20%20%20const%20diff%20=%20cutoff%20-%20now;%0A%0A%20%20%20%20%20%20%20%20//%20If%20passed%20cutoff%20or%20more%20than%203%20hours%20away%20(e.g.%2007:00),%20maybe%20don%27t%20show%3F%0A%20%20%20%20%20%20%20%20//%20User%20req:%20%22heute%20noch%20keine%20bestellung...%20countdown%20erscheinen%22%0A%20%20%20%20%20%20%20%20//%20Let%27s%20show%20it%20if%20within%20valid%20order%20window%20(e.g.%2000:00%20-%2010:00)%0A%0A%20%20%20%20%20%20%20%20if%20(diff%20%3C=%200)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20removeCountdown();%0A%20%20%20%20%20%20%20%20%20%20%20%20return;%0A%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20//%203.%20Render%20Countdown%0A%20%20%20%20%20%20%20%20const%20diffHrs%20=%20Math.floor(diff%20/%203600000);%0A%20%20%20%20%20%20%20%20const%20diffMins%20=%20Math.floor((diff%20%25%203600000)%20/%2060000);%0A%0A%20%20%20%20%20%20%20%20const%20headerCenter%20=%20document.querySelector(%27.header-center-wrapper%27);%0A%20%20%20%20%20%20%20%20if%20(!headerCenter)%20return;%0A%0A%20%20%20%20%20%20%20%20let%20countdownEl%20=%20document.getElementById(%27order-countdown%27);%0A%20%20%20%20%20%20%20%20if%20(!countdownEl)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20countdownEl%20=%20document.createElement(%27div%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20countdownEl.id%20=%20%27order-countdown%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Insert%20before%20cost%20display%20or%20append%0A%20%20%20%20%20%20%20%20%20%20%20%20headerCenter.insertBefore(countdownEl,%20headerCenter.firstChild);%0A%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20countdownEl.innerHTML%20=%20%60%3Cspan%3EBestellschluss:%3C/span%3E%20%3Cstrong%3E%24%7BdiffHrs%7Dh%20%24%7BdiffMins%7Dm%3C/strong%3E%60;%0A%0A%20%20%20%20%20%20%20%20//%20Red%20Alert%20if%20%3C%201%20hour%0A%20%20%20%20%20%20%20%20if%20(diff%20%3C%203600000)%20%7B%20//%201%20hour%0A%20%20%20%20%20%20%20%20%20%20%20%20countdownEl.classList.add(%27urgent%27);%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Notification%20logic%20(One%20time)%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20notifiedKey%20=%20%60kantine_notified_%24%7BtodayStr%7D%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(!sessionStorage.getItem(notifiedKey))%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(Notification.permission%20===%20%27granted%27)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20new%20Notification(%27Kantine:%20Bestellschluss%20naht!%27,%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20body:%20%27Du%20hast%20heute%20noch%20nichts%20bestellt.%20Nur%20noch%201%20Stunde!%27,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20icon:%20%27%E2%8F%B3%27%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%20else%20if%20(Notification.permission%20===%20%27default%27)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20Notification.requestPermission();%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20sessionStorage.setItem(notifiedKey,%20%27true%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%7D%20else%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20countdownEl.classList.remove(%27urgent%27);%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%0A%20%20%20%20function%20removeCountdown()%20%7B%0A%20%20%20%20%20%20%20%20const%20el%20=%20document.getElementById(%27order-countdown%27);%0A%20%20%20%20%20%20%20%20if%20(el)%20el.remove();%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20Update%20countdown%20every%20minute%0A%20%20%20%20setInterval(updateCountdown,%2060000);%0A%20%20%20%20//%20Also%20update%20on%20load%0A%20%20%20%20setTimeout(updateCountdown,%201000);%0A%0A%20%20%20%20//%20===%20Helpers%20===%20%0A%20%20%20%20function%20getISOWeek(date)%20%7B%0A%20%20%20%20%20%20%20%20const%20d%20=%20new%20Date(Date.UTC(date.getFullYear(),%20date.getMonth(),%20date.getDate()));%0A%20%20%20%20%20%20%20%20const%20dayNum%20=%20d.getUTCDay()%20%7C%7C%207;%0A%20%20%20%20%20%20%20%20d.setUTCDate(d.getUTCDate()%20+%204%20-%20dayNum);%0A%20%20%20%20%20%20%20%20const%20yearStart%20=%20new%20Date(Date.UTC(d.getUTCFullYear(),%200,%201));%0A%20%20%20%20%20%20%20%20return%20Math.ceil(((d%20-%20yearStart)%20/%2086400000%20+%201)%20/%207);%0A%20%20%20%20%7D%0A%0A%20%20%20%20function%20getWeekYear(d)%20%7B%0A%20%20%20%20%20%20%20%20const%20date%20=%20new%20Date(d.getTime());%0A%20%20%20%20%20%20%20%20date.setDate(date.getDate()%20+%203%20-%20(date.getDay()%20+%206)%20%25%207);%0A%20%20%20%20%20%20%20%20return%20date.getFullYear();%0A%20%20%20%20%7D%0A%0A%0A%20%20%20%20function%20translateDay(englishDay)%20%7B%0A%20%20%20%20%20%20%20%20const%20map%20=%20%7B%20Monday:%20%27Montag%27,%20Tuesday:%20%27Dienstag%27,%20Wednesday:%20%27Mittwoch%27,%20Thursday:%20%27Donnerstag%27,%20Friday:%20%27Freitag%27,%20Saturday:%20%27Samstag%27,%20Sunday:%20%27Sonntag%27%20%7D;%0A%20%20%20%20%20%20%20%20return%20map%5BenglishDay%5D%20%7C%7C%20englishDay;%0A%20%20%20%20%7D%0A%0A%20%20%20%20function%20escapeHtml(text)%20%7B%0A%20%20%20%20%20%20%20%20const%20div%20=%20document.createElement(%27div%27);%0A%20%20%20%20%20%20%20%20div.textContent%20=%20text%20%7C%7C%20%27%27;%0A%20%20%20%20%20%20%20%20return%20div.innerHTML;%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Bootstrap%20===%0A%20%20%20%20injectUI();%0A%20%20%20%20bindEvents();%0A%20%20%20%20updateAuthUI();%0A%20%20%20%20cleanupExpiredFlags();%0A%0A%20%20%20%20//%20Load%20cached%20data%20first%20for%20instant%20UI,%20then%20refresh%20from%20API%0A%20%20%20%20const%20hadCache%20=%20loadMenuCache();%0A%20%20%20%20if%20(hadCache)%20%7B%0A%20%20%20%20%20%20%20%20//%20Hide%20loading%20spinner%20since%20cache%20is%20shown%0A%20%20%20%20%20%20%20%20document.getElementById(%27loading%27).classList.add(%27hidden%27);%0A%20%20%20%20%7D%0A%20%20%20%20loadMenuDataFromAPI();%0A%0A%20%20%20%20//%20Auto-start%20polling%20if%20already%20logged%20in%0A%20%20%20%20if%20(authToken)%20%7B%0A%20%20%20%20%20%20%20%20startPolling();%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20Check%20for%20updates%0A%20%20%20%20checkForUpdates();%0A%0A%20%20%20%20console.log(%27Kantine%20Wrapper%20loaded%20%E2%9C%85%27);%0A%7D)();%0A%0A//%20===%20Error%20Modal%20===%0Afunction%20showErrorModal(title,%20htmlContent,%20btnText,%20url)%20%7B%0A%20%20%20%20const%20modalId%20=%20%27error-modal%27;%0A%20%20%20%20let%20modal%20=%20document.getElementById(modalId);%0A%20%20%20%20if%20(modal)%20modal.remove();%0A%0A%20%20%20%20modal%20=%20document.createElement(%27div%27);%0A%20%20%20%20modal.id%20=%20modalId;%0A%20%20%20%20modal.className%20=%20%27modal%20hidden%27;%0A%20%20%20%20modal.innerHTML%20=%20%60%0A%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22modal-content%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22modal-header%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Ch2%20style=%22color:%20var(--error-color);%20display:%20flex;%20align-items:%20center;%20gap:%2010px;%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cspan%20class=%22material-icons-round%22%3Esignal_wifi_off%3C/span%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%24%7Btitle%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/h2%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20style=%22padding:%2020px;%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cp%20style=%22margin-bottom:%2015px;%20color:%20var(--text-primary);%22%3E%24%7BhtmlContent%7D%3C/p%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20style=%22margin-top:%2020px;%20display:%20flex;%20justify-content:%20center;%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cbutton%20id=%22btn-error-redirect%22%20style=%22%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20background-color:%20var(--accent-color);%20%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20color:%20white;%20%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20padding:%2012px%2024px;%20%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20border-radius:%208px;%20%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20border:%20none;%20%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20font-weight:%20600;%20%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20cursor:%20pointer;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20display:%20flex;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20align-items:%20center;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20gap:%208px;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20width:%20100%25;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20justify-content:%20center;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20transition:%20transform%200.1s;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%24%7BbtnText%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cspan%20class=%22material-icons-round%22%3Eopen_in_new%3C/span%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/button%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%60;%0A%20%20%20%20document.body.appendChild(modal);%0A%0A%20%20%20%20document.getElementById(%27btn-error-redirect%27).addEventListener(%27click%27,%20()%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20window.location.href%20=%20url;%0A%20%20%20%20%7D);%0A%0A%20%20%20%20requestAnimationFrame(()%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20modal.classList.remove(%27hidden%27);%0A%20%20%20%20%7D);%0A%7D%0A%7D)();";
-        document.getElementById('bookmarklet-link').textContent = 'Kantine v1.2.0';
+"javascript:(function()%7Bvar%20s=document.createElement(%27style%27);s.textContent=%27:root%20%7B%20%20%20/%2A%20Premium%20Slate/Gray-Blue%20Palette%20-%20Light%20Mode%20%2A/%20%20%20--bg-body:%20%23f1f5f9;%20%20%20/%2A%20Slate%20100%20%2A/%20%20%20--bg-card:%20%23ffffff;%20%20%20--text-primary:%20%23334155;%20%20%20/%2A%20Slate%20700%20%2A/%20%20%20--text-secondary:%20%2364748b;%20%20%20--accent-color:%20%230f172a;%20%20%20/%2A%20Slate%20900%20(High%20contrast)%20%2A/%20%20%20--border-color:%20%23cbd5e1;%20%20%20/%2A%20Slate%20300%20%2A/%20%20%20--banner-bg:%20%23e2e8f0;%20%20%20--banner-text:%20%231e293b;%20%20%20--success-color:%20%23059669;%20%20%20--error-color:%20%23dc2626;%20%20%20--card-shadow:%200%204px%206px%20-1px%20rgb(0%200%200%20/%200.05),%200%202px%204px%20-2px%20rgb(0%200%200%20/%200.05);%20%20%20--header-bg:%20rgba(255,%20255,%20255,%200.9);%20%20%20--header-border:%201px%20solid%20rgba(203,%20213,%20225,%200.6);%20%7D%20%5Bdata-theme=%5C%22dark%5C%22%5D%20%7B%20%20%20/%2A%20Premium%20Slate/Gray-Blue%20Palette%20-%20Dark%20Mode%20%2A/%20%20%20--bg-body:%20%231e293b;%20%20%20/%2A%20Deep%20Slate%20Gray%20(Requested)%20%2A/%20%20%20--bg-card:%20%23334155;%20%20%20/%2A%20Slate%20700%20%2A/%20%20%20--text-primary:%20%23f8fafc;%20%20%20/%2A%20Slate%2050%20%2A/%20%20%20--text-secondary:%20%23cbd5e1;%20%20%20/%2A%20Slate%20300%20%2A/%20%20%20--accent-color:%20%2360a5fa;%20%20%20/%2A%20Blue%20400%20%2A/%20%20%20--border-color:%20%23475569;%20%20%20/%2A%20Slate%20600%20%2A/%20%20%20--banner-bg:%20%23475569;%20%20%20--banner-text:%20%23e2e8f0;%20%20%20--header-bg:%20rgba(30,%2041,%2059,%200.9);%20%20%20--header-border:%201px%20solid%20rgba(71,%2085,%20105,%200.6);%20%20%20--card-shadow:%200%2010px%2015px%20-3px%20rgb(0%200%200%20/%200.4);%20%7D%20%2A%20%7B%20%20%20box-sizing:%20border-box;%20%20%20margin:%200;%20%20%20padding:%200;%20%7D%20body%20%7B%20%20%20font-family:%20%5C%27Inter%5C%27,%20system-ui,%20-apple-system,%20sans-serif;%20%20%20background-color:%20var(--bg-body);%20%20%20color:%20var(--text-primary);%20%20%20transition:%20background-color%200.3s%20ease,%20color%200.3s%20ease;%20%20%20line-height:%201.5;%20%20%20-webkit-font-smoothing:%20antialiased;%20%7D%20/%2A%20Fix%20scrolling%20bug:%20Reset%20html/body%20styles%20from%20host%20page%20%2A/%20html,%20body%20%7B%20%20%20height:%20auto%20!important;%20%20%20min-height:%20100%25%20!important;%20%20%20overflow-y:%20auto%20!important;%20%20%20overflow-x:%20hidden%20!important;%20%20%20position:%20static%20!important;%20%20%20margin:%200%20!important;%20%20%20padding:%200%20!important;%20%7D%20/%2A%20Header%20%2A/%20.app-header%20%7B%20%20%20position:%20sticky;%20%20%20top:%200;%20%20%20z-index:%20100;%20%20%20backdrop-filter:%20blur(12px);%20%20%20background-color:%20var(--header-bg);%20%20%20border-bottom:%20var(--header-border);%20%20%20padding:%201rem%200;%20%7D%20.header-content%20%7B%20%20%20width:%20100%25;%20%20%20/%2A%20Full%20width%20%2A/%20%20%20padding:%200%202rem;%20%20%20/%2A%20Comfortable%20padding%20%2A/%20%20%20display:%20grid;%20%20%20grid-template-columns:%201fr%20auto%201fr;%20%20%20align-items:%20center;%20%20%20gap:%201rem;%20%7D%20.brand%20%7B%20%20%20display:%20flex;%20%20%20align-items:%20center;%20%20%20gap:%200.75rem;%20%7D%20.brand-text%20%7B%20%20%20display:%20flex;%20%20%20flex-direction:%20column;%20%7D%20.brand%20h1%20%7B%20%20%20font-size:%201.25rem;%20%20%20font-weight:%20700;%20%20%20letter-spacing:%20-0.025em;%20%20%20margin-bottom:%200;%20%7D%20.subtitle%20%7B%20%20%20font-size:%200.85rem;%20%20%20color:%20var(--text-secondary);%20%20%20font-weight:%20400;%20%20%20margin-left:%202px;%20%7D%20.logo-icon%20%7B%20%20%20font-size:%201.5rem;%20%20%20color:%20var(--accent-color);%20%7D%20/%2A%20Controls%20%2A/%20.controls%20%7B%20%20%20display:%20flex;%20%20%20align-items:%20center;%20%20%20gap:%201.5rem;%20%20%20justify-self:%20end;%20%7D%20/%2A%20Header%20Week%20Info%20(centered)%20%2A/%20.header-week-info%20%7B%20%20%20text-align:%20center;%20%20%20line-height:%201.3;%20%7D%20.header-center-wrapper%20%7B%20%20%20display:%20flex;%20%20%20flex-direction:%20row;%20%20%20align-items:%20center;%20%20%20gap:%201.5rem;%20%20%20justify-content:%20center;%20%7D%20%20.header-week-title%20%7B%20%20%20font-size:%201.1rem;%20%20%20font-weight:%20600;%20%20%20color:%20var(--text-primary);%20%7D%20.header-week-subtitle%20%7B%20%20%20font-size:%200.85rem;%20%20%20color:%20var(--text-secondary);%20%7D%20.nav-group%20%7B%20%20%20display:%20flex;%20%20%20background-color:%20var(--bg-card);%20%20%20border:%201px%20solid%20var(--border-color);%20%20%20padding:%200.25rem;%20%20%20border-radius:%208px;%20%7D%20.nav-btn%20%7B%20%20%20background:%20none;%20%20%20border:%20none;%20%20%20padding:%200.5rem%201rem;%20%20%20font-size:%200.875rem;%20%20%20font-weight:%20500;%20%20%20color:%20var(--text-secondary);%20%20%20cursor:%20pointer;%20%20%20border-radius:%206px;%20%20%20transition:%20all%200.2s;%20%20%20display:%20flex;%20%20%20align-items:%20center;%20%20%20gap:%200.5rem;%20%7D%20.nav-btn:hover%20%7B%20%20%20color:%20var(--text-primary);%20%20%20background-color:%20rgba(100,%20116,%20139,%200.1);%20%7D%20.nav-btn.active%20%7B%20%20%20background-color:%20var(--accent-color);%20%20%20color:%20white;%20%7D%20/%2A%20Badge%20for%20nav%20buttons%20(day%20count%20indicator)%20%2A/%20.nav-badge%20%7B%20%20%20background-color:%20var(--error-color);%20%20%20color:%20white;%20%20%20font-size:%200.75rem;%20%20%20font-weight:%20600;%20%20%20padding:%200%206px;%20%20%20border-radius:%2010px;%20%20%20min-width:%2018px;%20%20%20height:%2018px;%20%20%20display:%20inline-flex;%20%20%20align-items:%20center;%20%20%20justify-content:%20center;%20%20%20margin-left:%208px;%20%20%20gap:%203px;%20%20%20line-height:%201;%20%7D%20.nav-badge%20.orderable%20%7B%20%20%20color:%20%23fff;%20%20%20font-weight:%20800;%20%7D%20.nav-badge%20.separator%20%7B%20%20%20opacity:%200.6;%20%20%20font-weight:%20400;%20%7D%20.nav-badge%20.total%20%7B%20%20%20opacity:%200.8;%20%20%20font-weight:%20400;%20%7D%20.nav-btn.active%20.nav-badge%20%7B%20%20%20background:%20rgba(255,%20255,%20255,%200.3);%20%7D%20/%2A%20Primary%20style%20for%20Login%20Button%20to%20match%20header%20%2A/%20%23btn-login-open%20%7B%20%20%20background-color:%20var(--accent-color);%20%20%20color:%20white;%20%20%20padding:%200.5rem%201.25rem;%20%20%20border-radius:%208px;%20%20%20font-weight:%20600;%20%20%20letter-spacing:%200.025em;%20%20%20box-shadow:%200%202px%204px%20rgba(0,%200,%200,%200.1);%20%7D%20%23btn-login-open:hover%20%7B%20%20%20background-color:%20%23334155;%20%20%20/%2A%20Slightly%20lighter%20than%20slate-900%20%2A/%20%20%20transform:%20translateY(-1px);%20%20%20box-shadow:%200%204px%206px%20rgba(0,%200,%200,%200.1);%20%7D%20/%2A%20User%20Badge%20Button%20(Login)%20%2A/%20.user-badge-btn%20%7B%20%20%20display:%20flex;%20%20%20align-items:%20center;%20%20%20gap:%208px;%20%20%20padding:%206px%2012px;%20%20%20background:%20var(--bg-card);%20%20%20border:%201px%20solid%20var(--border-color);%20%20%20border-radius:%2020px;%20%20%20font-size:%200.9rem;%20%20%20font-weight:%20500;%20%20%20color:%20var(--text-primary);%20%20%20cursor:%20pointer;%20%20%20transition:%20all%200.2s;%20%7D%20.user-badge-btn:hover%20%7B%20%20%20background:%20rgba(100,%20116,%20139,%200.1);%20%20%20border-color:%20var(--accent-color);%20%7D%20.user-badge-btn%20.material-icons-round%20%7B%20%20%20font-size:%201.25rem;%20%20%20color:%20var(--accent-color);%20%7D%20.icon-btn%20%7B%20%20%20background:%20none;%20%20%20border:%20none;%20%20%20color:%20var(--text-primary);%20%20%20cursor:%20pointer;%20%20%20padding:%200.5rem;%20%20%20border-radius:%2050%25;%20%20%20transition:%20background-color%200.2s;%20%20%20display:%20flex;%20%20%20align-items:%20center;%20%20%20justify-content:%20center;%20%7D%20.icon-btn:hover%20%7B%20%20%20background-color:%20rgba(100,%20116,%20139,%200.1);%20%7D%20/%2A%20Refresh%20button%20animation%20%2A/%20%23btn-refresh.refreshing%20.material-icons-round%20%7B%20%20%20animation:%20rotate%201s%20linear%20infinite;%20%7D%20%40keyframes%20rotate%20%7B%20%20%20from%20%7B%20%20%20%20%20transform:%20rotate(0deg);%20%20%20%7D%20%20%20to%20%7B%20%20%20%20%20transform:%20rotate(360deg);%20%20%20%7D%20%7D%20/%2A%20Progress%20Modal%20%2A/%20.progress-container%20%7B%20%20%20margin-bottom:%201.5rem;%20%7D%20.progress-bar%20%7B%20%20%20width:%20100%25;%20%20%20height:%208px;%20%20%20background-color:%20var(--border-color);%20%20%20border-radius:%204px;%20%20%20overflow:%20hidden;%20%20%20margin-bottom:%200.75rem;%20%7D%20.progress-fill%20%7B%20%20%20height:%20100%25;%20%20%20background:%20linear-gradient(90deg,%20var(--accent-color)%200%25,%20%2360a5fa%20100%25);%20%20%20width:%200%25;%20%20%20transition:%20width%200.3s%20ease;%20%20%20border-radius:%204px;%20%7D%20.progress-percent%20%7B%20%20%20text-align:%20center;%20%20%20font-size:%201.5rem;%20%20%20font-weight:%20700;%20%20%20color:%20var(--text-primary);%20%20%20margin-bottom:%200.5rem;%20%7D%20.progress-message%20%7B%20%20%20text-align:%20center;%20%20%20color:%20var(--text-secondary);%20%20%20font-size:%200.9rem;%20%20%20font-weight:%20500;%20%7D%20.weekly-cost%20%7B%20%20%20background-color:%20rgba(59,%20130,%20246,%200.1);%20%20%20/%2A%20Blue%20tint%20%2A/%20%20%20color:%20var(--accent-color);%20%20%20padding:%200.4rem%200.8rem;%20%20%20border-radius:%208px;%20%20%20font-weight:%20600;%20%20%20font-size:%200.9rem;%20%20%20display:%20flex;%20%20%20align-items:%20center;%20%20%20gap:%200.5rem;%20%20%20border:%201px%20solid%20rgba(59,%20130,%20246,%200.2);%20%7D%20.weekly-cost%20.material-icons-round%20%7B%20%20%20font-size:%2018px;%20%7D%20/%2A%20Container%20%2A/%20.container%20%7B%20%20%20width:%20100%25;%20%20%20/%2A%20Full%20width%20%2A/%20%20%20margin:%202rem%20auto;%20%20%20padding:%200%202rem;%20%20%20min-height:%2080vh;%20%7D%20/%2A%20Banner%20%2A/%20.banner%20%7B%20%20%20background-color:%20var(--banner-bg);%20%20%20color:%20var(--banner-text);%20%20%20padding:%200.75rem%201rem;%20%20%20border-radius:%208px;%20%20%20display:%20flex;%20%20%20align-items:%20center;%20%20%20gap:%200.5rem;%20%20%20margin-bottom:%202rem;%20%20%20font-size:%200.875rem;%20%20%20font-weight:%20500;%20%20%20border:%201px%20solid%20var(--border-color);%20%20%20max-width:%20fit-content;%20%7D%20/%2A%20User%20Badge%20%2A/%20.user-badge%20%7B%20%20%20display:%20flex;%20%20%20align-items:%20center;%20%20%20gap:%208px;%20%20%20padding:%206px%2012px;%20%20%20background:%20var(--bg-card);%20%20%20/%2A%20Changed%20from%20--surface%20%2A/%20%20%20border:%201px%20solid%20var(--border-color);%20%20%20/%2A%20Changed%20from%20--border%20%2A/%20%20%20border-radius:%2020px;%20%20%20font-size:%200.9rem;%20%20%20font-weight:%20500;%20%7D%20.icon-btn-small%20%7B%20%20%20background:%20none;%20%20%20border:%20none;%20%20%20padding:%204px;%20%20%20cursor:%20pointer;%20%20%20color:%20var(--text-secondary);%20%20%20/%2A%20Changed%20from%20--text-muted%20%2A/%20%20%20display:%20flex;%20%20%20align-items:%20center;%20%20%20justify-content:%20center;%20%20%20border-radius:%2050%25;%20%20%20transition:%20all%200.2s;%20%7D%20.icon-btn-small:hover%20%7B%20%20%20color:%20var(--error-color);%20%20%20/%2A%20Changed%20from%20--danger%20%2A/%20%20%20background:%20rgba(239,%2068,%2068,%200.1);%20%7D%20/%2A%20Modal%20%2A/%20.modal%20%7B%20%20%20position:%20fixed;%20%20%20top:%200;%20%20%20left:%200;%20%20%20width:%20100%25;%20%20%20height:%20100%25;%20%20%20background:%20rgba(0,%200,%200,%200.5);%20%20%20backdrop-filter:%20blur(4px);%20%20%20display:%20flex;%20%20%20align-items:%20center;%20%20%20justify-content:%20center;%20%20%20z-index:%201000;%20%20%20transition:%20all%200.3s;%20%7D%20.modal.hidden%20%7B%20%20%20opacity:%200;%20%20%20pointer-events:%20none;%20%7D%20.modal-content%20%7B%20%20%20background:%20var(--bg-card);%20%20%20/%2A%20Changed%20from%20--surface%20%2A/%20%20%20width:%2090%25;%20%20%20max-width:%20400px;%20%20%20border-radius:%2016px;%20%20%20box-shadow:%200%2020px%2025px%20-5px%20rgba(0,%200,%200,%200.1),%200%2010px%2010px%20-5px%20rgba(0,%200,%200,%200.04);%20%20%20overflow:%20hidden;%20%20%20animation:%20modalSlide%200.3s%20ease-out;%20%7D%20%40keyframes%20modalSlide%20%7B%20%20%20from%20%7B%20%20%20%20%20transform:%20translateY(20px);%20%20%20%20%20opacity:%200;%20%20%20%7D%20%20%20to%20%7B%20%20%20%20%20transform:%20translateY(0);%20%20%20%20%20opacity:%201;%20%20%20%7D%20%7D%20.modal-header%20%7B%20%20%20display:%20flex;%20%20%20align-items:%20center;%20%20%20justify-content:%20space-between;%20%20%20padding:%2020px;%20%20%20border-bottom:%201px%20solid%20var(--border-color);%20%7D%20.modal-header%20h2%20%7B%20%20%20margin:%200;%20%20%20font-size:%201.25rem;%20%7D%20.modal-body%20%7B%20%20%20padding:%2020px;%20%7D%20%23login-form%20%7B%20%20%20padding:%2020px;%20%7D%20.form-group%20%7B%20%20%20margin-bottom:%2020px;%20%7D%20.form-group%20label%20%7B%20%20%20display:%20block;%20%20%20margin-bottom:%206px;%20%20%20font-weight:%20500;%20%20%20font-size:%200.9rem;%20%7D%20.form-group%20input%20%7B%20%20%20width:%20100%25;%20%20%20padding:%2010px%2012px;%20%20%20border:%201px%20solid%20var(--border-color);%20%20%20/%2A%20Changed%20from%20--border%20%2A/%20%20%20border-radius:%208px;%20%20%20background:%20var(--bg-body);%20%20%20/%2A%20Changed%20from%20--bg%20%2A/%20%20%20color:%20var(--text-primary);%20%20%20/%2A%20Changed%20from%20--text%20%2A/%20%20%20font-family:%20inherit;%20%20%20transition:%20border-color%200.2s;%20%7D%20.form-group%20input:focus%20%7B%20%20%20outline:%20none;%20%20%20border-color:%20var(--accent-color);%20%20%20/%2A%20Changed%20from%20--primary%20%2A/%20%7D%20.help-text%20%7B%20%20%20display:%20block;%20%20%20margin-top:%204px;%20%20%20color:%20var(--text-secondary);%20%20%20/%2A%20Changed%20from%20--text-muted%20%2A/%20%20%20font-size:%200.75rem;%20%7D%20.error-msg%20%7B%20%20%20margin-bottom:%2016px;%20%20%20padding:%2010px;%20%20%20background:%20rgba(239,%2068,%2068,%200.1);%20%20%20color:%20var(--error-color);%20%20%20/%2A%20Changed%20from%20--danger%20%2A/%20%20%20border-radius:%208px;%20%20%20font-size:%200.85rem;%20%20%20text-align:%20center;%20%7D%20.modal-actions%20%7B%20%20%20margin-top:%2024px;%20%7D%20.btn-primary.wide%20%7B%20%20%20width:%20100%25;%20%20%20justify-content:%20center;%20%7D%20.hidden%20%7B%20%20%20display:%20none%20!important;%20%7D%20/%2A%20Menu%20Grid%20%2A/%20.menu-grid%20%7B%20%20%20display:%20grid;%20%20%20gap:%202rem;%20%7D%20.week-section%20%7B%20%20%20margin-bottom:%203rem;%20%7D%20.week-header%20%7B%20%20%20margin-bottom:%201.5rem;%20%20%20border-bottom:%201px%20solid%20var(--border-color);%20%20%20padding-bottom:%201rem;%20%20%20text-align:%20center;%20%7D%20.week-title%20%7B%20%20%20font-size:%201.75rem;%20%20%20font-weight:%20700;%20%20%20color:%20var(--text-primary);%20%7D%20.week-range%20%7B%20%20%20color:%20var(--text-secondary);%20%20%20font-size:%200.9rem;%20%20%20margin-top:%200.25rem;%20%7D%20.days-grid%20%7B%20%20%20display:%20grid;%20%20%20grid-template-columns:%20repeat(auto-fit,%20minmax(180px,%201fr));%20%20%20gap:%200.75rem;%20%7D%20/%2A%20Card%20%2A/%20.menu-card%20%7B%20%20%20background-color:%20var(--bg-card);%20%20%20border-radius:%2012px;%20%20%20border:%201px%20solid%20var(--border-color);%20%20%20box-shadow:%20var(--card-shadow);%20%20%20overflow:%20hidden;%20%20%20transition:%20transform%200.2s%20ease,%20box-shadow%200.2s%20ease;%20%20%20display:%20flex;%20%20%20flex-direction:%20column;%20%7D%20/%2A%20Past%20Day%20Styling%20-%20Target%20specific%20elements%20so%20ordered%20items%20can%20remain%20visible%20%2A/%20.menu-card.past-day%20.card-header,%20.menu-card.past-day%20.menu-item:not(.ordered)%20%7B%20%20%20opacity:%200.6;%20%20%20filter:%20grayscale(0.8);%20%20%20transition:%20opacity%200.3s,%20filter%200.3s;%20%7D%20.menu-card.past-day:hover%20.card-header,%20.menu-card.past-day:hover%20.menu-item:not(.ordered)%20%7B%20%20%20opacity:%200.8;%20%20%20filter:%20grayscale(0.4);%20%7D%20/%2A%20Enhancements%20for%20ordered%20items%20%2A/%20.menu-card.past-day%20.menu-item.ordered%20%7B%20%20%20/%2A%20No%20opacity/filter%20here%20-%20fully%20visible%20%2A/%20%20%20background:%20var(--bg-card);%20%20%20box-shadow:%200%204px%2012px%20rgba(0,%200,%200,%200.15);%20%20%20border:%201px%20solid%20var(--accent-color);%20%20%20border-radius:%208px;%20%20%20padding:%201rem;%20%20%20margin:%200%20-1rem%201.5rem%20-1rem;%20%20%20position:%20relative;%20%20%20z-index:%2010;%20%7D%20.menu-item.today-ordered%20%7B%20%20%20border:%202px%20solid%20var(--accent-color);%20%20%20box-shadow:%200%200%2020px%20rgba(96,%20165,%20250,%200.4);%20%20%20border-radius:%208px;%20%20%20padding:%201rem;%20%20%20margin:%200%20-1rem%201.5rem%20-1rem;%20%20%20background:%20var(--bg-card);%20%20%20position:%20relative;%20%20%20z-index:%205;%20%20%20animation:%20pulse-glow%203s%20infinite;%20%7D%20%40keyframes%20pulse-glow%20%7B%20%20%200%25%20%7B%20%20%20%20%20box-shadow:%200%200%2015px%20rgba(96,%20165,%20250,%200.3);%20%20%20%7D%20%20%2050%25%20%7B%20%20%20%20%20box-shadow:%200%200%2025px%20rgba(96,%20165,%20250,%200.6);%20%20%20%7D%20%20%20100%25%20%7B%20%20%20%20%20box-shadow:%200%200%2015px%20rgba(96,%20165,%20250,%200.3);%20%20%20%7D%20%7D%20%20.menu-card:hover%20%7B%20%20%20transform:%20translateY(-2px);%20%20%20box-shadow:%200%2020px%2025px%20-5px%20rgb(0%200%200%20/%200.1),%200%208px%2010px%20-6px%20rgb(0%200%200%20/%200.1);%20%7D%20.card-header%20%7B%20%20%20padding:%201rem%201.25rem;%20%20%20border-bottom:%201px%20solid%20var(--border-color);%20%20%20display:%20flex;%20%20%20justify-content:%20space-between;%20%20%20align-items:%20baseline;%20%20%20background-color:%20rgba(100,%20116,%20139,%200.05);%20%7D%20.day-name%20%7B%20%20%20font-size:%201.125rem;%20%20%20font-weight:%20600;%20%7D%20.day-date%20%7B%20%20%20font-size:%200.875rem;%20%20%20color:%20var(--text-secondary);%20%7D%20.card-body%20%7B%20%20%20padding:%201.25rem;%20%20%20display:%20grid;%20%20%20grid-template-rows:%20auto;%20%20%20/%2A%20Each%20menu%20item%20gets%20its%20own%20row%20%2A/%20%20%20align-content:%20start;%20%7D%20.empty-state%20%7B%20%20%20color:%20var(--text-secondary);%20%20%20font-style:%20italic;%20%20%20text-align:%20center;%20%20%20padding:%201rem;%20%7D%20/%2A%20Menu%20Items%20%2A/%20.menu-item%20%7B%20%20%20margin-bottom:%201.5rem;%20%20%20padding-bottom:%201.5rem;%20%20%20border-bottom:%201px%20solid%20var(--border-color);%20%7D%20.menu-item:last-child%20%7B%20%20%20margin-bottom:%200;%20%20%20padding-bottom:%200;%20%20%20border-bottom:%20none;%20%7D%20.item-header%20%7B%20%20%20display:%20flex;%20%20%20justify-content:%20space-between;%20%20%20align-items:%20flex-start;%20%20%20margin-bottom:%200.5rem;%20%20%20gap:%201rem;%20%7D%20.item-name%20%7B%20%20%20font-weight:%20600;%20%20%20color:%20var(--text-primary);%20%20%20font-size:%201rem;%20%7D%20.item-price%20%7B%20%20%20font-weight:%20700;%20%20%20color:%20var(--accent-color);%20%20%20white-space:%20nowrap;%20%7D%20.item-desc%20%7B%20%20%20font-size:%200.875rem;%20%20%20color:%20var(--text-secondary);%20%20%20line-height:%201.6;%20%20%20margin-bottom:%200.75rem;%20%7D%20.badges%20%7B%20%20%20display:%20flex;%20%20%20gap:%200.5rem;%20%20%20margin-left:%20auto;%20%7D%20.item-status-row%20%7B%20%20%20display:%20flex;%20%20%20align-items:%20center;%20%20%20gap:%200.5rem;%20%20%20margin-bottom:%200.75rem;%20%7D%20.badge%20%7B%20%20%20display:%20inline-flex;%20%20%20align-items:%20center;%20%20%20justify-content:%20center;%20%20%20height:%2024px;%20%20%20font-size:%200.75rem;%20%20%20padding:%200%2010px;%20%20%20border-radius:%204px;%20%20%20font-weight:%20600;%20%20%20text-transform:%20uppercase;%20%20%20letter-spacing:%200.05em;%20%20%20line-height:%20normal;%20%20%20white-space:%20nowrap;%20%7D%20.badge.available%20%7B%20%20%20background-color:%20rgba(16,%20185,%20129,%200.1);%20%20%20/%2A%20Emerald%20500%20/%2010%25%20%2A/%20%20%20color:%20var(--success-color);%20%20%20border:%201px%20solid%20rgba(16,%20185,%20129,%200.2);%20%7D%20.badge.sold-out%20%7B%20%20%20background-color:%20rgba(239,%2068,%2068,%200.1);%20%20%20/%2A%20Red%20500%20/%2010%25%20%2A/%20%20%20color:%20var(--error-color);%20%20%20border:%201px%20solid%20rgba(239,%2068,%2068,%200.2);%20%7D%20.badge.ordered%20%7B%20%20%20background-color:%20rgba(139,%2092,%20246,%200.1);%20%20%20/%2A%20Violet%20500%20/%2010%25%20%2A/%20%20%20color:%20%238b5cf6;%20%20%20border:%201px%20solid%20rgba(139,%2092,%20246,%200.2);%20%20%20gap:%204px;%20%7D%20.badge.ordered%20.material-icons-round%20%7B%20%20%20font-size:%201rem;%20%7D%20/%2A%20Loading%20%2A/%20.loading-state%20%7B%20%20%20text-align:%20center;%20%20%20padding:%204rem;%20%20%20color:%20var(--text-secondary);%20%7D%20.spinner%20%7B%20%20%20width:%2040px;%20%20%20height:%2040px;%20%20%20border:%203px%20solid%20var(--border-color);%20%20%20border-top-color:%20var(--accent-color);%20%20%20border-radius:%2050%25;%20%20%20margin:%200%20auto%201rem;%20%20%20animation:%20spin%201s%20linear%20infinite;%20%7D%20%40keyframes%20spin%20%7B%20%20%20to%20%7B%20%20%20%20%20transform:%20rotate(360deg);%20%20%20%7D%20%7D%20/%2A%20Footer%20%2A/%20.app-footer%20%7B%20%20%20text-align:%20center;%20%20%20padding:%202rem;%20%20%20color:%20var(--text-secondary);%20%20%20font-size:%200.875rem;%20%20%20border-top:%201px%20solid%20var(--border-color);%20%20%20margin-top:%20auto;%20%7D%20/%2A%20===%20Order%20/%20Cancel%20Buttons%20(inline%20in%20status%20row)%20===%20%2A/%20.btn-order%20%7B%20%20%20display:%20inline-flex;%20%20%20align-items:%20center;%20%20%20gap:%204px;%20%20%20padding:%204px%2010px;%20%20%20border:%20none;%20%20%20border-radius:%206px;%20%20%20background:%20var(--success-color);%20%20%20color:%20white;%20%20%20font-size:%200.75rem;%20%20%20font-weight:%20600;%20%20%20cursor:%20pointer;%20%20%20transition:%20all%200.2s%20ease;%20%20%20font-family:%20inherit;%20%7D%20.btn-order%20.material-icons-round%20%7B%20%20%20font-size:%2016px;%20%7D%20.btn-order:hover:not(:disabled)%20%7B%20%20%20filter:%20brightness(1.15);%20%20%20transform:%20translateY(-1px);%20%7D%20.btn-order:disabled%20%7B%20%20%20opacity:%200.5;%20%20%20cursor:%20not-allowed;%20%7D%20.btn-order.loading%20%7B%20%20%20pointer-events:%20none;%20%20%20opacity:%200.6;%20%7D%20.btn-order-compact%20%7B%20%20%20padding:%202px%204px;%20%20%20gap:%200;%20%7D%20.btn-order-compact%20.material-icons-round%20%7B%20%20%20font-size:%2016px;%20%7D%20.btn-cancel%20%7B%20%20%20display:%20inline-flex;%20%20%20align-items:%20center;%20%20%20justify-content:%20center;%20%20%20padding:%204px%206px;%20%20%20border:%20none;%20%20%20border-radius:%206px;%20%20%20background:%20var(--error-color);%20%20%20color:%20white;%20%20%20font-size:%200.75rem;%20%20%20cursor:%20pointer;%20%20%20transition:%20all%200.2s%20ease;%20%20%20font-family:%20inherit;%20%7D%20.btn-cancel%20.material-icons-round%20%7B%20%20%20font-size:%2016px;%20%7D%20.btn-cancel:hover:not(:disabled)%20%7B%20%20%20filter:%20brightness(1.15);%20%20%20transform:%20translateY(-1px);%20%7D%20.btn-cancel:disabled%20%7B%20%20%20opacity:%200.5;%20%20%20cursor:%20not-allowed;%20%7D%20/%2A%20Past%20days:%20hide%20action%20buttons%20%2A/%20.past-day%20.item-actions%20%7B%20%20%20display:%20none;%20%7D%20/%2A%20Order%20count%20badge%20(for%20multi-orders)%20%2A/%20.order-count-badge%20%7B%20%20%20display:%20inline-flex;%20%20%20align-items:%20center;%20%20%20justify-content:%20center;%20%20%20background:%20rgba(255,%20255,%20255,%200.3);%20%20%20color:%20white;%20%20%20font-size:%200.65rem;%20%20%20font-weight:%20700;%20%20%20min-width:%2016px;%20%20%20height:%2016px;%20%20%20padding:%200%204px;%20%20%20border-radius:%208px;%20%20%20margin-left:%204px;%20%20%20line-height:%201;%20%7D%20/%2A%20===%20Toast%20Notifications%20===%20%2A/%20%23toast-container%20%7B%20%20%20position:%20fixed;%20%20%20bottom:%2020px;%20%20%20right:%2020px;%20%20%20z-index:%2010000;%20%20%20display:%20flex;%20%20%20flex-direction:%20column;%20%20%20gap:%208px;%20%20%20pointer-events:%20none;%20%7D%20.toast%20%7B%20%20%20display:%20flex;%20%20%20align-items:%20center;%20%20%20gap:%208px;%20%20%20padding:%2010px%2016px;%20%20%20border-radius:%208px;%20%20%20font-size:%200.85rem;%20%20%20font-weight:%20500;%20%20%20font-family:%20%5C%27Inter%5C%27,%20sans-serif;%20%20%20color:%20white;%20%20%20backdrop-filter:%20blur(10px);%20%20%20box-shadow:%200%204px%2012px%20rgba(0,%200,%200,%200.3);%20%20%20pointer-events:%20auto;%20%20%20transform:%20translateX(120%25);%20%20%20opacity:%200;%20%20%20transition:%20transform%200.3s%20ease,%20opacity%200.3s%20ease;%20%7D%20.toast.show%20%7B%20%20%20transform:%20translateX(0);%20%20%20opacity:%201;%20%7D%20.toast%20.material-icons-round%20%7B%20%20%20font-size:%2018px;%20%7D%20.toast-success%20%7B%20%20%20background:%20rgba(5,%20150,%20105,%200.95);%20%7D%20.toast-error%20%7B%20%20%20background:%20rgba(220,%2038,%2038,%200.95);%20%7D%20.toast-info%20%7B%20%20%20background:%20rgba(59,%20130,%20246,%200.95);%20%7D%20/%2A%20===%20Mobile%20Responsiveness%20===%20%2A/%20%40media%20(max-width:%20600px)%20%7B%20%20%20.header-content%20%7B%20%20%20%20%20flex-direction:%20column;%20%20%20%20%20gap:%201rem;%20%20%20%20%20padding:%200.75rem;%20%20%20%7D%20%20%20.week-nav%20%7B%20%20%20%20%20width:%20100%25;%20%20%20%20%20justify-content:%20center;%20%20%20%7D%20%20%20.nav-pills%20%7B%20%20%20%20%20width:%20100%25;%20%20%20%20%20justify-content:%20space-between;%20%20%20%7D%20%20%20.nav-btn%20%7B%20%20%20%20%20flex:%201;%20%20%20%20%20justify-content:%20center;%20%20%20%20%20padding:%200.5rem;%20%20%20%20%20font-size:%200.85rem;%20%20%20%7D%20%20%20.days-grid%20%7B%20%20%20%20%20grid-template-columns:%201fr;%20%20%20%20%20/%2A%20Force%20single%20column%20%2A/%20%20%20%7D%20%20%20.main-content%20%7B%20%20%20%20%20padding:%201rem;%20%20%20%7D%20%20%20.week-title%20%7B%20%20%20%20%20font-size:%201.5rem;%20%20%20%7D%20%20%20/%2A%20Adjust%20toast%20position%20for%20mobile%20%2A/%20%20%20.toast-container%20%7B%20%20%20%20%20bottom:%201rem;%20%20%20%20%20right:%201rem;%20%20%20%20%20left:%201rem;%20%20%20%20%20/%2A%20Center%20on%20mobile%20%2A/%20%20%20%20%20width:%20auto;%20%20%20%7D%20%20%20.menu-card%20%7B%20%20%20%20%20margin-bottom:%201rem;%20%20%20%7D%20%7D%20/%2A%20===%20Flagging%20%26%20Notification%20Styles%20===%20%2A/%20.btn-flag%20%7B%20%20%20display:%20inline-flex;%20%20%20align-items:%20center;%20%20%20justify-content:%20center;%20%20%20background:%20transparent;%20%20%20border:%201px%20solid%20var(--text-secondary);%20%20%20color:%20var(--text-secondary);%20%20%20border-radius:%206px;%20%20%20padding:%204px;%20%20%20cursor:%20pointer;%20%20%20transition:%20all%200.2s;%20%20%20margin-right:%200.5rem;%20%20%20width:%2028px;%20%20%20height:%2028px;%20%7D%20.btn-flag:hover%20%7B%20%20%20background:%20rgba(234,%20179,%208,%200.1);%20%20%20/%2A%20Yellow-500%20/%2010%25%20%2A/%20%20%20color:%20%23eab308;%20%20%20border-color:%20%23eab308;%20%7D%20.btn-flag.active%20%7B%20%20%20background:%20rgba(234,%20179,%208,%200.1);%20%20%20color:%20%23eab308;%20%20%20border-color:%20%23eab308;%20%7D%20.btn-flag%20.material-icons-round%20%7B%20%20%20font-size:%201.1rem;%20%7D%20/%2A%20Flagged%20%26%20Sold%20Out%20(Yellow%20Glow)%20%2A/%20.menu-item.flagged-sold-out%20%7B%20%20%20border:%201px%20solid%20%23eab308;%20%20%20box-shadow:%200%200%2010px%20rgba(234,%20179,%208,%200.2);%20%20%20border-radius:%208px;%20%20%20padding:%201rem;%20%20%20margin:%200%20-1rem%201.5rem%20-1rem;%20%20%20background:%20var(--bg-card);%20%20%20position:%20relative;%20%20%20z-index:%205;%20%20%20animation:%20yellow-pulse%203s%20infinite;%20%7D%20%40keyframes%20yellow-pulse%20%7B%20%20%200%25%20%7B%20%20%20%20%20box-shadow:%200%200%208px%20rgba(234,%20179,%208,%200.2);%20%20%20%7D%20%20%2050%25%20%7B%20%20%20%20%20box-shadow:%200%200%2016px%20rgba(234,%20179,%208,%200.5);%20%20%20%7D%20%20%20100%25%20%7B%20%20%20%20%20box-shadow:%200%200%208px%20rgba(234,%20179,%208,%200.2);%20%20%20%7D%20%7D%20/%2A%20Flagged%20%26%20Available%20(Green%20Glow)%20%2A/%20.menu-item.flagged-available%20%7B%20%20%20border:%202px%20solid%20var(--success-color);%20%20%20box-shadow:%200%200%2015px%20rgba(16,%20185,%20129,%200.3);%20%20%20border-radius:%208px;%20%20%20padding:%201rem;%20%20%20margin:%200%20-1rem%201.5rem%20-1rem;%20%20%20background:%20var(--bg-card);%20%20%20position:%20relative;%20%20%20z-index:%205;%20%20%20animation:%20green-pulse%203s%20infinite;%20%7D%20%40keyframes%20green-pulse%20%7B%20%20%200%25%20%7B%20%20%20%20%20box-shadow:%200%200%2010px%20rgba(16,%20185,%20129,%200.3);%20%20%20%7D%20%20%2050%25%20%7B%20%20%20%20%20box-shadow:%200%200%2020px%20rgba(16,%20185,%20129,%200.6);%20%20%20%7D%20%20%20100%25%20%7B%20%20%20%20%20box-shadow:%200%200%2010px%20rgba(16,%20185,%20129,%200.3);%20%20%20%7D%20%7D%20/%2A%20Day%20Header%20Badges%20%2A/%20.day-header-left%20%7B%20%20%20display:%20flex;%20%20%20align-items:%20center;%20%20%20gap:%200.75rem;%20%7D%20.menu-code-badge%20%7B%20%20%20font-size:%200.75rem;%20%20%20font-weight:%20700;%20%20%20color:%20%238b5cf6;%20%20%20/%2A%20Violet%20500%20%2A/%20%20%20background-color:%20rgba(139,%2092,%20246,%200.15);%20%20%20border:%201px%20solid%20rgba(139,%2092,%20246,%200.3);%20%20%20padding:%202px%206px;%20%20%20border-radius:%206px;%20%20%20line-height:%20normal;%20%20%20display:%20inline-block;%20%7D%20/%2A%20Detailed%20Badge%20Colors%20%2A/%20.nav-badge.badge-violet%20%7B%20%20%20background-color:%20%238b5cf6;%20%7D%20.nav-badge.badge-green%20%7B%20%20%20background-color:%20var(--success-color);%20%7D%20.nav-badge.badge-red%20%7B%20%20%20background-color:%20var(--error-color);%20%7D%20.nav-badge.badge-blue%20%7B%20%20%20background-color:%20var(--accent-color);%20%7D%20/%2A%20Day%20Header%20Status%20Colors%20(User%20Request)%20%2A/%20.card-header.header-violet%20%7B%20%20%20background-color:%20rgba(139,%2092,%20246,%200.15);%20%20%20border-bottom:%202px%20solid%20%238b5cf6;%20%7D%20.card-header.header-green%20%7B%20%20%20background-color:%20rgba(16,%20185,%20129,%200.15);%20%20%20border-bottom:%202px%20solid%20var(--success-color);%20%7D%20.card-header.header-red%20%7B%20%20%20background-color:%20rgba(239,%2068,%2068,%200.15);%20%20%20border-bottom:%202px%20solid%20var(--error-color);%20%7D%20.card-header.header-violet%20.day-name,%20.card-header.header-green%20.day-name,%20.card-header.header-red%20.day-name%20%7B%20%20%20font-weight:%20700;%20%20%20color:%20var(--text-primary);%20%20%20/%2A%20Ensure%20text%20remains%20standard%20color%20%2A/%20%7D%20/%2A%20Update%20Icon%20%2A/%20.update-icon%20%7B%20%20%20display:%20inline-flex;%20%20%20align-items:%20center;%20%20%20justify-content:%20center;%20%20%20margin-left:%208px;%20%20%20background-color:%20rgba(16,%20185,%20129,%200.2);%20%20%20/%2A%20Green%20tint%20%2A/%20%20%20color:%20var(--success-color);%20%20%20border-radius:%2050%25;%20%20%20width:%2024px;%20%20%20height:%2024px;%20%20%20cursor:%20pointer;%20%20%20font-size:%2014px;%20%20%20transition:%20all%200.2s;%20%20%20text-decoration:%20none;%20%20%20animation:%20pulse%202s%20infinite;%20%7D%20.update-icon:hover%20%7B%20%20%20background-color:%20var(--success-color);%20%20%20color:%20white;%20%20%20transform:%20scale(1.1);%20%7D%20%40keyframes%20pulse%20%7B%20%20%200%25%20%7B%20%20%20%20%20box-shadow:%200%200%200%200%20rgba(16,%20185,%20129,%200.4);%20%20%20%7D%20%20%2070%25%20%7B%20%20%20%20%20box-shadow:%200%200%200%206px%20rgba(16,%20185,%20129,%200);%20%20%20%7D%20%20%20100%25%20%7B%20%20%20%20%20box-shadow:%200%200%200%200%20rgba(16,%20185,%20129,%200);%20%20%20%7D%20%7D%20/%2A%20Order%20Countdown%20%2A/%20%23order-countdown%20%7B%20%20%20background:%20rgba(255,%20255,%20255,%200.1);%20%20%20padding:%200.25rem%200.75rem;%20%20%20border-radius:%2099px;%20%20%20font-size:%200.85rem;%20%20%20display:%20flex;%20%20%20align-items:%20center;%20%20%20gap:%200.5rem;%20%20%20white-space:%20nowrap;%20%20%20border:%201px%20solid%20var(--border-color);%20%7D%20%23order-countdown%20span%20%7B%20%20%20opacity:%200.7;%20%20%20font-size:%200.75rem;%20%20%20text-transform:%20uppercase;%20%20%20letter-spacing:%200.5px;%20%7D%20%23order-countdown.urgent%20%7B%20%20%20background:%20rgba(239,%2068,%2068,%200.2);%20%20%20border-color:%20rgba(239,%2068,%2068,%200.5);%20%20%20color:%20%23ef4444;%20%20%20animation:%20pulse-red%202s%20infinite;%20%7D%20%40keyframes%20pulse-red%20%7B%20%20%200%25%20%7B%20%20%20%20%20box-shadow:%200%200%200%200%20rgba(239,%2068,%2068,%200.4);%20%20%20%7D%20%20%2070%25%20%7B%20%20%20%20%20box-shadow:%200%200%200%206px%20rgba(239,%2068,%2068,%200);%20%20%20%7D%20%20%20100%25%20%7B%20%20%20%20%20box-shadow:%200%200%200%200%20rgba(239,%2068,%2068,%200);%20%20%20%7D%20%7D%20/%2A%20Smart%20Highlights%20(Blue%20Glow%20-%20matches%20today-ordered/flagged%20pattern)%20%2A/%20.menu-item.highlight-glow%20%7B%20%20%20border:%202px%20solid%20rgba(59,%20130,%20246,%200.7);%20%20%20box-shadow:%200%200%2020px%20rgba(59,%20130,%20246,%200.4);%20%20%20border-radius:%208px;%20%20%20padding:%201rem;%20%20%20margin:%200%20-1rem%201.5rem%20-1rem;%20%20%20background:%20var(--bg-card);%20%20%20position:%20relative;%20%20%20z-index:%205;%20%20%20animation:%20blue-pulse%203s%20infinite;%20%7D%20%40keyframes%20blue-pulse%20%7B%20%20%200%25%20%7B%20%20%20%20%20box-shadow:%200%200%2015px%20rgba(59,%20130,%20246,%200.3);%20%20%20%7D%20%20%2050%25%20%7B%20%20%20%20%20box-shadow:%200%200%2025px%20rgba(59,%20130,%20246,%200.6);%20%20%20%7D%20%20%20100%25%20%7B%20%20%20%20%20box-shadow:%200%200%2015px%20rgba(59,%20130,%20246,%200.3);%20%20%20%7D%20%7D%20/%2A%20Nav%20Badge%20with%20Count%20%2A/%20.nav-badge.has-highlights%20%7B%20%20%20background-color:%20var(--bg-card);%20%20%20/%2A%20Neutral%20background%20%2A/%20%20%20color:%20var(--text-primary);%20%20%20border:%201px%20solid%20var(--border-color);%20%20%20padding:%202px%206px;%20%7D%20.nav-badge%20.highlight-count%20%7B%20%20%20color:%20%233b82f6;%20%20%20/%2A%20Blue%20500%20%2A/%20%20%20font-weight:%20700;%20%20%20margin-left:%204px;%20%7D%20/%2A%20Tag%20Management%20Modal%20%2A/%20%23tags-list%20%7B%20%20%20display:%20flex;%20%20%20flex-wrap:%20wrap;%20%20%20gap:%200.5rem;%20%20%20margin-top:%201rem;%20%20%20min-height:%2050px;%20%7D%20/%2A%20Tag%20badges%20styled%20consistently%20with%20.badge%20(verf%C3%BCgbar/ausverkauft)%20%2A/%20.tag-badge%20%7B%20%20%20display:%20inline-flex;%20%20%20align-items:%20center;%20%20%20justify-content:%20center;%20%20%20height:%2024px;%20%20%20font-size:%200.75rem;%20%20%20padding:%200%2010px;%20%20%20border-radius:%204px;%20%20%20font-weight:%20600;%20%20%20text-transform:%20uppercase;%20%20%20letter-spacing:%200.05em;%20%20%20line-height:%20normal;%20%20%20white-space:%20nowrap;%20%20%20background-color:%20rgba(59,%20130,%20246,%200.1);%20%20%20color:%20%233b82f6;%20%20%20border:%201px%20solid%20rgba(59,%20130,%20246,%200.2);%20%20%20gap:%204px;%20%7D%20.tag-remove%20%7B%20%20%20cursor:%20pointer;%20%20%20opacity:%200.7;%20%20%20font-size:%201.1em;%20%20%20line-height:%201;%20%20%20transition:%20all%200.2s;%20%7D%20.tag-remove:hover%20%7B%20%20%20opacity:%201;%20%20%20color:%20%23ef4444;%20%7D%20.input-group%20%7B%20%20%20display:%20flex;%20%20%20gap:%200.5rem;%20%7D%20.input-group%20input%20%7B%20%20%20flex:%201;%20%20%20padding:%200.75rem;%20%20%20background:%20var(--bg-body);%20%20%20border:%201px%20solid%20var(--border-color);%20%20%20color:%20var(--text-primary);%20%20%20border-radius:%208px;%20%20%20font-family:%20inherit;%20%7D%20/%2A%20Add%20tag%20button%20-%20styled%20like%20.btn-order%20with%20nav-btn.active%20color%20%2A/%20%23btn-add-tag%20%7B%20%20%20display:%20inline-flex;%20%20%20align-items:%20center;%20%20%20gap:%204px;%20%20%20padding:%200.5rem%201rem;%20%20%20border:%20none;%20%20%20border-radius:%206px;%20%20%20background:%20var(--accent-color);%20%20%20color:%20white;%20%20%20font-size:%200.8rem;%20%20%20font-weight:%20600;%20%20%20cursor:%20pointer;%20%20%20transition:%20all%200.2s%20ease;%20%20%20font-family:%20inherit;%20%20%20white-space:%20nowrap;%20%7D%20%23btn-add-tag:hover%20%7B%20%20%20filter:%20brightness(1.15);%20%20%20transform:%20translateY(-1px);%20%7D%20/%2A%20Update%20Banner%20Enhanced%20%2A/%20.change-summary%20%7B%20%20%20font-size:%200.8rem;%20%20%20background:%20rgba(0,%200,%200,%200.1);%20%20%20padding:%200.5rem;%20%20%20border-radius:%204px;%20%20%20margin:%200.5rem%200;%20%20%20white-space:%20pre-wrap;%20%20%20font-family:%20inherit;%20%20%20line-height:%201.4;%20%20%20max-height:%20100px;%20%20%20overflow-y:%20auto;%20%7D%20.update-content%20%7B%20%20%20display:%20flex;%20%20%20flex-direction:%20column;%20%20%20gap:%204px;%20%20%20flex:%201;%20%7D%20/%2A%20Installer%20Changelog%20%2A/%20.changelog-container%20ul%20%7B%20%20%20padding-left:%201.5rem;%20%20%20margin:%200.5rem%200;%20%7D%20.changelog-container%20li%20%7B%20%20%20margin-bottom:%200.4rem;%20%20%20line-height:%201.5;%20%7D%20.changelog-container%20h3%20%7B%20%20%20margin-top:%201.5rem;%20%20%20margin-bottom:%200.5rem;%20%20%20font-size:%201.1em;%20%20%20color:%20var(--accent-color);%20%7D%27;document.head.appendChild(s);/%2A%2A%0A%20%2A%20Kantine%20Wrapper%20%E2%80%93%20Client-Only%20Bookmarklet%0A%20%2A%20Replaces%20Bessa%20page%20content%20with%20enhanced%20weekly%20menu%20view.%0A%20%2A%20All%20API%20calls%20go%20directly%20to%20api.bessa.app%20(same%20origin).%0A%20%2A%20Data%20stored%20in%20localStorage%20(flags,%20theme,%20auth).%0A%20%2A/%0A(function%20()%20%7B%0A%20%20%20%20%27use%20strict%27;%0A%0A%20%20%20%20//%20Prevent%20double%20injection%0A%20%20%20%20if%20(window.__KANTINE_LOADED)%20return;%0A%20%20%20%20window.__KANTINE_LOADED%20=%20true;%0A%0A%20%20%20%20//%20===%20Constants%20===%0A%20%20%20%20const%20API_BASE%20=%20%27https://api.bessa.app/v1%27;%0A%20%20%20%20const%20GUEST_TOKEN%20=%20%27c3418725e95a9f90e3645cbc846b4d67c7c66131%27;%0A%20%20%20%20const%20CLIENT_VERSION%20=%20%271.7.0_prod/2026-01-26%27;%0A%20%20%20%20const%20VENUE_ID%20=%20591;%0A%20%20%20%20const%20MENU_ID%20=%207;%0A%20%20%20%20const%20POLL_INTERVAL_MS%20=%205%20%2A%2060%20%2A%201000;%20//%205%20minutes%0A%0A%20%20%20%20//%20===%20State%20===%0A%20%20%20%20let%20allWeeks%20=%20%5B%5D;%0A%20%20%20%20let%20currentWeekNumber%20=%20getISOWeek(new%20Date());%0A%20%20%20%20let%20currentYear%20=%20new%20Date().getFullYear();%0A%20%20%20%20let%20displayMode%20=%20%27this-week%27;%0A%20%20%20%20let%20authToken%20=%20sessionStorage.getItem(%27kantine_authToken%27);%0A%20%20%20%20let%20currentUser%20=%20sessionStorage.getItem(%27kantine_currentUser%27);%0A%20%20%20%20let%20orderMap%20=%20new%20Map();%0A%20%20%20%20let%20userFlags%20=%20new%20Set(JSON.parse(localStorage.getItem(%27kantine_flags%27)%20%7C%7C%20%27%5B%5D%27));%0A%20%20%20%20let%20pollIntervalId%20=%20null;%0A%0A%20%20%20%20//%20===%20API%20Helpers%20===%0A%20%20%20%20function%20apiHeaders(token)%20%7B%0A%20%20%20%20%20%20%20%20return%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%27Authorization%27:%20%60Token%20%24%7Btoken%20%7C%7C%20GUEST_TOKEN%7D%60,%0A%20%20%20%20%20%20%20%20%20%20%20%20%27Accept%27:%20%27application/json%27,%0A%20%20%20%20%20%20%20%20%20%20%20%20%27Content-Type%27:%20%27application/json%27,%0A%20%20%20%20%20%20%20%20%20%20%20%20%27X-Client-Version%27:%20CLIENT_VERSION%0A%20%20%20%20%20%20%20%20%7D;%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Inject%20UI%20===%0A%20%20%20%20function%20injectUI()%20%7B%0A%20%20%20%20%20%20%20%20//%20Replace%20entire%20page%20content%0A%20%20%20%20%20%20%20%20document.title%20=%20%27Kantine%20Weekly%20Menu%27;%0A%0A%20%20%20%20%20%20%20%20//%20Inject%20Google%20Fonts%20if%20not%20already%20present%0A%20%20%20%20%20%20%20%20if%20(!document.querySelector(%27link%5Bhref%2A=%22fonts.googleapis.com/css2%3Ffamily=Inter%22%5D%27))%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20fontLink%20=%20document.createElement(%27link%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20fontLink.rel%20=%20%27stylesheet%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20fontLink.href%20=%20%27https://fonts.googleapis.com/css2%3Ffamily=Inter:wght%40300;400;500;600;700%26display=swap%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20document.head.appendChild(fontLink);%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20if%20(!document.querySelector(%27link%5Bhref%2A=%22Material+Icons+Round%22%5D%27))%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20iconLink%20=%20document.createElement(%27link%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20iconLink.rel%20=%20%27stylesheet%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20iconLink.href%20=%20%27https://fonts.googleapis.com/icon%3Ffamily=Material+Icons+Round%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20document.head.appendChild(iconLink);%0A%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20document.body.innerHTML%20=%20%60%0A%20%20%20%20%20%20%20%20%3Cdiv%20id=%22kantine-wrapper%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3Cheader%20class=%22app-header%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22header-content%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22brand%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cspan%20class=%22material-icons-round%20logo-icon%22%3Erestaurant_menu%3C/span%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22header-left%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Ch1%3EKantinen%20%C3%9Cbersicht%20%3Csmall%20style=%22font-size:%200.6em;%20opacity:%200.7;%20font-weight:%20400;%22%3Ev1.2.1%3C/small%3E%3C/h1%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20id=%22last-updated-subtitle%22%20class=%22subtitle%22%3E%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22header-center-wrapper%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20id=%22header-week-info%22%20class=%22header-week-info%22%3E%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20id=%22weekly-cost-display%22%20class=%22weekly-cost%20hidden%22%3E%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22controls%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cbutton%20id=%22btn-refresh%22%20class=%22icon-btn%22%20aria-label=%22Men%C3%BCdaten%20aktualisieren%22%20title=%22Men%C3%BCdaten%20neu%20laden%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cspan%20class=%22material-icons-round%22%3Erefresh%3C/span%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/button%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cbutton%20id=%22btn-highlights%22%20class=%22icon-btn%22%20aria-label=%22Pers%C3%B6nliche%20Highlights%20verwalten%22%20title=%22Pers%C3%B6nliche%20Highlights%20verwalten%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cspan%20class=%22material-icons-round%22%3Elabel%3C/span%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/button%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22nav-group%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cbutton%20id=%22btn-this-week%22%20class=%22nav-btn%20active%22%3EDiese%20Woche%3C/button%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cbutton%20id=%22btn-next-week%22%20class=%22nav-btn%22%3EN%C3%A4chste%20Woche%3C/button%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cbutton%20id=%22theme-toggle%22%20class=%22icon-btn%22%20aria-label=%22Toggle%20Theme%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cspan%20class=%22material-icons-round%20theme-icon%22%3Elight_mode%3C/span%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/button%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cbutton%20id=%22btn-login-open%22%20class=%22user-badge-btn%20icon-btn-small%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cspan%20class=%22material-icons-round%22%3Elogin%3C/span%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cspan%3EAnmelden%3C/span%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/button%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20id=%22user-info%22%20class=%22user-badge%20hidden%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cspan%20class=%22material-icons-round%22%3Eperson%3C/span%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cspan%20id=%22user-id-display%22%3E%3C/span%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cbutton%20id=%22btn-logout%22%20class=%22icon-btn-small%22%20aria-label=%22Logout%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cspan%20class=%22material-icons-round%22%3Elogout%3C/span%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/button%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3C/header%3E%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20id=%22login-modal%22%20class=%22modal%20hidden%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22modal-content%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22modal-header%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Ch2%3ELogin%3C/h2%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cbutton%20id=%22btn-login-close%22%20class=%22icon-btn%22%20aria-label=%22Close%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cspan%20class=%22material-icons-round%22%3Eclose%3C/span%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/button%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cform%20id=%22login-form%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22form-group%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Clabel%20for=%22employee-id%22%3EMitarbeiternummer%3C/label%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cinput%20type=%22text%22%20id=%22employee-id%22%20name=%22employee-id%22%20placeholder=%22z.B.%202041%22%20required%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Csmall%20class=%22help-text%22%3EDeine%20offizielle%20Knapp%20Mitarbeiternummer.%3C/small%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22form-group%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Clabel%20for=%22password%22%3EPasswort%3C/label%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cinput%20type=%22password%22%20id=%22password%22%20name=%22password%22%20placeholder=%22Bessa%20Passwort%22%20required%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Csmall%20class=%22help-text%22%3EDas%20Passwort%20f%C3%BCr%20deinen%20Bessa%20Account.%3C/small%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20id=%22login-error%22%20class=%22error-msg%20hidden%22%3E%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22modal-actions%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cbutton%20type=%22submit%22%20class=%22btn-primary%20wide%22%3EEinloggen%3C/button%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/form%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20id=%22progress-modal%22%20class=%22modal%20hidden%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22modal-content%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22modal-header%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Ch2%3EMen%C3%BCdaten%20aktualisieren%3C/h2%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22modal-body%22%20style=%22padding:%2020px;%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22progress-container%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22progress-bar%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20id=%22progress-fill%22%20class=%22progress-fill%22%3E%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20id=%22progress-percent%22%20class=%22progress-percent%22%3E0%25%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cp%20id=%22progress-message%22%20class=%22progress-message%22%3EInitialisierung...%3C/p%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20id=%22highlights-modal%22%20class=%22modal%20hidden%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22modal-content%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22modal-header%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Ch2%3EMeine%20Highlights%3C/h2%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cbutton%20id=%22btn-highlights-close%22%20class=%22icon-btn%22%20aria-label=%22Close%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cspan%20class=%22material-icons-round%22%3Eclose%3C/span%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/button%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22modal-body%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cp%20style=%22margin-bottom:%201rem;%20color:%20var(--text-secondary);%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20Markiere%20Men%C3%BCs%20automatisch,%20wenn%20sie%20diese%20Schlagw%C3%B6rter%20enthalten.%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/p%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22input-group%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cinput%20type=%22text%22%20id=%22tag-input%22%20placeholder=%22z.B.%20Schnitzel,%20Vegetarisch...%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cbutton%20id=%22btn-add-tag%22%20class=%22btn-primary%22%3EHinzuf%C3%BCgen%3C/button%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20id=%22tags-list%22%3E%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%3Cmain%20class=%22container%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20id=%22last-updated-banner%22%20class=%22banner%20hidden%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cspan%20class=%22material-icons-round%22%3Eupdate%3C/span%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cspan%20id=%22last-updated-text%22%3EGerade%20aktualisiert%3C/span%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20id=%22loading%22%20class=%22loading-state%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22spinner%22%3E%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cp%3ELade%20Men%C3%BCdaten...%3C/p%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20id=%22menu-container%22%20class=%22menu-grid%22%3E%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3C/main%3E%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%3Cfooter%20class=%22app-footer%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cp%3EBessa%20Knapp-Kantine%20Wrapper%20%26bull;%20%3Cspan%20id=%22current-year%22%3E%24%7Bnew%20Date().getFullYear()%7D%3C/span%3E%3C/p%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3C/footer%3E%0A%20%20%20%20%20%20%20%20%3C/div%3E%60;%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Bind%20Events%20===%0A%20%20%20%20function%20bindEvents()%20%7B%0A%20%20%20%20%20%20%20%20const%20btnThisWeek%20=%20document.getElementById(%27btn-this-week%27);%0A%20%20%20%20%20%20%20%20const%20btnNextWeek%20=%20document.getElementById(%27btn-next-week%27);%0A%20%20%20%20%20%20%20%20const%20btnRefresh%20=%20document.getElementById(%27btn-refresh%27);%0A%20%20%20%20%20%20%20%20const%20themeToggle%20=%20document.getElementById(%27theme-toggle%27);%0A%20%20%20%20%20%20%20%20const%20btnLoginOpen%20=%20document.getElementById(%27btn-login-open%27);%0A%20%20%20%20%20%20%20%20const%20btnLoginClose%20=%20document.getElementById(%27btn-login-close%27);%0A%20%20%20%20%20%20%20%20const%20btnLogout%20=%20document.getElementById(%27btn-logout%27);%0A%20%20%20%20%20%20%20%20const%20loginForm%20=%20document.getElementById(%27login-form%27);%0A%20%20%20%20%20%20%20%20const%20loginModal%20=%20document.getElementById(%27login-modal%27);%0A%0A%20%20%20%20%20%20%20%20//%20Highlights%20Modal%0A%20%20%20%20%20%20%20%20const%20btnHighlights%20=%20document.getElementById(%27btn-highlights%27);%0A%20%20%20%20%20%20%20%20const%20highlightsModal%20=%20document.getElementById(%27highlights-modal%27);%0A%20%20%20%20%20%20%20%20const%20btnHighlightsClose%20=%20document.getElementById(%27btn-highlights-close%27);%0A%20%20%20%20%20%20%20%20const%20btnAddTag%20=%20document.getElementById(%27btn-add-tag%27);%0A%20%20%20%20%20%20%20%20const%20tagInput%20=%20document.getElementById(%27tag-input%27);%0A%0A%20%20%20%20%20%20%20%20btnHighlights.addEventListener(%27click%27,%20()%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20highlightsModal.classList.remove(%27hidden%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20renderTagsList();%0A%20%20%20%20%20%20%20%20%20%20%20%20tagInput.focus();%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20btnHighlightsClose.addEventListener(%27click%27,%20()%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20highlightsModal.classList.add(%27hidden%27);%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20window.addEventListener(%27click%27,%20(e)%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(e.target%20===%20highlightsModal)%20highlightsModal.classList.add(%27hidden%27);%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20btnAddTag.addEventListener(%27click%27,%20()%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20tag%20=%20tagInput.value;%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(addHighlightTag(tag))%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20tagInput.value%20=%20%27%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20renderTagsList();%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20tagInput.addEventListener(%27keypress%27,%20(e)%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(e.key%20===%20%27Enter%27)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20btnAddTag.click();%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20//%20Theme%0A%20%20%20%20%20%20%20%20const%20savedTheme%20=%20localStorage.getItem(%27theme%27);%0A%20%20%20%20%20%20%20%20const%20prefersDark%20=%20window.matchMedia(%27(prefers-color-scheme:%20dark)%27).matches;%0A%20%20%20%20%20%20%20%20const%20themeIcon%20=%20themeToggle.querySelector(%27.theme-icon%27);%0A%0A%20%20%20%20%20%20%20%20if%20(savedTheme%20===%20%27dark%27%20%7C%7C%20(!savedTheme%20%26%26%20prefersDark))%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20document.documentElement.setAttribute(%27data-theme%27,%20%27dark%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20themeIcon.textContent%20=%20%27dark_mode%27;%0A%20%20%20%20%20%20%20%20%7D%20else%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20document.documentElement.setAttribute(%27data-theme%27,%20%27light%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20themeIcon.textContent%20=%20%27light_mode%27;%0A%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20themeToggle.addEventListener(%27click%27,%20()%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20current%20=%20document.documentElement.getAttribute(%27data-theme%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20next%20=%20current%20===%20%27dark%27%20%3F%20%27light%27%20:%20%27dark%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20document.documentElement.setAttribute(%27data-theme%27,%20next);%0A%20%20%20%20%20%20%20%20%20%20%20%20localStorage.setItem(%27theme%27,%20next);%0A%20%20%20%20%20%20%20%20%20%20%20%20themeIcon.textContent%20=%20next%20===%20%27dark%27%20%3F%20%27dark_mode%27%20:%20%27light_mode%27;%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20//%20Navigation%0A%20%20%20%20%20%20%20%20btnThisWeek.addEventListener(%27click%27,%20()%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(displayMode%20!==%20%27this-week%27)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20displayMode%20=%20%27this-week%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20btnThisWeek.classList.add(%27active%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20btnNextWeek.classList.remove(%27active%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20renderVisibleWeeks();%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20btnNextWeek.addEventListener(%27click%27,%20()%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(displayMode%20!==%20%27next-week%27)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20displayMode%20=%20%27next-week%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20btnNextWeek.classList.add(%27active%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20btnThisWeek.classList.remove(%27active%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20renderVisibleWeeks();%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20//%20Refresh%20%E2%80%93%20fetch%20fresh%20data%20from%20Bessa%20API%0A%20%20%20%20%20%20%20%20btnRefresh.addEventListener(%27click%27,%20()%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(!authToken)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20loginModal.classList.remove(%27hidden%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20return;%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20loadMenuDataFromAPI();%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20//%20Login%20Modal%0A%20%20%20%20%20%20%20%20btnLoginOpen.addEventListener(%27click%27,%20()%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20loginModal.classList.remove(%27hidden%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20document.getElementById(%27login-error%27).classList.add(%27hidden%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20loginForm.reset();%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20btnLoginClose.addEventListener(%27click%27,%20()%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20loginModal.classList.add(%27hidden%27);%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20window.addEventListener(%27click%27,%20(e)%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(e.target%20===%20loginModal)%20loginModal.classList.add(%27hidden%27);%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20//%20Login%20Form%20Submit%0A%20%20%20%20%20%20%20%20loginForm.addEventListener(%27submit%27,%20async%20(e)%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20e.preventDefault();%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20employeeId%20=%20document.getElementById(%27employee-id%27).value.trim();%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20password%20=%20document.getElementById(%27password%27).value;%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20loginError%20=%20document.getElementById(%27login-error%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20submitBtn%20=%20loginForm.querySelector(%27button%5Btype=%22submit%22%5D%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20originalText%20=%20submitBtn.textContent;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20submitBtn.disabled%20=%20true;%0A%20%20%20%20%20%20%20%20%20%20%20%20submitBtn.textContent%20=%20%27Wird%20eingeloggt...%27;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20try%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20email%20=%20%60knapp-%24%7BemployeeId%7D%40bessa.app%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20response%20=%20await%20fetch(%60%24%7BAPI_BASE%7D/auth/login/%60,%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20method:%20%27POST%27,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20headers:%20apiHeaders(GUEST_TOKEN),%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20body:%20JSON.stringify(%7B%20email,%20password%20%7D)%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20data%20=%20await%20response.json();%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(response.ok)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20authToken%20=%20data.key;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20currentUser%20=%20employeeId;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20sessionStorage.setItem(%27kantine_authToken%27,%20data.key);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20sessionStorage.setItem(%27kantine_currentUser%27,%20employeeId);%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20//%20Fetch%20user%20name%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20try%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20userResp%20=%20await%20fetch(%60%24%7BAPI_BASE%7D/auth/user/%60,%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20headers:%20apiHeaders(authToken)%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(userResp.ok)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20userData%20=%20await%20userResp.json();%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(userData.first_name)%20sessionStorage.setItem(%27kantine_firstName%27,%20userData.first_name);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(userData.last_name)%20sessionStorage.setItem(%27kantine_lastName%27,%20userData.last_name);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%20catch%20(err)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20console.error(%27Failed%20to%20fetch%20user%20info:%27,%20err);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20updateAuthUI();%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20loginModal.classList.add(%27hidden%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20fetchOrders();%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20loginForm.reset();%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20startPolling();%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20//%20Reload%20menu%20data%20with%20auth%20for%20full%20details%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20loadMenuDataFromAPI();%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%20else%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20loginError.textContent%20=%20data.non_field_errors%3F.%5B0%5D%20%7C%7C%20data.error%20%7C%7C%20%27Login%20fehlgeschlagen%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20loginError.classList.remove(%27hidden%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%20catch%20(error)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20console.error(%27Login%20error:%27,%20error);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20loginError.textContent%20=%20%27Ein%20Fehler%20ist%20aufgetreten%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20loginError.classList.remove(%27hidden%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%20finally%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20submitBtn.disabled%20=%20false;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20submitBtn.textContent%20=%20originalText;%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20//%20Logout%0A%20%20%20%20%20%20%20%20btnLogout.addEventListener(%27click%27,%20()%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20sessionStorage.removeItem(%27kantine_authToken%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20sessionStorage.removeItem(%27kantine_currentUser%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20sessionStorage.removeItem(%27kantine_firstName%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20sessionStorage.removeItem(%27kantine_lastName%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20authToken%20=%20null;%0A%20%20%20%20%20%20%20%20%20%20%20%20currentUser%20=%20null;%0A%20%20%20%20%20%20%20%20%20%20%20%20orderMap%20=%20new%20Map();%0A%20%20%20%20%20%20%20%20%20%20%20%20stopPolling();%0A%20%20%20%20%20%20%20%20%20%20%20%20updateAuthUI();%0A%20%20%20%20%20%20%20%20%20%20%20%20renderVisibleWeeks();%0A%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Auth%20UI%20===%0A%20%20%20%20function%20updateAuthUI()%20%7B%0A%20%20%20%20%20%20%20%20//%20Try%20to%20recover%20session%20from%20Bessa%27s%20storage%20if%20not%20already%20logged%20in%0A%20%20%20%20%20%20%20%20if%20(!authToken)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20try%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20akita%20=%20localStorage.getItem(%27AkitaStores%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(akita)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20parsed%20=%20JSON.parse(akita);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(parsed.auth%20%26%26%20parsed.auth.token)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20console.log(%27Found%20existing%20Bessa%20session!%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20authToken%20=%20parsed.auth.token;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20sessionStorage.setItem(%27kantine_authToken%27,%20authToken);%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(parsed.auth.user)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20currentUser%20=%20parsed.auth.user.id%20%7C%7C%20%27unknown%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20sessionStorage.setItem(%27kantine_currentUser%27,%20currentUser);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(parsed.auth.user.firstName)%20sessionStorage.setItem(%27kantine_firstName%27,%20parsed.auth.user.firstName);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(parsed.auth.user.lastName)%20sessionStorage.setItem(%27kantine_lastName%27,%20parsed.auth.user.lastName);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%20catch%20(e)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20console.warn(%27Failed%20to%20parse%20AkitaStores:%27,%20e);%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20authToken%20=%20sessionStorage.getItem(%27kantine_authToken%27);%0A%20%20%20%20%20%20%20%20currentUser%20=%20sessionStorage.getItem(%27kantine_currentUser%27);%0A%20%20%20%20%20%20%20%20const%20firstName%20=%20sessionStorage.getItem(%27kantine_firstName%27);%0A%20%20%20%20%20%20%20%20const%20btnLoginOpen%20=%20document.getElementById(%27btn-login-open%27);%0A%20%20%20%20%20%20%20%20const%20userInfo%20=%20document.getElementById(%27user-info%27);%0A%20%20%20%20%20%20%20%20const%20userIdDisplay%20=%20document.getElementById(%27user-id-display%27);%0A%0A%20%20%20%20%20%20%20%20if%20(authToken)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20btnLoginOpen.classList.add(%27hidden%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20userInfo.classList.remove(%27hidden%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20userIdDisplay.textContent%20=%20firstName%20%7C%7C%20(currentUser%20%3F%20%60User%20%24%7BcurrentUser%7D%60%20:%20%27Angemeldet%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20fetchOrders();%20//%20Always%20fetch%20fresh%20orders%20on%20auth%20update%0A%20%20%20%20%20%20%20%20%7D%20else%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20btnLoginOpen.classList.remove(%27hidden%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20userInfo.classList.add(%27hidden%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20userIdDisplay.textContent%20=%20%27%27;%0A%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20renderVisibleWeeks();%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Fetch%20Orders%20from%20Bessa%20===%0A%20%20%20%20async%20function%20fetchOrders()%20%7B%0A%20%20%20%20%20%20%20%20if%20(!authToken)%20return;%0A%20%20%20%20%20%20%20%20try%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Use%20user/orders%20endpoint%20for%20reliable%20history%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20response%20=%20await%20fetch(%60%24%7BAPI_BASE%7D/user/orders/%3Fvenue=%24%7BVENUE_ID%7D%26ordering=-created%26limit=50%60,%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20headers:%20apiHeaders(authToken)%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20data%20=%20await%20response.json();%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(response.ok)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20orderMap%20=%20new%20Map();%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20results%20=%20data.results%20%7C%7C%20%5B%5D;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20for%20(const%20order%20of%20results)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20//%20Filter%20out%20cancelled%20orders%20(State%209)%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20//%20Accepting%20State%201%20(Created%3F),%205%20(Placed%3F),%208%20(Completed)%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20//%20TODO:%20Verify%20exact%20states.%20Subagent%20saw%205=Active,%208=Completed,%209=Cancelled.%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(order.order_state%20===%209)%20continue;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20//%20Extract%20date%20properly%20(it%20comes%20as%20ISO%20string)%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20orderDate%20=%20order.date.split(%27T%27)%5B0%5D;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20for%20(const%20item%20of%20(order.items%20%7C%7C%20%5B%5D))%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20key%20=%20%60%24%7BorderDate%7D_%24%7Bitem.article%7D%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(!orderMap.has(key))%20orderMap.set(key,%20%5B%5D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20orderMap.get(key).push(order.id);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20console.log(%60Fetched%20%24%7Bresults.length%7D%20orders,%20mapped%20active%20ones.%60);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20renderVisibleWeeks();%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%7D%20catch%20(error)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20console.error(%27Error%20fetching%20orders:%27,%20error);%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Place%20Order%20===%0A%20%20%20%20async%20function%20placeOrder(date,%20articleId,%20name,%20price,%20description)%20%7B%0A%20%20%20%20%20%20%20%20if%20(!authToken)%20return;%0A%20%20%20%20%20%20%20%20try%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Get%20user%20data%20for%20customer%20object%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20userResp%20=%20await%20fetch(%60%24%7BAPI_BASE%7D/auth/user/%60,%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20headers:%20apiHeaders(authToken)%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(!userResp.ok)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20showToast(%27Fehler:%20Benutzerdaten%20konnten%20nicht%20geladen%20werden%27,%20%27error%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20return;%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20userData%20=%20await%20userResp.json();%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20now%20=%20new%20Date().toISOString();%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20orderPayload%20=%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20uuid:%20crypto.randomUUID(),%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20created:%20now,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20updated:%20now,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20order_type:%207,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20items:%20%5B%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20article:%20articleId,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20course_group:%20null,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20modifiers:%20%5B%5D,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20uuid:%20crypto.randomUUID(),%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20name:%20name,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20description:%20description%20%7C%7C%20%27%27,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20price:%20String(parseFloat(price)),%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20amount:%201,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20vat:%20%2710.00%27,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20comment:%20%27%27%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%5D,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20table:%20null,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20total:%20parseFloat(price),%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20tip:%200,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20currency:%20%27EUR%27,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20venue:%20VENUE_ID,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20states:%20%5B%5D,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20order_state:%201,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20date:%20%60%24%7Bdate%7DT10:00:00.000Z%60,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20payment_method:%20%27payroll%27,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20customer:%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20first_name:%20userData.first_name,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20last_name:%20userData.last_name,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20email:%20userData.email,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20newsletter:%20false%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20preorder:%20false,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20delivery_fee:%200,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20cash_box_table_name:%20null,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20take_away:%20false%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20response%20=%20await%20fetch(%60%24%7BAPI_BASE%7D/user/orders/%60,%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20method:%20%27POST%27,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20headers:%20apiHeaders(authToken),%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20body:%20JSON.stringify(orderPayload)%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(response.ok%20%7C%7C%20response.status%20===%20201)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20showToast(%60Bestellt:%20%24%7Bname%7D%60,%20%27success%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20await%20fetchOrders();%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%20else%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20data%20=%20await%20response.json();%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20showToast(%60Fehler:%20%24%7Bdata.detail%20%7C%7C%20data.non_field_errors%3F.%5B0%5D%20%7C%7C%20%27Bestellung%20fehlgeschlagen%27%7D%60,%20%27error%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%7D%20catch%20(error)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20console.error(%27Order%20error:%27,%20error);%0A%20%20%20%20%20%20%20%20%20%20%20%20showToast(%27Netzwerkfehler%20bei%20Bestellung%27,%20%27error%27);%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Cancel%20Order%20===%0A%20%20%20%20async%20function%20cancelOrder(date,%20articleId,%20name)%20%7B%0A%20%20%20%20%20%20%20%20if%20(!authToken)%20return;%0A%20%20%20%20%20%20%20%20const%20key%20=%20%60%24%7Bdate%7D_%24%7BarticleId%7D%60;%0A%20%20%20%20%20%20%20%20const%20orderIds%20=%20orderMap.get(key);%0A%20%20%20%20%20%20%20%20if%20(!orderIds%20%7C%7C%20orderIds.length%20===%200)%20return;%0A%0A%20%20%20%20%20%20%20%20//%20LIFO:%20cancel%20most%20recent%0A%20%20%20%20%20%20%20%20const%20orderId%20=%20orderIds%5BorderIds.length%20-%201%5D;%0A%20%20%20%20%20%20%20%20try%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20response%20=%20await%20fetch(%60%24%7BAPI_BASE%7D/user/orders/%24%7BorderId%7D/cancel/%60,%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20method:%20%27PATCH%27,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20headers:%20apiHeaders(authToken),%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20body:%20JSON.stringify(%7B%7D)%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(response.ok)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20showToast(%60Storniert:%20%24%7Bname%7D%60,%20%27success%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20await%20fetchOrders();%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%20else%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20data%20=%20await%20response.json();%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20showToast(%60Fehler:%20%24%7Bdata.detail%20%7C%7C%20%27Stornierung%20fehlgeschlagen%27%7D%60,%20%27error%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%7D%20catch%20(error)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20console.error(%27Cancel%20error:%27,%20error);%0A%20%20%20%20%20%20%20%20%20%20%20%20showToast(%27Netzwerkfehler%20bei%20Stornierung%27,%20%27error%27);%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Flag%20Management%20(localStorage)%20===%0A%20%20%20%20function%20saveFlags()%20%7B%0A%20%20%20%20%20%20%20%20localStorage.setItem(%27kantine_flags%27,%20JSON.stringify(%5B...userFlags%5D));%0A%20%20%20%20%7D%0A%0A%20%20%20%20function%20toggleFlag(date,%20articleId,%20name,%20cutoff)%20%7B%0A%20%20%20%20%20%20%20%20const%20id%20=%20%60%24%7Bdate%7D_%24%7BarticleId%7D%60;%0A%20%20%20%20%20%20%20%20if%20(userFlags.has(id))%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20userFlags.delete(id);%0A%20%20%20%20%20%20%20%20%20%20%20%20showToast(%60Flag%20entfernt%20f%C3%BCr%20%24%7Bname%7D%60,%20%27success%27);%0A%20%20%20%20%20%20%20%20%7D%20else%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20userFlags.add(id);%0A%20%20%20%20%20%20%20%20%20%20%20%20showToast(%60Benachrichtigung%20aktiviert%20f%C3%BCr%20%24%7Bname%7D%60,%20%27success%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(Notification.permission%20===%20%27default%27)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20Notification.requestPermission();%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20saveFlags();%0A%20%20%20%20%20%20%20%20renderVisibleWeeks();%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20FR-019:%20Auto-remove%20flags%20whose%20cutoff%20has%20passed%0A%20%20%20%20function%20cleanupExpiredFlags()%20%7B%0A%20%20%20%20%20%20%20%20const%20now%20=%20new%20Date();%0A%20%20%20%20%20%20%20%20let%20changed%20=%20false;%0A%20%20%20%20%20%20%20%20for%20(const%20flagId%20of%20%5B...userFlags%5D)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20%5Bdate%5D%20=%20flagId.split(%27_%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20cutoff%20=%20new%20Date(date);%0A%20%20%20%20%20%20%20%20%20%20%20%20cutoff.setHours(10,%200,%200,%200);%20//%20Standard%20cutoff%2010:00%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(now%20%3E=%20cutoff)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20userFlags.delete(flagId);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20changed%20=%20true;%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20if%20(changed)%20saveFlags();%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Polling%20(Client-Side)%20===%0A%20%20%20%20function%20startPolling()%20%7B%0A%20%20%20%20%20%20%20%20if%20(pollIntervalId)%20return;%0A%20%20%20%20%20%20%20%20if%20(!authToken)%20return;%0A%20%20%20%20%20%20%20%20pollIntervalId%20=%20setInterval(()%20=%3E%20pollFlaggedItems(),%20POLL_INTERVAL_MS);%0A%20%20%20%20%20%20%20%20console.log(%27Polling%20started%20(every%205%20min)%27);%0A%20%20%20%20%7D%0A%0A%20%20%20%20function%20stopPolling()%20%7B%0A%20%20%20%20%20%20%20%20if%20(pollIntervalId)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20clearInterval(pollIntervalId);%0A%20%20%20%20%20%20%20%20%20%20%20%20pollIntervalId%20=%20null;%0A%20%20%20%20%20%20%20%20%20%20%20%20console.log(%27Polling%20stopped%27);%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%0A%20%20%20%20async%20function%20pollFlaggedItems()%20%7B%0A%20%20%20%20%20%20%20%20if%20(userFlags.size%20===%200%20%7C%7C%20!authToken)%20return;%0A%20%20%20%20%20%20%20%20console.log(%60Polling%20%24%7BuserFlags.size%7D%20flagged%20items...%60);%0A%0A%20%20%20%20%20%20%20%20for%20(const%20flagId%20of%20userFlags)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20%5Bdate,%20articleIdStr%5D%20=%20flagId.split(%27_%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20articleId%20=%20parseInt(articleIdStr);%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20try%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20response%20=%20await%20fetch(%60%24%7BAPI_BASE%7D/venues/%24%7BVENUE_ID%7D/menu/%24%7BMENU_ID%7D/%24%7Bdate%7D/%60,%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20headers:%20apiHeaders(authToken)%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(!response.ok)%20continue;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20data%20=%20await%20response.json();%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20groups%20=%20data.results%20%7C%7C%20%5B%5D;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20let%20foundItem%20=%20null;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20for%20(const%20group%20of%20groups)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(group.items)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20foundItem%20=%20group.items.find(i%20=%3E%20i.id%20===%20articleId%20%7C%7C%20i.article%20===%20articleId);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(foundItem)%20break;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(foundItem)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20isAvailable%20=%20(foundItem.amount_tracking%20===%20false)%20%7C%7C%20(parseInt(foundItem.available_amount)%20%3E%200);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(isAvailable)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20itemName%20=%20foundItem.name%20%7C%7C%20%27Unbekannt%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20showToast(%60%24%7BitemName%7D%20ist%20jetzt%20verf%C3%BCgbar!%60,%20%27success%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(Notification.permission%20===%20%27granted%27)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20new%20Notification(%27Kantine%20Wrapper%27,%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20body:%20%60%24%7BitemName%7D%20ist%20jetzt%20verf%C3%BCgbar!%60,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20icon:%20%27%F0%9F%8D%BD%EF%B8%8F%27%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20//%20Refresh%20menu%20data%20to%20update%20UI%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20loadMenuDataFromAPI();%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%20catch%20(err)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20console.error(%60Poll%20error%20for%20%24%7BflagId%7D:%60,%20err);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20//%20Small%20delay%20between%20checks%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20await%20new%20Promise(r%20=%3E%20setTimeout(r,%20200));%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Highlight%20Management%20===%0A%20%20%20%20let%20highlightTags%20=%20JSON.parse(localStorage.getItem(%27kantine_highlightTags%27)%20%7C%7C%20%27%5B%5D%27);%0A%0A%20%20%20%20function%20saveHighlightTags()%20%7B%0A%20%20%20%20%20%20%20%20localStorage.setItem(%27kantine_highlightTags%27,%20JSON.stringify(highlightTags));%0A%20%20%20%20%20%20%20%20renderVisibleWeeks();%20//%20Refresh%20UI%20to%20apply%20changes%0A%20%20%20%20%20%20%20%20updateNextWeekBadge();%0A%20%20%20%20%7D%0A%0A%20%20%20%20function%20addHighlightTag(tag)%20%7B%0A%20%20%20%20%20%20%20%20tag%20=%20tag.trim().toLowerCase();%0A%20%20%20%20%20%20%20%20if%20(tag%20%26%26%20!highlightTags.includes(tag))%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20highlightTags.push(tag);%0A%20%20%20%20%20%20%20%20%20%20%20%20saveHighlightTags();%0A%20%20%20%20%20%20%20%20%20%20%20%20return%20true;%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20return%20false;%0A%20%20%20%20%7D%0A%0A%20%20%20%20function%20removeHighlightTag(tag)%20%7B%0A%20%20%20%20%20%20%20%20highlightTags%20=%20highlightTags.filter(t%20=%3E%20t%20!==%20tag);%0A%20%20%20%20%20%20%20%20saveHighlightTags();%0A%20%20%20%20%7D%0A%0A%20%20%20%20function%20renderTagsList()%20%7B%0A%20%20%20%20%20%20%20%20const%20list%20=%20document.getElementById(%27tags-list%27);%0A%20%20%20%20%20%20%20%20list.innerHTML%20=%20%27%27;%0A%20%20%20%20%20%20%20%20highlightTags.forEach(tag%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20badge%20=%20document.createElement(%27span%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20badge.className%20=%20%27tag-badge%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20badge.innerHTML%20=%20%60%24%7Btag%7D%20%3Cspan%20class=%22tag-remove%22%20data-tag=%22%24%7Btag%7D%22%3E%26times;%3C/span%3E%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20list.appendChild(badge);%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20//%20Bind%20remove%20events%0A%20%20%20%20%20%20%20%20list.querySelectorAll(%27.tag-remove%27).forEach(btn%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20btn.addEventListener(%27click%27,%20(e)%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20removeHighlightTag(e.target.dataset.tag);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20renderTagsList();%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%7D%0A%0A%20%20%20%20function%20checkHighlight(text)%20%7B%0A%20%20%20%20%20%20%20%20if%20(!text)%20return%20false;%0A%20%20%20%20%20%20%20%20text%20=%20text.toLowerCase();%0A%20%20%20%20%20%20%20%20return%20highlightTags.some(tag%20=%3E%20text.includes(tag));%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Local%20Menu%20Cache%20(localStorage)%20===%0A%20%20%20%20const%20CACHE_KEY%20=%20%27kantine_menuCache%27;%0A%20%20%20%20const%20CACHE_TS_KEY%20=%20%27kantine_menuCacheTs%27;%0A%0A%20%20%20%20function%20saveMenuCache()%20%7B%0A%20%20%20%20%20%20%20%20try%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20localStorage.setItem(CACHE_KEY,%20JSON.stringify(allWeeks));%0A%20%20%20%20%20%20%20%20%20%20%20%20localStorage.setItem(CACHE_TS_KEY,%20new%20Date().toISOString());%0A%20%20%20%20%20%20%20%20%7D%20catch%20(e)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20console.warn(%27Failed%20to%20cache%20menu%20data:%27,%20e);%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%0A%20%20%20%20function%20loadMenuCache()%20%7B%0A%20%20%20%20%20%20%20%20try%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20cached%20=%20localStorage.getItem(CACHE_KEY);%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20cachedTs%20=%20localStorage.getItem(CACHE_TS_KEY);%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(cached)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20allWeeks%20=%20JSON.parse(cached);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20currentWeekNumber%20=%20getISOWeek(new%20Date());%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20currentYear%20=%20new%20Date().getFullYear();%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20renderVisibleWeeks();%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20updateNextWeekBadge();%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(cachedTs)%20updateLastUpdatedTime(cachedTs);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20console.log(%27Loaded%20menu%20from%20cache%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20return%20true;%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%7D%20catch%20(e)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20console.warn(%27Failed%20to%20load%20cached%20menu:%27,%20e);%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20return%20false;%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Menu%20Data%20Fetching%20(Direct%20from%20Bessa%20API)%20===%0A%20%20%20%20async%20function%20loadMenuDataFromAPI()%20%7B%0A%20%20%20%20%20%20%20%20const%20loading%20=%20document.getElementById(%27loading%27);%0A%20%20%20%20%20%20%20%20const%20progressModal%20=%20document.getElementById(%27progress-modal%27);%0A%20%20%20%20%20%20%20%20const%20progressFill%20=%20document.getElementById(%27progress-fill%27);%0A%20%20%20%20%20%20%20%20const%20progressPercent%20=%20document.getElementById(%27progress-percent%27);%0A%20%20%20%20%20%20%20%20const%20progressMessage%20=%20document.getElementById(%27progress-message%27);%0A%0A%20%20%20%20%20%20%20%20loading.classList.remove(%27hidden%27);%0A%0A%20%20%20%20%20%20%20%20const%20token%20=%20authToken%20%7C%7C%20GUEST_TOKEN;%0A%0A%20%20%20%20%20%20%20%20try%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Show%20progress%20modal%0A%20%20%20%20%20%20%20%20%20%20%20%20progressModal.classList.remove(%27hidden%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20progressMessage.textContent%20=%20%27Hole%20verf%C3%BCgbare%20Daten...%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20progressFill.style.width%20=%20%270%25%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20progressPercent.textContent%20=%20%270%25%27;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20//%201.%20Fetch%20available%20dates%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20datesResponse%20=%20await%20fetch(%60%24%7BAPI_BASE%7D/venues/%24%7BVENUE_ID%7D/menu/dates/%60,%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20headers:%20apiHeaders(token)%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(!datesResponse.ok)%20throw%20new%20Error(%60Failed%20to%20fetch%20dates:%20%24%7BdatesResponse.status%7D%60);%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20datesData%20=%20await%20datesResponse.json();%0A%20%20%20%20%20%20%20%20%20%20%20%20let%20availableDates%20=%20datesData.results%20%7C%7C%20%5B%5D;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Filter%20%E2%80%93%20last%207%20days%20+%20future,%20limit%2030%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20cutoff%20=%20new%20Date();%0A%20%20%20%20%20%20%20%20%20%20%20%20cutoff.setDate(cutoff.getDate()%20-%207);%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20cutoffStr%20=%20cutoff.toISOString().split(%27T%27)%5B0%5D;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20availableDates%20=%20availableDates%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20.filter(d%20=%3E%20d.date%20%3E=%20cutoffStr)%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20.sort((a,%20b)%20=%3E%20a.date.localeCompare(b.date))%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20.slice(0,%2030);%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20totalDates%20=%20availableDates.length;%0A%20%20%20%20%20%20%20%20%20%20%20%20progressMessage.textContent%20=%20%60%24%7BtotalDates%7D%20Tage%20gefunden.%20Lade%20Details...%60;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20//%202.%20Fetch%20details%20for%20each%20date%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20allDays%20=%20%5B%5D;%0A%20%20%20%20%20%20%20%20%20%20%20%20let%20completed%20=%200;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20for%20(const%20dateObj%20of%20availableDates)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20dateStr%20=%20dateObj.date;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20pct%20=%20Math.round(((completed%20+%201)%20/%20totalDates)%20%2A%20100);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20progressFill.style.width%20=%20%60%24%7Bpct%7D%25%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20progressPercent.textContent%20=%20%60%24%7Bpct%7D%25%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20progressMessage.textContent%20=%20%60Lade%20Men%C3%BC%20f%C3%BCr%20%24%7BdateStr%7D...%60;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20try%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20detailResp%20=%20await%20fetch(%60%24%7BAPI_BASE%7D/venues/%24%7BVENUE_ID%7D/menu/%24%7BMENU_ID%7D/%24%7BdateStr%7D/%60,%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20headers:%20apiHeaders(token)%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(detailResp.ok)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20detailData%20=%20await%20detailResp.json();%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20//%20Debug:%20log%20raw%20API%20response%20for%20first%20date%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(completed%20===%200)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20console.log(%27%5BKantine%20Debug%5D%20Raw%20API%20response%20for%27,%20dateStr,%20%27:%27,%20JSON.stringify(detailData).substring(0,%202000));%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20menuGroups%20=%20detailData.results%20%7C%7C%20%5B%5D;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20let%20dayItems%20=%20%5B%5D;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20for%20(const%20group%20of%20menuGroups)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(group.items%20%26%26%20Array.isArray(group.items))%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20dayItems%20=%20dayItems.concat(group.items);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(dayItems.length%20%3E%200)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20//%20Debug:%20log%20first%20item%20structure%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(completed%20===%200)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20console.log(%27%5BKantine%20Debug%5D%20First%20item%20keys:%27,%20Object.keys(dayItems%5B0%5D));%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20console.log(%27%5BKantine%20Debug%5D%20First%20item:%27,%20JSON.stringify(dayItems%5B0%5D).substring(0,%20500));%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20allDays.push(%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20date:%20dateStr,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20menu_items:%20dayItems,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20orders:%20dateObj.orders%20%7C%7C%20%5B%5D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%20catch%20(err)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20console.error(%60Failed%20to%20fetch%20details%20for%20%24%7BdateStr%7D:%60,%20err);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20completed++;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20//%20Small%20delay%20to%20avoid%20rate%20limiting%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20await%20new%20Promise(r%20=%3E%20setTimeout(r,%20100));%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20//%203.%20Group%20by%20ISO%20week%20(Merge%20with%20existing%20to%20preserve%20past%20days)%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20weeksMap%20=%20new%20Map();%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Hydrate%20from%20existing%20cache%20(preserve%20past%20data)%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(allWeeks%20%26%26%20allWeeks.length%20%3E%200)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20allWeeks.forEach(w%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20key%20=%20%60%24%7Bw.year%7D-%24%7Bw.weekNumber%7D%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20try%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20weeksMap.set(key,%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20year:%20w.year,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20weekNumber:%20w.weekNumber,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20days:%20w.days%20%3F%20w.days.map(d%20=%3E%20(%7B%20...d,%20items:%20d.items%20%3F%20%5B...d.items%5D%20:%20%5B%5D%20%7D))%20:%20%5B%5D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%20catch%20(e)%20%7B%20console.warn(%27Error%20hydrating%20week:%27,%20e);%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20for%20(const%20day%20of%20allDays)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20d%20=%20new%20Date(day.date);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20weekNum%20=%20getISOWeek(d);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20year%20=%20getWeekYear(d);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20key%20=%20%60%24%7Byear%7D-%24%7BweekNum%7D%60;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(!weeksMap.has(key))%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20weeksMap.set(key,%20%7B%20year,%20weekNumber:%20weekNum,%20days:%20%5B%5D%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20weekObj%20=%20weeksMap.get(key);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20weekday%20=%20d.toLocaleDateString(%27en-US%27,%20%7B%20weekday:%20%27long%27%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20orderCutoffDate%20=%20new%20Date(day.date);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20orderCutoffDate.setHours(10,%200,%200,%200);%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20newDayObj%20=%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20date:%20day.date,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20weekday:%20weekday,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20orderCutoff:%20orderCutoffDate.toISOString(),%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20items:%20day.menu_items.map(item%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20isUnlimited%20=%20item.amount_tracking%20===%20false;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20hasStock%20=%20parseInt(item.available_amount)%20%3E%200;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20return%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20id:%20%60%24%7Bday.date%7D_%24%7Bitem.id%7D%60,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20articleId:%20item.id,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20name:%20item.name%20%7C%7C%20%27Unknown%27,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20description:%20item.description%20%7C%7C%20%27%27,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20price:%20parseFloat(item.price)%20%7C%7C%200,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20available:%20isUnlimited%20%7C%7C%20hasStock,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20availableAmount:%20parseInt(item.available_amount)%20%7C%7C%200,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20amountTracking:%20item.amount_tracking%20!==%20false%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D)%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20//%20Merge:%20Overwrite%20if%20exists,%20push%20if%20new%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20existingIndex%20=%20weekObj.days.findIndex(existing%20=%3E%20existing.date%20===%20day.date);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(existingIndex%20%3E=%200)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20weekObj.days%5BexistingIndex%5D%20=%20newDayObj;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%20else%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20weekObj.days.push(newDayObj);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Sort%20weeks%20and%20days%0A%20%20%20%20%20%20%20%20%20%20%20%20allWeeks%20=%20Array.from(weeksMap.values()).sort((a,%20b)%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(a.year%20!==%20b.year)%20return%20a.year%20-%20b.year;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20return%20a.weekNumber%20-%20b.weekNumber;%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20allWeeks.forEach(w%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(w.days)%20w.days.sort((a,%20b)%20=%3E%20a.date.localeCompare(b.date));%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Save%20to%20localStorage%20cache%0A%20%20%20%20%20%20%20%20%20%20%20%20saveMenuCache();%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Update%20timestamp%0A%20%20%20%20%20%20%20%20%20%20%20%20updateLastUpdatedTime(new%20Date().toISOString());%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20currentWeekNumber%20=%20getISOWeek(new%20Date());%0A%20%20%20%20%20%20%20%20%20%20%20%20currentYear%20=%20new%20Date().getFullYear();%0A%0A%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20updateAuthUI();%20//%20This%20will%20trigger%20fetchOrders%20if%20logged%20in%0A%20%20%20%20%20%20%20%20%20%20%20%20renderVisibleWeeks();%0A%20%20%20%20%20%20%20%20%20%20%20%20updateNextWeekBadge();%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20progressMessage.textContent%20=%20%27Fertig!%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20setTimeout(()%20=%3E%20progressModal.classList.add(%27hidden%27),%20500);%0A%0A%20%20%20%20%20%20%20%20%7D%20catch%20(error)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20console.error(%27Error%20fetching%20menu:%27,%20error);%0A%20%20%20%20%20%20%20%20%20%20%20%20progressModal.classList.add(%27hidden%27);%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20showErrorModal(%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%27Keine%20Verbindung%27,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%60Die%20Men%C3%BCdaten%20konnten%20nicht%20geladen%20werden.%20M%C3%B6glicherweise%20besteht%20keine%20Verbindung%20zur%20API%20oder%20zur%20Bessa-Webseite.%3Cbr%3E%3Cbr%3E%3Csmall%20style=%22color:var(--text-secondary)%22%3E%24%7Berror.message%7D%3C/small%3E%60,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%27Zur%20Original-Seite%27,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%27https://web.bessa.app/knapp-kantine%27%0A%20%20%20%20%20%20%20%20%20%20%20%20);%0A%20%20%20%20%20%20%20%20%7D%20finally%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20loading.classList.add(%27hidden%27);%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Last%20Updated%20Display%20===%0A%20%20%20%20function%20updateLastUpdatedTime(isoTimestamp)%20%7B%0A%20%20%20%20%20%20%20%20const%20subtitle%20=%20document.getElementById(%27last-updated-subtitle%27);%0A%20%20%20%20%20%20%20%20if%20(!isoTimestamp)%20return;%0A%20%20%20%20%20%20%20%20try%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20date%20=%20new%20Date(isoTimestamp);%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20timeStr%20=%20date.toLocaleTimeString(%27de-DE%27,%20%7B%20hour:%20%272-digit%27,%20minute:%20%272-digit%27%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20dateStr%20=%20date.toLocaleDateString(%27de-DE%27,%20%7B%20day:%20%272-digit%27,%20month:%20%272-digit%27%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20subtitle.textContent%20=%20%60Aktualisiert:%20%24%7BdateStr%7D%20%24%7BtimeStr%7D%60;%0A%20%20%20%20%20%20%20%20%7D%20catch%20(e)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20subtitle.textContent%20=%20%27%27;%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Toast%20Notification%20===%0A%20%20%20%20function%20showToast(message,%20type%20=%20%27info%27)%20%7B%0A%20%20%20%20%20%20%20%20let%20container%20=%20document.getElementById(%27toast-container%27);%0A%20%20%20%20%20%20%20%20if%20(!container)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20container%20=%20document.createElement(%27div%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20container.id%20=%20%27toast-container%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20document.body.appendChild(container);%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20const%20toast%20=%20document.createElement(%27div%27);%0A%20%20%20%20%20%20%20%20toast.className%20=%20%60toast%20toast-%24%7Btype%7D%60;%0A%20%20%20%20%20%20%20%20const%20icon%20=%20type%20===%20%27success%27%20%3F%20%27check_circle%27%20:%20type%20===%20%27error%27%20%3F%20%27error%27%20:%20%27info%27;%0A%20%20%20%20%20%20%20%20toast.innerHTML%20=%20%60%3Cspan%20class=%22material-icons-round%22%3E%24%7Bicon%7D%3C/span%3E%3Cspan%3E%24%7Bmessage%7D%3C/span%3E%60;%0A%20%20%20%20%20%20%20%20container.appendChild(toast);%0A%20%20%20%20%20%20%20%20requestAnimationFrame(()%20=%3E%20toast.classList.add(%27show%27));%0A%20%20%20%20%20%20%20%20setTimeout(()%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20toast.classList.remove(%27show%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20setTimeout(()%20=%3E%20toast.remove(),%20300);%0A%20%20%20%20%20%20%20%20%7D,%203000);%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Next%20Week%20Badge%20===%0A%20%20%20%20function%20updateNextWeekBadge()%20%7B%0A%20%20%20%20%20%20%20%20const%20btnNextWeek%20=%20document.getElementById(%27btn-next-week%27);%0A%20%20%20%20%20%20%20%20let%20nextWeek%20=%20currentWeekNumber%20+%201;%0A%20%20%20%20%20%20%20%20let%20nextYear%20=%20currentYear;%0A%20%20%20%20%20%20%20%20if%20(nextWeek%20%3E%2052)%20%7B%20nextWeek%20=%201;%20nextYear++;%20%7D%0A%0A%20%20%20%20%20%20%20%20const%20nextWeekData%20=%20allWeeks.find(w%20=%3E%20w.weekNumber%20===%20nextWeek%20%26%26%20w.year%20===%20nextYear);%0A%20%20%20%20%20%20%20%20let%20totalDataCount%20=%200;%0A%20%20%20%20%20%20%20%20let%20orderableCount%20=%200;%0A%20%20%20%20%20%20%20%20let%20daysWithOrders%20=%200;%0A%20%20%20%20%20%20%20%20let%20daysWithOrderableAndNoOrder%20=%200;%0A%0A%20%20%20%20%20%20%20%20if%20(nextWeekData%20%26%26%20nextWeekData.days)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20nextWeekData.days.forEach(day%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(day.items%20%26%26%20day.items.length%20%3E%200)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20totalDataCount++;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20isOrderable%20=%20day.items.some(item%20=%3E%20item.available);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(isOrderable)%20orderableCount++;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20let%20hasOrder%20=%20false;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20day.items.forEach(item%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20articleId%20=%20item.articleId%20%7C%7C%20parseInt(item.id.split(%27_%27)%5B1%5D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20key%20=%20%60%24%7Bday.date%7D_%24%7BarticleId%7D%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(orderMap.has(key)%20%26%26%20orderMap.get(key).length%20%3E%200)%20hasOrder%20=%20true;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(hasOrder)%20daysWithOrders++;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(isOrderable%20%26%26%20!hasOrder)%20daysWithOrderableAndNoOrder++;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20let%20badge%20=%20btnNextWeek.querySelector(%27.nav-badge%27);%0A%20%20%20%20%20%20%20%20if%20(totalDataCount%20%3E%200)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(!badge)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20badge%20=%20document.createElement(%27span%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20badge.className%20=%20%27nav-badge%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20btnNextWeek.appendChild(badge);%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Format:%20(%20Ordered%20/%20Orderable%20/%20Total%20)%0A%20%20%20%20%20%20%20%20%20%20%20%20badge.title%20=%20%60%24%7BdaysWithOrders%7D%20bestellt%20/%20%24%7BorderableCount%7D%20bestellbar%20/%20%24%7BtotalDataCount%7D%20gesamt%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20badge.innerHTML%20=%20%60%3Cspan%20class=%22ordered%22%3E%24%7BdaysWithOrders%7D%3C/span%3E%3Cspan%20class=%22separator%22%3E/%3C/span%3E%3Cspan%20class=%22orderable%22%3E%24%7BorderableCount%7D%3C/span%3E%3Cspan%20class=%22separator%22%3E/%3C/span%3E%3Cspan%20class=%22total%22%3E%24%7BtotalDataCount%7D%3C/span%3E%60;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Color%20Logic%0A%20%20%20%20%20%20%20%20%20%20%20%20badge.classList.remove(%27badge-violet%27,%20%27badge-green%27,%20%27badge-red%27,%20%27badge-blue%27);%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Refined%20Logic%20(v1.7.4):%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Violet:%20If%20we%20have%20orders%20AND%20there%20are%20no%20DAYS%20left%20that%20are%20orderable%20but%20un-ordered.%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20(i.e.%20%22I%20have%20ordered%20everything%20I%20can%22)%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(daysWithOrders%20%3E%200%20%26%26%20daysWithOrderableAndNoOrder%20===%200)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20badge.classList.add(%27badge-violet%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%20else%20if%20(daysWithOrderableAndNoOrder%20%3E%200)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20badge.classList.add(%27badge-green%27);%20//%20Orderable%20days%20exist%20without%20order%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%20else%20if%20(orderableCount%20===%200)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20badge.classList.add(%27badge-red%27);%20//%20No%20orderable%20days%20at%20all%20%26%20no%20orders%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%20else%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20badge.classList.add(%27badge-blue%27);%20//%20Default%20/%20partial%20state%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Advanced%20Feature:%20Highlight%20Count%0A%20%20%20%20%20%20%20%20%20%20%20%20let%20highlightCount%20=%200;%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(nextWeekData%20%26%26%20nextWeekData.days)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20nextWeekData.days.forEach(day%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20day.items.forEach(item%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(checkHighlight(item.name)%20%7C%7C%20checkHighlight(item.description))%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20highlightCount++;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(highlightCount%20%3E%200)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20//%20Append%20blue%20count%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20badge.innerHTML%20+=%20%60%3Cspan%20class=%22highlight-count%22%20title=%22%24%7BhighlightCount%7D%20Highlight%20Men%C3%BCs%22%3E(%24%7BhighlightCount%7D)%3C/span%3E%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20badge.title%20+=%20%60%20%E2%80%A2%20%24%7BhighlightCount%7D%20Highlights%20gefunden%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20badge.classList.add(%27has-highlights%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20%7D%20else%20if%20(badge)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20badge.remove();%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Weekly%20Cost%20===%0A%20%20%20%20function%20updateWeeklyCost(days)%20%7B%0A%20%20%20%20%20%20%20%20let%20totalCost%20=%200;%0A%20%20%20%20%20%20%20%20if%20(days%20%26%26%20days.length%20%3E%200)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20days.forEach(day%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(day.items)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20day.items.forEach(item%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20articleId%20=%20item.articleId%20%7C%7C%20parseInt(item.id.split(%27_%27)%5B1%5D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20key%20=%20%60%24%7Bday.date%7D_%24%7BarticleId%7D%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20orders%20=%20orderMap.get(key)%20%7C%7C%20%5B%5D;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(orders.length%20%3E%200)%20totalCost%20+=%20item.price%20%2A%20orders.length;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20const%20costDisplay%20=%20document.getElementById(%27weekly-cost-display%27);%0A%20%20%20%20%20%20%20%20if%20(totalCost%20%3E%200)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20costDisplay.innerHTML%20=%20%60%3Cspan%20class=%22material-icons-round%22%3Eshopping_bag%3C/span%3E%20%3Cspan%3EGesamt:%20%24%7BtotalCost.toFixed(2).replace(%27.%27,%20%27,%27)%7D%20%E2%82%AC%3C/span%3E%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20costDisplay.classList.remove(%27hidden%27);%0A%20%20%20%20%20%20%20%20%7D%20else%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20costDisplay.classList.add(%27hidden%27);%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Render%20Weeks%20===%0A%20%20%20%20function%20renderVisibleWeeks()%20%7B%0A%20%20%20%20%20%20%20%20const%20menuContainer%20=%20document.getElementById(%27menu-container%27);%0A%20%20%20%20%20%20%20%20if%20(!menuContainer)%20return;%0A%20%20%20%20%20%20%20%20menuContainer.innerHTML%20=%20%27%27;%0A%0A%20%20%20%20%20%20%20%20let%20targetWeek%20=%20currentWeekNumber;%0A%20%20%20%20%20%20%20%20let%20targetYear%20=%20currentYear;%0A%0A%20%20%20%20%20%20%20%20if%20(displayMode%20===%20%27next-week%27)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20targetWeek++;%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(targetWeek%20%3E%2052)%20%7B%20targetWeek%20=%201;%20targetYear++;%20%7D%0A%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20//%20Flatten%20%26%20filter%20by%20week%20+%20year%0A%20%20%20%20%20%20%20%20const%20allDays%20=%20allWeeks.flatMap(w%20=%3E%20w.days%20%7C%7C%20%5B%5D);%0A%20%20%20%20%20%20%20%20const%20daysInTargetWeek%20=%20allDays.filter(day%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20d%20=%20new%20Date(day.date);%0A%20%20%20%20%20%20%20%20%20%20%20%20return%20getISOWeek(d)%20===%20targetWeek%20%26%26%20getWeekYear(d)%20===%20targetYear;%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20if%20(daysInTargetWeek.length%20===%200)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20menuContainer.innerHTML%20=%20%60%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22empty-state%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cp%3EKeine%20Men%C3%BCdaten%20f%C3%BCr%20KW%20%24%7BtargetWeek%7D%20(%24%7BtargetYear%7D)%20verf%C3%BCgbar.%3C/p%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Csmall%3EVersuchen%20Sie%20eine%20andere%20Woche%20oder%20schauen%20Sie%20sp%C3%A4ter%20vorbei.%3C/small%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20document.getElementById(%27weekly-cost-display%27).classList.add(%27hidden%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20return;%0A%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20updateWeeklyCost(daysInTargetWeek);%0A%0A%20%20%20%20%20%20%20%20//%20Update%20header%0A%20%20%20%20%20%20%20%20const%20headerWeekInfo%20=%20document.getElementById(%27header-week-info%27);%0A%20%20%20%20%20%20%20%20const%20weekTitle%20=%20displayMode%20===%20%27this-week%27%20%3F%20%27Diese%20Woche%27%20:%20%27N%C3%A4chste%20Woche%27;%0A%20%20%20%20%20%20%20%20headerWeekInfo.innerHTML%20=%20%60%0A%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22header-week-title%22%3E%24%7BweekTitle%7D%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22header-week-subtitle%22%3EWeek%20%24%7BtargetWeek%7D%20%E2%80%A2%20%24%7BtargetYear%7D%3C/div%3E%60;%0A%0A%20%20%20%20%20%20%20%20const%20grid%20=%20document.createElement(%27div%27);%0A%20%20%20%20%20%20%20%20grid.className%20=%20%27days-grid%27;%0A%0A%20%20%20%20%20%20%20%20daysInTargetWeek.sort((a,%20b)%20=%3E%20a.date.localeCompare(b.date));%0A%0A%20%20%20%20%20%20%20%20//%20Filter%20weekends%0A%20%20%20%20%20%20%20%20const%20workingDays%20=%20daysInTargetWeek.filter(d%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20date%20=%20new%20Date(d.date);%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20day%20=%20date.getDay();%0A%20%20%20%20%20%20%20%20%20%20%20%20return%20day%20!==%200%20%26%26%20day%20!==%206;%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20workingDays.forEach(day%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20card%20=%20createDayCard(day);%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(card)%20grid.appendChild(card);%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20menuContainer.appendChild(grid);%0A%20%20%20%20%20%20%20%20setTimeout(()%20=%3E%20syncMenuItemHeights(grid),%200);%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Sync%20Item%20Heights%20===%0A%20%20%20%20function%20syncMenuItemHeights(grid)%20%7B%0A%20%20%20%20%20%20%20%20const%20cards%20=%20grid.querySelectorAll(%27.menu-card%27);%0A%20%20%20%20%20%20%20%20if%20(cards.length%20===%200)%20return;%0A%20%20%20%20%20%20%20%20let%20maxItems%20=%200;%0A%20%20%20%20%20%20%20%20cards.forEach(card%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20maxItems%20=%20Math.max(maxItems,%20card.querySelectorAll(%27.menu-item%27).length);%0A%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20for%20(let%20i%20=%200;%20i%20%3C%20maxItems;%20i++)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20let%20maxHeight%20=%200;%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20itemsAtPos%20=%20%5B%5D;%0A%20%20%20%20%20%20%20%20%20%20%20%20cards.forEach(card%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20items%20=%20card.querySelectorAll(%27.menu-item%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(items%5Bi%5D)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20items%5Bi%5D.style.height%20=%20%27auto%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20maxHeight%20=%20Math.max(maxHeight,%20items%5Bi%5D.offsetHeight);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20itemsAtPos.push(items%5Bi%5D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20itemsAtPos.forEach(item%20=%3E%20%7B%20item.style.height%20=%20%60%24%7BmaxHeight%7Dpx%60;%20%7D);%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Create%20Day%20Card%20===%0A%20%20%20%20function%20createDayCard(day)%20%7B%0A%20%20%20%20%20%20%20%20if%20(!day.items%20%7C%7C%20day.items.length%20===%200)%20return%20null;%0A%0A%20%20%20%20%20%20%20%20const%20card%20=%20document.createElement(%27div%27);%0A%20%20%20%20%20%20%20%20card.className%20=%20%27menu-card%27;%0A%0A%20%20%20%20%20%20%20%20const%20now%20=%20new%20Date();%0A%20%20%20%20%20%20%20%20const%20cardDate%20=%20new%20Date(day.date);%0A%0A%20%20%20%20%20%20%20%20let%20isPastCutoff%20=%20false;%0A%20%20%20%20%20%20%20%20if%20(day.orderCutoff)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20isPastCutoff%20=%20now%20%3E=%20new%20Date(day.orderCutoff);%0A%20%20%20%20%20%20%20%20%7D%20else%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20today%20=%20new%20Date();%0A%20%20%20%20%20%20%20%20%20%20%20%20today.setHours(0,%200,%200,%200);%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20cd%20=%20new%20Date(day.date);%0A%20%20%20%20%20%20%20%20%20%20%20%20cd.setHours(0,%200,%200,%200);%0A%20%20%20%20%20%20%20%20%20%20%20%20isPastCutoff%20=%20cd%20%3C%20today;%0A%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20if%20(isPastCutoff)%20card.classList.add(%27past-day%27);%0A%0A%20%20%20%20%20%20%20%20//%20Collect%20ordered%20menu%20codes%0A%20%20%20%20%20%20%20%20const%20menuBadges%20=%20%5B%5D;%0A%20%20%20%20%20%20%20%20if%20(day.items)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20day.items.forEach(item%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20articleId%20=%20item.articleId%20%7C%7C%20parseInt(item.id.split(%27_%27)%5B1%5D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20orderKey%20=%20%60%24%7Bday.date%7D_%24%7BarticleId%7D%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20orders%20=%20orderMap.get(orderKey)%20%7C%7C%20%5B%5D;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20count%20=%20orders.length;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(count%20%3E%200)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20//%20Regex%20for%20M1,%20M2,%20M1F%20etc.%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20match%20=%20item.name.match(/(%5BM%5D%5B1-9%5D%5BFf%5D%3F)/);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(match)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20let%20code%20=%20match%5B1%5D;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(count%20%3E%201)%20code%20+=%20%27+%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20menuBadges.push(code);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20//%20Header%0A%20%20%20%20%20%20%20%20const%20header%20=%20document.createElement(%27div%27);%0A%20%20%20%20%20%20%20%20header.className%20=%20%27card-header%27;%0A%20%20%20%20%20%20%20%20const%20dateStr%20=%20cardDate.toLocaleDateString(%27de-DE%27,%20%7B%20day:%20%272-digit%27,%20month:%20%272-digit%27%20%7D);%0A%0A%20%20%20%20%20%20%20%20const%20badgesHtml%20=%20menuBadges.map(code%20=%3E%20%60%3Cspan%20class=%22menu-code-badge%22%3E%24%7Bcode%7D%3C/span%3E%60).join(%27%27);%0A%0A%20%20%20%20%20%20%20%20//%20Determine%20Day%20Status%20for%20Header%20Color%0A%20%20%20%20%20%20%20%20//%20Violet:%20Has%20Order%0A%20%20%20%20%20%20%20%20//%20Green:%20No%20Order%20but%20Orderable%0A%20%20%20%20%20%20%20%20//%20Red:%20No%20Order%20and%20Not%20Orderable%20(Locked/Sold%20Out)%0A%20%20%20%20%20%20%20%20let%20headerClass%20=%20%27%27;%0A%20%20%20%20%20%20%20%20const%20hasAnyOrder%20=%20day.items%20%26%26%20day.items.some(item%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20articleId%20=%20item.articleId%20%7C%7C%20parseInt(item.id.split(%27_%27)%5B1%5D);%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20key%20=%20%60%24%7Bday.date%7D_%24%7BarticleId%7D%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20return%20orderMap.has(key)%20%26%26%20orderMap.get(key).length%20%3E%200;%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20const%20hasOrderable%20=%20day.items%20%26%26%20day.items.some(item%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Use%20pre-calculated%20available%20flag%20from%20loadMenuDataFromAPI%20calculation%0A%20%20%20%20%20%20%20%20%20%20%20%20return%20item.available;%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20if%20(hasAnyOrder)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20headerClass%20=%20%27header-violet%27;%0A%20%20%20%20%20%20%20%20%7D%20else%20if%20(hasOrderable%20%26%26%20!isPastCutoff)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20headerClass%20=%20%27header-green%27;%0A%20%20%20%20%20%20%20%20%7D%20else%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Red%20if%20not%20orderable%20(or%20past%20cutoff)%0A%20%20%20%20%20%20%20%20%20%20%20%20headerClass%20=%20%27header-red%27;%0A%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20if%20(headerClass)%20header.classList.add(headerClass);%0A%0A%20%20%20%20%20%20%20%20header.innerHTML%20=%20%60%0A%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22day-header-left%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cspan%20class=%22day-name%22%3E%24%7BtranslateDay(day.weekday)%7D%3C/span%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22day-badges%22%3E%24%7BbadgesHtml%7D%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3Cspan%20class=%22day-date%22%3E%24%7BdateStr%7D%3C/span%3E%60;%0A%20%20%20%20%20%20%20%20card.appendChild(header);%0A%0A%20%20%20%20%20%20%20%20//%20Body%0A%20%20%20%20%20%20%20%20const%20body%20=%20document.createElement(%27div%27);%0A%20%20%20%20%20%20%20%20body.className%20=%20%27card-body%27;%0A%0A%20%20%20%20%20%20%20%20const%20todayDateStr%20=%20new%20Date().toISOString().split(%27T%27)%5B0%5D;%0A%20%20%20%20%20%20%20%20const%20isToday%20=%20day.date%20===%20todayDateStr;%0A%0A%20%20%20%20%20%20%20%20const%20sortedItems%20=%20%5B...day.items%5D.sort((a,%20b)%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(isToday)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20aId%20=%20a.articleId%20%7C%7C%20parseInt(a.id.split(%27_%27)%5B1%5D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20bId%20=%20b.articleId%20%7C%7C%20parseInt(b.id.split(%27_%27)%5B1%5D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20aOrdered%20=%20orderMap.has(%60%24%7Bday.date%7D_%24%7BaId%7D%60);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20bOrdered%20=%20orderMap.has(%60%24%7Bday.date%7D_%24%7BbId%7D%60);%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(aOrdered%20%26%26%20!bOrdered)%20return%20-1;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(!aOrdered%20%26%26%20bOrdered)%20return%201;%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20return%20a.name.localeCompare(b.name);%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20sortedItems.forEach(item%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20itemEl%20=%20document.createElement(%27div%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20itemEl.className%20=%20%27menu-item%27;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20articleId%20=%20item.articleId%20%7C%7C%20parseInt(item.id.split(%27_%27)%5B1%5D);%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20orderKey%20=%20%60%24%7Bday.date%7D_%24%7BarticleId%7D%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20orderIds%20=%20orderMap.get(orderKey)%20%7C%7C%20%5B%5D;%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20orderCount%20=%20orderIds.length;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Status%20badge%0A%20%20%20%20%20%20%20%20%20%20%20%20let%20statusBadge%20=%20%27%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(item.available)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20statusBadge%20=%20item.amountTracking%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3F%20%60%3Cspan%20class=%22badge%20available%22%3EVerf%C3%BCgbar%20(%24%7Bitem.availableAmount%7D)%3C/span%3E%60%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20:%20%60%3Cspan%20class=%22badge%20available%22%3EVerf%C3%BCgbar%3C/span%3E%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%20else%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20statusBadge%20=%20%60%3Cspan%20class=%22badge%20sold-out%22%3EAusverkauft%3C/span%3E%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Order%20badge%0A%20%20%20%20%20%20%20%20%20%20%20%20let%20orderedBadge%20=%20%27%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(orderCount%20%3E%200)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20countBadge%20=%20orderCount%20%3E%201%20%3F%20%60%3Cspan%20class=%22order-count-badge%22%3E%24%7BorderCount%7D%3C/span%3E%60%20:%20%27%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20orderedBadge%20=%20%60%3Cspan%20class=%22badge%20ordered%22%3E%3Cspan%20class=%22material-icons-round%22%3Echeck_circle%3C/span%3E%20Bestellt%24%7BcountBadge%7D%3C/span%3E%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20itemEl.classList.add(%27ordered%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(new%20Date(day.date).toDateString()%20===%20now.toDateString())%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20itemEl.classList.add(%27today-ordered%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Flagged%20styles%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20flagId%20=%20%60%24%7Bday.date%7D_%24%7BarticleId%7D%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20isFlagged%20=%20userFlags.has(flagId);%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(isFlagged)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20itemEl.classList.add(item.available%20%3F%20%27flagged-available%27%20:%20%27flagged-sold-out%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Highlight%20matching%20menu%20items%20based%20on%20user%20tags%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(checkHighlight(item.name)%20%7C%7C%20checkHighlight(item.description))%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20itemEl.classList.add(%27highlight-glow%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Action%20buttons%0A%20%20%20%20%20%20%20%20%20%20%20%20let%20orderButton%20=%20%27%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20let%20cancelButton%20=%20%27%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20let%20flagButton%20=%20%27%27;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(authToken%20%26%26%20!isPastCutoff)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20//%20Flag%20button%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20flagIcon%20=%20isFlagged%20%3F%20%27notifications_active%27%20:%20%27notifications_none%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20flagClass%20=%20isFlagged%20%3F%20%27btn-flag%20active%27%20:%20%27btn-flag%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20flagTitle%20=%20isFlagged%20%3F%20%27Benachrichtigung%20deaktivieren%27%20:%20%27Benachrichtigen%20wenn%20verf%C3%BCgbar%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(!item.available%20%7C%7C%20isFlagged)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20flagButton%20=%20%60%3Cbutton%20class=%22%24%7BflagClass%7D%22%20data-date=%22%24%7Bday.date%7D%22%20data-article=%22%24%7BarticleId%7D%22%20data-name=%22%24%7BescapeHtml(item.name)%7D%22%20data-cutoff=%22%24%7Bday.orderCutoff%7D%22%20title=%22%24%7BflagTitle%7D%22%3E%3Cspan%20class=%22material-icons-round%22%3E%24%7BflagIcon%7D%3C/span%3E%3C/button%3E%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20//%20Order%20button%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(item.available)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(orderCount%20%3E%200)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20orderButton%20=%20%60%3Cbutton%20class=%22btn-order%20btn-order-compact%22%20data-date=%22%24%7Bday.date%7D%22%20data-article=%22%24%7BarticleId%7D%22%20data-name=%22%24%7BescapeHtml(item.name)%7D%22%20data-price=%22%24%7Bitem.price%7D%22%20data-desc=%22%24%7BescapeHtml(item.description%20%7C%7C%20%27%27)%7D%22%20title=%22%24%7BescapeHtml(item.name)%7D%20nochmal%20bestellen%22%3E%3Cspan%20class=%22material-icons-round%22%3Eadd%3C/span%3E%3C/button%3E%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%20else%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20orderButton%20=%20%60%3Cbutton%20class=%22btn-order%22%20data-date=%22%24%7Bday.date%7D%22%20data-article=%22%24%7BarticleId%7D%22%20data-name=%22%24%7BescapeHtml(item.name)%7D%22%20data-price=%22%24%7Bitem.price%7D%22%20data-desc=%22%24%7BescapeHtml(item.description%20%7C%7C%20%27%27)%7D%22%20title=%22%24%7BescapeHtml(item.name)%7D%20bestellen%22%3E%3Cspan%20class=%22material-icons-round%22%3Eadd_shopping_cart%3C/span%3E%20Bestellen%3C/button%3E%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20//%20Cancel%20button%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(orderCount%20%3E%200)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20cancelIcon%20=%20orderCount%20===%201%20%3F%20%27close%27%20:%20%27remove%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20cancelTitle%20=%20orderCount%20===%201%20%3F%20%27Bestellung%20stornieren%27%20:%20%27Eine%20Bestellung%20stornieren%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20cancelButton%20=%20%60%3Cbutton%20class=%22btn-cancel%22%20data-date=%22%24%7Bday.date%7D%22%20data-article=%22%24%7BarticleId%7D%22%20data-name=%22%24%7BescapeHtml(item.name)%7D%22%20title=%22%24%7BcancelTitle%7D%22%3E%3Cspan%20class=%22material-icons-round%22%3E%24%7BcancelIcon%7D%3C/span%3E%3C/button%3E%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20itemEl.innerHTML%20=%20%60%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22item-header%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cspan%20class=%22item-name%22%3E%24%7BescapeHtml(item.name)%7D%3C/span%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cspan%20class=%22item-price%22%3E%24%7Bitem.price.toFixed(2)%7D%20%E2%82%AC%3C/span%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22item-status-row%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%24%7BorderedBadge%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%24%7BcancelButton%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%24%7BorderButton%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%24%7BflagButton%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22badges%22%3E%24%7BstatusBadge%7D%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cp%20class=%22item-desc%22%3E%24%7BescapeHtml(item.description)%7D%3C/p%3E%60;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Event:%20Order%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20orderBtn%20=%20itemEl.querySelector(%27.btn-order%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(orderBtn)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20orderBtn.addEventListener(%27click%27,%20(e)%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20e.stopPropagation();%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20btn%20=%20e.currentTarget;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20btn.disabled%20=%20true;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20btn.classList.add(%27loading%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20placeOrder(btn.dataset.date,%20parseInt(btn.dataset.article),%20btn.dataset.name,%20parseFloat(btn.dataset.price),%20btn.dataset.desc%20%7C%7C%20%27%27)%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20.finally(()%20=%3E%20%7B%20btn.disabled%20=%20false;%20btn.classList.remove(%27loading%27);%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Event:%20Cancel%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20cancelBtn%20=%20itemEl.querySelector(%27.btn-cancel%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(cancelBtn)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20cancelBtn.addEventListener(%27click%27,%20(e)%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20e.stopPropagation();%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20btn%20=%20e.currentTarget;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20btn.disabled%20=%20true;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20cancelOrder(btn.dataset.date,%20parseInt(btn.dataset.article),%20btn.dataset.name)%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20.finally(()%20=%3E%20%7B%20btn.disabled%20=%20false;%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Event:%20Flag%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20flagBtn%20=%20itemEl.querySelector(%27.btn-flag%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(flagBtn)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20flagBtn.addEventListener(%27click%27,%20(e)%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20e.stopPropagation();%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20btn%20=%20e.currentTarget;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20toggleFlag(btn.dataset.date,%20parseInt(btn.dataset.article),%20btn.dataset.name,%20btn.dataset.cutoff);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20body.appendChild(itemEl);%0A%20%20%20%20%20%20%20%20%7D);%0A%0A%20%20%20%20%20%20%20%20card.appendChild(body);%0A%20%20%20%20%20%20%20%20return%20card;%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Version%20Check%20===%0A%20%20%20%20async%20function%20checkForUpdates()%20%7B%0A%20%20%20%20%20%20%20%20const%20CurrentVersion%20=%20%27v1.2.1%27;%0A%20%20%20%20%20%20%20%20const%20VersionUrl%20=%20%27https://raw.githubusercontent.com/TauNeutrino/kantine-overview/main/version.txt%27;%0A%20%20%20%20%20%20%20%20const%20InstallerUrl%20=%20%27https://htmlpreview.github.io/%3Fhttps://github.com/TauNeutrino/kantine-overview/blob/main/dist/install.html%27;%0A%0A%20%20%20%20%20%20%20%20console.log(%60%5BKantine%5D%20Checking%20for%20updates...%20(Current:%20%24%7BCurrentVersion%7D)%60);%0A%0A%20%20%20%20%20%20%20%20try%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20response%20=%20await%20fetch(VersionUrl,%20%7B%20cache:%20%27no-cache%27%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(!response.ok)%20return;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20remoteVersion%20=%20(await%20response.text()).trim();%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(remoteVersion%20%26%26%20remoteVersion%20!==%20CurrentVersion)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20console.log(%60%5BKantine%5D%20New%20version%20available:%20%24%7BremoteVersion%7D%60);%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20//%20Fetch%20Changelog%20content%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20let%20changeSummary%20=%20%27%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20try%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20clResp%20=%20await%20fetch(%27https://raw.githubusercontent.com/TauNeutrino/kantine-overview/main/changelog.md%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(clResp.ok)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20clText%20=%20await%20clResp.text();%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20match%20=%20clText.match(/%23%23%20(v%5B%5E%5Cn%5D+)%5Cn((%3F:-%5B%5E%5Cn%5D+%5Cn)+)/);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(match%20%26%26%20match%5B1%5D.includes(remoteVersion))%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20changeSummary%20=%20match%5B2%5D.replace(/-%20/g,%20%27%E2%80%A2%20%27).trim();%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%20catch%20(e)%20%7B%20console.warn(%27No%20changelog%27,%20e);%20%7D%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20//%20Create%20Banner%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20updateBanner%20=%20document.createElement(%27div%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20updateBanner.className%20=%20%27update-banner%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20updateBanner.innerHTML%20=%20%60%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22update-content%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cstrong%3EUpdate%20verf%C3%BCgbar:%20%24%7BremoteVersion%7D%3C/strong%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%24%7BchangeSummary%20%3F%20%60%3Cpre%20class=%22change-summary%22%3E%24%7BchangeSummary%7D%3C/pre%3E%60%20:%20%27%27%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Ca%20href=%22%24%7BInstallerUrl%7D%22%20target=%22_blank%22%20class=%22update-link%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cspan%20class=%22material-icons-round%22%3Esystem_update_alt%3C/span%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20Jetzt%20aktualisieren%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/a%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cbutton%20class=%22icon-btn-small%20close-update%22%3E%26times;%3C/button%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%60;%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20document.body.appendChild(updateBanner);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20updateBanner.querySelector(%27.close-update%27).addEventListener(%27click%27,%20()%20=%3E%20updateBanner.remove());%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20//%20Highlight%20Header%20Icon%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20const%20lastUpdatedIcon%20=%20document.querySelector(%27.material-icons-round.logo-icon%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(lastUpdatedIcon)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20lastUpdatedIcon.style.color%20=%20%27var(--accent-color)%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20lastUpdatedIcon.parentElement.title%20=%20%60Update%20verf%C3%BCgbar:%20%24%7BremoteVersion%7D%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%7D%20catch%20(error)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20console.warn(%27%5BKantine%5D%20Version%20check%20failed:%27,%20error);%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Order%20Countdown%20===%0A%20%20%20%20function%20updateCountdown()%20%7B%0A%20%20%20%20%20%20%20%20const%20now%20=%20new%20Date();%0A%20%20%20%20%20%20%20%20const%20currentDay%20=%20now.getDay();%0A%20%20%20%20%20%20%20%20//%20Skip%20weekends%20(0=Sun,%206=Sat)%0A%20%20%20%20%20%20%20%20if%20(currentDay%20===%200%20%7C%7C%20currentDay%20===%206)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20removeCountdown();%0A%20%20%20%20%20%20%20%20%20%20%20%20return;%0A%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20const%20todayStr%20=%20now.toISOString().split(%27T%27)%5B0%5D;%0A%0A%20%20%20%20%20%20%20%20//%201.%20Check%20if%20we%20already%20ordered%20for%20today%0A%20%20%20%20%20%20%20%20let%20hasOrder%20=%20false;%0A%20%20%20%20%20%20%20%20//%20Optimization:%20Check%20orderMap%20for%20today%27s%20date%0A%20%20%20%20%20%20%20%20//%20Keys%20are%20%22YYYY-MM-DD_ArticleID%22%0A%20%20%20%20%20%20%20%20for%20(const%20key%20of%20orderMap.keys())%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(key.startsWith(todayStr))%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20hasOrder%20=%20true;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20break;%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20if%20(hasOrder)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20removeCountdown();%0A%20%20%20%20%20%20%20%20%20%20%20%20return;%0A%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20//%202.%20Calculate%20time%20to%20cutoff%20(10:00%20AM)%0A%20%20%20%20%20%20%20%20const%20cutoff%20=%20new%20Date();%0A%20%20%20%20%20%20%20%20cutoff.setHours(10,%200,%200,%200);%0A%0A%20%20%20%20%20%20%20%20const%20diff%20=%20cutoff%20-%20now;%0A%0A%20%20%20%20%20%20%20%20//%20If%20passed%20cutoff%20or%20more%20than%203%20hours%20away%20(e.g.%2007:00),%20maybe%20don%27t%20show%3F%0A%20%20%20%20%20%20%20%20//%20User%20req:%20%22heute%20noch%20keine%20bestellung...%20countdown%20erscheinen%22%0A%20%20%20%20%20%20%20%20//%20Let%27s%20show%20it%20if%20within%20valid%20order%20window%20(e.g.%2000:00%20-%2010:00)%0A%0A%20%20%20%20%20%20%20%20if%20(diff%20%3C=%200)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20removeCountdown();%0A%20%20%20%20%20%20%20%20%20%20%20%20return;%0A%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20//%203.%20Render%20Countdown%0A%20%20%20%20%20%20%20%20const%20diffHrs%20=%20Math.floor(diff%20/%203600000);%0A%20%20%20%20%20%20%20%20const%20diffMins%20=%20Math.floor((diff%20%25%203600000)%20/%2060000);%0A%0A%20%20%20%20%20%20%20%20const%20headerCenter%20=%20document.querySelector(%27.header-center-wrapper%27);%0A%20%20%20%20%20%20%20%20if%20(!headerCenter)%20return;%0A%0A%20%20%20%20%20%20%20%20let%20countdownEl%20=%20document.getElementById(%27order-countdown%27);%0A%20%20%20%20%20%20%20%20if%20(!countdownEl)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20countdownEl%20=%20document.createElement(%27div%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20countdownEl.id%20=%20%27order-countdown%27;%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Insert%20before%20cost%20display%20or%20append%0A%20%20%20%20%20%20%20%20%20%20%20%20headerCenter.insertBefore(countdownEl,%20headerCenter.firstChild);%0A%20%20%20%20%20%20%20%20%7D%0A%0A%20%20%20%20%20%20%20%20countdownEl.innerHTML%20=%20%60%3Cspan%3EBestellschluss:%3C/span%3E%20%3Cstrong%3E%24%7BdiffHrs%7Dh%20%24%7BdiffMins%7Dm%3C/strong%3E%60;%0A%0A%20%20%20%20%20%20%20%20//%20Red%20Alert%20if%20%3C%201%20hour%0A%20%20%20%20%20%20%20%20if%20(diff%20%3C%203600000)%20%7B%20//%201%20hour%0A%20%20%20%20%20%20%20%20%20%20%20%20countdownEl.classList.add(%27urgent%27);%0A%0A%20%20%20%20%20%20%20%20%20%20%20%20//%20Notification%20logic%20(One%20time)%0A%20%20%20%20%20%20%20%20%20%20%20%20const%20notifiedKey%20=%20%60kantine_notified_%24%7BtodayStr%7D%60;%0A%20%20%20%20%20%20%20%20%20%20%20%20if%20(!sessionStorage.getItem(notifiedKey))%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20if%20(Notification.permission%20===%20%27granted%27)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20new%20Notification(%27Kantine:%20Bestellschluss%20naht!%27,%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20body:%20%27Du%20hast%20heute%20noch%20nichts%20bestellt.%20Nur%20noch%201%20Stunde!%27,%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20icon:%20%27%E2%8F%B3%27%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D);%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%20else%20if%20(Notification.permission%20===%20%27default%27)%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20Notification.requestPermission();%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20sessionStorage.setItem(notifiedKey,%20%27true%27);%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%7D%20else%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20countdownEl.classList.remove(%27urgent%27);%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%7D%0A%0A%20%20%20%20function%20removeCountdown()%20%7B%0A%20%20%20%20%20%20%20%20const%20el%20=%20document.getElementById(%27order-countdown%27);%0A%20%20%20%20%20%20%20%20if%20(el)%20el.remove();%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20Update%20countdown%20every%20minute%0A%20%20%20%20setInterval(updateCountdown,%2060000);%0A%20%20%20%20//%20Also%20update%20on%20load%0A%20%20%20%20setTimeout(updateCountdown,%201000);%0A%0A%20%20%20%20//%20===%20Helpers%20===%20%0A%20%20%20%20function%20getISOWeek(date)%20%7B%0A%20%20%20%20%20%20%20%20const%20d%20=%20new%20Date(Date.UTC(date.getFullYear(),%20date.getMonth(),%20date.getDate()));%0A%20%20%20%20%20%20%20%20const%20dayNum%20=%20d.getUTCDay()%20%7C%7C%207;%0A%20%20%20%20%20%20%20%20d.setUTCDate(d.getUTCDate()%20+%204%20-%20dayNum);%0A%20%20%20%20%20%20%20%20const%20yearStart%20=%20new%20Date(Date.UTC(d.getUTCFullYear(),%200,%201));%0A%20%20%20%20%20%20%20%20return%20Math.ceil(((d%20-%20yearStart)%20/%2086400000%20+%201)%20/%207);%0A%20%20%20%20%7D%0A%0A%20%20%20%20function%20getWeekYear(d)%20%7B%0A%20%20%20%20%20%20%20%20const%20date%20=%20new%20Date(d.getTime());%0A%20%20%20%20%20%20%20%20date.setDate(date.getDate()%20+%203%20-%20(date.getDay()%20+%206)%20%25%207);%0A%20%20%20%20%20%20%20%20return%20date.getFullYear();%0A%20%20%20%20%7D%0A%0A%0A%20%20%20%20function%20translateDay(englishDay)%20%7B%0A%20%20%20%20%20%20%20%20const%20map%20=%20%7B%20Monday:%20%27Montag%27,%20Tuesday:%20%27Dienstag%27,%20Wednesday:%20%27Mittwoch%27,%20Thursday:%20%27Donnerstag%27,%20Friday:%20%27Freitag%27,%20Saturday:%20%27Samstag%27,%20Sunday:%20%27Sonntag%27%20%7D;%0A%20%20%20%20%20%20%20%20return%20map%5BenglishDay%5D%20%7C%7C%20englishDay;%0A%20%20%20%20%7D%0A%0A%20%20%20%20function%20escapeHtml(text)%20%7B%0A%20%20%20%20%20%20%20%20const%20div%20=%20document.createElement(%27div%27);%0A%20%20%20%20%20%20%20%20div.textContent%20=%20text%20%7C%7C%20%27%27;%0A%20%20%20%20%20%20%20%20return%20div.innerHTML;%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20===%20Bootstrap%20===%0A%20%20%20%20injectUI();%0A%20%20%20%20bindEvents();%0A%20%20%20%20updateAuthUI();%0A%20%20%20%20cleanupExpiredFlags();%0A%0A%20%20%20%20//%20Load%20cached%20data%20first%20for%20instant%20UI,%20then%20refresh%20from%20API%0A%20%20%20%20const%20hadCache%20=%20loadMenuCache();%0A%20%20%20%20if%20(hadCache)%20%7B%0A%20%20%20%20%20%20%20%20//%20Hide%20loading%20spinner%20since%20cache%20is%20shown%0A%20%20%20%20%20%20%20%20document.getElementById(%27loading%27).classList.add(%27hidden%27);%0A%20%20%20%20%7D%0A%20%20%20%20loadMenuDataFromAPI();%0A%0A%20%20%20%20//%20Auto-start%20polling%20if%20already%20logged%20in%0A%20%20%20%20if%20(authToken)%20%7B%0A%20%20%20%20%20%20%20%20startPolling();%0A%20%20%20%20%7D%0A%0A%20%20%20%20//%20Check%20for%20updates%0A%20%20%20%20checkForUpdates();%0A%0A%20%20%20%20console.log(%27Kantine%20Wrapper%20loaded%20%E2%9C%85%27);%0A%7D)();%0A%0A//%20===%20Error%20Modal%20===%0Afunction%20showErrorModal(title,%20htmlContent,%20btnText,%20url)%20%7B%0A%20%20%20%20const%20modalId%20=%20%27error-modal%27;%0A%20%20%20%20let%20modal%20=%20document.getElementById(modalId);%0A%20%20%20%20if%20(modal)%20modal.remove();%0A%0A%20%20%20%20modal%20=%20document.createElement(%27div%27);%0A%20%20%20%20modal.id%20=%20modalId;%0A%20%20%20%20modal.className%20=%20%27modal%20hidden%27;%0A%20%20%20%20modal.innerHTML%20=%20%60%0A%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22modal-content%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20class=%22modal-header%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Ch2%20style=%22color:%20var(--error-color);%20display:%20flex;%20align-items:%20center;%20gap:%2010px;%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cspan%20class=%22material-icons-round%22%3Esignal_wifi_off%3C/span%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%24%7Btitle%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/h2%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20style=%22padding:%2020px;%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cp%20style=%22margin-bottom:%2015px;%20color:%20var(--text-primary);%22%3E%24%7BhtmlContent%7D%3C/p%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cdiv%20style=%22margin-top:%2020px;%20display:%20flex;%20justify-content:%20center;%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cbutton%20id=%22btn-error-redirect%22%20style=%22%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20background-color:%20var(--accent-color);%20%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20color:%20white;%20%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20padding:%2012px%2024px;%20%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20border-radius:%208px;%20%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20border:%20none;%20%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20font-weight:%20600;%20%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20cursor:%20pointer;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20display:%20flex;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20align-items:%20center;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20gap:%208px;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20width:%20100%25;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20justify-content:%20center;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20transition:%20transform%200.1s;%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%22%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%24%7BbtnText%7D%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Cspan%20class=%22material-icons-round%22%3Eopen_in_new%3C/span%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/button%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%20%20%20%20%3C/div%3E%0A%20%20%20%20%20%20%20%20%60;%0A%20%20%20%20document.body.appendChild(modal);%0A%0A%20%20%20%20document.getElementById(%27btn-error-redirect%27).addEventListener(%27click%27,%20()%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20window.location.href%20=%20url;%0A%20%20%20%20%7D);%0A%0A%20%20%20%20requestAnimationFrame(()%20=%3E%20%7B%0A%20%20%20%20%20%20%20%20modal.classList.remove(%27hidden%27);%0A%20%20%20%20%7D);%0A%7D%0A%7D)();";
+        document.getElementById('bookmarklet-link').textContent = 'Kantine v1.2.1';
     </script>
 </body>
 </html>
diff --git a/dist/kantine-standalone.html b/dist/kantine-standalone.html
index d61a2df..2cb6fdf 100755
--- a/dist/kantine-standalone.html
+++ b/dist/kantine-standalone.html
@@ -475,7 +475,6 @@ body {
     justify-content: space-between;
     padding: 20px;
     border-bottom: 1px solid var(--border-color);
-    /* Changed from --border */
 }
 
 .modal-header h2 {
@@ -483,6 +482,10 @@ body {
     font-size: 1.25rem;
 }
 
+.modal-body {
+    padding: 20px;
+}
+
 #login-form {
     padding: 20px;
 }
@@ -1247,14 +1250,31 @@ body {
     }
 }
 
-/* Smart Highlights */
-.highlight-glow {
-    box-shadow: 0 0 15px rgba(59, 130, 246, 0.5);
-    /* Blue glow */
-    border: 1px solid rgba(59, 130, 246, 0.8);
-    background: rgba(59, 130, 246, 0.05);
+/* Smart Highlights (Blue Glow - matches today-ordered/flagged pattern) */
+.menu-item.highlight-glow {
+    border: 2px solid rgba(59, 130, 246, 0.7);
+    box-shadow: 0 0 20px rgba(59, 130, 246, 0.4);
+    border-radius: 8px;
+    padding: 1rem;
+    margin: 0 -1rem 1.5rem -1rem;
+    background: var(--bg-card);
     position: relative;
-    z-index: 1;
+    z-index: 5;
+    animation: blue-pulse 3s infinite;
+}
+
+@keyframes blue-pulse {
+    0% {
+        box-shadow: 0 0 15px rgba(59, 130, 246, 0.3);
+    }
+
+    50% {
+        box-shadow: 0 0 25px rgba(59, 130, 246, 0.6);
+    }
+
+    100% {
+        box-shadow: 0 0 15px rgba(59, 130, 246, 0.3);
+    }
 }
 
 /* Nav Badge with Count */
@@ -1282,23 +1302,32 @@ body {
     min-height: 50px;
 }
 
+/* Tag badges styled consistently with .badge (verfügbar/ausverkauft) */
 .tag-badge {
     display: inline-flex;
     align-items: center;
-    background: rgba(59, 130, 246, 0.15);
+    justify-content: center;
+    height: 24px;
+    font-size: 0.75rem;
+    padding: 0 10px;
+    border-radius: 4px;
+    font-weight: 600;
+    text-transform: uppercase;
+    letter-spacing: 0.05em;
+    line-height: normal;
+    white-space: nowrap;
+    background-color: rgba(59, 130, 246, 0.1);
     color: #3b82f6;
-    padding: 4px 10px;
-    border-radius: 99px;
-    font-size: 0.85rem;
-    font-weight: 500;
+    border: 1px solid rgba(59, 130, 246, 0.2);
+    gap: 4px;
 }
 
 .tag-remove {
-    margin-left: 6px;
     cursor: pointer;
     opacity: 0.7;
     font-size: 1.1em;
     line-height: 1;
+    transition: all 0.2s;
 }
 
 .tag-remove:hover {
@@ -1318,6 +1347,30 @@ body {
     border: 1px solid var(--border-color);
     color: var(--text-primary);
     border-radius: 8px;
+    font-family: inherit;
+}
+
+/* Add tag button - styled like .btn-order with nav-btn.active color */
+#btn-add-tag {
+    display: inline-flex;
+    align-items: center;
+    gap: 4px;
+    padding: 0.5rem 1rem;
+    border: none;
+    border-radius: 6px;
+    background: var(--accent-color);
+    color: white;
+    font-size: 0.8rem;
+    font-weight: 600;
+    cursor: pointer;
+    transition: all 0.2s ease;
+    font-family: inherit;
+    white-space: nowrap;
+}
+
+#btn-add-tag:hover {
+    filter: brightness(1.15);
+    transform: translateY(-1px);
 }
 
 /* Update Banner Enhanced */
@@ -1361,6 +1414,191 @@ body {
 </head>
 <body>
     <script>
+/**
+ * Mock data for standalone HTML testing.
+ * Intercepts fetch() calls to api.bessa.app and returns realistic dummy data.
+ * Injected BEFORE kantine.js in standalone builds only.
+ */
+(function () {
+    'use strict';
+
+    // Generate dates for this week and next week (Mon-Fri)
+    function getWeekDates(weekOffset) {
+        const dates = [];
+        const now = new Date();
+        const dayOfWeek = now.getDay(); // 0=Sun, 1=Mon
+        const monday = new Date(now);
+        monday.setDate(now.getDate() - (dayOfWeek === 0 ? 6 : dayOfWeek - 1) + (weekOffset * 7));
+
+        for (let i = 0; i < 5; i++) {
+            const d = new Date(monday);
+            d.setDate(monday.getDate() + i);
+            dates.push(d.toISOString().split('T')[0]);
+        }
+        return dates;
+    }
+
+    const thisWeekDates = getWeekDates(0);
+    const nextWeekDates = getWeekDates(1);
+    const allDates = [...thisWeekDates, ...nextWeekDates];
+
+    // Realistic German canteen menu items per day
+    const menuPool = [
+        [
+            { id: 101, name: 'Wiener Schnitzel mit Kartoffelsalat', description: 'Paniertes Schweineschnitzel mit hausgemachtem Kartoffelsalat', price: '6.90', available_amount: '15', amount_tracking: true },
+            { id: 102, name: 'Gemüse-Curry mit Basmatireis', description: 'Veganes Curry mit saisonalem Gemüse und Kokosmilch', price: '5.50', available_amount: '0', amount_tracking: true },
+            { id: 103, name: 'Rindergulasch mit Spätzle', description: 'Geschmortes Rindfleisch in Paprikasauce mit Eierspätzle', price: '7.20', available_amount: '8', amount_tracking: true },
+            { id: 104, name: 'Tagessuppe: Tomatencremesuppe', description: 'Cremige Tomatensuppe mit Croutons', price: '3.20', available_amount: '0', amount_tracking: false },
+        ],
+        [
+            { id: 201, name: 'Hähnchenbrust mit Pilzrahmsauce', description: 'Gebratene Hähnchenbrust mit Champignon-Rahmsauce und Reis', price: '6.50', available_amount: '12', amount_tracking: true },
+            { id: 202, name: 'Vegetarische Lasagne', description: 'Lasagne mit Spinat, Ricotta und Tomatensauce', price: '5.80', available_amount: '10', amount_tracking: true },
+            { id: 203, name: 'Bratwurst mit Sauerkraut', description: 'Thüringer Bratwurst mit Sauerkraut und Kartoffelpüree', price: '5.90', available_amount: '0', amount_tracking: true },
+            { id: 204, name: 'Caesar Salad mit Hähnchen', description: 'Römersalat mit gegrilltem Hähnchen, Parmesan und Croutons', price: '6.10', available_amount: '0', amount_tracking: false },
+        ],
+        [
+            { id: 301, name: 'Spaghetti Bolognese', description: 'Klassische Bolognese mit frischen Spaghetti', price: '5.20', available_amount: '20', amount_tracking: true },
+            { id: 302, name: 'Gebratener Lachs mit Dillsauce', description: 'Lachsfilet auf Blattspinat mit Senf-Dill-Sauce', price: '8.50', available_amount: '5', amount_tracking: true },
+            { id: 303, name: 'Kartoffelgratin mit Salat', description: 'Überbackene Kartoffeln mit Sahne und Käse, dazu gemischter Salat', price: '5.00', available_amount: '0', amount_tracking: false },
+            { id: 304, name: 'Chili con Carne', description: 'Pikantes Chili mit Hackfleisch, Bohnen und Reis', price: '5.80', available_amount: '9', amount_tracking: true },
+        ],
+        [
+            { id: 401, name: 'Schweinebraten mit Knödel', description: 'Bayerischer Schweinebraten mit Semmelknödel und Bratensauce', price: '7.00', available_amount: '7', amount_tracking: true },
+            { id: 402, name: 'Falafel-Bowl mit Hummus', description: 'Knusprige Falafel mit Hummus, Tabouleh und Fladenbrot', price: '5.90', available_amount: '0', amount_tracking: false },
+            { id: 403, name: 'Putengeschnetzeltes mit Nudeln', description: 'Putenstreifen in Champignon-Sahnesauce mit Bandnudeln', price: '6.30', available_amount: '11', amount_tracking: true },
+            { id: 404, name: 'Tagessuppe: Erbsensuppe', description: 'Deftige Erbsensuppe mit Wiener Würstchen', price: '3.50', available_amount: '0', amount_tracking: false },
+        ],
+        [
+            { id: 501, name: 'Backfisch mit Remoulade', description: 'Paniertes Seelachsfilet mit Remouladensauce und Bratkartoffeln', price: '6.80', available_amount: '6', amount_tracking: true },
+            { id: 502, name: 'Käsespätzle mit Röstzwiebeln', description: 'Allgäuer Käsespätzle mit karamellisierten Zwiebeln und Salat', price: '5.50', available_amount: '14', amount_tracking: true },
+            { id: 503, name: 'Schnitzel Wiener Art mit Pommes', description: 'Paniertes Hähnchenschnitzel mit knusprigen Pommes Frites', price: '6.20', available_amount: '0', amount_tracking: true },
+            { id: 504, name: 'Griechischer Bauernsalat', description: 'Frischer Salat mit Feta, Oliven, Gurke und Tomaten', price: '5.30', available_amount: '0', amount_tracking: false },
+        ],
+    ];
+
+    // Build mock responses for each date
+    const dateResponses = {};
+    allDates.forEach((date, i) => {
+        const menuIndex = i % menuPool.length;
+        dateResponses[date] = {
+            results: [{
+                id: 1,
+                name: 'Mittagsmenü',
+                items: menuPool[menuIndex].map(item => ({
+                    ...item,
+                    // Ensure unique IDs per date
+                    id: item.id + (i * 1000)
+                }))
+            }]
+        };
+    });
+
+    // Mock some orders for today (to show "Bestellt" badges)
+    const todayStr = new Date().toISOString().split('T')[0];
+    const todayMenu = dateResponses[todayStr];
+    const mockOrders = [];
+    let nextOrderId = 9001;
+    if (todayMenu) {
+        const firstItem = todayMenu.results[0].items[0];
+        mockOrders.push({
+            id: nextOrderId++,
+            article: firstItem.id,
+            article_name: firstItem.name,
+            date: todayStr,
+            venue: 591,
+            status: 'confirmed',
+            created: new Date().toISOString()
+        });
+    }
+
+    // Pre-seed a mock auth session so flag/order buttons render
+    sessionStorage.setItem('kantine_authToken', 'mock-token-for-testing');
+    sessionStorage.setItem('kantine_currentUser', '12345');
+    sessionStorage.setItem('kantine_firstName', 'Test');
+    sessionStorage.setItem('kantine_lastName', 'User');
+
+    // Intercept fetch
+    const originalFetch = window.fetch;
+    window.fetch = function (url, options) {
+        const urlStr = typeof url === 'string' ? url : url.toString();
+
+        // Menu dates endpoint
+        if (urlStr.includes('/menu/dates/')) {
+            console.log('[MOCK] Returning mock dates data');
+            return Promise.resolve(new Response(JSON.stringify({
+                results: allDates.map(date => ({ date, orders: [] }))
+            }), { status: 200, headers: { 'Content-Type': 'application/json' } }));
+        }
+
+        // Menu detail for a specific date
+        const dateMatch = urlStr.match(/\/menu\/\d+\/(\d{4}-\d{2}-\d{2})\//);
+        if (dateMatch) {
+            const date = dateMatch[1];
+            const data = dateResponses[date] || { results: [] };
+            console.log(`[MOCK] Returning mock menu for ${date}`);
+            return Promise.resolve(new Response(JSON.stringify(data), {
+                status: 200, headers: { 'Content-Type': 'application/json' }
+            }));
+        }
+
+        // Orders endpoint
+        if (urlStr.includes('/user/orders/') && (!options || options.method === 'GET' || !options.method)) {
+            console.log('[MOCK] Returning mock orders');
+            return Promise.resolve(new Response(JSON.stringify({
+                results: mockOrders
+            }), { status: 200, headers: { 'Content-Type': 'application/json' } }));
+        }
+
+        // Auth user endpoint
+        if (urlStr.includes('/auth/user/')) {
+            console.log('[MOCK] Returning mock user');
+            return Promise.resolve(new Response(JSON.stringify({
+                pk: 12345,
+                username: 'testuser',
+                email: 'test@example.com',
+                first_name: 'Test',
+                last_name: 'User'
+            }), { status: 200, headers: { 'Content-Type': 'application/json' } }));
+        }
+
+        // Order create (POST to /user/orders/)
+        if (urlStr.includes('/user/orders/') && options && options.method === 'POST') {
+            const body = JSON.parse(options.body || '{}');
+            const newOrder = {
+                id: nextOrderId++,
+                article: body.article,
+                article_name: 'Mock Order',
+                date: body.date,
+                venue: 591,
+                status: 'confirmed',
+                created: new Date().toISOString()
+            };
+            mockOrders.push(newOrder);
+            console.log('[MOCK] Created order:', newOrder);
+            return Promise.resolve(new Response(JSON.stringify(newOrder), {
+                status: 201, headers: { 'Content-Type': 'application/json' }
+            }));
+        }
+
+        // Order cancel (POST to /user/orders/{id}/cancel/)
+        const cancelMatch = urlStr.match(/\/user\/orders\/(\d+)\/cancel\//);
+        if (cancelMatch) {
+            const orderId = parseInt(cancelMatch[1]);
+            const idx = mockOrders.findIndex(o => o.id === orderId);
+            if (idx >= 0) mockOrders.splice(idx, 1);
+            console.log('[MOCK] Cancelled order:', orderId);
+            return Promise.resolve(new Response('{}', {
+                status: 200, headers: { 'Content-Type': 'application/json' }
+            }));
+        }
+
+        // Fallback to real fetch for other URLs (fonts, etc.)
+        return originalFetch.apply(this, arguments);
+    };
+
+    console.log('[MOCK] 🧪 Mock data active – using dummy canteen menus for UI testing');
+})();
+
 /**
  * Kantine Wrapper – Client-Only Bookmarklet
  * Replaces Bessa page content with enhanced weekly menu view.
@@ -1429,7 +1667,7 @@ body {
                     <div class="brand">
                         <span class="material-icons-round logo-icon">restaurant_menu</span>
                         <div class="header-left">
-                            <h1>Kantinen Übersicht <small style="font-size: 0.6em; opacity: 0.7; font-weight: 400;">v1.2.0</small></h1>
+                            <h1>Kantinen Übersicht <small style="font-size: 0.6em; opacity: 0.7; font-weight: 400;">v1.2.1</small></h1>
                             <div id="last-updated-subtitle" class="subtitle"></div>
                         </div>
                     </div>
@@ -2673,6 +2911,11 @@ body {
                 itemEl.classList.add(item.available ? 'flagged-available' : 'flagged-sold-out');
             }
 
+            // Highlight matching menu items based on user tags
+            if (checkHighlight(item.name) || checkHighlight(item.description)) {
+                itemEl.classList.add('highlight-glow');
+            }
+
             // Action buttons
             let orderButton = '';
             let cancelButton = '';
@@ -2762,7 +3005,7 @@ body {
 
     // === Version Check ===
     async function checkForUpdates() {
-        const CurrentVersion = 'v1.2.0';
+        const CurrentVersion = 'v1.2.1';
         const VersionUrl = 'https://raw.githubusercontent.com/TauNeutrino/kantine-overview/main/version.txt';
         const InstallerUrl = 'https://htmlpreview.github.io/?https://github.com/TauNeutrino/kantine-overview/blob/main/dist/install.html';
 
diff --git a/kantine.js b/kantine.js
index c207c47..57261d5 100755
--- a/kantine.js
+++ b/kantine.js
@@ -1310,6 +1310,11 @@
                 itemEl.classList.add(item.available ? 'flagged-available' : 'flagged-sold-out');
             }
 
+            // Highlight matching menu items based on user tags
+            if (checkHighlight(item.name) || checkHighlight(item.description)) {
+                itemEl.classList.add('highlight-glow');
+            }
+
             // Action buttons
             let orderButton = '';
             let cancelButton = '';
diff --git a/mock-data.js b/mock-data.js
new file mode 100755
index 0000000..9a33524
--- /dev/null
+++ b/mock-data.js
@@ -0,0 +1,184 @@
+/**
+ * Mock data for standalone HTML testing.
+ * Intercepts fetch() calls to api.bessa.app and returns realistic dummy data.
+ * Injected BEFORE kantine.js in standalone builds only.
+ */
+(function () {
+    'use strict';
+
+    // Generate dates for this week and next week (Mon-Fri)
+    function getWeekDates(weekOffset) {
+        const dates = [];
+        const now = new Date();
+        const dayOfWeek = now.getDay(); // 0=Sun, 1=Mon
+        const monday = new Date(now);
+        monday.setDate(now.getDate() - (dayOfWeek === 0 ? 6 : dayOfWeek - 1) + (weekOffset * 7));
+
+        for (let i = 0; i < 5; i++) {
+            const d = new Date(monday);
+            d.setDate(monday.getDate() + i);
+            dates.push(d.toISOString().split('T')[0]);
+        }
+        return dates;
+    }
+
+    const thisWeekDates = getWeekDates(0);
+    const nextWeekDates = getWeekDates(1);
+    const allDates = [...thisWeekDates, ...nextWeekDates];
+
+    // Realistic German canteen menu items per day
+    const menuPool = [
+        [
+            { id: 101, name: 'Wiener Schnitzel mit Kartoffelsalat', description: 'Paniertes Schweineschnitzel mit hausgemachtem Kartoffelsalat', price: '6.90', available_amount: '15', amount_tracking: true },
+            { id: 102, name: 'Gemüse-Curry mit Basmatireis', description: 'Veganes Curry mit saisonalem Gemüse und Kokosmilch', price: '5.50', available_amount: '0', amount_tracking: true },
+            { id: 103, name: 'Rindergulasch mit Spätzle', description: 'Geschmortes Rindfleisch in Paprikasauce mit Eierspätzle', price: '7.20', available_amount: '8', amount_tracking: true },
+            { id: 104, name: 'Tagessuppe: Tomatencremesuppe', description: 'Cremige Tomatensuppe mit Croutons', price: '3.20', available_amount: '0', amount_tracking: false },
+        ],
+        [
+            { id: 201, name: 'Hähnchenbrust mit Pilzrahmsauce', description: 'Gebratene Hähnchenbrust mit Champignon-Rahmsauce und Reis', price: '6.50', available_amount: '12', amount_tracking: true },
+            { id: 202, name: 'Vegetarische Lasagne', description: 'Lasagne mit Spinat, Ricotta und Tomatensauce', price: '5.80', available_amount: '10', amount_tracking: true },
+            { id: 203, name: 'Bratwurst mit Sauerkraut', description: 'Thüringer Bratwurst mit Sauerkraut und Kartoffelpüree', price: '5.90', available_amount: '0', amount_tracking: true },
+            { id: 204, name: 'Caesar Salad mit Hähnchen', description: 'Römersalat mit gegrilltem Hähnchen, Parmesan und Croutons', price: '6.10', available_amount: '0', amount_tracking: false },
+        ],
+        [
+            { id: 301, name: 'Spaghetti Bolognese', description: 'Klassische Bolognese mit frischen Spaghetti', price: '5.20', available_amount: '20', amount_tracking: true },
+            { id: 302, name: 'Gebratener Lachs mit Dillsauce', description: 'Lachsfilet auf Blattspinat mit Senf-Dill-Sauce', price: '8.50', available_amount: '5', amount_tracking: true },
+            { id: 303, name: 'Kartoffelgratin mit Salat', description: 'Überbackene Kartoffeln mit Sahne und Käse, dazu gemischter Salat', price: '5.00', available_amount: '0', amount_tracking: false },
+            { id: 304, name: 'Chili con Carne', description: 'Pikantes Chili mit Hackfleisch, Bohnen und Reis', price: '5.80', available_amount: '9', amount_tracking: true },
+        ],
+        [
+            { id: 401, name: 'Schweinebraten mit Knödel', description: 'Bayerischer Schweinebraten mit Semmelknödel und Bratensauce', price: '7.00', available_amount: '7', amount_tracking: true },
+            { id: 402, name: 'Falafel-Bowl mit Hummus', description: 'Knusprige Falafel mit Hummus, Tabouleh und Fladenbrot', price: '5.90', available_amount: '0', amount_tracking: false },
+            { id: 403, name: 'Putengeschnetzeltes mit Nudeln', description: 'Putenstreifen in Champignon-Sahnesauce mit Bandnudeln', price: '6.30', available_amount: '11', amount_tracking: true },
+            { id: 404, name: 'Tagessuppe: Erbsensuppe', description: 'Deftige Erbsensuppe mit Wiener Würstchen', price: '3.50', available_amount: '0', amount_tracking: false },
+        ],
+        [
+            { id: 501, name: 'Backfisch mit Remoulade', description: 'Paniertes Seelachsfilet mit Remouladensauce und Bratkartoffeln', price: '6.80', available_amount: '6', amount_tracking: true },
+            { id: 502, name: 'Käsespätzle mit Röstzwiebeln', description: 'Allgäuer Käsespätzle mit karamellisierten Zwiebeln und Salat', price: '5.50', available_amount: '14', amount_tracking: true },
+            { id: 503, name: 'Schnitzel Wiener Art mit Pommes', description: 'Paniertes Hähnchenschnitzel mit knusprigen Pommes Frites', price: '6.20', available_amount: '0', amount_tracking: true },
+            { id: 504, name: 'Griechischer Bauernsalat', description: 'Frischer Salat mit Feta, Oliven, Gurke und Tomaten', price: '5.30', available_amount: '0', amount_tracking: false },
+        ],
+    ];
+
+    // Build mock responses for each date
+    const dateResponses = {};
+    allDates.forEach((date, i) => {
+        const menuIndex = i % menuPool.length;
+        dateResponses[date] = {
+            results: [{
+                id: 1,
+                name: 'Mittagsmenü',
+                items: menuPool[menuIndex].map(item => ({
+                    ...item,
+                    // Ensure unique IDs per date
+                    id: item.id + (i * 1000)
+                }))
+            }]
+        };
+    });
+
+    // Mock some orders for today (to show "Bestellt" badges)
+    const todayStr = new Date().toISOString().split('T')[0];
+    const todayMenu = dateResponses[todayStr];
+    const mockOrders = [];
+    let nextOrderId = 9001;
+    if (todayMenu) {
+        const firstItem = todayMenu.results[0].items[0];
+        mockOrders.push({
+            id: nextOrderId++,
+            article: firstItem.id,
+            article_name: firstItem.name,
+            date: todayStr,
+            venue: 591,
+            status: 'confirmed',
+            created: new Date().toISOString()
+        });
+    }
+
+    // Pre-seed a mock auth session so flag/order buttons render
+    sessionStorage.setItem('kantine_authToken', 'mock-token-for-testing');
+    sessionStorage.setItem('kantine_currentUser', '12345');
+    sessionStorage.setItem('kantine_firstName', 'Test');
+    sessionStorage.setItem('kantine_lastName', 'User');
+
+    // Intercept fetch
+    const originalFetch = window.fetch;
+    window.fetch = function (url, options) {
+        const urlStr = typeof url === 'string' ? url : url.toString();
+
+        // Menu dates endpoint
+        if (urlStr.includes('/menu/dates/')) {
+            console.log('[MOCK] Returning mock dates data');
+            return Promise.resolve(new Response(JSON.stringify({
+                results: allDates.map(date => ({ date, orders: [] }))
+            }), { status: 200, headers: { 'Content-Type': 'application/json' } }));
+        }
+
+        // Menu detail for a specific date
+        const dateMatch = urlStr.match(/\/menu\/\d+\/(\d{4}-\d{2}-\d{2})\//);
+        if (dateMatch) {
+            const date = dateMatch[1];
+            const data = dateResponses[date] || { results: [] };
+            console.log(`[MOCK] Returning mock menu for ${date}`);
+            return Promise.resolve(new Response(JSON.stringify(data), {
+                status: 200, headers: { 'Content-Type': 'application/json' }
+            }));
+        }
+
+        // Orders endpoint
+        if (urlStr.includes('/user/orders/') && (!options || options.method === 'GET' || !options.method)) {
+            console.log('[MOCK] Returning mock orders');
+            return Promise.resolve(new Response(JSON.stringify({
+                results: mockOrders
+            }), { status: 200, headers: { 'Content-Type': 'application/json' } }));
+        }
+
+        // Auth user endpoint
+        if (urlStr.includes('/auth/user/')) {
+            console.log('[MOCK] Returning mock user');
+            return Promise.resolve(new Response(JSON.stringify({
+                pk: 12345,
+                username: 'testuser',
+                email: 'test@example.com',
+                first_name: 'Test',
+                last_name: 'User'
+            }), { status: 200, headers: { 'Content-Type': 'application/json' } }));
+        }
+
+        // Order create (POST to /user/orders/)
+        if (urlStr.includes('/user/orders/') && options && options.method === 'POST') {
+            const body = JSON.parse(options.body || '{}');
+            const newOrder = {
+                id: nextOrderId++,
+                article: body.article,
+                article_name: 'Mock Order',
+                date: body.date,
+                venue: 591,
+                status: 'confirmed',
+                created: new Date().toISOString()
+            };
+            mockOrders.push(newOrder);
+            console.log('[MOCK] Created order:', newOrder);
+            return Promise.resolve(new Response(JSON.stringify(newOrder), {
+                status: 201, headers: { 'Content-Type': 'application/json' }
+            }));
+        }
+
+        // Order cancel (POST to /user/orders/{id}/cancel/)
+        const cancelMatch = urlStr.match(/\/user\/orders\/(\d+)\/cancel\//);
+        if (cancelMatch) {
+            const orderId = parseInt(cancelMatch[1]);
+            const idx = mockOrders.findIndex(o => o.id === orderId);
+            if (idx >= 0) mockOrders.splice(idx, 1);
+            console.log('[MOCK] Cancelled order:', orderId);
+            return Promise.resolve(new Response('{}', {
+                status: 200, headers: { 'Content-Type': 'application/json' }
+            }));
+        }
+
+        // Fallback to real fetch for other URLs (fonts, etc.)
+        return originalFetch.apply(this, arguments);
+    };
+
+    console.log('[MOCK] 🧪 Mock data active – using dummy canteen menus for UI testing');
+})();
diff --git a/style.css b/style.css
index fab71bc..806ceb5 100755
--- a/style.css
+++ b/style.css
@@ -464,7 +464,6 @@ body {
     justify-content: space-between;
     padding: 20px;
     border-bottom: 1px solid var(--border-color);
-    /* Changed from --border */
 }
 
 .modal-header h2 {
@@ -472,6 +471,10 @@ body {
     font-size: 1.25rem;
 }
 
+.modal-body {
+    padding: 20px;
+}
+
 #login-form {
     padding: 20px;
 }
@@ -1236,14 +1239,31 @@ body {
     }
 }
 
-/* Smart Highlights */
-.highlight-glow {
-    box-shadow: 0 0 15px rgba(59, 130, 246, 0.5);
-    /* Blue glow */
-    border: 1px solid rgba(59, 130, 246, 0.8);
-    background: rgba(59, 130, 246, 0.05);
+/* Smart Highlights (Blue Glow - matches today-ordered/flagged pattern) */
+.menu-item.highlight-glow {
+    border: 2px solid rgba(59, 130, 246, 0.7);
+    box-shadow: 0 0 20px rgba(59, 130, 246, 0.4);
+    border-radius: 8px;
+    padding: 1rem;
+    margin: 0 -1rem 1.5rem -1rem;
+    background: var(--bg-card);
     position: relative;
-    z-index: 1;
+    z-index: 5;
+    animation: blue-pulse 3s infinite;
+}
+
+@keyframes blue-pulse {
+    0% {
+        box-shadow: 0 0 15px rgba(59, 130, 246, 0.3);
+    }
+
+    50% {
+        box-shadow: 0 0 25px rgba(59, 130, 246, 0.6);
+    }
+
+    100% {
+        box-shadow: 0 0 15px rgba(59, 130, 246, 0.3);
+    }
 }
 
 /* Nav Badge with Count */
@@ -1271,23 +1291,32 @@ body {
     min-height: 50px;
 }
 
+/* Tag badges styled consistently with .badge (verfügbar/ausverkauft) */
 .tag-badge {
     display: inline-flex;
     align-items: center;
-    background: rgba(59, 130, 246, 0.15);
+    justify-content: center;
+    height: 24px;
+    font-size: 0.75rem;
+    padding: 0 10px;
+    border-radius: 4px;
+    font-weight: 600;
+    text-transform: uppercase;
+    letter-spacing: 0.05em;
+    line-height: normal;
+    white-space: nowrap;
+    background-color: rgba(59, 130, 246, 0.1);
     color: #3b82f6;
-    padding: 4px 10px;
-    border-radius: 99px;
-    font-size: 0.85rem;
-    font-weight: 500;
+    border: 1px solid rgba(59, 130, 246, 0.2);
+    gap: 4px;
 }
 
 .tag-remove {
-    margin-left: 6px;
     cursor: pointer;
     opacity: 0.7;
     font-size: 1.1em;
     line-height: 1;
+    transition: all 0.2s;
 }
 
 .tag-remove:hover {
@@ -1307,6 +1336,30 @@ body {
     border: 1px solid var(--border-color);
     color: var(--text-primary);
     border-radius: 8px;
+    font-family: inherit;
+}
+
+/* Add tag button - styled like .btn-order with nav-btn.active color */
+#btn-add-tag {
+    display: inline-flex;
+    align-items: center;
+    gap: 4px;
+    padding: 0.5rem 1rem;
+    border: none;
+    border-radius: 6px;
+    background: var(--accent-color);
+    color: white;
+    font-size: 0.8rem;
+    font-weight: 600;
+    cursor: pointer;
+    transition: all 0.2s ease;
+    font-family: inherit;
+    white-space: nowrap;
+}
+
+#btn-add-tag:hover {
+    filter: brightness(1.15);
+    transform: translateY(-1px);
 }
 
 /* Update Banner Enhanced */
diff --git a/version.txt b/version.txt
index 79127d8..6a5e98a 100755
--- a/version.txt
+++ b/version.txt
@@ -1 +1 @@
-v1.2.0
+v1.2.1