Theodore Hotel - Menu & Invoicing<\/title>\n <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\n <style>\n * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n }\n \n body {\n background: #f5f5f5;\n font-family: 'Cormorant Garamond', serif;\n color: #333;\n padding: 20px;\n background-image: radial-gradient(#f5f5f5 1px, transparent 1px);\n background-size: 20px 20px;\n }\n \n .menu-container {\n max-width: 1200px;\n margin: 0 auto;\n background: #f5f5f5;\n border-radius: 12px;\n overflow: hidden;\n box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15);\n position: relative;\n border: 2px solid #AD2419;\n }\n \n .menu-header {\n background: linear-gradient(to right, #ffffff, #f5f5f6);\n color: white;\n padding: 25px 40px;\n display: flex;\n justify-content: space-between;\n align-items: center;\n border-bottom: 4px solid #AD2419;\n position: relative;\n }\n \n .hotel-name {\n font-family: 'Playfair Display', serif;\n text-transform: uppercase;\n letter-spacing: 2px;\n }\n \n .hotel-name h1 {\n font-size: 32px;\n font-weight: 700;\n margin-bottom: 5px;\n color: #e0b45d;\n }\n \n .hotel-name h2 {\n font-size: 20px;\n font-weight: 400;\n letter-spacing: 4px;\n }\n \n .hotel-address {\n text-align: right;\n font-weight: bold;\n font-style: italic;\n font-size: 24px;\n color: #AD2419;\n line-height: 1;\n }\n \n .cart-toggle {\n position: absolute;\n top: 20px;\n right: 20px;\n background: #AD2419;\n color: white;\n border: none;\n padding: 10px 15px;\n border-radius: 5px;\n cursor: pointer;\n font-family: 'Montserrat', sans-serif;\n font-weight: bold;\n display: flex;\n align-items: center;\n gap: 8px;\n box-shadow: 0 3px 8px rgba(0,0,0,0.2);\n transition: all 0.3s;\n }\n \n .cart-toggle:hover {\n background: #8a1d14;\n transform: translateY(-2px);\n }\n \n .cart-badge {\n background: #e0b45d;\n color: #333;\n border-radius: 50%;\n width: 24px;\n height: 24px;\n display: flex;\n align-items: center;\n justify-content: center;\n font-weight: bold;\n }\n \n .menu-title {\n text-align: center;\n padding: 30px 20px 15px;\n background: #fffaf0;\n }\n \n .menu-title h2 {\n font-family: 'Playfair Display', serif;\n font-size: 48px;\n color: #AD2419;\n text-transform: uppercase;\n letter-spacing: 3px;\n font-weight: 700;\n position: relative;\n display: inline-block;\n margin-bottom: 15px;\n }\n \n .menu-title h2:after {\n content: \"\";\n position: absolute;\n bottom: -10px;\n left: 50%;\n transform: translateX(-50%);\n width: 80px;\n height: 3px;\n background: #AD2419;\n }\n \n .punch-line {\n font-family: 'Montserrat', sans-serif;\n font-size: 20px;\n color: #808080;\n font-style: italic;\n margin-top: 10px;\n letter-spacing: 1px;\n }\n \n .menu-table {\n width: 100%;\n border-collapse: collapse;\n padding: 0 20px 30px;\n }\n \n .menu-table td {\n width: 33.33%;\n height:100%;\n text-align: center;\n vertical-align: top;\n padding: 25px 15px;\n border: 1px solid #AD2419;\n cursor: pointer;\n transition: all 0.3s;\n }\n \n .menu-table td:hover {\n background-color: rgba(173, 36, 25, 0.05);\n transform: translateY(-3px);\n }\n \n .item-container {\n height: 100%;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: space-between;\n }\n \n .item-image {\n width: 160px;\n height: 120px;\n margin-bottom: 15px;\n border-radius: 8px;\n overflow: hidden;\n box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);\n position: relative;\n }\n \n .item-image img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n transition: transform 0.3s ease;\n }\n \n .item-container:hover .item-image img {\n transform: scale(1.05);\n }\n \n .item-name {\n font-weight: bold;\n font-size: 20px;\n margin-bottom: 8px;\n color: #1a1a1a;\n font-family: 'Montserrat', sans-serif;\n text-transform: uppercase;\n letter-spacing: 1px;\n }\n \n .item-description {\n font-family: 'Montserrat', sans-serif;\n font-size: 14px;\n color: #808080;\n font-weight: bold;\n margin-bottom: 12px;\n line-height: 1.4;\n min-height: 60px;\n padding: 0 10px;\n }\n \n .item-price {\n color: #AD2419;\n font-weight: bold;\n font-size: 22px;\n font-family: 'Playfair Display', serif;\n font-style: italic;\n margin-top: 1px;\n }\n \n .section-title {\n text-align: center;\n padding: 25px 20px 15px;\n background: #fffaf0;\n border-top: 2px dashed #d8c9b4;\n border-bottom: 2px dashed #d8c9b4;\n }\n \n .section-title h3 {\n font-family: 'Playfair Display', serif;\n font-size: 32px;\n color: #5a4d41;\n text-transform: uppercase;\n letter-spacing: 3px;\n font-weight: 700;\n position: relative;\n display: inline-block;\n }\n \n .section-title h3:after {\n content: \"\";\n position: absolute;\n bottom: -8px;\n left: 50%;\n transform: translateX(-50%);\n width: 60px;\n height: 2px;\n background: #d8c9b4;\n }\n \n .menu-footer {\n background: #f5f5f5;\n color: #AD2419;\n font-weight: bold;\n text-align: center;\n padding: 20px;\n font-size: 24px;\n font-style: italic;\n border-top: 3px solid #AD2419;\n display: flex;\n justify-content: center;\n align-items: center;\n }\n \n .logo-container img {\n max-width: 150px;\n height: auto;\n display: block;\n }\n \n .menu-footer i {\n color: #e0b45d;\n font-size: 20px;\n }\n \n \/* Cart Styles *\/\n .cart-container {\n display: none;\n position: fixed;\n top: 0;\n right: 0;\n width: 100%;\n max-width: 450px;\n height: 100%;\n background: #f5f5f5;\n z-index: 1000;\n box-shadow: -5px 0 20px rgba(0,0,0,0.2);\n overflow-y: auto;\n padding: 20px;\n border-left: 4px solid #AD2419;\n }\n \n .cart-header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding-bottom: 15px;\n border-bottom: 2px solid #AD2419;\n margin-bottom: 20px;\n }\n \n .cart-header h2 {\n font-family: 'Playfair Display', serif;\n color: #AD2419;\n font-size: 28px;\n }\n \n .close-cart {\n background: #AD2419;\n color: white;\n border: none;\n width: 36px;\n height: 36px;\n border-radius: 50%;\n cursor: pointer;\n font-size: 18px;\n display: flex;\n align-items: center;\n justify-content: center;\n }\n \n .cart-items {\n margin-bottom: 20px;\n }\n \n .cart-item {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 15px 0;\n border-bottom: 1px dashed #d8c9b4;\n }\n \n .item-info {\n flex: 1;\n }\n \n .item-title {\n font-weight: bold;\n font-size: 18px;\n color: #1a1a1a;\n }\n \n .item-price-cart {\n color: #AD2419;\n font-weight: bold;\n }\n \n .quantity-controls {\n display: flex;\n align-items: center;\n gap: 8px;\n }\n \n .qty-btn {\n width: 28px;\n height: 28px;\n background: #AD2419;\n color: white;\n border: none;\n border-radius: 4px;\n font-size: 16px;\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n }\n \n .qty-display {\n min-width: 30px;\n text-align: center;\n font-weight: bold;\n }\n \n .remove-btn {\n background: none;\n border: none;\n color: #AD2419;\n cursor: pointer;\n font-size: 16px;\n margin-left: 10px;\n }\n \n .cart-summary {\n background: #fffaf0;\n padding: 20px;\n border-radius: 8px;\n border: 1px solid #d8c9b4;\n }\n \n .summary-row {\n display: flex;\n justify-content: space-between;\n padding: 8px 0;\n }\n \n .grand-total {\n font-weight: bold;\n font-size: 20px;\n color: #AD2419;\n border-top: 2px solid #AD2419;\n padding-top: 10px;\n margin-top: 10px;\n }\n \n .cart-actions {\n display: flex;\n gap: 15px;\n margin-top: 20px;\n }\n \n .cart-btn {\n flex: 1;\n padding: 12px;\n border: none;\n border-radius: 5px;\n font-family: 'Montserrat', sans-serif;\n font-weight: bold;\n cursor: pointer;\n transition: all 0.3s;\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 8px;\n }\n \n .print-btn {\n background: #e0b45d;\n color: #333;\n }\n \n .cancel-btn {\n background: #808080;\n color: white;\n }\n \n .save-btn {\n background: #AD2419;\n color: white;\n }\n \n .cart-btn:hover {\n transform: translateY(-2px);\n box-shadow: 0 3px 8px rgba(0,0,0,0.2);\n }\n \n \/* Invoice Search Section *\/\n .invoice-section {\n background: #fffaf0;\n padding: 30px;\n margin: 20px;\n border-radius: 10px;\n border: 1px solid #d8c9b4;\n display: none;\n }\n \n .invoice-header {\n font-family: 'Playfair Display', serif;\n color: #AD2419;\n font-size: 28px;\n margin-bottom: 20px;\n text-align: center;\n }\n \n .search-controls {\n display: flex;\n gap: 15px;\n margin-bottom: 20px;\n }\n \n .search-controls input, .search-controls select {\n flex: 1;\n padding: 12px;\n border: 1px solid #d8c9b4;\n border-radius: 5px;\n font-family: 'Montserrat', sans-serif;\n }\n \n .search-btn {\n background: #AD2419;\n color: white;\n border: none;\n padding: 12px 20px;\n border-radius: 5px;\n cursor: pointer;\n font-family: 'Montserrat', sans-serif;\n font-weight: bold;\n }\n \n .invoice-results {\n max-height: 400px;\n overflow-y: auto;\n }\n \n .invoice-card {\n background: white;\n border-radius: 8px;\n padding: 15px;\n margin-bottom: 15px;\n box-shadow: 0 3px 8px rgba(0,0,0,0.1);\n border-left: 4px solid #e0b45d;\n }\n \n .invoice-header-row {\n display: flex;\n justify-content: space-between;\n margin-bottom: 10px;\n padding-bottom: 10px;\n border-bottom: 1px dashed #d8c9b4;\n }\n \n .invoice-number {\n font-weight: bold;\n color: #AD2419;\n }\n \n .invoice-date {\n color: #808080;\n }\n \n .invoice-items {\n margin-bottom: 10px;\n }\n \n .invoice-item {\n display: flex;\n justify-content: space-between;\n padding: 5px 0;\n }\n \n .invoice-total {\n font-weight: bold;\n text-align: right;\n color: #AD2419;\n border-top: 1px solid #d8c9b4;\n padding-top: 10px;\n }\n \n \/* Responsive styles *\/\n @media (max-width: 900px) {\n .menu-table td {\n width: 50%;\n display: inline-block;\n }\n \n .menu-header {\n flex-direction: column;\n text-align: center;\n color: #AD2419;\n }\n \n .hotel-address {\n text-align: center;\n margin-top: 30px;\n }\n \n .cart-container {\n max-width: 100%;\n }\n }\n \n @media (max-width: 600px) {\n .menu-table td {\n width: 100%;\n display: block;\n }\n \n .item-image {\n width: 120px;\n height: 90px;\n }\n \n .cart-actions {\n flex-direction: column;\n }\n \n .search-controls {\n flex-direction: column;\n }\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"menu-container\">\n <div class=\"menu-header\">\n <div class=\"logo-container\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/hotel_Logo-1.jpeg\" alt=\"Theodore Hotel Logo\">\n <\/div>\n \n <div class=\"hotel-address\">\n <p><h>100 <\/h><br>\n <h>Yellowhead Hwy<\/h><br>\n <h>Theodore<\/h><br>\n <h> SK SOA 4C0<\/h><br>\n <h>Ph:3066472166<\/h> <\/p>\n <\/div>\n \n <button class=\"cart-toggle\" onclick=\"toggleCart()\">\n <i class=\"fas fa-shopping-cart\"><\/i>\n <span class=\"cart-badge\" id=\"cartCount\">0<\/span>\n <\/button>\n <\/div>\n \n <div class=\"menu-title\">\n <h2>Menu<\/h2>\n <div class=\"punch-line\">Serving Exceptional Cuisine Since 2023<\/div>\n <\/div>\n \n \n <div class=\"section-title\">\n <h3>Appetizers<\/h3>\n <\/div>\n \n <table class=\"menu-table\">\n <tr>\n <td onclick=\"addToCart('Battered Mushrooms', 9.99)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/Battered Mushrooms.jpg\" alt=\"Battered Mushrooms\">\n <\/div>\n <div class=\"item-name\">Battered Mushrooms<\/div>\n <div class=\"item-description\">Golden fried mushrooms with signature batter<\/div>\n <div class=\"item-price\">$9.99<\/div>\n <\/div>\n <\/td>\n <td onclick=\"addToCart('Mozza Sticks', 9.99)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/Mozza Sticks.jpg\" alt=\"Mozza Sticks\">\n <\/div>\n <div class=\"item-name\">Mozza Sticks<\/div>\n <div class=\"item-description\">Crispy breaded mozzarella with marinara<\/div>\n <div class=\"item-price\">$9.99<\/div>\n <\/div>\n <\/td>\n <td onclick=\"addToCart('Chicken Strips', 7.35)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/Chicken Strips.jpeg\" alt=\"Chicken Strips\">\n <\/div>\n <div class=\"item-name\">Chicken Strips<\/div>\n <div class=\"item-description\">Tender chicken breast strips, golden fried<\/div>\n <div class=\"item-price\">$7.35<\/div>\n <\/div>\n <\/td>\n <\/tr>\n <tr>\n <td onclick=\"addToCart('French Fries', 7.25)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/French Fries.jpg\" alt=\"French Fries\">\n <\/div>\n <div class=\"item-name\">French Fries<\/div>\n <div class=\"item-description\">Crispy golden fries with sea salt<\/div>\n <div class=\"item-price\">$7.25<\/div>\n <\/div>\n <\/td>\n <td onclick=\"addToCart('Onion Rings', 7.75)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/Onion Rings.jpg\" alt=\"Onion Rings\">\n <\/div>\n <div class=\"item-name\">Onion Rings<\/div>\n <div class=\"item-description\">Crispy beer-battered onion rings<\/div>\n <div class=\"item-price\">$7.75<\/div>\n <\/div>\n <\/td>\n <td onclick=\"addToCart('Poutine', 8.25)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/Poutine.jpg\" alt=\"Poutine\">\n <\/div>\n <div class=\"item-name\">Poutine<\/div>\n <div class=\"item-description\">Classic Canadian fries, cheese curds, gravy<\/div>\n <div class=\"item-price\">$8.25<\/div>\n <\/div>\n <\/td>\n <\/tr>\n <tr>\n <td onclick=\"addToCart('Dry Ribs', 13.99)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/Dry Ribs.jpeg\" alt=\"Dry Ribs\">\n <\/div>\n <div class=\"item-name\">Dry Ribs<\/div>\n <div class=\"item-description\">Tender pork ribs with signature dry rub<\/div>\n <div class=\"item-price\">$13.99<\/div>\n <\/div>\n <\/td>\n <td onclick=\"addToCart('Chicken Wings', 13.99)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/Chicken Wings.jpg\" alt=\"Chicken Wings\">\n <\/div>\n <div class=\"item-name\">Chicken Wings<\/div>\n <div class=\"item-description\">Jumbo wings with choice of sauce<\/div>\n <div class=\"item-price\">$13.99<\/div>\n <\/div>\n <\/td>\n <td onclick=\"addToCart('Popcorn Chicken', 7.55)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/Popcorn-Chicken.jpg\" alt=\"Popcorn Chicken\">\n <\/div>\n <div class=\"item-name\">Popcorn Chicken<\/div>\n <div class=\"item-description\">Bite-sized crispy chicken pieces<\/div>\n <div class=\"item-price\">$7.55<\/div>\n <\/div>\n <\/td>\n <\/tr>\n <\/table>\n \n \n <div class=\"section-title\">\n <h3>Main Course<\/h3>\n <\/div>\n \n <table class=\"menu-table\">\n <tr>\n <td onclick=\"addToCart('Chicken Poutine', 14.99)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/Chicken Poutine.jpg\" alt=\"Chicken Poutine\">\n <\/div>\n <div class=\"item-name\">Chicken Poutine<\/div>\n <div class=\"item-description\">Poutine topped with deep-fried chicken<\/div>\n <div class=\"item-price\">$14.99<\/div>\n <\/div>\n <\/td>\n <td onclick=\"addToCart('Sweet & Sour', 14.99)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/Sweet Sour1.jpeg\" alt=\"Sweet & Sour\">\n <\/div>\n <div class=\"item-name\">Sweet & Sour<\/div>\n <div class=\"item-description\">Chicken or pork with peppers in tangy sauce<\/div>\n <div class=\"item-price\">$14.99<\/div>\n <\/div>\n <\/td>\n <td onclick=\"addToCart('Teriyaki', 14.99)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/chicken Teriyaki.jpg\" alt=\"Teriyaki\">\n <\/div>\n <div class=\"item-name\">Teriyaki<\/div>\n <div class=\"item-description\">Chicken or pork with teriyaki glaze<\/div>\n <div class=\"item-price\">$14.99<\/div>\n <\/div>\n <\/td>\n <\/tr>\n <tr>\n <td onclick=\"addToCart('NY Strip Steak', 22.99)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/NY Strip Steak.jpg\" alt=\"NY Strip Steak\">\n <\/div>\n <div class=\"item-name\">NY Strip Steak<\/div>\n <div class=\"item-description\">10oz premium steak with fries and salad<\/div>\n <div class=\"item-price\">$22.99<\/div>\n <\/div>\n <\/td>\n <td onclick=\"addToCart('Theodore Perogies', 14.99)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/perogies.jpg\" alt=\"Theodore Perogies\">\n <\/div>\n <div class=\"item-name\">Theodore Perogies<\/div>\n <div class=\"item-description\">Homemade perogies with farmer's sausage<\/div>\n <div class=\"item-price\">$14.99<\/div>\n <\/div>\n <\/td>\n <td onclick=\"addToCart('Fish Fillet', 14.99)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/fish fillet.jpg\" alt=\"Fish Fillet\">\n <\/div>\n <div class=\"item-name\">Fish Fillet<\/div>\n <div class=\"item-description\">Beer-battered cod with tartar sauce<\/div>\n <div class=\"item-price\">$14.99<\/div>\n <\/div>\n <\/td>\n <\/tr>\n <\/table>\n \n \n <div class=\"section-title\">\n <h3>Wraps & Sandwiches<\/h3>\n <\/div>\n \n <table class=\"menu-table\">\n <tr>\n <td onclick=\"addToCart('Chicken Bacon Ranch', 16.99)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/Chicken Bacon Ranch.jpg\" alt=\"Chicken Bacon Ranch\">\n <\/div>\n <div class=\"item-name\">Chicken Bacon Ranch<\/div>\n <div class=\"item-description\">Grilled chicken, bacon, ranch dressing<\/div>\n <div class=\"item-price\">$16.99<\/div>\n <\/div>\n <\/td>\n <td onclick=\"addToCart('Chicken Caesar', 16.99)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/Chicken Ceasar.jpg\" alt=\"Chicken Caesar\">\n <\/div>\n <div class=\"item-name\">Chicken Caesar<\/div>\n <div class=\"item-description\">Grilled chicken, romaine, parmesan, caesar<\/div>\n <div class=\"item-price\">$16.99<\/div>\n <\/div>\n <\/td>\n <td onclick=\"addToCart('Spicy Chicken', 16.99)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/Crispy chicken.jpg\" alt=\"Spicy Chicken\">\n <\/div>\n <div class=\"item-name\">Spicy Chicken<\/div>\n <div class=\"item-description\">Crispy chicken with spicy sauce<\/div>\n <div class=\"item-price\">$16.99<\/div>\n <\/div>\n <\/td>\n <\/tr>\n <tr>\n <td onclick=\"addToCart('Buffalo Chicken', 16.99)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/Buffalo Chicken.jpg\" alt=\"Buffalo Chicken\">\n <\/div>\n <div class=\"item-name\">Buffalo Chicken<\/div>\n <div class=\"item-description\">Crispy chicken tossed in buffalo sauce<\/div>\n <div class=\"item-price\">$16.99<\/div>\n <\/div>\n <\/td>\n <td onclick=\"addToCart('Honey Dill Chicken', 16.99)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/Honey Drill.jpg\" alt=\"Honey Dill Chicken\">\n <\/div>\n <div class=\"item-name\">Honey Dill Chicken<\/div>\n <div class=\"item-description\">Grilled chicken with honey dill sauce<\/div>\n <div class=\"item-price\">$16.99<\/div>\n <\/div>\n <\/td>\n <td onclick=\"addToCart('Loaded Nachos', 10.99)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/Nachos.jpg\" alt=\"Loaded Nachos\">\n <\/div>\n <div class=\"item-name\">Loaded Nachos<\/div>\n <div class=\"item-description\">Tortilla chips topped with cheese, salsa, jalape\u00f1os<\/div>\n <div class=\"item-price\">$10.99<\/div>\n <\/div>\n <\/td>\n <\/tr>\n <\/table>\n \n \n <div class=\"section-title\">\n <h3>Desserts<\/h3>\n <\/div>\n \n <table class=\"menu-table\">\n <tr>\n <td onclick=\"addToCart('Assorted Cheesecake', 3.55)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/Cheese Cake.jpeg\" alt=\"Cheesecake\">\n <\/div>\n <div class=\"item-name\">Assorted Cheesecake<\/div>\n <div class=\"item-description\">Daily selection of premium cheesecakes<\/div>\n <div class=\"item-price\">$3.55<\/div>\n <\/div>\n <\/td>\n <td onclick=\"addToCart('Chocolate Fudge Cake', 6.99)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/chocolate cake.jpg\" alt=\"Chocolate Cake\">\n <\/div>\n <div class=\"item-name\">Chocolate Fudge Cake<\/div>\n <div class=\"item-description\">Rich chocolate cake with fudge frosting<\/div>\n <div class=\"item-price\">$6.99<\/div>\n <\/div>\n <\/td>\n <td onclick=\"addToCart('Apple Pie', 7.25)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/apple pie.jpg\" alt=\"Apple Pie\">\n <\/div>\n <div class=\"item-name\">Apple Pie<\/div>\n <div class=\"item-description\">Homemade pie with vanilla ice cream<\/div>\n <div class=\"item-price\">$7.25<\/div>\n <\/div>\n <\/td>\n <\/tr>\n <\/table>\n \n \n <div class=\"invoice-section\" id=\"invoiceSection\">\n <h2 class=\"invoice-header\">Invoice Search<\/h2>\n <div class=\"search-controls\">\n <input type=\"date\" id=\"invoiceDate\" placeholder=\"Select date\">\n <input type=\"text\" id=\"invoiceNumber\" placeholder=\"Invoice number\">\n <button class=\"search-btn\" onclick=\"searchInvoices()\">\n <i class=\"fas fa-search\"><\/i> Search\n <\/button>\n <\/div>\n <div class=\"invoice-results\" id=\"invoiceResults\">\n \n <\/div>\n <\/div>\n \n <div class=\"menu-footer\">\n <i class=\"fas fa-utensils\"><\/i> Substitutions may incur additional charges. Prices subject to change. <i class=\"fas fa-info-circle\"><\/i>\n <\/div>\n <\/div>\n \n \n <div class=\"cart-container\" id=\"cartContainer\">\n <div class=\"cart-header\">\n <h2>Your Order<\/h2>\n <button class=\"close-cart\" onclick=\"toggleCart()\">\n <i class=\"fas fa-times\"><\/i>\n <\/button>\n <\/div>\n \n <div class=\"cart-items\" id=\"cartItems\">\n \n <\/div>\n \n <div class=\"cart-summary\">\n <div class=\"summary-row\">\n <span>Subtotal:<\/span>\n <span id=\"subtotal\">$0.00<\/span>\n <\/div>\n <div class=\"summary-row\">\n <span>Tax (5%):<\/span>\n <span id=\"tax\">$0.00<\/span>\n <\/div>\n <div class=\"summary-row grand-total\">\n <span>Grand Total:<\/span>\n <span id=\"grandTotal\">$0.00<\/span>\n <\/div>\n <\/div>\n \n <div class=\"cart-actions\">\n <button class=\"cart-btn print-btn\" onclick=\"printInvoice()\">\n <i class=\"fas fa-print\"><\/i> Print\n <\/button>\n <button class=\"cart-btn cancel-btn\" onclick=\"clearCart()\">\n <i class=\"fas fa-times\"><\/i> Cancel\n <\/button>\n <button class=\"cart-btn save-btn\" onclick=\"saveInvoice()\">\n <i class=\"fas fa-save\"><\/i> Save Invoice\n <\/button>\n <\/div>\n \n <div class=\"cart-actions\">\n <button class=\"cart-btn\" style=\"background: #5a4d41; color: white;\" onclick=\"toggleInvoiceSection()\">\n <i class=\"fas fa-file-invoice\"><\/i> View Invoices\n <\/button>\n <\/div>\n <\/div>\n \n <script>\n \/\/ Cart data\n let cart = [];\n let invoices = JSON.parse(localStorage.getItem('invoices')) || [];\n \n \/\/ Initialize the page\n document.addEventListener('DOMContentLoaded', () => {\n updateCartCount();\n });\n \n \/\/ Add item to cart\n function addToCart(name, price) {\n \/\/ Check if item already in cart\n const existingItem = cart.find(item => item.name === name);\n \n if (existingItem) {\n existingItem.quantity++;\n } else {\n cart.push({\n name: name,\n price: price,\n quantity: 1\n });\n }\n \n updateCartCount();\n renderCartItems();\n \/\/showNotification(`${name} added to cart`);\n }\n \n \/\/ Update cart item quantity\n function updateQuantity(index, change) {\n cart[index].quantity += change;\n \n \/\/ Remove item if quantity is 0\n if (cart[index].quantity <= 0) {\n cart.splice(index, 1);\n }\n \n updateCartCount();\n renderCartItems();\n }\n \n \/\/ Remove item from cart\n function removeItem(index) {\n cart.splice(index, 1);\n updateCartCount();\n renderCartItems();\n }\n \n \/\/ Update cart badge count\n function updateCartCount() {\n const count = cart.reduce((total, item) => total + item.quantity, 0);\n document.getElementById('cartCount').textContent = count;\n }\n \n \/\/ Render cart items\n function renderCartItems() {\n const cartItems = document.getElementById('cartItems');\n cartItems.innerHTML = '';\n \n if (cart.length === 0) {\n cartItems.innerHTML = '<p style=\"text-align: center; padding: 20px;\">Your cart is empty<\/p>';\n updateCartTotals();\n return;\n }\n \n cart.forEach((item, index) => {\n const itemElement = document.createElement('div');\n itemElement.className = 'cart-item';\n itemElement.innerHTML = `\n <div class=\"item-info\">\n <div class=\"item-title\">${item.name}<\/div>\n <div class=\"item-price-cart\">$${item.price.toFixed(2)}<\/div>\n <\/div>\n <div class=\"quantity-controls\">\n <button class=\"qty-btn\" onclick=\"updateQuantity(${index}, -1)\">-<\/button>\n <span class=\"qty-display\">${item.quantity}<\/span>\n <button class=\"qty-btn\" onclick=\"updateQuantity(${index}, 1)\">+<\/button>\n <\/div>\n <button class=\"remove-btn\" onclick=\"removeItem(${index})\">\n <i class=\"fas fa-trash\"><\/i>\n <\/button>\n `;\n cartItems.appendChild(itemElement);\n });\n \n updateCartTotals();\n }\n \n \/\/ Update cart totals\n function updateCartTotals() {\n const subtotal = cart.reduce((sum, item) => sum + (item.price * item.quantity), 0);\n const tax = subtotal * 0.05;\n const grandTotal = subtotal + tax;\n \n document.getElementById('subtotal').textContent = `$${subtotal.toFixed(2)}`;\n document.getElementById('tax').textContent = `$${tax.toFixed(2)}`;\n document.getElementById('grandTotal').textContent = `$${grandTotal.toFixed(2)}`;\n }\n \n \/\/ Toggle cart visibility\n function toggleCart() {\n const cartContainer = document.getElementById('cartContainer');\n cartContainer.style.display = cartContainer.style.display === 'block' ? 'none' : 'block';\n }\n \n \/\/ Toggle invoice section\n function toggleInvoiceSection() {\n const invoiceSection = document.getElementById('invoiceSection');\n invoiceSection.style.display = invoiceSection.style.display === 'block' ? 'none' : 'block';\n \n \/\/ Hide cart when showing invoices\n if (invoiceSection.style.display === 'block') {\n document.getElementById('cartContainer').style.display = 'none';\n }\n }\n \n \/\/ Clear cart\n function clearCart() {\n cart = [];\n updateCartCount();\n renderCartItems();\n \/\/showNotification('Cart cleared');\n }\n \n \/\/ Print invoice\n function printInvoice() {\n if (cart.length === 0) {\n \/\/showNotification('Cart is empty!');\n return;\n }\n \n \/\/ In a real app, you would open a print-friendly invoice page\n \/\/alert('Opening print dialog...');\n window.print();\n }\n \n \/\/ Save invoice\n function saveInvoice() {\n if (cart.length === 0) {\n showNotification('Cart is empty!');\n return;\n }\n \n const invoiceNumber = 'INV-' + Date.now().toString().slice(-6);\n const invoiceDate = new Date().toLocaleDateString();\n const subtotal = cart.reduce((sum, item) => sum + (item.price * item.quantity), 0);\n const tax = subtotal * 0.05;\n const grandTotal = subtotal + tax;\n \n const invoice = {\n id: Date.now(),\n number: invoiceNumber,\n date: invoiceDate,\n items: [...cart],\n subtotal: subtotal,\n tax: tax,\n total: grandTotal\n };\n \n invoices.push(invoice);\n localStorage.setItem('invoices', JSON.stringify(invoices));\n \n cart = [];\n updateCartCount();\n renderCartItems();\n \n \/\/showNotification(`Invoice ${invoiceNumber} saved successfully!`);\n }\n \n \/\/ Search invoices\n function searchInvoices() {\n const dateFilter = document.getElementById('invoiceDate').value;\n const numberFilter = document.getElementById('invoiceNumber').value.toLowerCase();\n \n const results = invoices.filter(invoice => {\n const matchesDate = dateFilter ? invoice.date === new Date(dateFilter).toLocaleDateString() : true;\n const matchesNumber = numberFilter ? invoice.number.toLowerCase().includes(numberFilter) : true;\n return matchesDate && matchesNumber;\n });\n \n displayInvoiceResults(results);\n }\n \n \/\/ Display invoice search results\n function displayInvoiceResults(results) {\n const resultsContainer = document.getElementById('invoiceResults');\n \n if (results.length === 0) {\n resultsContainer.innerHTML = '<p style=\"text-align: center; padding: 20px;\">No invoices found<\/p>';\n return;\n }\n \n resultsContainer.innerHTML = '';\n \n results.forEach(invoice => {\n const invoiceCard = document.createElement('div');\n invoiceCard.className = 'invoice-card';\n \n let itemsHTML = '';\n invoice.items.forEach(item => {\n itemsHTML += `\n <div class=\"invoice-item\">\n <span>${item.name} (${item.quantity}x)<\/span>\n <span>$${(item.price * item.quantity).toFixed(2)}<\/span>\n <\/div>\n `;\n });\n \n invoiceCard.innerHTML = `\n <div class=\"invoice-header-row\">\n <span class=\"invoice-number\">${invoice.number}<\/span>\n <span class=\"invoice-date\">${invoice.date}<\/span>\n <\/div>\n <div class=\"invoice-items\">\n ${itemsHTML}\n <\/div>\n <div class=\"invoice-total\">\n Total: $${invoice.total.toFixed(2)}\n <\/div>\n `;\n \n resultsContainer.appendChild(invoiceCard);\n });\n }\n \n \/\/ Show notification\n function showNotification(message) {\n \/\/ In a real app, you would use a toast notification\n alert(message);\n }\n <\/script>\n<\/body>\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Theodore Hotel - Menu & Invoicing 100 Yellowhead Hwy Theodore SK SOA 4C0 Ph:3066472166 0 Menu Serving Exceptional Cuisine Since […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"normal-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"disabled","ast-banner-title-visibility":"disabled","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"disabled","ast-disable-related-posts":"","theme-transparent-header-meta":"disabled","adv-header-id-meta":"","stick-header-meta":"disabled","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-1472","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/theodorehotel.ca\/index.php\/wp-json\/wp\/v2\/pages\/1472","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/theodorehotel.ca\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/theodorehotel.ca\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/theodorehotel.ca\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/theodorehotel.ca\/index.php\/wp-json\/wp\/v2\/comments?post=1472"}],"version-history":[{"count":250,"href":"https:\/\/theodorehotel.ca\/index.php\/wp-json\/wp\/v2\/pages\/1472\/revisions"}],"predecessor-version":[{"id":2001,"href":"https:\/\/theodorehotel.ca\/index.php\/wp-json\/wp\/v2\/pages\/1472\/revisions\/2001"}],"wp:attachment":[{"href":"https:\/\/theodorehotel.ca\/index.php\/wp-json\/wp\/v2\/media?parent=1472"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

\n\t\t\t\t

\n\t\t\t\t\t\n\n\n \n \n Theodore Hotel - Menu & Invoicing<\/title>\n <link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\n <style>\n * {\n margin: 0;\n padding: 0;\n box-sizing: border-box;\n }\n \n body {\n background: #f5f5f5;\n font-family: 'Cormorant Garamond', serif;\n color: #333;\n padding: 20px;\n background-image: radial-gradient(#f5f5f5 1px, transparent 1px);\n background-size: 20px 20px;\n }\n \n .menu-container {\n max-width: 1200px;\n margin: 0 auto;\n background: #f5f5f5;\n border-radius: 12px;\n overflow: hidden;\n box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15);\n position: relative;\n border: 2px solid #AD2419;\n }\n \n .menu-header {\n background: linear-gradient(to right, #ffffff, #f5f5f6);\n color: white;\n padding: 25px 40px;\n display: flex;\n justify-content: space-between;\n align-items: center;\n border-bottom: 4px solid #AD2419;\n position: relative;\n }\n \n .hotel-name {\n font-family: 'Playfair Display', serif;\n text-transform: uppercase;\n letter-spacing: 2px;\n }\n \n .hotel-name h1 {\n font-size: 32px;\n font-weight: 700;\n margin-bottom: 5px;\n color: #e0b45d;\n }\n \n .hotel-name h2 {\n font-size: 20px;\n font-weight: 400;\n letter-spacing: 4px;\n }\n \n .hotel-address {\n text-align: right;\n font-weight: bold;\n font-style: italic;\n font-size: 24px;\n color: #AD2419;\n line-height: 1;\n }\n \n .cart-toggle {\n position: absolute;\n top: 20px;\n right: 20px;\n background: #AD2419;\n color: white;\n border: none;\n padding: 10px 15px;\n border-radius: 5px;\n cursor: pointer;\n font-family: 'Montserrat', sans-serif;\n font-weight: bold;\n display: flex;\n align-items: center;\n gap: 8px;\n box-shadow: 0 3px 8px rgba(0,0,0,0.2);\n transition: all 0.3s;\n }\n \n .cart-toggle:hover {\n background: #8a1d14;\n transform: translateY(-2px);\n }\n \n .cart-badge {\n background: #e0b45d;\n color: #333;\n border-radius: 50%;\n width: 24px;\n height: 24px;\n display: flex;\n align-items: center;\n justify-content: center;\n font-weight: bold;\n }\n \n .menu-title {\n text-align: center;\n padding: 30px 20px 15px;\n background: #fffaf0;\n }\n \n .menu-title h2 {\n font-family: 'Playfair Display', serif;\n font-size: 48px;\n color: #AD2419;\n text-transform: uppercase;\n letter-spacing: 3px;\n font-weight: 700;\n position: relative;\n display: inline-block;\n margin-bottom: 15px;\n }\n \n .menu-title h2:after {\n content: \"\";\n position: absolute;\n bottom: -10px;\n left: 50%;\n transform: translateX(-50%);\n width: 80px;\n height: 3px;\n background: #AD2419;\n }\n \n .punch-line {\n font-family: 'Montserrat', sans-serif;\n font-size: 20px;\n color: #808080;\n font-style: italic;\n margin-top: 10px;\n letter-spacing: 1px;\n }\n \n .menu-table {\n width: 100%;\n border-collapse: collapse;\n padding: 0 20px 30px;\n }\n \n .menu-table td {\n width: 33.33%;\n height:100%;\n text-align: center;\n vertical-align: top;\n padding: 25px 15px;\n border: 1px solid #AD2419;\n cursor: pointer;\n transition: all 0.3s;\n }\n \n .menu-table td:hover {\n background-color: rgba(173, 36, 25, 0.05);\n transform: translateY(-3px);\n }\n \n .item-container {\n height: 100%;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: space-between;\n }\n \n .item-image {\n width: 160px;\n height: 120px;\n margin-bottom: 15px;\n border-radius: 8px;\n overflow: hidden;\n box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);\n position: relative;\n }\n \n .item-image img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n transition: transform 0.3s ease;\n }\n \n .item-container:hover .item-image img {\n transform: scale(1.05);\n }\n \n .item-name {\n font-weight: bold;\n font-size: 20px;\n margin-bottom: 8px;\n color: #1a1a1a;\n font-family: 'Montserrat', sans-serif;\n text-transform: uppercase;\n letter-spacing: 1px;\n }\n \n .item-description {\n font-family: 'Montserrat', sans-serif;\n font-size: 14px;\n color: #808080;\n font-weight: bold;\n margin-bottom: 12px;\n line-height: 1.4;\n min-height: 60px;\n padding: 0 10px;\n }\n \n .item-price {\n color: #AD2419;\n font-weight: bold;\n font-size: 22px;\n font-family: 'Playfair Display', serif;\n font-style: italic;\n margin-top: 1px;\n }\n \n .section-title {\n text-align: center;\n padding: 25px 20px 15px;\n background: #fffaf0;\n border-top: 2px dashed #d8c9b4;\n border-bottom: 2px dashed #d8c9b4;\n }\n \n .section-title h3 {\n font-family: 'Playfair Display', serif;\n font-size: 32px;\n color: #5a4d41;\n text-transform: uppercase;\n letter-spacing: 3px;\n font-weight: 700;\n position: relative;\n display: inline-block;\n }\n \n .section-title h3:after {\n content: \"\";\n position: absolute;\n bottom: -8px;\n left: 50%;\n transform: translateX(-50%);\n width: 60px;\n height: 2px;\n background: #d8c9b4;\n }\n \n .menu-footer {\n background: #f5f5f5;\n color: #AD2419;\n font-weight: bold;\n text-align: center;\n padding: 20px;\n font-size: 24px;\n font-style: italic;\n border-top: 3px solid #AD2419;\n display: flex;\n justify-content: center;\n align-items: center;\n }\n \n .logo-container img {\n max-width: 150px;\n height: auto;\n display: block;\n }\n \n .menu-footer i {\n color: #e0b45d;\n font-size: 20px;\n }\n \n \/* Cart Styles *\/\n .cart-container {\n display: none;\n position: fixed;\n top: 0;\n right: 0;\n width: 100%;\n max-width: 450px;\n height: 100%;\n background: #f5f5f5;\n z-index: 1000;\n box-shadow: -5px 0 20px rgba(0,0,0,0.2);\n overflow-y: auto;\n padding: 20px;\n border-left: 4px solid #AD2419;\n }\n \n .cart-header {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding-bottom: 15px;\n border-bottom: 2px solid #AD2419;\n margin-bottom: 20px;\n }\n \n .cart-header h2 {\n font-family: 'Playfair Display', serif;\n color: #AD2419;\n font-size: 28px;\n }\n \n .close-cart {\n background: #AD2419;\n color: white;\n border: none;\n width: 36px;\n height: 36px;\n border-radius: 50%;\n cursor: pointer;\n font-size: 18px;\n display: flex;\n align-items: center;\n justify-content: center;\n }\n \n .cart-items {\n margin-bottom: 20px;\n }\n \n .cart-item {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding: 15px 0;\n border-bottom: 1px dashed #d8c9b4;\n }\n \n .item-info {\n flex: 1;\n }\n \n .item-title {\n font-weight: bold;\n font-size: 18px;\n color: #1a1a1a;\n }\n \n .item-price-cart {\n color: #AD2419;\n font-weight: bold;\n }\n \n .quantity-controls {\n display: flex;\n align-items: center;\n gap: 8px;\n }\n \n .qty-btn {\n width: 28px;\n height: 28px;\n background: #AD2419;\n color: white;\n border: none;\n border-radius: 4px;\n font-size: 16px;\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: center;\n }\n \n .qty-display {\n min-width: 30px;\n text-align: center;\n font-weight: bold;\n }\n \n .remove-btn {\n background: none;\n border: none;\n color: #AD2419;\n cursor: pointer;\n font-size: 16px;\n margin-left: 10px;\n }\n \n .cart-summary {\n background: #fffaf0;\n padding: 20px;\n border-radius: 8px;\n border: 1px solid #d8c9b4;\n }\n \n .summary-row {\n display: flex;\n justify-content: space-between;\n padding: 8px 0;\n }\n \n .grand-total {\n font-weight: bold;\n font-size: 20px;\n color: #AD2419;\n border-top: 2px solid #AD2419;\n padding-top: 10px;\n margin-top: 10px;\n }\n \n .cart-actions {\n display: flex;\n gap: 15px;\n margin-top: 20px;\n }\n \n .cart-btn {\n flex: 1;\n padding: 12px;\n border: none;\n border-radius: 5px;\n font-family: 'Montserrat', sans-serif;\n font-weight: bold;\n cursor: pointer;\n transition: all 0.3s;\n display: flex;\n align-items: center;\n justify-content: center;\n gap: 8px;\n }\n \n .print-btn {\n background: #e0b45d;\n color: #333;\n }\n \n .cancel-btn {\n background: #808080;\n color: white;\n }\n \n .save-btn {\n background: #AD2419;\n color: white;\n }\n \n .cart-btn:hover {\n transform: translateY(-2px);\n box-shadow: 0 3px 8px rgba(0,0,0,0.2);\n }\n \n \/* Invoice Search Section *\/\n .invoice-section {\n background: #fffaf0;\n padding: 30px;\n margin: 20px;\n border-radius: 10px;\n border: 1px solid #d8c9b4;\n display: none;\n }\n \n .invoice-header {\n font-family: 'Playfair Display', serif;\n color: #AD2419;\n font-size: 28px;\n margin-bottom: 20px;\n text-align: center;\n }\n \n .search-controls {\n display: flex;\n gap: 15px;\n margin-bottom: 20px;\n }\n \n .search-controls input, .search-controls select {\n flex: 1;\n padding: 12px;\n border: 1px solid #d8c9b4;\n border-radius: 5px;\n font-family: 'Montserrat', sans-serif;\n }\n \n .search-btn {\n background: #AD2419;\n color: white;\n border: none;\n padding: 12px 20px;\n border-radius: 5px;\n cursor: pointer;\n font-family: 'Montserrat', sans-serif;\n font-weight: bold;\n }\n \n .invoice-results {\n max-height: 400px;\n overflow-y: auto;\n }\n \n .invoice-card {\n background: white;\n border-radius: 8px;\n padding: 15px;\n margin-bottom: 15px;\n box-shadow: 0 3px 8px rgba(0,0,0,0.1);\n border-left: 4px solid #e0b45d;\n }\n \n .invoice-header-row {\n display: flex;\n justify-content: space-between;\n margin-bottom: 10px;\n padding-bottom: 10px;\n border-bottom: 1px dashed #d8c9b4;\n }\n \n .invoice-number {\n font-weight: bold;\n color: #AD2419;\n }\n \n .invoice-date {\n color: #808080;\n }\n \n .invoice-items {\n margin-bottom: 10px;\n }\n \n .invoice-item {\n display: flex;\n justify-content: space-between;\n padding: 5px 0;\n }\n \n .invoice-total {\n font-weight: bold;\n text-align: right;\n color: #AD2419;\n border-top: 1px solid #d8c9b4;\n padding-top: 10px;\n }\n \n \/* Responsive styles *\/\n @media (max-width: 900px) {\n .menu-table td {\n width: 50%;\n display: inline-block;\n }\n \n .menu-header {\n flex-direction: column;\n text-align: center;\n color: #AD2419;\n }\n \n .hotel-address {\n text-align: center;\n margin-top: 30px;\n }\n \n .cart-container {\n max-width: 100%;\n }\n }\n \n @media (max-width: 600px) {\n .menu-table td {\n width: 100%;\n display: block;\n }\n \n .item-image {\n width: 120px;\n height: 90px;\n }\n \n .cart-actions {\n flex-direction: column;\n }\n \n .search-controls {\n flex-direction: column;\n }\n }\n <\/style>\n<\/head>\n<body>\n <div class=\"menu-container\">\n <div class=\"menu-header\">\n <div class=\"logo-container\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/hotel_Logo-1.jpeg\" alt=\"Theodore Hotel Logo\">\n <\/div>\n \n <div class=\"hotel-address\">\n <p><h>100 <\/h><br>\n <h>Yellowhead Hwy<\/h><br>\n <h>Theodore<\/h><br>\n <h> SK SOA 4C0<\/h><br>\n <h>Ph:3066472166<\/h> <\/p>\n <\/div>\n \n <button class=\"cart-toggle\" onclick=\"toggleCart()\">\n <i class=\"fas fa-shopping-cart\"><\/i>\n <span class=\"cart-badge\" id=\"cartCount\">0<\/span>\n <\/button>\n <\/div>\n \n <div class=\"menu-title\">\n <h2>Menu<\/h2>\n <div class=\"punch-line\">Serving Exceptional Cuisine Since 2023<\/div>\n <\/div>\n \n \n <div class=\"section-title\">\n <h3>Appetizers<\/h3>\n <\/div>\n \n <table class=\"menu-table\">\n <tr>\n <td onclick=\"addToCart('Battered Mushrooms', 9.99)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/Battered Mushrooms.jpg\" alt=\"Battered Mushrooms\">\n <\/div>\n <div class=\"item-name\">Battered Mushrooms<\/div>\n <div class=\"item-description\">Golden fried mushrooms with signature batter<\/div>\n <div class=\"item-price\">$9.99<\/div>\n <\/div>\n <\/td>\n <td onclick=\"addToCart('Mozza Sticks', 9.99)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/Mozza Sticks.jpg\" alt=\"Mozza Sticks\">\n <\/div>\n <div class=\"item-name\">Mozza Sticks<\/div>\n <div class=\"item-description\">Crispy breaded mozzarella with marinara<\/div>\n <div class=\"item-price\">$9.99<\/div>\n <\/div>\n <\/td>\n <td onclick=\"addToCart('Chicken Strips', 7.35)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/Chicken Strips.jpeg\" alt=\"Chicken Strips\">\n <\/div>\n <div class=\"item-name\">Chicken Strips<\/div>\n <div class=\"item-description\">Tender chicken breast strips, golden fried<\/div>\n <div class=\"item-price\">$7.35<\/div>\n <\/div>\n <\/td>\n <\/tr>\n <tr>\n <td onclick=\"addToCart('French Fries', 7.25)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/French Fries.jpg\" alt=\"French Fries\">\n <\/div>\n <div class=\"item-name\">French Fries<\/div>\n <div class=\"item-description\">Crispy golden fries with sea salt<\/div>\n <div class=\"item-price\">$7.25<\/div>\n <\/div>\n <\/td>\n <td onclick=\"addToCart('Onion Rings', 7.75)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/Onion Rings.jpg\" alt=\"Onion Rings\">\n <\/div>\n <div class=\"item-name\">Onion Rings<\/div>\n <div class=\"item-description\">Crispy beer-battered onion rings<\/div>\n <div class=\"item-price\">$7.75<\/div>\n <\/div>\n <\/td>\n <td onclick=\"addToCart('Poutine', 8.25)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/Poutine.jpg\" alt=\"Poutine\">\n <\/div>\n <div class=\"item-name\">Poutine<\/div>\n <div class=\"item-description\">Classic Canadian fries, cheese curds, gravy<\/div>\n <div class=\"item-price\">$8.25<\/div>\n <\/div>\n <\/td>\n <\/tr>\n <tr>\n <td onclick=\"addToCart('Dry Ribs', 13.99)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/Dry Ribs.jpeg\" alt=\"Dry Ribs\">\n <\/div>\n <div class=\"item-name\">Dry Ribs<\/div>\n <div class=\"item-description\">Tender pork ribs with signature dry rub<\/div>\n <div class=\"item-price\">$13.99<\/div>\n <\/div>\n <\/td>\n <td onclick=\"addToCart('Chicken Wings', 13.99)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/Chicken Wings.jpg\" alt=\"Chicken Wings\">\n <\/div>\n <div class=\"item-name\">Chicken Wings<\/div>\n <div class=\"item-description\">Jumbo wings with choice of sauce<\/div>\n <div class=\"item-price\">$13.99<\/div>\n <\/div>\n <\/td>\n <td onclick=\"addToCart('Popcorn Chicken', 7.55)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/Popcorn-Chicken.jpg\" alt=\"Popcorn Chicken\">\n <\/div>\n <div class=\"item-name\">Popcorn Chicken<\/div>\n <div class=\"item-description\">Bite-sized crispy chicken pieces<\/div>\n <div class=\"item-price\">$7.55<\/div>\n <\/div>\n <\/td>\n <\/tr>\n <\/table>\n \n \n <div class=\"section-title\">\n <h3>Main Course<\/h3>\n <\/div>\n \n <table class=\"menu-table\">\n <tr>\n <td onclick=\"addToCart('Chicken Poutine', 14.99)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/Chicken Poutine.jpg\" alt=\"Chicken Poutine\">\n <\/div>\n <div class=\"item-name\">Chicken Poutine<\/div>\n <div class=\"item-description\">Poutine topped with deep-fried chicken<\/div>\n <div class=\"item-price\">$14.99<\/div>\n <\/div>\n <\/td>\n <td onclick=\"addToCart('Sweet & Sour', 14.99)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/Sweet Sour1.jpeg\" alt=\"Sweet & Sour\">\n <\/div>\n <div class=\"item-name\">Sweet & Sour<\/div>\n <div class=\"item-description\">Chicken or pork with peppers in tangy sauce<\/div>\n <div class=\"item-price\">$14.99<\/div>\n <\/div>\n <\/td>\n <td onclick=\"addToCart('Teriyaki', 14.99)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/chicken Teriyaki.jpg\" alt=\"Teriyaki\">\n <\/div>\n <div class=\"item-name\">Teriyaki<\/div>\n <div class=\"item-description\">Chicken or pork with teriyaki glaze<\/div>\n <div class=\"item-price\">$14.99<\/div>\n <\/div>\n <\/td>\n <\/tr>\n <tr>\n <td onclick=\"addToCart('NY Strip Steak', 22.99)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/NY Strip Steak.jpg\" alt=\"NY Strip Steak\">\n <\/div>\n <div class=\"item-name\">NY Strip Steak<\/div>\n <div class=\"item-description\">10oz premium steak with fries and salad<\/div>\n <div class=\"item-price\">$22.99<\/div>\n <\/div>\n <\/td>\n <td onclick=\"addToCart('Theodore Perogies', 14.99)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/perogies.jpg\" alt=\"Theodore Perogies\">\n <\/div>\n <div class=\"item-name\">Theodore Perogies<\/div>\n <div class=\"item-description\">Homemade perogies with farmer's sausage<\/div>\n <div class=\"item-price\">$14.99<\/div>\n <\/div>\n <\/td>\n <td onclick=\"addToCart('Fish Fillet', 14.99)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/fish fillet.jpg\" alt=\"Fish Fillet\">\n <\/div>\n <div class=\"item-name\">Fish Fillet<\/div>\n <div class=\"item-description\">Beer-battered cod with tartar sauce<\/div>\n <div class=\"item-price\">$14.99<\/div>\n <\/div>\n <\/td>\n <\/tr>\n <\/table>\n \n \n <div class=\"section-title\">\n <h3>Wraps & Sandwiches<\/h3>\n <\/div>\n \n <table class=\"menu-table\">\n <tr>\n <td onclick=\"addToCart('Chicken Bacon Ranch', 16.99)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/Chicken Bacon Ranch.jpg\" alt=\"Chicken Bacon Ranch\">\n <\/div>\n <div class=\"item-name\">Chicken Bacon Ranch<\/div>\n <div class=\"item-description\">Grilled chicken, bacon, ranch dressing<\/div>\n <div class=\"item-price\">$16.99<\/div>\n <\/div>\n <\/td>\n <td onclick=\"addToCart('Chicken Caesar', 16.99)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/Chicken Ceasar.jpg\" alt=\"Chicken Caesar\">\n <\/div>\n <div class=\"item-name\">Chicken Caesar<\/div>\n <div class=\"item-description\">Grilled chicken, romaine, parmesan, caesar<\/div>\n <div class=\"item-price\">$16.99<\/div>\n <\/div>\n <\/td>\n <td onclick=\"addToCart('Spicy Chicken', 16.99)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/Crispy chicken.jpg\" alt=\"Spicy Chicken\">\n <\/div>\n <div class=\"item-name\">Spicy Chicken<\/div>\n <div class=\"item-description\">Crispy chicken with spicy sauce<\/div>\n <div class=\"item-price\">$16.99<\/div>\n <\/div>\n <\/td>\n <\/tr>\n <tr>\n <td onclick=\"addToCart('Buffalo Chicken', 16.99)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/Buffalo Chicken.jpg\" alt=\"Buffalo Chicken\">\n <\/div>\n <div class=\"item-name\">Buffalo Chicken<\/div>\n <div class=\"item-description\">Crispy chicken tossed in buffalo sauce<\/div>\n <div class=\"item-price\">$16.99<\/div>\n <\/div>\n <\/td>\n <td onclick=\"addToCart('Honey Dill Chicken', 16.99)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/Honey Drill.jpg\" alt=\"Honey Dill Chicken\">\n <\/div>\n <div class=\"item-name\">Honey Dill Chicken<\/div>\n <div class=\"item-description\">Grilled chicken with honey dill sauce<\/div>\n <div class=\"item-price\">$16.99<\/div>\n <\/div>\n <\/td>\n <td onclick=\"addToCart('Loaded Nachos', 10.99)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/Nachos.jpg\" alt=\"Loaded Nachos\">\n <\/div>\n <div class=\"item-name\">Loaded Nachos<\/div>\n <div class=\"item-description\">Tortilla chips topped with cheese, salsa, jalape\u00f1os<\/div>\n <div class=\"item-price\">$10.99<\/div>\n <\/div>\n <\/td>\n <\/tr>\n <\/table>\n \n \n <div class=\"section-title\">\n <h3>Desserts<\/h3>\n <\/div>\n \n <table class=\"menu-table\">\n <tr>\n <td onclick=\"addToCart('Assorted Cheesecake', 3.55)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/Cheese Cake.jpeg\" alt=\"Cheesecake\">\n <\/div>\n <div class=\"item-name\">Assorted Cheesecake<\/div>\n <div class=\"item-description\">Daily selection of premium cheesecakes<\/div>\n <div class=\"item-price\">$3.55<\/div>\n <\/div>\n <\/td>\n <td onclick=\"addToCart('Chocolate Fudge Cake', 6.99)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/chocolate cake.jpg\" alt=\"Chocolate Cake\">\n <\/div>\n <div class=\"item-name\">Chocolate Fudge Cake<\/div>\n <div class=\"item-description\">Rich chocolate cake with fudge frosting<\/div>\n <div class=\"item-price\">$6.99<\/div>\n <\/div>\n <\/td>\n <td onclick=\"addToCart('Apple Pie', 7.25)\">\n <div class=\"item-container\">\n <div class=\"item-image\">\n <img decoding=\"async\" src=\"https:\/\/theodorehotel.ca\/wp-includes\/images\/apple pie.jpg\" alt=\"Apple Pie\">\n <\/div>\n <div class=\"item-name\">Apple Pie<\/div>\n <div class=\"item-description\">Homemade pie with vanilla ice cream<\/div>\n <div class=\"item-price\">$7.25<\/div>\n <\/div>\n <\/td>\n <\/tr>\n <\/table>\n \n \n <div class=\"invoice-section\" id=\"invoiceSection\">\n <h2 class=\"invoice-header\">Invoice Search<\/h2>\n <div class=\"search-controls\">\n <input type=\"date\" id=\"invoiceDate\" placeholder=\"Select date\">\n <input type=\"text\" id=\"invoiceNumber\" placeholder=\"Invoice number\">\n <button class=\"search-btn\" onclick=\"searchInvoices()\">\n <i class=\"fas fa-search\"><\/i> Search\n <\/button>\n <\/div>\n <div class=\"invoice-results\" id=\"invoiceResults\">\n \n <\/div>\n <\/div>\n \n <div class=\"menu-footer\">\n <i class=\"fas fa-utensils\"><\/i> Substitutions may incur additional charges. Prices subject to change. <i class=\"fas fa-info-circle\"><\/i>\n <\/div>\n <\/div>\n \n \n <div class=\"cart-container\" id=\"cartContainer\">\n <div class=\"cart-header\">\n <h2>Your Order<\/h2>\n <button class=\"close-cart\" onclick=\"toggleCart()\">\n <i class=\"fas fa-times\"><\/i>\n <\/button>\n <\/div>\n \n <div class=\"cart-items\" id=\"cartItems\">\n \n <\/div>\n \n <div class=\"cart-summary\">\n <div class=\"summary-row\">\n <span>Subtotal:<\/span>\n <span id=\"subtotal\">$0.00<\/span>\n <\/div>\n <div class=\"summary-row\">\n <span>Tax (5%):<\/span>\n <span id=\"tax\">$0.00<\/span>\n <\/div>\n <div class=\"summary-row grand-total\">\n <span>Grand Total:<\/span>\n <span id=\"grandTotal\">$0.00<\/span>\n <\/div>\n <\/div>\n \n <div class=\"cart-actions\">\n <button class=\"cart-btn print-btn\" onclick=\"printInvoice()\">\n <i class=\"fas fa-print\"><\/i> Print\n <\/button>\n <button class=\"cart-btn cancel-btn\" onclick=\"clearCart()\">\n <i class=\"fas fa-times\"><\/i> Cancel\n <\/button>\n <button class=\"cart-btn save-btn\" onclick=\"saveInvoice()\">\n <i class=\"fas fa-save\"><\/i> Save Invoice\n <\/button>\n <\/div>\n \n <div class=\"cart-actions\">\n <button class=\"cart-btn\" style=\"background: #5a4d41; color: white;\" onclick=\"toggleInvoiceSection()\">\n <i class=\"fas fa-file-invoice\"><\/i> View Invoices\n <\/button>\n <\/div>\n <\/div>\n \n <script>\n \/\/ Cart data\n let cart = [];\n let invoices = JSON.parse(localStorage.getItem('invoices')) || [];\n \n \/\/ Initialize the page\n document.addEventListener('DOMContentLoaded', () => {\n updateCartCount();\n });\n \n \/\/ Add item to cart\n function addToCart(name, price) {\n \/\/ Check if item already in cart\n const existingItem = cart.find(item => item.name === name);\n \n if (existingItem) {\n existingItem.quantity++;\n } else {\n cart.push({\n name: name,\n price: price,\n quantity: 1\n });\n }\n \n updateCartCount();\n renderCartItems();\n \/\/showNotification(`${name} added to cart`);\n }\n \n \/\/ Update cart item quantity\n function updateQuantity(index, change) {\n cart[index].quantity += change;\n \n \/\/ Remove item if quantity is 0\n if (cart[index].quantity <= 0) {\n cart.splice(index, 1);\n }\n \n updateCartCount();\n renderCartItems();\n }\n \n \/\/ Remove item from cart\n function removeItem(index) {\n cart.splice(index, 1);\n updateCartCount();\n renderCartItems();\n }\n \n \/\/ Update cart badge count\n function updateCartCount() {\n const count = cart.reduce((total, item) => total + item.quantity, 0);\n document.getElementById('cartCount').textContent = count;\n }\n \n \/\/ Render cart items\n function renderCartItems() {\n const cartItems = document.getElementById('cartItems');\n cartItems.innerHTML = '';\n \n if (cart.length === 0) {\n cartItems.innerHTML = '<p style=\"text-align: center; padding: 20px;\">Your cart is empty<\/p>';\n updateCartTotals();\n return;\n }\n \n cart.forEach((item, index) => {\n const itemElement = document.createElement('div');\n itemElement.className = 'cart-item';\n itemElement.innerHTML = `\n <div class=\"item-info\">\n <div class=\"item-title\">${item.name}<\/div>\n <div class=\"item-price-cart\">$${item.price.toFixed(2)}<\/div>\n <\/div>\n <div class=\"quantity-controls\">\n <button class=\"qty-btn\" onclick=\"updateQuantity(${index}, -1)\">-<\/button>\n <span class=\"qty-display\">${item.quantity}<\/span>\n <button class=\"qty-btn\" onclick=\"updateQuantity(${index}, 1)\">+<\/button>\n <\/div>\n <button class=\"remove-btn\" onclick=\"removeItem(${index})\">\n <i class=\"fas fa-trash\"><\/i>\n <\/button>\n `;\n cartItems.appendChild(itemElement);\n });\n \n updateCartTotals();\n }\n \n \/\/ Update cart totals\n function updateCartTotals() {\n const subtotal = cart.reduce((sum, item) => sum + (item.price * item.quantity), 0);\n const tax = subtotal * 0.05;\n const grandTotal = subtotal + tax;\n \n document.getElementById('subtotal').textContent = `$${subtotal.toFixed(2)}`;\n document.getElementById('tax').textContent = `$${tax.toFixed(2)}`;\n document.getElementById('grandTotal').textContent = `$${grandTotal.toFixed(2)}`;\n }\n \n \/\/ Toggle cart visibility\n function toggleCart() {\n const cartContainer = document.getElementById('cartContainer');\n cartContainer.style.display = cartContainer.style.display === 'block' ? 'none' : 'block';\n }\n \n \/\/ Toggle invoice section\n function toggleInvoiceSection() {\n const invoiceSection = document.getElementById('invoiceSection');\n invoiceSection.style.display = invoiceSection.style.display === 'block' ? 'none' : 'block';\n \n \/\/ Hide cart when showing invoices\n if (invoiceSection.style.display === 'block') {\n document.getElementById('cartContainer').style.display = 'none';\n }\n }\n \n \/\/ Clear cart\n function clearCart() {\n cart = [];\n updateCartCount();\n renderCartItems();\n \/\/showNotification('Cart cleared');\n }\n \n \/\/ Print invoice\n function printInvoice() {\n if (cart.length === 0) {\n \/\/showNotification('Cart is empty!');\n return;\n }\n \n \/\/ In a real app, you would open a print-friendly invoice page\n \/\/alert('Opening print dialog...');\n window.print();\n }\n \n \/\/ Save invoice\n function saveInvoice() {\n if (cart.length === 0) {\n showNotification('Cart is empty!');\n return;\n }\n \n const invoiceNumber = 'INV-' + Date.now().toString().slice(-6);\n const invoiceDate = new Date().toLocaleDateString();\n const subtotal = cart.reduce((sum, item) => sum + (item.price * item.quantity), 0);\n const tax = subtotal * 0.05;\n const grandTotal = subtotal + tax;\n \n const invoice = {\n id: Date.now(),\n number: invoiceNumber,\n date: invoiceDate,\n items: [...cart],\n subtotal: subtotal,\n tax: tax,\n total: grandTotal\n };\n \n invoices.push(invoice);\n localStorage.setItem('invoices', JSON.stringify(invoices));\n \n cart = [];\n updateCartCount();\n renderCartItems();\n \n \/\/showNotification(`Invoice ${invoiceNumber} saved successfully!`);\n }\n \n \/\/ Search invoices\n function searchInvoices() {\n const dateFilter = document.getElementById('invoiceDate').value;\n const numberFilter = document.getElementById('invoiceNumber').value.toLowerCase();\n \n const results = invoices.filter(invoice => {\n const matchesDate = dateFilter ? invoice.date === new Date(dateFilter).toLocaleDateString() : true;\n const matchesNumber = numberFilter ? invoice.number.toLowerCase().includes(numberFilter) : true;\n return matchesDate && matchesNumber;\n });\n \n displayInvoiceResults(results);\n }\n \n \/\/ Display invoice search results\n function displayInvoiceResults(results) {\n const resultsContainer = document.getElementById('invoiceResults');\n \n if (results.length === 0) {\n resultsContainer.innerHTML = '<p style=\"text-align: center; padding: 20px;\">No invoices found<\/p>';\n return;\n }\n \n resultsContainer.innerHTML = '';\n \n results.forEach(invoice => {\n const invoiceCard = document.createElement('div');\n invoiceCard.className = 'invoice-card';\n \n let itemsHTML = '';\n invoice.items.forEach(item => {\n itemsHTML += `\n <div class=\"invoice-item\">\n <span>${item.name} (${item.quantity}x)<\/span>\n <span>$${(item.price * item.quantity).toFixed(2)}<\/span>\n <\/div>\n `;\n });\n \n invoiceCard.innerHTML = `\n <div class=\"invoice-header-row\">\n <span class=\"invoice-number\">${invoice.number}<\/span>\n <span class=\"invoice-date\">${invoice.date}<\/span>\n <\/div>\n <div class=\"invoice-items\">\n ${itemsHTML}\n <\/div>\n <div class=\"invoice-total\">\n Total: $${invoice.total.toFixed(2)}\n <\/div>\n `;\n \n resultsContainer.appendChild(invoiceCard);\n });\n }\n \n \/\/ Show notification\n function showNotification(message) {\n \/\/ In a real app, you would use a toast notification\n alert(message);\n }\n <\/script>\n<\/body>\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Theodore Hotel - Menu & Invoicing 100 Yellowhead Hwy Theodore SK SOA 4C0 Ph:3066472166 0 Menu Serving Exceptional Cuisine Since […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"default","site-content-layout":"","ast-site-content-layout":"normal-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"disabled","ast-banner-title-visibility":"disabled","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"disabled","ast-disable-related-posts":"","theme-transparent-header-meta":"disabled","adv-header-id-meta":"","stick-header-meta":"disabled","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"default","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-1472","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/theodorehotel.ca\/index.php\/wp-json\/wp\/v2\/pages\/1472","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/theodorehotel.ca\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/theodorehotel.ca\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/theodorehotel.ca\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/theodorehotel.ca\/index.php\/wp-json\/wp\/v2\/comments?post=1472"}],"version-history":[{"count":250,"href":"https:\/\/theodorehotel.ca\/index.php\/wp-json\/wp\/v2\/pages\/1472\/revisions"}],"predecessor-version":[{"id":2001,"href":"https:\/\/theodorehotel.ca\/index.php\/wp-json\/wp\/v2\/pages\/1472\/revisions\/2001"}],"wp:attachment":[{"href":"https:\/\/theodorehotel.ca\/index.php\/wp-json\/wp\/v2\/media?parent=1472"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}