{"id":5795,"date":"2025-12-15T05:14:53","date_gmt":"2025-12-15T04:14:53","guid":{"rendered":"https:\/\/melodypartybox.de\/myzeil\/?page_id=5795"},"modified":"2026-05-03T15:19:50","modified_gmt":"2026-05-03T14:19:50","slug":"preisrechner","status":"publish","type":"page","link":"https:\/\/melodypartybox.de\/myzeil\/preisrechner\/","title":{"rendered":"Preisrechner"},"content":{"rendered":"
<\/div><\/div>
\n\n \n \n \n Raumpreise Berechnung<\/title>\n <!-- Stand Code: 20260503-1616 \u2014 Preise in PRICE_TABLE (melodypartybox.de\/myzeil\/raumpreise\/) -->\n <link href=\"https:\/\/maxcdn.bootstrapcdn.com\/bootstrap\/4.0.0\/css\/bootstrap.min.css\" rel=\"stylesheet\">\n <link href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/5.15.4\/css\/all.min.css\" rel=\"stylesheet\">\n <style>\n body {\n padding-top: 20px;\n background-color: #f8f9fa; \/* Light gray background *\/\n font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;\n }\n .container {\n max-width: 600px; \/* Wider container *\/\n background-color: #ffffff; \/* White background for the container *\/\n padding: 20px; \/* Padding inside the container *\/\n border-radius: 8px; \/* Rounded corners for the container *\/\n box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); \/* Subtle shadow for the container *\/\n margin-bottom: 20px; \/* Margin at the bottom of the container *\/\n }\n \n \/* Mobile responsiveness *\/\n @media (max-width: 768px) {\n .container {\n max-width: 100%;\n margin: 10px;\n padding: 15px;\n border-radius: 4px;\n }\n body {\n padding-top: 10px;\n padding-left: 5px;\n padding-right: 5px;\n }\n h1 {\n font-size: 2rem;\n margin-bottom: 0.5rem;\n }\n h3 {\n font-size: 1.25rem;\n }\n }\n \n @media (max-width: 480px) {\n .container {\n margin: 5px;\n padding: 10px;\n }\n body {\n padding-top: 5px;\n padding-left: 2px;\n padding-right: 2px;\n }\n h1 {\n font-size: 1.75rem;\n }\n h3 {\n font-size: 1.1rem;\n }\n }\n h1 {\n color: #007bff; \/* Bootstrap primary color for the heading *\/\n font-size: 2.5rem; \/* Larger font size for the heading *\/\n margin-bottom: 1rem; \/* Space below the heading *\/\n }\n .result {\n background-color: #f1f1f1; \/* Lighter background for the result area *\/\n padding: 15px; \/* Padding inside the result area *\/\n border-radius: 8px; \/* Rounded corners for the result area *\/\n margin-top: 20px; \/* Margin above the result area *\/\n }\n .result p { margin: 0.1rem 0; line-height: 1.2; }\n #disclaimer {\n font-size: 0.85rem; \/* Smaller font size for the disclaimer *\/\n color: #6c757d; \/* Bootstrap secondary color for the disclaimer *\/\n }\n \/* Additional custom styles *\/\n \/* Larger tap targets and prevent iOS zoom by using >=16px *\/\n input, select, textarea { font-size: 16px; }\n select.form-control { padding-top: 0.375rem; padding-bottom: 0.375rem; height: auto; }\n \/* Ausgew\u00e4hlte Dropdown-Werte hervorheben *\/\n select.form-control.field-selected,\n input[type=\"date\"].form-control.field-selected {\n font-weight: 700;\n color: #212529;\n }\n .date-display-overlay.field-selected {\n font-weight: 700;\n color: #212529;\n }\n \n \/* Mobile form improvements *\/\n @media (max-width: 768px) {\n .form-control {\n font-size: 16px; \/* Prevent zoom on iOS *\/\n padding: 0.75rem;\n }\n .btn {\n padding: 0.75rem 1rem;\n font-size: 16px;\n }\n .form-check-input {\n margin-top: 0.3rem;\n }\n .form-check-label {\n padding-left: 0.5rem;\n }\n }\n \/* Date display overlay styling *\/\n .date-input-wrapper {\n position: relative;\n }\n .date-display-overlay {\n position: absolute;\n top: 2px;\n left: 2px;\n right: 42px;\n bottom: 2px;\n background: white;\n display: flex;\n align-items: center;\n padding-left: 0.65rem;\n font-size: 16px;\n font-weight: 500;\n color: #212529;\n pointer-events: none;\n border-radius: 0.2rem 0 0 0.2rem;\n }\n .date-display-overlay:empty {\n display: none;\n }\n \n \/* Holiday Toggle Switch *\/\n .toggle-container {\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 10px 0;\n }\n .toggle-switch {\n position: relative;\n width: 70px;\n height: 36px;\n margin-right: 12px;\n }\n .toggle-switch input {\n opacity: 0;\n width: 0;\n height: 0;\n }\n .toggle-slider {\n position: absolute;\n cursor: pointer;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background: linear-gradient(135deg, #e0e0e0 0%, #c0c0c0 100%);\n transition: all 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);\n border-radius: 36px;\n box-shadow: inset 0 2px 4px rgba(0,0,0,0.1), 0 2px 4px rgba(0,0,0,0.1);\n }\n .toggle-slider:before {\n position: absolute;\n content: \"\";\n height: 28px;\n width: 28px;\n left: 4px;\n bottom: 4px;\n background: linear-gradient(135deg, #ffffff 0%, #f0f0f0 100%);\n transition: all 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);\n border-radius: 50%;\n box-shadow: 0 2px 8px rgba(0,0,0,0.2);\n }\n .toggle-switch input:checked + .toggle-slider {\n background: linear-gradient(135deg, #ff6b6b 0%, #ee5a5a 100%);\n box-shadow: inset 0 2px 4px rgba(0,0,0,0.1), 0 0 20px rgba(238,90,90,0.4);\n }\n .toggle-switch input:checked + .toggle-slider:before {\n transform: translateX(34px);\n background: linear-gradient(135deg, #ffffff 0%, #fff5f5 100%);\n }\n .toggle-switch input:focus + .toggle-slider {\n box-shadow: inset 0 2px 4px rgba(0,0,0,0.1), 0 0 0 3px rgba(238,90,90,0.3);\n }\n .toggle-label {\n font-size: 18px;\n font-weight: 500;\n color: #6c757d;\n cursor: pointer;\n transition: all 0.3s ease;\n user-select: none;\n }\n .toggle-label.active {\n color: #ee5a5a;\n font-weight: 700;\n }\n .toggle-label:hover {\n color: #495057;\n }\n .toggle-label.active:hover {\n color: #dc3545;\n }\n \/* Holiday icon animation *\/\n .toggle-label .holiday-icon {\n display: inline-block;\n margin-right: 6px;\n transition: transform 0.3s ease;\n }\n .toggle-label.active .holiday-icon {\n animation: bounce 0.5s ease;\n }\n @keyframes bounce {\n 0%, 100% { transform: scale(1); }\n 50% { transform: scale(1.3); }\n }\n \n \/* Per-person split toggle (orientation only) *\/\n .per-person-split-panel {\n background: linear-gradient(135deg, #f8f9fc 0%, #eef1f8 100%);\n border: 1px solid #dee2e6;\n border-radius: 10px;\n padding: 0.85rem 1rem;\n margin-bottom: 1rem;\n box-shadow: 0 2px 8px rgba(0, 51, 102, 0.06);\n }\n .per-person-split-header {\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n gap: 0.75rem 1rem;\n user-select: none;\n margin-bottom: 0;\n font-weight: normal;\n }\n .per-person-split-header:focus-within .per-person-slider {\n box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.25);\n }\n .per-person-split-title strong {\n color: #0d47a1;\n font-size: 1rem;\n }\n .per-person-split-title .sub {\n font-size: 0.8rem;\n color: #6c757d;\n line-height: 1.25;\n margin-top: 0.15rem;\n }\n .per-person-switch {\n position: relative;\n width: 52px;\n height: 28px;\n flex-shrink: 0;\n }\n .per-person-switch input {\n opacity: 0;\n width: 0;\n height: 0;\n }\n .per-person-slider {\n position: absolute;\n cursor: pointer;\n top: 0;\n left: 0;\n right: 0;\n bottom: 0;\n background: #ced4da;\n transition: 0.25s ease;\n border-radius: 28px;\n box-shadow: inset 0 1px 3px rgba(0,0,0,0.12);\n }\n .per-person-slider:before {\n position: absolute;\n content: \"\";\n height: 22px;\n width: 22px;\n left: 3px;\n bottom: 3px;\n background: white;\n transition: 0.25s ease;\n border-radius: 50%;\n box-shadow: 0 2px 4px rgba(0,0,0,0.15);\n }\n .per-person-switch input:checked + .per-person-slider {\n background: linear-gradient(135deg, #007bff 0%, #0056b3 100%);\n }\n .per-person-switch input:checked + .per-person-slider:before {\n transform: translateX(24px);\n }\n .per-person-switch input:focus-visible + .per-person-slider {\n box-shadow: 0 0 0 3px rgba(0, 123, 255, 0.35);\n }\n .per-person-reminder {\n margin-top: 0.75rem;\n padding: 0.65rem 0.85rem;\n font-size: 0.82rem;\n line-height: 1.45;\n color: #495057;\n background: #fff;\n border-left: 4px solid #17a2b8;\n border-radius: 0 6px 6px 0;\n box-shadow: 0 1px 3px rgba(0,0,0,0.05);\n }\n .per-person-reminder i {\n color: #17a2b8;\n margin-right: 0.35rem;\n }\n .per-person-line-muted {\n display: block;\n margin-top: 0.35rem;\n font-size: 0.88rem;\n font-weight: 500;\n color: #5a6570;\n line-height: 1.35;\n }\n @media (max-width: 480px) {\n .per-person-split-header {\n align-items: flex-start;\n }\n .per-person-reminder {\n font-size: 0.78rem;\n }\n }\n \n \/* Notice box styling *\/\n .notice-box {\n border-left: 5px solid #ffc107;\n background: linear-gradient(135deg, #fff3cd 0%, #ffe69c 100%);\n border-radius: 8px;\n padding: 1rem;\n }\n .notice-icon {\n font-size: 2rem;\n color: #856404;\n }\n \n \/* Action buttons styling *\/\n .btn-action {\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 1rem 2rem;\n font-size: 1.1rem;\n font-weight: 600;\n border-radius: 12px;\n text-decoration: none;\n transition: all 0.3s ease;\n min-width: 140px;\n box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);\n }\n .btn-action i {\n font-size: 1.8rem;\n margin-bottom: 0.5rem;\n }\n .btn-action:hover {\n transform: translateY(-3px);\n box-shadow: 0 6px 12px rgba(0, 0, 0, 0.15);\n text-decoration: none;\n }\n .btn-faq {\n background: linear-gradient(135deg, #6c757d 0%, #495057 100%);\n color: white;\n border: none;\n }\n .btn-faq:hover {\n background: linear-gradient(135deg, #5a6268 0%, #3d4246 100%);\n color: white;\n }\n .btn-reservierung {\n background: linear-gradient(135deg, #28a745 0%, #1e7e34 100%);\n color: white;\n border: none;\n animation: pulse-attention 2s infinite;\n position: relative;\n }\n .btn-reservierung:hover {\n background: linear-gradient(135deg, #218838 0%, #1a6b2c 100%);\n color: white;\n animation: none;\n }\n @keyframes pulse-attention {\n 0%, 100% { \n transform: scale(1);\n box-shadow: 0 4px 6px rgba(40, 167, 69, 0.3);\n }\n 50% { \n transform: scale(1.05);\n box-shadow: 0 6px 20px rgba(40, 167, 69, 0.5);\n }\n }\n \n \/* CTA Box after calculation *\/\n .cta-box {\n background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);\n border-radius: 12px;\n padding: 1.5rem;\n text-align: center;\n color: white;\n box-shadow: 0 4px 15px rgba(220, 53, 69, 0.4);\n animation: glow-pulse 2s infinite;\n }\n .cta-content {\n display: flex;\n align-items: center;\n justify-content: center;\n margin-bottom: 1rem;\n }\n .cta-hand {\n font-size: 2.5rem;\n margin-right: 1rem;\n animation: point-anim 1s infinite;\n }\n .cta-text {\n text-align: left;\n font-size: 1.1rem;\n }\n .btn-cta-reservierung {\n background: white !important;\n color: #dc3545 !important;\n font-size: 1.3rem !important;\n padding: 1rem 2.5rem !important;\n font-weight: bold !important;\n border: 3px solid white !important;\n animation: none !important;\n }\n .btn-cta-reservierung:hover {\n background: #28a745 !important;\n color: white !important;\n border-color: #28a745 !important;\n }\n .btn-cta-reservierung::after {\n display: none !important;\n }\n @keyframes glow-pulse {\n 0%, 100% { box-shadow: 0 4px 15px rgba(220, 53, 69, 0.4); }\n 50% { box-shadow: 0 4px 30px rgba(220, 53, 69, 0.7); }\n }\n @keyframes point-anim {\n 0%, 100% { transform: translateX(0); }\n 50% { transform: translateX(10px); }\n }\n @media (prefers-reduced-motion: reduce) {\n .btn-reservierung,\n .cta-box,\n .cta-hand,\n .btn-cta-reservierung {\n animation: none !important;\n }\n .btn-action:hover {\n transform: none;\n }\n }\n @media (max-width: 480px) {\n .action-buttons {\n flex-direction: column;\n align-items: center;\n }\n .btn-action {\n width: 100%;\n margin-bottom: 0.75rem;\n }\n .btn-action.mr-3 {\n margin-right: 0 !important;\n }\n }\n \n \/* Reset button styling *\/\n #resetFormLink {\n margin-top: 10px;\n padding: 8px 16px;\n font-weight: 500;\n transition: all 0.2s ease;\n }\n #resetFormLink:hover {\n background-color: #6c757d;\n color: white;\n transform: translateY(-1px);\n }\n \n \/* Enhanced error message styling *\/\n #timeError {\n border-left: 4px solid #dc3545;\n background-color: #f8d7da;\n border-radius: 4px;\n padding: 12px 16px;\n margin-top: 8px;\n box-shadow: 0 2px 4px rgba(220, 53, 69, 0.1);\n animation: shake 0.5s ease-in-out;\n }\n \n @keyframes shake {\n 0%, 100% { transform: translateX(0); }\n 25% { transform: translateX(-5px); }\n 75% { transform: translateX(5px); }\n }\n \n \/* Mobile result section improvements *\/\n @media (max-width: 768px) {\n .result {\n padding: 10px;\n margin-top: 15px;\n }\n .result p {\n font-size: 14px;\n margin: 0.2rem 0;\n }\n #timeError {\n font-size: 14px;\n padding: 10px 12px;\n }\n }\n <\/style>\n <\/head>\n<body>\n <div class=\"container\">\n <h1 class=\"text-center\">Raumpreise Berechnung<\/h1>\n <h4 class=\"text-primary text-center mb-3\">Standort: Melody Myzeil<\/h4>\n \n <!-- Important Notice -->\n <div class=\"alert alert-warning notice-box mb-4\">\n <div class=\"d-flex align-items-center\">\n <i class=\"fas fa-exclamation-triangle notice-icon mr-3\"><\/i>\n <div>\n <strong>Hinweis:<\/strong> Dies ist nur ein <strong>Preisrechner<\/strong> zur Orientierung.<br>\n <span class=\"text-danger font-weight-bold\">Eine Reservierung ist separat erforderlich!<\/span>\n <\/div>\n <\/div>\n <\/div>\n \n <form id=\"priceCalculationForm\">\n <div class=\"form-group\">\n <label for=\"datePicker\">Datum:<\/label>\n <div class=\"date-input-wrapper position-relative\">\n <input type=\"date\" id=\"datePicker\" class=\"form-control\" required>\n <div id=\"dateDisplay\" class=\"date-display-overlay\"><\/div>\n <\/div>\n <div class=\"toggle-container mt-2\">\n <label class=\"toggle-switch\">\n <input type=\"checkbox\" id=\"holidayCheckbox\">\n <span class=\"toggle-slider\"><\/span>\n <\/label>\n <span class=\"toggle-label\" id=\"holidayLabel\" onclick=\"document.getElementById('holidayCheckbox').click()\">\n <span class=\"holiday-icon\">\ud83c\udf89<\/span>Vor- & Feiertag\n <\/span>\n <\/div>\n <\/div>\n <div class=\"form-group\">\n <label for=\"roomSize\">Raumgr\u00f6\u00dfe:<\/label>\n <select id=\"roomSize\" class=\"form-control\" required>\n <option value=\"\" disabled selected>Raumgr\u00f6\u00dfe w\u00e4hlen...<\/option>\n <option value=\"Bronze\">Bronze (bis zu 6 Personen)<\/option>\n <option value=\"Silver\">Silver (bis zu 10 Personen)<\/option>\n <option value=\"Gold\">Gold (bis zu 14 Personen)<\/option>\n <option value=\"Platinum\">Platinum (bis zu 20 Personen)<\/option>\n <option value=\"Diamond\">Diamond (bis zu 30 Personen)<\/option>\n <\/select>\n <\/div>\n <div class=\"form-group\">\n <label for=\"personCount\">Personenanzahl:<\/label>\n <select id=\"personCount\" class=\"form-control\" required>\n <option value=\"\" disabled selected>Personenanzahl w\u00e4hlen...<\/option>\n <option value=\"1\">1 Person<\/option>\n <option value=\"2\">2 Personen<\/option>\n <option value=\"3\">3 Personen<\/option>\n <option value=\"4\">4 Personen<\/option>\n <option value=\"5\">5 Personen<\/option>\n <option value=\"6\">6 Personen<\/option>\n <option value=\"7\">7 Personen<\/option>\n <option value=\"8\">8 Personen<\/option>\n <option value=\"9\">9 Personen<\/option>\n <option value=\"10\">10 Personen<\/option>\n <option value=\"11\">11 Personen<\/option>\n <option value=\"12\">12 Personen<\/option>\n <option value=\"13\">13 Personen<\/option>\n <option value=\"14\">14 Personen<\/option>\n <option value=\"15\">15 Personen<\/option>\n <option value=\"16\">16 Personen<\/option>\n <option value=\"17\">17 Personen<\/option>\n <option value=\"18\">18 Personen<\/option>\n <option value=\"19\">19 Personen<\/option>\n <option value=\"20\">20 Personen<\/option>\n <option value=\"21\">21 Personen<\/option>\n <option value=\"22\">22 Personen<\/option>\n <option value=\"23\">23 Personen<\/option>\n <option value=\"24\">24 Personen<\/option>\n <option value=\"25\">25 Personen<\/option>\n <option value=\"26\">26 Personen<\/option>\n <option value=\"27\">27 Personen<\/option>\n <option value=\"28\">28 Personen<\/option>\n <option value=\"29\">29 Personen<\/option>\n <option value=\"30\">30 Personen<\/option>\n <\/select>\n <\/div>\n <div class=\"form-group\">\n <label for=\"entryTime\">Eintrittszeit:<\/label>\n <select id=\"entryTime\" class=\"form-control\" required disabled>\n <!-- Time options added dynamically -->\n <\/select>\n <div id=\"timeError\" class=\"alert alert-danger d-none mt-2\" role=\"alert\">\n <strong>\u26a0\ufe0f Fehler:<\/strong> Eintrittszeit muss vor Austrittszeit liegen.\n <\/div>\n <\/div>\n <div class=\"form-group\">\n <label for=\"exitTime\">Austrittszeit:<\/label>\n <select id=\"exitTime\" class=\"form-control\" required disabled>\n <!-- Time options added dynamically -->\n <\/select>\n <\/div>\n <div class=\"text-center mt-3\">\n <button type=\"button\" id=\"resetFormLink\" class=\"btn btn-outline-secondary btn-sm\">\n <i class=\"fas fa-undo\" style=\"margin-right: 5px;\"><\/i>Formular zur\u00fccksetzen\n <\/button>\n <\/div>\n <\/form>\n \n <!-- Raummiete & Mindestverzehr -->\n <div id=\"raummieteResult\" class=\"result d-none mt-4\">\n <h4 class=\"mb-3 text-primary\">\n Raummiete \n <i class=\"fas fa-info-circle text-info\" id=\"raummieteInfoBtn\" style=\"cursor: pointer; font-size: 1rem;\" title=\"Info zur Raummiete\"><\/i>\n <\/h4>\n <div id=\"raummieteInfoBox\" class=\"alert alert-info d-none mb-3\" style=\"font-size: 0.9rem;\">\n <button type=\"button\" class=\"close\" id=\"raummieteInfoClose\" aria-label=\"Schlie\u00dfen\">\n <span aria-hidden=\"true\">\u00d7<\/span>\n <\/button>\n <ul class=\"mb-0 pl-3\">\n <li>Der Party Raum wird zum Anfang der Feier in 60 Minuten bestellt und berechnet.<\/li>\n <li>Die Verl\u00e4ngerung erfolgt \u00fcber Absprache mit Kollegen vor Ort.<\/li>\n <li>Die Raummiete bezieht sich auf pro Raum pro Stunde und nicht auf einzelne Person.<\/li>\n <li>Am Silvester und an einigen Feiertagen gelten gesonderte Tarife.<\/li>\n <li>Alle Preise verstehen sich in Euro inkl. der gesetzlichen MwSt.<\/li>\n <li>Die Mindestdauer der Anmietung betr\u00e4gt 60 Minuten und kann nach Verf\u00fcgbarkeit in 30 Minuten Takt verl\u00e4ngert werden.<\/li>\n <li>An Freitagen, Samstagen, Sonntagen und Feiertagen haben wir eine Mindestbuchungszeit von 120 Minuten.<\/li>\n <\/ul>\n <\/div>\n <p id=\"resultRaummiete\" style=\"font-size: 1.5rem; font-weight: bold; margin-bottom: 0.25rem;\"><strong><\/strong><\/p>\n <div id=\"resultRaummieteDetails\" class=\"small text-muted mb-3\"><\/div>\n \n <div id=\"mindestverzehrSection\">\n <h4 class=\"mb-3 text-primary\">\n Mindestverzehr \n <i class=\"fas fa-info-circle text-info\" id=\"mindestverzehrInfoBtn\" style=\"cursor: pointer; font-size: 1rem;\" title=\"Info zum Mindestverzehr\"><\/i>\n <\/h4>\n <div id=\"mindestverzehrInfoBox\" class=\"alert alert-info d-none mb-3\" style=\"font-size: 0.9rem;\">\n <button type=\"button\" class=\"close\" id=\"mindestverzehrInfoClose\" aria-label=\"Schlie\u00dfen\">\n <span aria-hidden=\"true\">\u00d7<\/span>\n <\/button>\n <p><strong>Was bedeutet Mindestverzehr?<\/strong><br>\n Der Mindestverzehr ist ein Konsumguthaben, das Ihre Gruppe w\u00e4hrend der Raummietdauer f\u00fcr Speisen und Getr\u00e4nke ausgibt.<\/p>\n <p>Der Mindestverzehr betr\u00e4gt pauschal 50% zus\u00e4tzlich zur Raummiete.<\/p>\n <p><strong>Beispiel:<\/strong> Bei einer Raummiete von 100\u20ac betr\u00e4gt der Mindestverzehr 50\u20ac. Ihre Gruppe muss in diesem Fall Speisen und Getr\u00e4nke im Wert von mindestens 50\u20ac bestellen.<\/p>\n <p><strong>Wichtig: Der Betrag gilt f\u00fcr die gesamte Gruppe<\/strong><br>\n Sowohl die Raummiete als auch der Mindestverzehr beziehen sich auf den gesamten reservierten Raum und nicht auf die einzelne Person.<\/p>\n <p><strong>Abrechnung und Transparenz<\/strong><\/p>\n <ul class=\"pl-3\">\n <li><strong>Mindesterf\u00fcllung:<\/strong> Sollte Ihre Gruppe Speisen und Getr\u00e4nke im Wert des Mindestverzehrs oder dar\u00fcber konsumieren, zahlen Sie selbstverst\u00e4ndlich nur den tats\u00e4chlich konsumierten Betrag (ab dem Mindestverzehr aufw\u00e4rts).<\/li>\n <li><strong>Unterschreitung:<\/strong> Liegt der tats\u00e4chliche Konsum unter dem festgelegten Mindestverzehr, stellen wir Ihnen dennoch den Mindestverzehr-Betrag in Rechnung.<\/li>\n <li><strong>\u00dcberschreitung:<\/strong> Liegt der Konsum \u00fcber dem Mindestverzehr, berechnen wir selbstverst\u00e4ndlich den h\u00f6heren, tats\u00e4chlichen Konsum.<\/li>\n <\/ul>\n <p>Diese Regelung hilft uns, die Kosten f\u00fcr die exklusive Bereitstellung und den Service des reservierten Raumes zu decken.<\/p>\n <p><strong>Wann f\u00e4llt ein Mindestverzehr an?<\/strong><br>\n Ein Mindestverzehr wird bei Reservierung unter einer der folgenden Bedingungen verlangt:<\/p>\n <ul class=\"mb-0 pl-3\">\n <li><strong>An Wochenenden & Feiertagen:<\/strong> Freitags, samstags, sonntags und an gesetzlichen Feiertagen.<\/li>\n <li><strong>In speziellen R\u00e4umen:<\/strong> Bei Anmietung unserer Platinum- & Diamond-R\u00e4ume.<\/li>\n <li><strong>Lange Reservierungen:<\/strong> Bei einer Reservierungsdauer ab 3 Stunden.<\/li>\n <\/ul>\n <\/div>\n <p id=\"resultMindestverzehr\" style=\"font-size: 1.5rem; font-weight: bold;\"><strong><\/strong><\/p>\n <\/div>\n \n <hr>\n <p class=\"mb-2 text-primary\"><strong>Voraussichtlicher Mindestgesamtpreis:<\/strong><\/p>\n <div id=\"perPersonSplitPanel\" class=\"per-person-split-panel d-none mb-3\" aria-live=\"polite\">\n <label class=\"per-person-split-header mb-0\" style=\"cursor: pointer;\">\n <span class=\"per-person-switch\">\n <input type=\"checkbox\" id=\"perPersonSplitToggle\" aria-describedby=\"perPersonSplitHint\">\n <span class=\"per-person-slider\"><\/span>\n <\/span>\n <span class=\"per-person-split-title flex-grow-1\">\n <strong>Aufteilung auf Personen anzeigen<\/strong>\n <span class=\"sub d-block\" id=\"perPersonSplitHint\">Nur zur Orientierung \u2014 der Mindestgesamtpreis gilt f\u00fcr die Gruppe<\/span>\n <\/span>\n <\/label>\n <div id=\"perPersonReminder\" class=\"per-person-reminder d-none\" role=\"note\">\n <i class=\"fas fa-info-circle\" aria-hidden=\"true\"><\/i>\n <strong>Hinweis:<\/strong> Die folgende Zeile zeigt eine <em>rechnerische<\/em> gleichm\u00e4\u00dfige Aufteilung des Mindestgesamtpreises auf die gew\u00e4hlte Personenzahl. Es handelt sich nicht um einen gesonderten Personentarif und nicht um eine Einzelabrechnung pro Gast.\n <\/div>\n <\/div>\n <p id=\"resultGesamtMin\" style=\"font-size: 1.5rem; font-weight: bold; margin: 0;\"><strong><\/strong><span id=\"resultGesamtMinProPerson\" class=\"per-person-line-muted d-none\"><\/span><\/p>\n <\/div>\n \n <!-- Separate Deposit Section -->\n <div id=\"depositResult\" class=\"result d-none mt-4\">\n <h4 class=\"mb-3 text-primary\">\n Anzahlung \n <i class=\"fas fa-info-circle text-info\" id=\"anzahlungInfoBtn\" style=\"cursor: pointer; font-size: 1rem;\" title=\"Info zur Anzahlung\"><\/i>\n <\/h4>\n <div id=\"anzahlungInfoBox\" class=\"alert alert-info d-none mb-3\" style=\"font-size: 0.9rem;\">\n <button type=\"button\" class=\"close\" id=\"anzahlungInfoClose\" aria-label=\"Schlie\u00dfen\">\n <span aria-hidden=\"true\">\u00d7<\/span>\n <\/button>\n <p>Aufgrund der limitierten Verf\u00fcgbarkeit an R\u00e4umlichkeit k\u00f6nnen wir ohne Weiteres einen gew\u00fcnschten Raum nicht blockieren, deshalb bitten wir bei Reservierungen mit einer der folgenden Kriterien um eine Anzahlung mit Mindestverzehr.<\/p>\n <ul class=\"pl-3\">\n <li>an Freitagen, Samstagen, Sonntagen und Feiertagen<\/li>\n <li>Platinum- & Diamond Raum<\/li>\n <li>Reservierung mit einer Dauer ab 3 Stunden<\/li>\n <\/ul>\n <p>Die Anzahlung ist eine Vorauszahlung von einer Stunde Raummiete, die man nach einer erfolgreichen Raumanfrage leisten muss und sp\u00e4ter bei seiner Reservierung automatisch vollst\u00e4ndig verrechnet.<\/p>\n <p>Die Vorauszahlung kann via Bank\u00fcberweisung, Paypal oder vor Ort mit Bargeld oder Karte bezahlt werden.<\/p>\n <p class=\"mb-0\">Bei Abwesenheit oder spontaner \u00c4nderung der Reservierung behalten wir das Recht vor, die Vorauszahlung einzubehalten.<\/p>\n <\/div>\n <p id=\"resultAnzahlung\" style=\"font-size: 1.5rem; font-weight: bold;\"><strong><\/strong><\/p>\n <\/div>\n \n <!-- Call to Action after calculation -->\n <div id=\"ctaAfterCalc\" class=\"cta-box d-none mt-4\">\n <div class=\"cta-content\">\n <i class=\"fas fa-hand-point-right cta-hand\"><\/i>\n <div class=\"cta-text\">\n <strong>N\u00c4CHSTER SCHRITT:<\/strong><br>\n <span>Diese Berechnung ist <u>keine Reservierung<\/u>!<\/span>\n <\/div>\n <\/div>\n <a href=\"https:\/\/melodypartybox.de\/myzeil\/reservierung\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"btn btn-action btn-cta-reservierung\">\n <i class=\"fas fa-calendar-check mr-2\"><\/i>Jetzt Reservieren\n <\/a>\n <\/div>\n \n <!-- Action Buttons -->\n <div class=\"action-buttons mt-4 d-flex justify-content-center\">\n <a href=\"https:\/\/melodypartybox.de\/myzeil\/faq\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"btn btn-action btn-faq mr-3\">\n <i class=\"fas fa-question-circle\"><\/i>\n <span>FAQs<\/span>\n <\/a>\n <a href=\"https:\/\/melodypartybox.de\/myzeil\/reservierung\/\" target=\"_blank\" rel=\"noopener noreferrer\" class=\"btn btn-action btn-reservierung\">\n <i class=\"fas fa-calendar-check\"><\/i>\n <span>Reservierung<\/span>\n <\/a>\n <\/div>\n \n <!-- DISCLAIMER -->\n <p id=\"disclaimer\" class=\"mt-4\">\n Wir weisen ausdr\u00fccklich darauf hin, dass die hier berechneten Werte lediglich als unverbindliche Kostensch\u00e4tzung dienen. Erst nach einer schriftlichen Best\u00e4tigung der Reservierung sind Preise verbindlich bzw. rechtsg\u00fcltig.\n <\/p>\n \n <!-- Version Information -->\n <div class=\"mt-4 pt-3 border-top\">\n <small class=\"text-muted\">\n <strong>Version:<\/strong> 20260503-1616\n <\/small>\n <\/div>\n <\/div>\n\n <!-- Removed jQuery\/Popper\/Bootstrap JS as they are not used -->\n\n <script>\n \/\/ Constants\n const TIME_INTERVAL_MINUTES = 15;\n const OPEN_CONFIG = { sundayStartHour: 15, sundayStartMinutes: 0, defaultStartHour: 10, defaultStartMinutes: 0, endHourInclusive: 26 };\n const ROOM_MAX_PERSONS = { 'Bronze': 6, 'Silver': 10, 'Gold': 14, 'Platinum': 20, 'Diamond': 30 };\n const WEEKDAY_LABELS_DE = ['Sonntag', 'Montag', 'Dienstag', 'Mittwoch', 'Donnerstag', 'Freitag', 'Samstag'];\n const INFO_PANEL_TRIPLETS = [\n ['raummieteInfoBtn', 'raummieteInfoBox', 'raummieteInfoClose'],\n ['mindestverzehrInfoBtn', 'mindestverzehrInfoBox', 'mindestverzehrInfoClose'],\n ['anzahlungInfoBtn', 'anzahlungInfoBox', 'anzahlungInfoClose']\n ];\n const PRICE_TABLE = {\n 'Bronze': {\n 'weekdays': [ { start: 600, end: 900, price: 4.25 }, { start: 900, end: 1200, price: 5.75 }, { start: 1200, end: 1500, price: 8.75 } ],\n 'friday': [ { start: 600, end: 900, price: 5 }, { start: 900, end: 1200, price: 7.25 }, { start: 1200, end: 1500, price: 9.75 } ],\n 'saturday': [ { start: 600, end: 900, price: 6.75 }, { start: 900, end: 1200, price: 9 }, { start: 1200, end: 1500, price: 11.50 } ],\n 'sunday': [ { start: 600, end: 900, price: 5 }, { start: 900, end: 1200, price: 7.25 }, { start: 1200, end: 1500, price: 9.75 } ]\n },\n 'Silver': {\n 'weekdays': [ { start: 600, end: 900, price: 5 }, { start: 900, end: 1200, price: 6.75 }, { start: 1200, end: 1500, price: 10 } ],\n 'friday': [ { start: 600, end: 900, price: 6.25 }, { start: 900, end: 1200, price: 8.50 }, { start: 1200, end: 1500, price: 11.25 } ],\n 'saturday': [ { start: 600, end: 900, price: 9.25 }, { start: 900, end: 1200, price: 11.50 }, { start: 1200, end: 1500, price: 14 } ],\n 'sunday': [ { start: 600, end: 900, price: 6.25 }, { start: 900, end: 1200, price: 8.50 }, { start: 1200, end: 1500, price: 11.25 } ]\n },\n 'Gold': {\n 'weekdays': [ { start: 600, end: 900, price: 6.25 }, { start: 900, end: 1200, price: 9.75 }, { start: 1200, end: 1500, price: 12.25 } ],\n 'friday': [ { start: 600, end: 900, price: 8.50 }, { start: 900, end: 1200, price: 11.50 }, { start: 1200, end: 1500, price: 13.75 } ],\n 'saturday': [ { start: 600, end: 900, price: 11.25 }, { start: 900, end: 1200, price: 14.25 }, { start: 1200, end: 1500, price: 16.75 } ],\n 'sunday': [ { start: 600, end: 900, price: 8.50 }, { start: 900, end: 1200, price: 11.50 }, { start: 1200, end: 1500, price: 13.75 } ]\n },\n 'Platinum': {\n 'weekdays': [ { start: 600, end: 900, price: 8.75 }, { start: 900, end: 1200, price: 13.75 }, { start: 1200, end: 1500, price: 17.50 } ],\n 'friday': [ { start: 600, end: 900, price: 11.25 }, { start: 900, end: 1200, price: 16.25 }, { start: 1200, end: 1500, price: 18.75 } ],\n 'saturday': [ { start: 600, end: 900, price: 12.50 }, { start: 900, end: 1200, price: 17.50 }, { start: 1200, end: 1500, price: 21.25 } ],\n 'sunday': [ { start: 600, end: 900, price: 11.25 }, { start: 900, end: 1200, price: 16.25 }, { start: 1200, end: 1500, price: 18.75 } ]\n },\n 'Diamond': {\n 'weekdays': [ { start: 600, end: 900, price: 11.25 }, { start: 900, end: 1200, price: 16.25 }, { start: 1200, end: 1500, price: 21.25 } ],\n 'friday': [ { start: 600, end: 900, price: 13.75 }, { start: 900, end: 1200, price: 18.75 }, { start: 1200, end: 1500, price: 23.75 } ],\n 'saturday': [ { start: 600, end: 900, price: 15 }, { start: 900, end: 1200, price: 22.50 }, { start: 1200, end: 1500, price: 27.25 } ],\n 'sunday': [ { start: 600, end: 900, price: 13.75 }, { start: 900, end: 1200, price: 18.75 }, { start: 1200, end: 1500, price: 23.75 } ]\n }\n };\n\n \/\/ Helpers\n const $ = (id) => document.getElementById(id);\n const minutesToHHMM = (mins) => `${String(Math.floor((mins % (24*60)) \/ 60)).padStart(2,'0')}:${String(mins % 60).padStart(2,'0')}`;\n const formatEuro = (val) => `${val.toLocaleString('de-DE', { minimumFractionDigits: 2, maximumFractionDigits: 2 })}\\u00A0\u20ac`;\n const setRowValue = (selector, value) => {\n const row = document.querySelector(selector);\n const strong = row ? row.querySelector('strong') : null;\n if (!row || !strong) return;\n if (value && String(value).trim() !== '') {\n strong.textContent = value;\n row.classList.remove('d-none');\n } else {\n strong.textContent = '';\n row.classList.add('d-none');\n }\n };\n\n function refreshSelectBold(selectEl) {\n if (!selectEl || selectEl.tagName !== 'SELECT') return;\n const selected = !selectEl.disabled && selectEl.value !== '';\n selectEl.classList.toggle('field-selected', selected);\n }\n\n function refreshDateFieldBold() {\n const inp = document.getElementById('datePicker');\n const overlay = document.getElementById('dateDisplay');\n const has = !!(inp && inp.value);\n if (inp) inp.classList.toggle('field-selected', has);\n if (overlay) overlay.classList.toggle('field-selected', has);\n }\n\n function syncFormFieldBold() {\n refreshDateFieldBold();\n ['roomSize', 'personCount', 'entryTime', 'exitTime'].forEach((id) => {\n refreshSelectBold(document.getElementById(id));\n });\n }\n\n \/** Parse yyyy-mm-dd as local calendar date (avoids UTC weekday shifts). *\/\n function parseLocalDate(isoDateStr) {\n if (!isoDateStr || typeof isoDateStr !== 'string') return null;\n const parts = isoDateStr.split('-');\n if (parts.length !== 3) return null;\n const y = parseInt(parts[0], 10);\n const m = parseInt(parts[1], 10);\n const d = parseInt(parts[2], 10);\n if (isNaN(y) || isNaN(m) || isNaN(d)) return null;\n const dt = new Date(y, m - 1, d);\n if (dt.getFullYear() !== y || dt.getMonth() !== m - 1 || dt.getDate() !== d) return null;\n return dt;\n }\n\n function getApplicablePrices(roomSize, dayOfWeek, isHoliday) {\n let applicablePrices = PRICE_TABLE[roomSize].weekdays;\n if (isHoliday) {\n applicablePrices = PRICE_TABLE[roomSize].saturday;\n } else if (dayOfWeek === 5) {\n applicablePrices = PRICE_TABLE[roomSize].friday;\n } else if (dayOfWeek === 6) {\n applicablePrices = PRICE_TABLE[roomSize].saturday;\n } else if (dayOfWeek === 0) {\n applicablePrices = PRICE_TABLE[roomSize].sunday;\n }\n return applicablePrices;\n }\n\n \/** Price for one 15-minute slot [start, end) in minutes-of-day (same logic as former getPrice for one interval). *\/\n function getPriceForQuarterHour(applicablePrices, quarterStartMins, quarterEndMins) {\n let price = 0;\n for (let i = 0; i < applicablePrices.length; i++) {\n const pi = applicablePrices[i];\n if (quarterStartMins < pi.end && quarterEndMins > pi.start) {\n price = pi.price;\n }\n }\n return price;\n }\n\n \/** Max 15-min tariff in overlap of [winStart, winEnd) with price bands. *\/\n function maxSlotPriceInOverlap(applicablePrices, winStart, winEnd) {\n let maxP = 0;\n for (let i = 0; i < applicablePrices.length; i++) {\n const pi = applicablePrices[i];\n if (winStart < pi.end && winEnd > pi.start) {\n maxP = Math.max(maxP, pi.price);\n }\n }\n return maxP;\n }\n\n \/** Max 15-min slot price in window [startTime, endTime), returned as hourly equivalent (\u00d74). *\/\n function getHighestHourlyRate(roomSize, dayOfWeek, isHoliday, startTime, endTime) {\n const ap = getApplicablePrices(roomSize, dayOfWeek, isHoliday);\n return maxSlotPriceInOverlap(ap, startTime, endTime) * 4;\n }\n\n \/** Sum of two consecutive hourly equivalents for deposit (last two hours of booking). *\/\n function calculateTwoHourlyRates(roomSize, dayOfWeek, isHoliday, startTime, endTime) {\n const ap = getApplicablePrices(roomSize, dayOfWeek, isHoliday);\n const middleTime = startTime + 60;\n return maxSlotPriceInOverlap(ap, startTime, middleTime) * 4 + maxSlotPriceInOverlap(ap, middleTime, endTime) * 4;\n }\n\n \/\/ Time options\n function getTimeOptionsForDay(dayOfWeek) {\n const startHour = dayOfWeek === 0 ? OPEN_CONFIG.sundayStartHour : OPEN_CONFIG.defaultStartHour;\n const startMinutes = dayOfWeek === 0 ? OPEN_CONFIG.sundayStartMinutes : OPEN_CONFIG.defaultStartMinutes;\n const endHour = OPEN_CONFIG.endHourInclusive;\n const options = [];\n for (let hour = startHour; hour < endHour; hour++) {\n for (let minute = hour === startHour ? startMinutes : 0; minute < 60; minute += TIME_INTERVAL_MINUTES) {\n const labelHour = hour > 23 ? hour - 24 : hour;\n const label = minutesToHHMM(labelHour * 60 + minute);\n const value = hour * 60 + minute;\n options.push({ label, value, hour });\n }\n }\n return options;\n }\n\n function renderTimeOptions(selectEl, options, predicate, placeholder) {\n selectEl.innerHTML = '';\n \/\/ Add empty placeholder option\n const emptyOption = new Option(placeholder || 'Bitte w\u00e4hlen...', '');\n emptyOption.disabled = true;\n emptyOption.selected = true;\n selectEl.add(emptyOption);\n \/\/ Add time options\n options.forEach(opt => {\n if (!predicate || predicate(opt)) {\n selectEl.add(new Option(opt.label, opt.value));\n }\n });\n }\n\n function setTimesEnabled(enabled) {\n $('entryTime').disabled = !enabled;\n $('exitTime').disabled = !enabled;\n }\n\n function populatePersonCountOptions(roomSize) {\n const select = $('personCount');\n if (!select) return;\n const maxPersons = (roomSize && ROOM_MAX_PERSONS[roomSize]) ? ROOM_MAX_PERSONS[roomSize] : 30;\n const currentVal = select.value ? parseInt(select.value, 10) : null;\n select.innerHTML = '';\n const placeholder = new Option('Personenanzahl w\u00e4hlen...', '');\n placeholder.disabled = true;\n placeholder.selected = true;\n select.add(placeholder);\n for (let n = 1; n <= maxPersons; n++) {\n const opt = new Option(n === 1 ? '1 Person' : `${n} Personen`, String(n));\n select.add(opt);\n if (currentVal !== null && n === currentVal) opt.selected = true;\n }\n if (currentVal === null || currentVal > maxPersons) {\n select.selectedIndex = 0;\n }\n }\n\n function populateTimeOptions() {\n const datePicker = $('datePicker');\n const entrySelect = $('entryTime');\n const exitSelect = $('exitTime');\n\n datePicker.addEventListener('change', function() {\n const selectedDate = parseLocalDate(this.value);\n if (!selectedDate) return;\n const dayOfWeek = selectedDate.getDay();\n\n const options = getTimeOptionsForDay(dayOfWeek);\n \/\/ Entry time: up to 00:00 (hour 24)\n renderTimeOptions(entrySelect, options, (o) => o.hour <= 24, 'Eintrittszeit w\u00e4hlen...');\n \/\/ Exit time: from 11:00 (or 17:00 on Sunday) up to 01:00 (hour 25)\n const minExitValue = dayOfWeek === 0 ? 17 * 60 : 11 * 60;\n renderTimeOptions(exitSelect, options, (o) => o.value >= minExitValue && (o.hour < 25 || (o.hour === 25 && o.value === 25 * 60)), 'Austrittszeit w\u00e4hlen...');\n setTimesEnabled(true);\n syncFormFieldBold();\n });\n }\n\n\n function calculatePricing() {\n const date = parseLocalDate(document.getElementById('datePicker').value);\n if (!date) return;\n\n const dayOfWeek = date.getDay();\n const roomSize = document.getElementById('roomSize').value;\n if (!roomSize || !PRICE_TABLE[roomSize]) return;\n\n const entryTime = parseInt(document.getElementById('entryTime').value, 10);\n let exitTime = parseInt(document.getElementById('exitTime').value, 10);\n\n if (isNaN(entryTime) || isNaN(exitTime)) return;\n\n \/\/ Adjust for times past midnight\n if (exitTime <= entryTime) {\n exitTime += 24 * 60; \/\/ Add 24 hours, as we consider up to 26:00\n }\n\n const isHoliday = document.getElementById('holidayCheckbox').checked;\n\n const getPrice = (quarterStart, quarterEnd, pricingDayOfWeek) => {\n const applicablePrices = getApplicablePrices(roomSize, pricingDayOfWeek, isHoliday);\n return getPriceForQuarterHour(applicablePrices, quarterStart, quarterEnd);\n };\n\n \/\/ Calculate the total price and collect price segments\n let total = 0;\n let currentTime = entryTime;\n let lastValidPrice = 0; \/\/ Store the last valid price from the previous day\n let priceSegments = []; \/\/ Collect segments for detailed display\n let currentSegment = null;\n\n while (currentTime < exitTime) {\n let nextTime = currentTime + TIME_INTERVAL_MINUTES;\n \n \/\/ Determine which day's pricing to use\n let pricingDayOfWeek = dayOfWeek;\n let pricingTime = currentTime;\n \n \/\/ If we're past midnight (after 24:00), use the next day's pricing\n if (currentTime >= 24 * 60) {\n pricingDayOfWeek = (dayOfWeek + 1) % 7; \/\/ Next day\n pricingTime = currentTime - (24 * 60); \/\/ Convert to next day's time\n }\n \n \/\/ Get the price for this interval\n let currentPrice = getPrice(pricingTime, pricingTime + TIME_INTERVAL_MINUTES, pricingDayOfWeek);\n \n \/\/ If no price is found for the new day's early hours, use the last valid price from the previous day\n if (currentPrice === 0 && currentTime >= 24 * 60) {\n currentPrice = lastValidPrice;\n }\n \n \/\/ Update lastValidPrice if we found a valid price (from either day)\n if (currentPrice > 0) {\n lastValidPrice = currentPrice;\n }\n \n \/\/ Track price segments for detailed display\n const hourlyRate = currentPrice * 4; \/\/ Convert 15-min price to hourly\n if (currentSegment && currentSegment.hourlyRate === hourlyRate) {\n \/\/ Extend current segment\n currentSegment.endTime = nextTime;\n currentSegment.intervals++;\n } else {\n \/\/ Start new segment\n if (currentSegment) {\n priceSegments.push(currentSegment);\n }\n currentSegment = {\n startTime: currentTime,\n endTime: nextTime,\n hourlyRate: hourlyRate,\n intervals: 1\n };\n }\n \n total += currentPrice;\n currentTime = nextTime;\n }\n \/\/ Push last segment\n if (currentSegment) {\n priceSegments.push(currentSegment);\n }\n\n const raummieteResultElement = document.getElementById('raummieteResult');\n raummieteResultElement.classList.remove('d-none');\n \n \/\/ Show deposit result\n const depositElement = document.getElementById('depositResult');\n depositElement.classList.remove('d-none');\n \n \/\/ Show CTA box\n const ctaBox = document.getElementById('ctaAfterCalc');\n ctaBox.classList.remove('d-none');\n\n const fmt = (mins) => `${String(Math.floor((mins % (24*60)) \/ 60)).padStart(2,'0')}:${String(mins % 60).padStart(2,'0')}`;\n\n \/\/ Calculate deposit based on booking duration\n const totalHours = (exitTime - entryTime) \/ 60; \/\/ Convert minutes to hours\n \n \/\/ Check if Anzahlung applies\n const isWeekendForDeposit = (dayOfWeek === 5 || dayOfWeek === 6 || dayOfWeek === 0);\n const isPlatinumOrDiamondForDeposit = (roomSize === 'Platinum' || roomSize === 'Diamond');\n const durationOverThreeHoursForDeposit = totalHours >= 3;\n const hasAnzahlung = isWeekendForDeposit || isHoliday || isPlatinumOrDiamondForDeposit || durationOverThreeHoursForDeposit;\n \n let anzahlung = 0;\n if (hasAnzahlung) {\n if (totalHours <= 3) {\n \/\/ For bookings <= 3 hours: highest rate from last hour\n anzahlung = getHighestHourlyRate(roomSize, dayOfWeek, isHoliday, exitTime - 60, exitTime);\n } else {\n \/\/ For bookings >= 3 hours: sum of 2 hourly rates from last two hours\n anzahlung = calculateTwoHourlyRates(roomSize, dayOfWeek, isHoliday, exitTime - 120, exitTime);\n }\n }\n\n \/\/ Check if Mindestverzehr applies\n \/\/ Conditions: Weekend (Fri\/Sat\/Sun) OR holiday OR Platinum\/Diamond OR duration > 3h\n const isWeekend = (dayOfWeek === 5 || dayOfWeek === 6 || dayOfWeek === 0);\n const isPlatinumOrDiamond = (roomSize === 'Platinum' || roomSize === 'Diamond');\n const durationOverThreeHours = totalHours >= 3;\n const hasMindestverzehr = isWeekend || isHoliday || isPlatinumOrDiamond || durationOverThreeHours;\n \n const mindestverzehr = hasMindestverzehr ? total * 0.5 : 0;\n const gesamtMin = total + mindestverzehr;\n\n \/\/ Get person count\n const personCount = parseInt(document.getElementById('personCount').value, 10) || 0;\n const gesamtMinProPerson = personCount > 0 ? gesamtMin \/ personCount : 0;\n\n \/\/ Show holiday price indication if checkbox is checked\n const raummieteText = isHoliday ? `${formatEuro(total)} (Feiertags- & Vorfeiertagspreis)` : formatEuro(total);\n setRowValue('#resultRaummiete', raummieteText);\n \n \/\/ Build detailed price breakdown\n const detailsEl = document.getElementById('resultRaummieteDetails');\n if (detailsEl) {\n let detailsHtml = '';\n priceSegments.forEach(seg => {\n const startLabel = fmt(seg.startTime);\n const endLabel = fmt(seg.endTime);\n const durationMinutes = seg.intervals * 15;\n const hours = Math.floor(durationMinutes \/ 60);\n const minutes = durationMinutes % 60;\n let durationStr = '';\n if (hours > 0 && minutes > 0) {\n durationStr = `${hours}h ${minutes}min`;\n } else if (hours > 0) {\n durationStr = `${hours}h`;\n } else {\n durationStr = `${minutes}min`;\n }\n const segmentTotal = seg.intervals * (seg.hourlyRate \/ 4);\n detailsHtml += `<div>\u2022 ${startLabel} - ${endLabel} (${durationStr}) \u00d7 ${formatEuro(seg.hourlyRate)}\/h = <strong>${formatEuro(segmentTotal)}<\/strong><\/div>`;\n });\n detailsEl.innerHTML = detailsHtml;\n }\n \/\/ Update deposit result (no decimal places)\n const formatDeposit = (val) => `${Math.round(val).toLocaleString('de-DE')} \u20ac`;\n if (hasAnzahlung) {\n setRowValue('#resultAnzahlung', formatDeposit(anzahlung));\n } else {\n setRowValue('#resultAnzahlung', 'Keine Anzahlung n\u00f6tig');\n }\n \n const mindestverzehrSection = document.getElementById('mindestverzehrSection');\n if (mindestverzehr > 0) {\n if (mindestverzehrSection) {\n mindestverzehrSection.classList.remove('d-none');\n }\n setRowValue('#resultMindestverzehr', formatEuro(mindestverzehr));\n } else {\n if (mindestverzehrSection) {\n mindestverzehrSection.classList.add('d-none');\n }\n const mindestverzehrInfoBoxEl = document.getElementById('mindestverzehrInfoBox');\n if (mindestverzehrInfoBoxEl) {\n mindestverzehrInfoBoxEl.classList.add('d-none');\n }\n const rMin = document.querySelector('#resultMindestverzehr');\n if (rMin) {\n const s = rMin.querySelector('strong');\n if (s) s.textContent = '';\n }\n }\n setRowValue('#resultGesamtMin', formatEuro(gesamtMin));\n \n \/\/ Aufteilung (optional visualization \u2014 toggle + reminder)\n const splitPanel = document.getElementById('perPersonSplitPanel');\n const splitToggle = document.getElementById('perPersonSplitToggle');\n const perPersonReminder = document.getElementById('perPersonReminder');\n const perPersonSplitHint = document.getElementById('perPersonSplitHint');\n const gesamtProPersonSpan = document.getElementById('resultGesamtMinProPerson');\n\n if (splitPanel) {\n splitPanel.classList.remove('d-none');\n }\n if (splitToggle) {\n splitToggle.disabled = personCount === 0;\n }\n if (perPersonSplitHint) {\n perPersonSplitHint.textContent = personCount === 0\n ? 'Bitte zuerst eine Personenanzahl w\u00e4hlen, um die Aufteilung zu nutzen.'\n : 'Nur zur Orientierung \u2014 der Mindestgesamtpreis gilt f\u00fcr die Gruppe';\n }\n\n const showSplit = !!(splitToggle && splitToggle.checked && personCount > 0);\n const personWord = (n) => (n === 1 ? 'Person' : 'Personen');\n const splitLine = (amount) =>\n `Bei gleichm\u00e4\u00dfiger Aufteilung auf ${personCount} ${personWord(personCount)}: ${formatEuro(amount)} (nur Orientierung)`;\n\n if (showSplit) {\n if (perPersonReminder) {\n perPersonReminder.classList.remove('d-none');\n }\n if (gesamtProPersonSpan) {\n gesamtProPersonSpan.textContent = splitLine(gesamtMinProPerson);\n gesamtProPersonSpan.classList.remove('d-none');\n }\n } else {\n if (perPersonReminder) {\n perPersonReminder.classList.add('d-none');\n }\n if (gesamtProPersonSpan) {\n gesamtProPersonSpan.textContent = '';\n gesamtProPersonSpan.classList.add('d-none');\n }\n }\n }\n\n \/\/ Initialization\n document.addEventListener('DOMContentLoaded', function() {\n \n populateTimeOptions();\n const datePickerEl = document.getElementById('datePicker');\n const roomSizeEl = document.getElementById('roomSize');\n const personCountEl = document.getElementById('personCount');\n const entryEl = document.getElementById('entryTime');\n const exitEl = document.getElementById('exitTime');\n const timeError = document.getElementById('timeError');\n populatePersonCountOptions(roomSizeEl ? roomSizeEl.value : '');\n syncFormFieldBold();\n const maybeCalc = () => {\n const hasDate = !!datePickerEl.value;\n const hasRoom = !!(roomSizeEl && roomSizeEl.value);\n const hasEntry = !!entryEl.value;\n const hasExit = !!exitEl.value;\n\n if (hasDate && hasRoom && hasEntry && hasExit) {\n \/\/ Inline invalid combo check\n const entryVal = parseInt(entryEl.value, 10);\n let exitVal = parseInt(exitEl.value, 10);\n let invalid = false;\n if (exitVal <= entryVal) {\n \/\/ allow next-day if exit <= entry only when exit is >= 24:00 (i.e., 1440)\n if (exitVal < 24 * 60) invalid = true;\n }\n if (timeError) timeError.classList.toggle('d-none', !invalid);\n if (!invalid) calculatePricing();\n }\n syncFormFieldBold();\n };\n datePickerEl.addEventListener('change', function() {\n const dateDisplay = $('dateDisplay');\n if (dateDisplay && this.value) {\n const selectedDate = parseLocalDate(this.value);\n if (!selectedDate) {\n dateDisplay.textContent = '';\n } else {\n const weekday = WEEKDAY_LABELS_DE[selectedDate.getDay()];\n const day = String(selectedDate.getDate()).padStart(2, '0');\n const month = String(selectedDate.getMonth() + 1).padStart(2, '0');\n const year = selectedDate.getFullYear();\n dateDisplay.textContent = `${weekday}, ${day}.${month}.${year}`;\n }\n } else if (dateDisplay) {\n dateDisplay.textContent = '';\n }\n maybeCalc();\n });\n roomSizeEl.addEventListener('change', function() {\n populatePersonCountOptions(this.value);\n maybeCalc();\n });\n personCountEl.addEventListener('change', maybeCalc);\n entryEl.addEventListener('change', maybeCalc);\n exitEl.addEventListener('change', maybeCalc);\n const perPersonSplitToggle = document.getElementById('perPersonSplitToggle');\n if (perPersonSplitToggle) {\n perPersonSplitToggle.addEventListener('change', maybeCalc);\n }\n \/\/ Add event listener for holiday checkbox\n const holidayCheckbox = document.getElementById('holidayCheckbox');\n const holidayLabel = document.getElementById('holidayLabel');\n if (holidayCheckbox) {\n holidayCheckbox.addEventListener('change', function() {\n if (holidayLabel) holidayLabel.classList.toggle('active', this.checked);\n maybeCalc();\n });\n }\n INFO_PANEL_TRIPLETS.forEach(([btnId, boxId, closeId]) => {\n const btn = $(btnId), box = $(boxId), closeBtn = $(closeId);\n if (btn && box) btn.addEventListener('click', () => box.classList.toggle('d-none'));\n if (closeBtn && box) closeBtn.addEventListener('click', () => box.classList.add('d-none'));\n });\n\n const today = new Date();\n const maxDate = new Date(today.getFullYear(), today.getMonth(), today.getDate() + 365);\n const isoDay = (d) =>\n `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, '0')}-${String(d.getDate()).padStart(2, '0')}`;\n $('datePicker').setAttribute('min', isoDay(today));\n $('datePicker').setAttribute('max', isoDay(maxDate));\n\n \/\/ Reset form link\n const resetLink = document.getElementById('resetFormLink');\n if (resetLink) {\n resetLink.addEventListener('click', function(e) {\n e.preventDefault();\n document.getElementById('priceCalculationForm').reset();\n \/\/ Clear date display\n const dateDisplayEl = document.getElementById('dateDisplay');\n if (dateDisplayEl) dateDisplayEl.textContent = '';\n \/\/ Clear selects and disable until date chosen again\n const entrySelect = document.getElementById('entryTime');\n const exitSelect = document.getElementById('exitTime');\n entrySelect.innerHTML = '';\n exitSelect.innerHTML = '';\n entrySelect.disabled = true;\n exitSelect.disabled = true;\n \/\/ Reset holiday checkbox\n const holidayCheckbox = document.getElementById('holidayCheckbox');\n const holidayLabel = document.getElementById('holidayLabel');\n if (holidayCheckbox) holidayCheckbox.checked = false;\n if (holidayLabel) holidayLabel.classList.remove('active');\n \/\/ Reset person count\n const personCountSelect = document.getElementById('personCount');\n if (personCountSelect) personCountSelect.selectedIndex = 0;\n \/\/ Hide errors and results\n const timeErrorEl = document.getElementById('timeError');\n if (timeErrorEl) timeErrorEl.classList.add('d-none');\n const raummieteResultEl = document.getElementById('raummieteResult');\n if (raummieteResultEl) raummieteResultEl.classList.add('d-none');\n const detailsEl = document.getElementById('resultRaummieteDetails');\n if (detailsEl) detailsEl.innerHTML = '';\n const raummieteInfoBoxEl = document.getElementById('raummieteInfoBox');\n if (raummieteInfoBoxEl) raummieteInfoBoxEl.classList.add('d-none');\n const mindestverzehrInfoBoxEl = document.getElementById('mindestverzehrInfoBox');\n if (mindestverzehrInfoBoxEl) mindestverzehrInfoBoxEl.classList.add('d-none');\n const depositEl = document.getElementById('depositResult');\n if (depositEl) depositEl.classList.add('d-none');\n const anzahlungInfoBoxEl = document.getElementById('anzahlungInfoBox');\n if (anzahlungInfoBoxEl) anzahlungInfoBoxEl.classList.add('d-none');\n const ctaBoxEl = document.getElementById('ctaAfterCalc');\n if (ctaBoxEl) ctaBoxEl.classList.add('d-none');\n const perPersonSplitToggleEl = document.getElementById('perPersonSplitToggle');\n if (perPersonSplitToggleEl) perPersonSplitToggleEl.checked = false;\n const perPersonReminderEl = document.getElementById('perPersonReminder');\n if (perPersonReminderEl) perPersonReminderEl.classList.add('d-none');\n const splitPanelEl = document.getElementById('perPersonSplitPanel');\n if (splitPanelEl) splitPanelEl.classList.add('d-none');\n const gesamtProPersonEl = document.getElementById('resultGesamtMinProPerson');\n if (gesamtProPersonEl) {\n gesamtProPersonEl.textContent = '';\n gesamtProPersonEl.classList.add('d-none');\n }\n const perPersonSplitHintEl = document.getElementById('perPersonSplitHint');\n if (perPersonSplitHintEl) {\n perPersonSplitHintEl.textContent = 'Nur zur Orientierung \u2014 der Mindestgesamtpreis gilt f\u00fcr die Gruppe';\n }\n syncFormFieldBold();\n });\n }\n });\n\n \/\/ ?selftest=1 \u2014 Konsolenchecks (Preistabelle, Datum, Anzahlung-Helfer)\n (function runUrlSelfTest() {\n if (typeof location === 'undefined' || !\/\\?.*selftest=1(?:&|$)\/.test(String(location.search || ''))) {\n return;\n }\n const fail = (msg) => { throw new Error(msg); };\n try {\n if (!parseLocalDate('2026-11-11') || parseLocalDate('2026-11-11').getDate() !== 11) {\n fail('parseLocalDate');\n }\n if (parseLocalDate('') !== null) fail('parseLocalDate empty');\n const apDo = getApplicablePrices('Bronze', 4, false);\n const p1015 = getPriceForQuarterHour(apDo, 10 * 60, 10 * 60 + 15);\n if (p1015 !== 4.25) fail('Bronze Do 10:00 Uhr \/ 4.25 erwartet, got ' + p1015);\n const h1 = getHighestHourlyRate('Bronze', 4, false, 10 * 60, 11 * 60);\n if (Math.abs(h1 - 17) > 0.001) fail('getHighestHourlyRate 1h = 17, got ' + h1);\n const apSa = getApplicablePrices('Bronze', 6, false);\n if (getPriceForQuarterHour(apSa, 0, 15) !== 0) fail('Sa 00:00 au\u00dferhalb Tabelle = 0');\n const t2 = calculateTwoHourlyRates('Bronze', 5, false, 20 * 60, 22 * 60);\n if (Math.abs(t2 - 78) > 0.01) {\n fail('calculateTwoHourlyRates Fr 20\u201322h erwartet 78, got ' + t2);\n }\n console.info('[raumpreisrechner] selftest OK');\n } catch (e) {\n console.error('[raumpreisrechner] selftest FEHLER', e);\n }\n })();\n <\/script>\n<\/body>\n<\/html><\/div><\/div><div class=\"fusion-layout-column fusion_builder_column fusion-builder-column-2 fusion_builder_column_1_4 1_4 fusion-flex-column\" style=\"--awb-bg-size:cover;--awb-width-large:25%;--awb-margin-top-large:0px;--awb-spacing-right-large:7.68%;--awb-margin-bottom-large:20px;--awb-spacing-left-large:7.68%;--awb-width-medium:100%;--awb-order-medium:0;--awb-spacing-right-medium:1.92%;--awb-spacing-left-medium:1.92%;--awb-width-small:100%;--awb-order-small:0;--awb-spacing-right-small:1.92%;--awb-spacing-left-small:1.92%;\"><div class=\"fusion-column-wrapper fusion-column-has-shadow fusion-flex-justify-content-flex-start fusion-content-layout-column\"><\/div><\/div><\/div><\/div>\n","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-5795","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/melodypartybox.de\/myzeil\/wp-json\/wp\/v2\/pages\/5795","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/melodypartybox.de\/myzeil\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/melodypartybox.de\/myzeil\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/melodypartybox.de\/myzeil\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/melodypartybox.de\/myzeil\/wp-json\/wp\/v2\/comments?post=5795"}],"version-history":[{"count":5,"href":"https:\/\/melodypartybox.de\/myzeil\/wp-json\/wp\/v2\/pages\/5795\/revisions"}],"predecessor-version":[{"id":5938,"href":"https:\/\/melodypartybox.de\/myzeil\/wp-json\/wp\/v2\/pages\/5795\/revisions\/5938"}],"wp:attachment":[{"href":"https:\/\/melodypartybox.de\/myzeil\/wp-json\/wp\/v2\/media?parent=5795"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}