Carta del Restaurante<\/title>\r\n <style>\r\n * {\r\n margin: 0;\r\n padding: 0;\r\n box-sizing: border-box;\r\n }\r\n\r\n body {\r\n font-family: 'Georgia', serif;\r\n background-color: #f0ebe3;\r\n color: #4a4a4a;\r\n line-height: 1.6;\r\n }\r\n\r\n .container {\r\n max-width: 1400px;\r\n margin: 0 auto;\r\n padding: 20px;\r\n }\r\n\r\n .carta-header {\r\n text-align: left;\r\n margin-bottom: 30px;\r\n }\r\n\r\n .breadcrumb {\r\n font-size: 14px;\r\n color: #8b7355;\r\n margin-bottom: 10px;\r\n }\r\n\r\n .breadcrumb a {\r\n color: #8b7355;\r\n text-decoration: none;\r\n }\r\n\r\n .breadcrumb a:hover {\r\n text-decoration: underline;\r\n }\r\n\r\n .carta-title {\r\n font-size: 2.5em;\r\n font-weight: normal;\r\n color: #4a4a4a;\r\n margin-bottom: 30px;\r\n }\r\n\r\n .allergen-legend {\r\n margin-top: 1rem;\r\n background: rgba(255, 255, 255, 0.8);\r\n padding: 20px;\r\n border-radius: 12px;\r\n margin-bottom: 30px;\r\n box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);\r\n width: 100%;\r\n }\r\n\r\n .allergen-legend h3 {\r\n margin-bottom: 15px;\r\n color: #4a4a4a;\r\n font-size: 1.2em;\r\n }\r\n\r\n .allergen-grid {\r\n display: grid;\r\n grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));\r\n gap: 15px;\r\n }\r\n\r\n .allergen-item {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n padding: 10px;\r\n border-radius: 8px;\r\n cursor: pointer;\r\n transition: all 0.3s ease;\r\n background: rgba(255, 255, 255, 0.5);\r\n }\r\n\r\n .allergen-item:hover {\r\n background: rgba(255, 255, 255, 0.8);\r\n }\r\n\r\n .allergen-item.active {\r\n background: #4a4a4a;\r\n color: white;\r\n }\r\n\r\n .allergen-icon {\r\n width: 60px;\r\n height: 60px;\r\n margin: 0 auto 10px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n overflow: hidden;\r\n border-radius: 8px;\r\n }\r\n \r\n .allergen-icon img {\r\n width: 100%;\r\n height: 100%;\r\n object-fit: cover;\r\n object-position: center;\r\n }\r\n \r\n .allergen-name {\r\n font-weight: bold;\r\n font-size: 14px;\r\n color: #333;\r\n text-transform: uppercase;\r\n letter-spacing: 0.5px;\r\n }\r\n \r\n .allergen-item.active .allergen-name {\r\n color: white !important; \/* Texto blanco cuando est\u00e1 activo *\/\r\n }\r\n\r\n \/* Colores originales que se muestran en hover y active *\/\r\n .allergen-item:hover .allergen-icon.color {\r\n background-color: #e0e0e0 !important; \/* Gris claro para hover *\/\r\n }\r\n\r\n .allergen-item.active .allergen-icon.color {\r\n background-color: transparent !important; \/* Sin background cuando est\u00e1 activo *\/\r\n }\r\n\r\n .allergen-name {\r\n font-size: 0.8em;\r\n text-align: center;\r\n font-weight: bold;\r\n }\r\n\r\n .carta-layout {\r\n display: grid;\r\n grid-template-columns: 1fr 500px;\r\n gap: 40px;\r\n align-items: start;\r\n }\r\n\r\n .carta-content {\r\n background: rgba(255, 255, 255, 0.3);\r\n padding: 30px;\r\n border-radius: 8px;\r\n }\r\n\r\n .carta-section {\r\n margin-bottom: 40px;\r\n }\r\n\r\n .section-title {\r\n font-size: 1.4em;\r\n margin-bottom: 25px;\r\n color: #4a4a4a;\r\n border-bottom: 2px solid #d4c4a8;\r\n padding-bottom: 10px;\r\n font-weight: bold;\r\n text-transform: uppercase;\r\n letter-spacing: 1px;\r\n }\r\n\r\n .section-subtitle {\r\n font-size: 1.1em;\r\n margin-bottom: 15px;\r\n color: #6b5b47;\r\n font-style: italic;\r\n text-align: center;\r\n background: rgba(255, 255, 255, 0.5);\r\n padding: 8px;\r\n border-radius: 4px;\r\n }\r\n\r\n .menu-item {\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: flex-start;\r\n margin-bottom: 18px;\r\n padding: 12px 0;\r\n border-bottom: 1px dotted #d4c4a8;\r\n transition: all 0.3s ease;\r\n }\r\n\r\n .menu-item.grayed-out {\r\n opacity: 0.4;\r\n }\r\n\r\n .menu-item.grayed-out .item-name,\r\n .menu-item.grayed-out .item-name-euskera,\r\n .menu-item.grayed-out .item-description,\r\n .menu-item.grayed-out .item-price {\r\n color: #999 !important;\r\n }\r\n\r\n .menu-item:last-child {\r\n border-bottom: none;\r\n }\r\n\r\n .item-info {\r\n flex: 1;\r\n }\r\n\r\n .item-name {\r\n font-size: 1.05em;\r\n color: #4a4a4a;\r\n margin-bottom: 4px;\r\n font-weight: bold;\r\n }\r\n\r\n .item-name-euskera {\r\n font-size: 0.95em;\r\n color: #6b5b47;\r\n font-style: italic;\r\n margin-bottom: 6px;\r\n }\r\n\r\n .item-description {\r\n font-size: 0.9em;\r\n color: #8b7355;\r\n font-style: italic;\r\n margin-bottom: 5px;\r\n }\r\n\r\n .item-indicators {\r\n display: flex;\r\n gap: 8px;\r\n margin: 6px 0;\r\n }\r\n\r\n .indicator {\r\n width: 10px;\r\n height: 10px;\r\n border-radius: 50%;\r\n border: 1px solid rgba(0,0,0,0.1);\r\n }\r\n\r\n .indicator.apio { background-color: #A4C639; }\r\n .indicator.altramuz { background-color: #FFC107; }\r\n .indicator.cacahuetes { background-color: #D4A853; }\r\n .indicator.crustaceos { background-color: #B85AA4; }\r\n .indicator.frutos-secos { background-color: #C07062; }\r\n .indicator.cereales { background-color: #E6B547; }\r\n .indicator.huevos { background-color: #F5A623; }\r\n .indicator.lacteos { background-color: #5DADE2; }\r\n .indicator.moluscos { background-color: #E74C3C; }\r\n .indicator.mostaza { background-color: #F39C12; }\r\n .indicator.pescado { background-color: #3498DB; }\r\n .indicator.sesamo { background-color: #D68910; }\r\n .indicator.soja { background-color: #7FB069; }\r\n .indicator.sulfitos { background-color: #E91E63; }\r\n \r\n .item-price {\r\n font-size: 1.15em;\r\n font-weight: bold;\r\n color: #4a4a4a;\r\n margin-left: 20px;\r\n min-width: 80px;\r\n text-align: right;\r\n white-space: nowrap;\r\n }\r\n\r\n .special-note {\r\n background: rgba(139, 115, 85, 0.1);\r\n padding: 8px;\r\n border-radius: 4px;\r\n font-size: 0.85em;\r\n color: #6b5b47;\r\n margin: 5px 0;\r\n font-style: italic;\r\n }\r\n\r\n \/* Nueva clase para la imagen \u00fanica que ocupa toda la altura *\/\r\n .carta-image {\r\n position: sticky;\r\n top: 20px;\r\n height: fit-content;\r\n }\r\n\r\n .carta-image img {\r\n width: 100%; \/* M\u00e1s ancha que el contenedor *\/\r\n height: 800px;\r\n object-fit: cover;\r\n border-radius: 12px;\r\n box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);\r\n }\r\n\r\n .footer-notes {\r\n margin-top: 40px;\r\n padding: 20px;\r\n background: rgba(139, 115, 85, 0.1);\r\n border-radius: 8px;\r\n font-size: 0.9em;\r\n color: #6b5b47;\r\n }\r\n\r\n .footer-notes p {\r\n margin-bottom: 8px;\r\n }\r\n\r\n \/* Responsive Design *\/\r\n @media (max-width: 768px) {\r\n .container {\r\n padding: 15px;\r\n }\r\n\r\n .carta-title {\r\n font-size: 2em;\r\n }\r\n\r\n .carta-layout {\r\n grid-template-columns: 1fr;\r\n gap: 30px;\r\n }\r\n\r\n .carta-image {\r\n display: none;\r\n }\r\n\r\n .carta-content {\r\n padding: 20px;\r\n }\r\n\r\n .item-price {\r\n margin-left: 10px;\r\n min-width: 60px;\r\n }\r\n\r\n .menu-item {\r\n flex-wrap: wrap;\r\n }\r\n\r\n .item-indicators {\r\n margin-top: 8px;\r\n }\r\n\r\n .allergen-grid {\r\n grid-template-columns: repeat(auto-fit, minmax(80px, 1fr));\r\n gap: 10px;\r\n }\r\n\r\n .allergen-icon {\r\n width: 50px;\r\n height: 50px;\r\n margin: 0 auto 10px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n }\r\n\r\n .allergen-icon img {\r\n width: 100%;\r\n height: 100%;\r\n object-fit: contain;\r\n }\r\n \r\n .allergen-name {\r\n font-weight: bold;\r\n font-size: 14px;\r\n color: #333;\r\n text-transform: uppercase;\r\n letter-spacing: 0.5px;\r\n }\r\n }\r\n\r\n @media (max-width: 480px) {\r\n .carta-title {\r\n font-size: 1.8em;\r\n }\r\n\r\n .carta-content {\r\n padding: 15px;\r\n }\r\n\r\n .menu-item {\r\n display: block;\r\n text-align: left;\r\n }\r\n\r\n .item-price {\r\n display: block;\r\n text-align: left;\r\n margin: 8px 0 0 0;\r\n font-size: 1.3em;\r\n }\r\n }\r\n\r\n \/* Ajuste autom\u00e1tico de altura en funci\u00f3n del contenido *\/\r\n @media (min-width: 769px) {\r\n .carta-image img {\r\n min-height: 100vh;\r\n max-height: none;\r\n }\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n <div class=\"container\">\r\n <div class=\"carta-header\">\r\n <h1 class=\"carta-title\">Carta del Restaurante<\/h1>\r\n <\/div>\r\n\r\n <div class=\"carta-layout\">\r\n <div class=\"carta-content\">\r\n <div class=\"carta-section\">\r\n <h2 class=\"section-title\">ENTRANTES<\/h2>\r\n <div class=\"section-subtitle\">Todos los entrantes son raciones individualizadas<\/div>\r\n \r\n <div class=\"menu-item\" data-allergens=\"pescado,sulfitos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Ensalada de bonito HONDARTZAPE (nuestra conserva)<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator pescado\"><\/span>\r\n <span class=\"indicator sulfitos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">17\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"pescado,crustaceos,cereales,moluscos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Sopa de pescado<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator pescado\"><\/span>\r\n <span class=\"indicator crustaceos\"><\/span>\r\n <span class=\"indicator cereales\"><\/span>\r\n <span class=\"indicator moluscos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">20\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Jam\u00f3n ib\u00e9rico de bellota \"JOSELITO\"<\/div>\r\n <\/div>\r\n <div class=\"item-price\">32\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Lomo ib\u00e9rico de bellota \"JOSELITO\"<\/div>\r\n <\/div>\r\n <div class=\"item-price\">28\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"pescado\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Anchoa mariposa en salaz\u00f3n \"LA MACHINA\" (Santo\u00f1a)<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator pescado\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">6\u20ac\/unid<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"crustaceos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Excellent de claire<\/div>\r\n <div class=\"item-description\">Esmeralda de claire (en temporada)<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator crustaceos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">5\u20ac\/unid<\/div>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"carta-section\">\r\n <h2 class=\"section-title\">ENTRANTES A LA BRASA<\/h2>\r\n <div class=\"section-subtitle\">Todos los entrantes son raciones individualizadas<\/div>\r\n \r\n <div class=\"menu-item\" data-allergens=\"frutos-secos,sulfitos,cereales\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Esp\u00e1rragos a la brasa y ajoblanco(en temporada)<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator frutos-secos\"><\/span>\r\n <span class=\"indicator sulfitos\"><\/span>\r\n <span class=\"indicator cereales\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">12\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"frutos-secos,cereales,huevos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Croqueta a la brasa<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator frutos-secos\"><\/span>\r\n <span class=\"indicator cereales\"><\/span>\r\n <span class=\"indicator huevos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">4\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"huevos,lacteos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Perretxikos a la brasa con holandesa(en temporada)<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator huevos\"><\/span>\r\n <span class=\"indicator lacteos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">30\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"pescado\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Anchoa a la brasa (en temporada)<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator pescado\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">12\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"moluscos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Chipir\u00f3n de potera a la brasa(en temporada)<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator moluscos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">16\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"pescado\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Taco de bacalao a la brasa , morrones y pilpil<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator pescado\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">20\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"pescado,huevos,cereales,lacteos,soja\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Brioche, papada ib\u00e9rica y caviar (oscietra)<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator pescado\"><\/span>\r\n <span class=\"indicator huevos\"><\/span>\r\n <span class=\"indicator cereales\"><\/span>\r\n <span class=\"indicator lacteos\"><\/span>\r\n <span class=\"indicator soja\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">28\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"sulfitos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Foie a la brasa , reducci\u00f3n de PX y compota de higo<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator sulfitos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">23\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"pescado,sulfitos,crustaceos,moluscos,soja\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Ventresca de at\u00fan rojo a la brasa, calabaza y ponzu<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator pescado\"><\/span>\r\n <span class=\"indicator sulfitos\"><\/span>\r\n <span class=\"indicator crustaceos\"><\/span>\r\n <span class=\"indicator moluscos\"><\/span>\r\n <span class=\"indicator soja\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">23\u20ac<\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"carta-section\">\r\n <h2 class=\"section-title\">MARISCOS A LA BRASA<\/h2>\r\n \r\n <div class=\"menu-item\" data-allergens=\"crustaceos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Gamba blanca<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator crustaceos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">32\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"crustaceos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Gamba roja<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator crustaceos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">8.5\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"crustaceos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Langostino<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator crustaceos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">Un. 3.5\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"moluscos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Almeja fina<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator moluscos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">90\u20ac\/kg<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"crustaceos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Carabinero<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator crustaceos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">Un. 24\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"crustaceos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Cigala (250 gr.) 140\u20ac\/kg<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator crustaceos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">35\u20ac<\/div>\r\n <\/div>\r\n \r\n <div class=\"menu-item\" data-allergens=\"crustaceos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Quisquill\u00f3n (250 gr.) 180\u20ac\/kg<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator crustaceos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">45\u20ac<\/div>\r\n <\/div>\r\n \r\n <div class=\"menu-item\" data-allergens=\"crustaceos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Percebes (250 gr.) 160\u20ac\/kg<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator crustaceos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">40\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"crustaceos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">N\u00e9cora<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator crustaceos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">18\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"crustaceos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Bogavante<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator crustaceos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">92\u20ac\/kg<\/div>\r\n <\/div>\r\n \r\n <div class=\"menu-item\" data-allergens=\"crustaceos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Langosta<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator crustaceos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">140\u20ac\/kg<\/div>\r\n <\/div>\r\n \r\n <\/div>\r\n\r\n <div class=\"carta-section\">\r\n <h2 class=\"section-title\">PESCADOS A LA BRASA<\/h2>\r\n \r\n <div class=\"menu-item\" data-allergens=\"pescado,sulfitos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Cogote de merluza<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator pescado\"><\/span>\r\n <span class=\"indicator sulfitos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">52\u20ac\/kg<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"pescado,sulfitos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Merluza<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator pescado\"><\/span>\r\n <span class=\"indicator sulfitos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">52\u20ac\/kg<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"pescado,sulfitos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Mero negro<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator pescado\"><\/span>\r\n <span class=\"indicator sulfitos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">98\u20ac\/kg<\/div>\r\n <\/div>\r\n \r\n <div class=\"menu-item\" data-allergens=\"pescado,sulfitos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Lubina<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator pescado\"><\/span>\r\n <span class=\"indicator sulfitos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">88\u20ac\/kg<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"pescado,sulfitos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Besugo<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator pescado\"><\/span>\r\n <span class=\"indicator sulfitos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">135\u20ac\/kg<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"pescado,sulfitos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Rey \/ Palometa roja \/ Virrey<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator pescado\"><\/span>\r\n <span class=\"indicator sulfitos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">135\u20ac\/kg<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"pescado,sulfitos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">San Pedro<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator pescado\"><\/span>\r\n <span class=\"indicator sulfitos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">88\u20ac\/kg<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"pescado,sulfitos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Rodaballo<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator pescado\"><\/span>\r\n <span class=\"indicator sulfitos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">88\u20ac\/kg<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"pescado,sulfitos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Lenguado<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator pescado\"><\/span>\r\n <span class=\"indicator sulfitos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">92\u20ac\/kg<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"pescado,sulfitos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Sargo<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator pescado\"><\/span>\r\n <span class=\"indicator sulfitos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">58\u20ac\/kg<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"pescado,sulfitos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Cabracho<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator pescado\"><\/span>\r\n <span class=\"indicator sulfitos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">88\u20ac\/kg<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"pescado,sulfitos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Salmonete<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator pescado\"><\/span>\r\n <span class=\"indicator sulfitos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">88\u20ac\/kg<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"pescado,sulfitos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Rape<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator pescado\"><\/span>\r\n <span class=\"indicator sulfitos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">68\u20ac\/kg<\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"carta-section\">\r\n <h2 class=\"section-title\">CARNE A LA BRASA<\/h2>\r\n \r\n <div class=\"menu-item\" data-allergens=\"\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Chuleta de ganado mayor<\/div> \r\n <div class=\"item-description\">(raza Simmental con m\u00e1s de 30 dias de maduraci\u00f3n)<\/div>\r\n <\/div>\r\n <div class=\"item-price\">88\u20ac\/kg<\/div>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"carta-section\">\r\n <h2 class=\"section-title\">POSTRES<\/h2>\r\n \r\n <div class=\"menu-item\" data-allergens=\"lacteos,huevos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Flan<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator lacteos\"><\/span>\r\n <span class=\"indicator huevos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">9.50\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"lacteos,huevos,frutos-secos,cereales\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Tostada de pan brioche<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator lacteos\"><\/span>\r\n <span class=\"indicator huevos\"><\/span>\r\n <span class=\"indicator frutos-secos\"><\/span>\r\n <span class=\"indicator cereales\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">9.50\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"lacteos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Cuajada de leche de oveja<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator lacteos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">9.50\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"lacteos,huevos,frutos-secos,cereales\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Tarta de queso al horno<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator lacteos\"><\/span>\r\n <span class=\"indicator huevos\"><\/span>\r\n <span class=\"indicator frutos-secos\"><\/span>\r\n <span class=\"indicator cereales\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">9.50\u20ac<\/div>\r\n <\/div>\r\n \r\n <div class=\"menu-item\" data-allergens=\"lacteos,huevos,frutos-secos,sesamo,soja,cereales,frutos-secos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Texturas de chocolate<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator lacteos\"><\/span>\r\n <span class=\"indicator huevos\"><\/span>\r\n <span class=\"indicator frutos-secos\"><\/span>\r\n <span class=\"indicator sesamo\"><\/span>\r\n <span class=\"indicator soja\"><\/span>\r\n <span class=\"indicator cereales\"><\/span>\r\n <span class=\"indicator frutos-secos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">9.50\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"lacteos,huevos,frutos-secos,cereales\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Tarta de manzana con helado de nata y nueces<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator lacteos\"><\/span>\r\n <span class=\"indicator huevos\"><\/span>\r\n <span class=\"indicator frutos-secos\"><\/span>\r\n <span class=\"indicator cereales\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">9.50\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"lacteos,huevos,frutos-secos,cereales\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Nuestro postre c\u00edtrico (Lemon pie)<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator lacteos\"><\/span>\r\n <span class=\"indicator huevos\"><\/span>\r\n <span class=\"indicator frutos-secos\"><\/span>\r\n <span class=\"indicator cereales\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">9.50\u20ac<\/div>\r\n <\/div>\r\n \r\n <div class=\"menu-item\" data-allergens=\"lacteos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Irland\u00e9s<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator lacteos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">16\u20ac<\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"footer-notes\">\r\n <p><strong>Nota:<\/strong> Todos los entrantes son raciones individualizadas.<\/p>\r\n <p>Trabajamos con productos frescos, es por ello que la carta variar\u00e1 seg\u00fan temporada.<\/p>\r\n <p>Consulta disponibilidad con el jefe de sala.<\/p>\r\n <p><\/p>\r\n <p>Todos nuestros precios incluyen IVA y est\u00e1n indicados en Euros.<\/p>\r\n <p>Soliciten informaci\u00f3n de al\u00e9rgenos a nuestro personal.<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"carta-image\">\r\n <img decoding=\"async\" src=\"\/wp-content\/allergens\/menu-restaurante.jpg\">\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"allergen-legend\">\r\n <div class=\"allergen-grid\">\r\n <div class=\"allergen-item\" data-allergen=\"apio\">\r\n <div class=\"allergen-icon color\">\r\n <img decoding=\"async\" src=\"\/wp-content\/allergens\/apio.png\">\r\n <\/div>\r\n <div class=\"allergen-name\">APIO<\/div>\r\n <\/div>\r\n <div class=\"allergen-item\" data-allergen=\"altramuz\">\r\n <div class=\"allergen-icon color\">\r\n <img decoding=\"async\" src=\"\/wp-content\/allergens\/altramuz.png\">\r\n <\/div>\r\n <div class=\"allergen-name\">ALTRAMUZ<\/div>\r\n <\/div>\r\n <div class=\"allergen-item\" data-allergen=\"cacahuetes\">\r\n <div class=\"allergen-icon color\">\r\n <img decoding=\"async\" src=\"\/wp-content\/allergens\/cacahuetes.png\">\r\n <\/div>\r\n <div class=\"allergen-name\">CACAHUETES<\/div>\r\n <\/div>\r\n <div class=\"allergen-item\" data-allergen=\"cereales\">\r\n <div class=\"allergen-icon color\">\r\n <img decoding=\"async\" src=\"\/wp-content\/allergens\/gluten.png\">\r\n <\/div>\r\n <div class=\"allergen-name\">CEREALES<\/div>\r\n <\/div>\r\n <div class=\"allergen-item\" data-allergen=\"crustaceos\">\r\n <div class=\"allergen-icon color\">\r\n <img decoding=\"async\" src=\"\/wp-content\/allergens\/crustaceos.png\">\r\n <\/div>\r\n <div class=\"allergen-name\">CRUST\u00c1CEOS<\/div>\r\n <\/div>\r\n <div class=\"allergen-item\" data-allergen=\"frutos-secos\">\r\n <div class=\"allergen-icon color\">\r\n <img decoding=\"async\" src=\"\/wp-content\/allergens\/frutos-secos.png\">\r\n <\/div>\r\n <div class=\"allergen-name\">FRUTOS SECOS<\/div>\r\n <\/div>\r\n <div class=\"allergen-item\" data-allergen=\"huevos\">\r\n <div class=\"allergen-icon color\">\r\n <img decoding=\"async\" src=\"\/wp-content\/allergens\/huevos.png\">\r\n <\/div>\r\n <div class=\"allergen-name\">HUEVOS<\/div>\r\n <\/div>\r\n <div class=\"allergen-item\" data-allergen=\"lacteos\">\r\n <div class=\"allergen-icon color\">\r\n <img decoding=\"async\" src=\"\/wp-content\/allergens\/lacteos.png\">\r\n <\/div>\r\n <div class=\"allergen-name\">L\u00c1CTEOS<\/div>\r\n <\/div>\r\n <div class=\"allergen-item\" data-allergen=\"moluscos\">\r\n <div class=\"allergen-icon color\">\r\n <img decoding=\"async\" src=\"\/wp-content\/allergens\/moluscos.png\">\r\n <\/div>\r\n <div class=\"allergen-name\">MOLUSCOS<\/div>\r\n <\/div>\r\n <div class=\"allergen-item\" data-allergen=\"mostaza\">\r\n <div class=\"allergen-icon color\">\r\n <img decoding=\"async\" src=\"\/wp-content\/allergens\/mostaza.png\">\r\n <\/div>\r\n <div class=\"allergen-name\">MOSTAZA<\/div>\r\n <\/div>\r\n <div class=\"allergen-item\" data-allergen=\"sesamo\">\r\n <div class=\"allergen-icon color\">\r\n <img decoding=\"async\" src=\"\/wp-content\/allergens\/sesamo.png\">\r\n <\/div>\r\n <div class=\"allergen-name\">S\u00c9SAMO<\/div>\r\n <\/div>\r\n <div class=\"allergen-item\" data-allergen=\"soja\">\r\n <div class=\"allergen-icon color\">\r\n <img decoding=\"async\" src=\"\/wp-content\/allergens\/soja.png\">\r\n <\/div>\r\n <div class=\"allergen-name\">SOJA<\/div>\r\n <\/div>\r\n <div class=\"allergen-item\" data-allergen=\"sulfitos\">\r\n <div class=\"allergen-icon color\">\r\n <img decoding=\"async\" src=\"\/wp-content\/allergens\/sulfitos.png\">\r\n <\/div>\r\n <div class=\"allergen-name\">SULFITOS<\/div>\r\n <\/div>\r\n <div class=\"allergen-item\" data-allergen=\"pescado\">\r\n <div class=\"allergen-icon color\">\r\n <img decoding=\"async\" src=\"\/wp-content\/allergens\/\/pescado.png\">\r\n <\/div>\r\n <div class=\"allergen-name\">PESCADO<\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <script>\r\n \/\/ Array para almacenar los al\u00e9rgenos activos\r\n let activeAllergens = [];\r\n\r\n \/\/ Funci\u00f3n para filtrar los elementos del men\u00fa\r\n function filterMenuItems() {\r\n const menuItems = document.querySelectorAll('.menu-item');\r\n \r\n menuItems.forEach(item => {\r\n \/\/ Verificar si el atributo data-allergens existe y no es null\/undefined\r\n const allergensData = item.dataset.allergens;\r\n const itemAllergens = allergensData ? allergensData.split(',').filter(a => a.trim() !== '') : [];\r\n \r\n \/\/ Si no hay al\u00e9rgenos activos, mostrar todos los platos normalmente\r\n if (activeAllergens.length === 0) {\r\n item.classList.remove('grayed-out');\r\n return;\r\n }\r\n \r\n \/\/ Verificar si el plato contiene alguno de los al\u00e9rgenos activos\r\n const hasActiveAllergen = itemAllergens.some(allergen => \r\n activeAllergens.includes(allergen.trim())\r\n );\r\n \r\n \/\/ Si contiene un al\u00e9rgeno activo, ponerlo en gris\r\n if (hasActiveAllergen) {\r\n item.classList.add('grayed-out');\r\n } else {\r\n item.classList.remove('grayed-out');\r\n }\r\n });\r\n }\r\n\r\n \/\/ Funci\u00f3n para inicializar el filtro de al\u00e9rgenos\r\n function initAllergenFilter() {\r\n const allergenItems = document.querySelectorAll('.allergen-item');\r\n \r\n allergenItems.forEach(item => {\r\n item.addEventListener('click', function() {\r\n const allergen = this.dataset.allergen;\r\n \r\n \/\/ Verificar que el al\u00e9rgeno existe\r\n if (!allergen) return;\r\n \r\n \/\/ Toggle del al\u00e9rgeno activo\r\n if (activeAllergens.includes(allergen)) {\r\n \/\/ Remover del array\r\n activeAllergens = activeAllergens.filter(a => a !== allergen);\r\n this.classList.remove('active');\r\n } else {\r\n \/\/ Agregar al array\r\n activeAllergens.push(allergen);\r\n this.classList.add('active');\r\n }\r\n \r\n \/\/ Actualizar la visualizaci\u00f3n de los platos\r\n filterMenuItems();\r\n });\r\n });\r\n }\r\n\r\n \/\/ Inicializar cuando se carga la p\u00e1gina\r\n document.addEventListener('DOMContentLoaded', function() {\r\n try {\r\n initAllergenFilter();\r\n console.log('Sistema de filtros de al\u00e9rgenos inicializado correctamente');\r\n } catch (error) {\r\n console.error('Error al inicializar el sistema de filtros:', error);\r\n }\r\n });\r\n <\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\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>Carta del Restaurante Carta del Restaurante ENTRANTES Todos los entrantes son raciones individualizadas Ensalada de bonito HONDARTZAPE (nuestra conserva) 17\u20ac Sopa de pescado 20\u20ac Jam\u00f3n ib\u00e9rico de bellota “JOSELITO” 32\u20ac Lomo ib\u00e9rico de bellota “JOSELITO” 28\u20ac Anchoa mariposa en salaz\u00f3n “LA MACHINA” (Santo\u00f1a) 6\u20ac\/unid Excellent de claire Esmeralda de claire (en temporada) 5\u20ac\/unid ENTRANTES A… <a href=\"https:\/\/hondartzape.com\/?page_id=5412\" rel=\"bookmark\">Leer m\u00e1s »<span class=\"screen-reader-text\">Carta<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"page-templates\/template-pagebuilder-full-width.php","meta":{"neve_meta_sidebar":"","neve_meta_container":"","neve_meta_enable_content_width":"","neve_meta_content_width":0,"neve_meta_title_alignment":"","neve_meta_author_avatar":"","neve_post_elements_order":"","neve_meta_disable_header":"","neve_meta_disable_footer":"","neve_meta_disable_title":"","footnotes":""},"class_list":["post-5412","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/hondartzape.com\/index.php?rest_route=\/wp\/v2\/pages\/5412","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/hondartzape.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/hondartzape.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/hondartzape.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/hondartzape.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=5412"}],"version-history":[{"count":34,"href":"https:\/\/hondartzape.com\/index.php?rest_route=\/wp\/v2\/pages\/5412\/revisions"}],"predecessor-version":[{"id":5518,"href":"https:\/\/hondartzape.com\/index.php?rest_route=\/wp\/v2\/pages\/5412\/revisions\/5518"}],"wp:attachment":[{"href":"https:\/\/hondartzape.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=5412"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

\n\t\t\t\t

\n\t\t\t\t\t

\n\t\t\t\t

\n\t\t\t\t\t\r\n\r\n\r\n \r\n \r\n Carta del Restaurante<\/title>\r\n <style>\r\n * {\r\n margin: 0;\r\n padding: 0;\r\n box-sizing: border-box;\r\n }\r\n\r\n body {\r\n font-family: 'Georgia', serif;\r\n background-color: #f0ebe3;\r\n color: #4a4a4a;\r\n line-height: 1.6;\r\n }\r\n\r\n .container {\r\n max-width: 1400px;\r\n margin: 0 auto;\r\n padding: 20px;\r\n }\r\n\r\n .carta-header {\r\n text-align: left;\r\n margin-bottom: 30px;\r\n }\r\n\r\n .breadcrumb {\r\n font-size: 14px;\r\n color: #8b7355;\r\n margin-bottom: 10px;\r\n }\r\n\r\n .breadcrumb a {\r\n color: #8b7355;\r\n text-decoration: none;\r\n }\r\n\r\n .breadcrumb a:hover {\r\n text-decoration: underline;\r\n }\r\n\r\n .carta-title {\r\n font-size: 2.5em;\r\n font-weight: normal;\r\n color: #4a4a4a;\r\n margin-bottom: 30px;\r\n }\r\n\r\n .allergen-legend {\r\n margin-top: 1rem;\r\n background: rgba(255, 255, 255, 0.8);\r\n padding: 20px;\r\n border-radius: 12px;\r\n margin-bottom: 30px;\r\n box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);\r\n width: 100%;\r\n }\r\n\r\n .allergen-legend h3 {\r\n margin-bottom: 15px;\r\n color: #4a4a4a;\r\n font-size: 1.2em;\r\n }\r\n\r\n .allergen-grid {\r\n display: grid;\r\n grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));\r\n gap: 15px;\r\n }\r\n\r\n .allergen-item {\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n padding: 10px;\r\n border-radius: 8px;\r\n cursor: pointer;\r\n transition: all 0.3s ease;\r\n background: rgba(255, 255, 255, 0.5);\r\n }\r\n\r\n .allergen-item:hover {\r\n background: rgba(255, 255, 255, 0.8);\r\n }\r\n\r\n .allergen-item.active {\r\n background: #4a4a4a;\r\n color: white;\r\n }\r\n\r\n .allergen-icon {\r\n width: 60px;\r\n height: 60px;\r\n margin: 0 auto 10px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n overflow: hidden;\r\n border-radius: 8px;\r\n }\r\n \r\n .allergen-icon img {\r\n width: 100%;\r\n height: 100%;\r\n object-fit: cover;\r\n object-position: center;\r\n }\r\n \r\n .allergen-name {\r\n font-weight: bold;\r\n font-size: 14px;\r\n color: #333;\r\n text-transform: uppercase;\r\n letter-spacing: 0.5px;\r\n }\r\n \r\n .allergen-item.active .allergen-name {\r\n color: white !important; \/* Texto blanco cuando est\u00e1 activo *\/\r\n }\r\n\r\n \/* Colores originales que se muestran en hover y active *\/\r\n .allergen-item:hover .allergen-icon.color {\r\n background-color: #e0e0e0 !important; \/* Gris claro para hover *\/\r\n }\r\n\r\n .allergen-item.active .allergen-icon.color {\r\n background-color: transparent !important; \/* Sin background cuando est\u00e1 activo *\/\r\n }\r\n\r\n .allergen-name {\r\n font-size: 0.8em;\r\n text-align: center;\r\n font-weight: bold;\r\n }\r\n\r\n .carta-layout {\r\n display: grid;\r\n grid-template-columns: 1fr 500px;\r\n gap: 40px;\r\n align-items: start;\r\n }\r\n\r\n .carta-content {\r\n background: rgba(255, 255, 255, 0.3);\r\n padding: 30px;\r\n border-radius: 8px;\r\n }\r\n\r\n .carta-section {\r\n margin-bottom: 40px;\r\n }\r\n\r\n .section-title {\r\n font-size: 1.4em;\r\n margin-bottom: 25px;\r\n color: #4a4a4a;\r\n border-bottom: 2px solid #d4c4a8;\r\n padding-bottom: 10px;\r\n font-weight: bold;\r\n text-transform: uppercase;\r\n letter-spacing: 1px;\r\n }\r\n\r\n .section-subtitle {\r\n font-size: 1.1em;\r\n margin-bottom: 15px;\r\n color: #6b5b47;\r\n font-style: italic;\r\n text-align: center;\r\n background: rgba(255, 255, 255, 0.5);\r\n padding: 8px;\r\n border-radius: 4px;\r\n }\r\n\r\n .menu-item {\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: flex-start;\r\n margin-bottom: 18px;\r\n padding: 12px 0;\r\n border-bottom: 1px dotted #d4c4a8;\r\n transition: all 0.3s ease;\r\n }\r\n\r\n .menu-item.grayed-out {\r\n opacity: 0.4;\r\n }\r\n\r\n .menu-item.grayed-out .item-name,\r\n .menu-item.grayed-out .item-name-euskera,\r\n .menu-item.grayed-out .item-description,\r\n .menu-item.grayed-out .item-price {\r\n color: #999 !important;\r\n }\r\n\r\n .menu-item:last-child {\r\n border-bottom: none;\r\n }\r\n\r\n .item-info {\r\n flex: 1;\r\n }\r\n\r\n .item-name {\r\n font-size: 1.05em;\r\n color: #4a4a4a;\r\n margin-bottom: 4px;\r\n font-weight: bold;\r\n }\r\n\r\n .item-name-euskera {\r\n font-size: 0.95em;\r\n color: #6b5b47;\r\n font-style: italic;\r\n margin-bottom: 6px;\r\n }\r\n\r\n .item-description {\r\n font-size: 0.9em;\r\n color: #8b7355;\r\n font-style: italic;\r\n margin-bottom: 5px;\r\n }\r\n\r\n .item-indicators {\r\n display: flex;\r\n gap: 8px;\r\n margin: 6px 0;\r\n }\r\n\r\n .indicator {\r\n width: 10px;\r\n height: 10px;\r\n border-radius: 50%;\r\n border: 1px solid rgba(0,0,0,0.1);\r\n }\r\n\r\n .indicator.apio { background-color: #A4C639; }\r\n .indicator.altramuz { background-color: #FFC107; }\r\n .indicator.cacahuetes { background-color: #D4A853; }\r\n .indicator.crustaceos { background-color: #B85AA4; }\r\n .indicator.frutos-secos { background-color: #C07062; }\r\n .indicator.cereales { background-color: #E6B547; }\r\n .indicator.huevos { background-color: #F5A623; }\r\n .indicator.lacteos { background-color: #5DADE2; }\r\n .indicator.moluscos { background-color: #E74C3C; }\r\n .indicator.mostaza { background-color: #F39C12; }\r\n .indicator.pescado { background-color: #3498DB; }\r\n .indicator.sesamo { background-color: #D68910; }\r\n .indicator.soja { background-color: #7FB069; }\r\n .indicator.sulfitos { background-color: #E91E63; }\r\n \r\n .item-price {\r\n font-size: 1.15em;\r\n font-weight: bold;\r\n color: #4a4a4a;\r\n margin-left: 20px;\r\n min-width: 80px;\r\n text-align: right;\r\n white-space: nowrap;\r\n }\r\n\r\n .special-note {\r\n background: rgba(139, 115, 85, 0.1);\r\n padding: 8px;\r\n border-radius: 4px;\r\n font-size: 0.85em;\r\n color: #6b5b47;\r\n margin: 5px 0;\r\n font-style: italic;\r\n }\r\n\r\n \/* Nueva clase para la imagen \u00fanica que ocupa toda la altura *\/\r\n .carta-image {\r\n position: sticky;\r\n top: 20px;\r\n height: fit-content;\r\n }\r\n\r\n .carta-image img {\r\n width: 100%; \/* M\u00e1s ancha que el contenedor *\/\r\n height: 800px;\r\n object-fit: cover;\r\n border-radius: 12px;\r\n box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);\r\n }\r\n\r\n .footer-notes {\r\n margin-top: 40px;\r\n padding: 20px;\r\n background: rgba(139, 115, 85, 0.1);\r\n border-radius: 8px;\r\n font-size: 0.9em;\r\n color: #6b5b47;\r\n }\r\n\r\n .footer-notes p {\r\n margin-bottom: 8px;\r\n }\r\n\r\n \/* Responsive Design *\/\r\n @media (max-width: 768px) {\r\n .container {\r\n padding: 15px;\r\n }\r\n\r\n .carta-title {\r\n font-size: 2em;\r\n }\r\n\r\n .carta-layout {\r\n grid-template-columns: 1fr;\r\n gap: 30px;\r\n }\r\n\r\n .carta-image {\r\n display: none;\r\n }\r\n\r\n .carta-content {\r\n padding: 20px;\r\n }\r\n\r\n .item-price {\r\n margin-left: 10px;\r\n min-width: 60px;\r\n }\r\n\r\n .menu-item {\r\n flex-wrap: wrap;\r\n }\r\n\r\n .item-indicators {\r\n margin-top: 8px;\r\n }\r\n\r\n .allergen-grid {\r\n grid-template-columns: repeat(auto-fit, minmax(80px, 1fr));\r\n gap: 10px;\r\n }\r\n\r\n .allergen-icon {\r\n width: 50px;\r\n height: 50px;\r\n margin: 0 auto 10px;\r\n display: flex;\r\n align-items: center;\r\n justify-content: center;\r\n }\r\n\r\n .allergen-icon img {\r\n width: 100%;\r\n height: 100%;\r\n object-fit: contain;\r\n }\r\n \r\n .allergen-name {\r\n font-weight: bold;\r\n font-size: 14px;\r\n color: #333;\r\n text-transform: uppercase;\r\n letter-spacing: 0.5px;\r\n }\r\n }\r\n\r\n @media (max-width: 480px) {\r\n .carta-title {\r\n font-size: 1.8em;\r\n }\r\n\r\n .carta-content {\r\n padding: 15px;\r\n }\r\n\r\n .menu-item {\r\n display: block;\r\n text-align: left;\r\n }\r\n\r\n .item-price {\r\n display: block;\r\n text-align: left;\r\n margin: 8px 0 0 0;\r\n font-size: 1.3em;\r\n }\r\n }\r\n\r\n \/* Ajuste autom\u00e1tico de altura en funci\u00f3n del contenido *\/\r\n @media (min-width: 769px) {\r\n .carta-image img {\r\n min-height: 100vh;\r\n max-height: none;\r\n }\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n <div class=\"container\">\r\n <div class=\"carta-header\">\r\n <h1 class=\"carta-title\">Carta del Restaurante<\/h1>\r\n <\/div>\r\n\r\n <div class=\"carta-layout\">\r\n <div class=\"carta-content\">\r\n <div class=\"carta-section\">\r\n <h2 class=\"section-title\">ENTRANTES<\/h2>\r\n <div class=\"section-subtitle\">Todos los entrantes son raciones individualizadas<\/div>\r\n \r\n <div class=\"menu-item\" data-allergens=\"pescado,sulfitos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Ensalada de bonito HONDARTZAPE (nuestra conserva)<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator pescado\"><\/span>\r\n <span class=\"indicator sulfitos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">17\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"pescado,crustaceos,cereales,moluscos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Sopa de pescado<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator pescado\"><\/span>\r\n <span class=\"indicator crustaceos\"><\/span>\r\n <span class=\"indicator cereales\"><\/span>\r\n <span class=\"indicator moluscos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">20\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Jam\u00f3n ib\u00e9rico de bellota \"JOSELITO\"<\/div>\r\n <\/div>\r\n <div class=\"item-price\">32\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Lomo ib\u00e9rico de bellota \"JOSELITO\"<\/div>\r\n <\/div>\r\n <div class=\"item-price\">28\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"pescado\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Anchoa mariposa en salaz\u00f3n \"LA MACHINA\" (Santo\u00f1a)<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator pescado\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">6\u20ac\/unid<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"crustaceos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Excellent de claire<\/div>\r\n <div class=\"item-description\">Esmeralda de claire (en temporada)<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator crustaceos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">5\u20ac\/unid<\/div>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"carta-section\">\r\n <h2 class=\"section-title\">ENTRANTES A LA BRASA<\/h2>\r\n <div class=\"section-subtitle\">Todos los entrantes son raciones individualizadas<\/div>\r\n \r\n <div class=\"menu-item\" data-allergens=\"frutos-secos,sulfitos,cereales\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Esp\u00e1rragos a la brasa y ajoblanco(en temporada)<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator frutos-secos\"><\/span>\r\n <span class=\"indicator sulfitos\"><\/span>\r\n <span class=\"indicator cereales\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">12\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"frutos-secos,cereales,huevos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Croqueta a la brasa<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator frutos-secos\"><\/span>\r\n <span class=\"indicator cereales\"><\/span>\r\n <span class=\"indicator huevos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">4\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"huevos,lacteos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Perretxikos a la brasa con holandesa(en temporada)<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator huevos\"><\/span>\r\n <span class=\"indicator lacteos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">30\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"pescado\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Anchoa a la brasa (en temporada)<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator pescado\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">12\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"moluscos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Chipir\u00f3n de potera a la brasa(en temporada)<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator moluscos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">16\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"pescado\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Taco de bacalao a la brasa , morrones y pilpil<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator pescado\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">20\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"pescado,huevos,cereales,lacteos,soja\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Brioche, papada ib\u00e9rica y caviar (oscietra)<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator pescado\"><\/span>\r\n <span class=\"indicator huevos\"><\/span>\r\n <span class=\"indicator cereales\"><\/span>\r\n <span class=\"indicator lacteos\"><\/span>\r\n <span class=\"indicator soja\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">28\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"sulfitos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Foie a la brasa , reducci\u00f3n de PX y compota de higo<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator sulfitos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">23\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"pescado,sulfitos,crustaceos,moluscos,soja\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Ventresca de at\u00fan rojo a la brasa, calabaza y ponzu<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator pescado\"><\/span>\r\n <span class=\"indicator sulfitos\"><\/span>\r\n <span class=\"indicator crustaceos\"><\/span>\r\n <span class=\"indicator moluscos\"><\/span>\r\n <span class=\"indicator soja\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">23\u20ac<\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"carta-section\">\r\n <h2 class=\"section-title\">MARISCOS A LA BRASA<\/h2>\r\n \r\n <div class=\"menu-item\" data-allergens=\"crustaceos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Gamba blanca<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator crustaceos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">32\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"crustaceos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Gamba roja<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator crustaceos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">8.5\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"crustaceos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Langostino<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator crustaceos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">Un. 3.5\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"moluscos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Almeja fina<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator moluscos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">90\u20ac\/kg<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"crustaceos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Carabinero<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator crustaceos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">Un. 24\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"crustaceos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Cigala (250 gr.) 140\u20ac\/kg<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator crustaceos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">35\u20ac<\/div>\r\n <\/div>\r\n \r\n <div class=\"menu-item\" data-allergens=\"crustaceos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Quisquill\u00f3n (250 gr.) 180\u20ac\/kg<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator crustaceos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">45\u20ac<\/div>\r\n <\/div>\r\n \r\n <div class=\"menu-item\" data-allergens=\"crustaceos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Percebes (250 gr.) 160\u20ac\/kg<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator crustaceos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">40\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"crustaceos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">N\u00e9cora<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator crustaceos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">18\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"crustaceos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Bogavante<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator crustaceos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">92\u20ac\/kg<\/div>\r\n <\/div>\r\n \r\n <div class=\"menu-item\" data-allergens=\"crustaceos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Langosta<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator crustaceos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">140\u20ac\/kg<\/div>\r\n <\/div>\r\n \r\n <\/div>\r\n\r\n <div class=\"carta-section\">\r\n <h2 class=\"section-title\">PESCADOS A LA BRASA<\/h2>\r\n \r\n <div class=\"menu-item\" data-allergens=\"pescado,sulfitos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Cogote de merluza<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator pescado\"><\/span>\r\n <span class=\"indicator sulfitos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">52\u20ac\/kg<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"pescado,sulfitos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Merluza<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator pescado\"><\/span>\r\n <span class=\"indicator sulfitos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">52\u20ac\/kg<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"pescado,sulfitos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Mero negro<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator pescado\"><\/span>\r\n <span class=\"indicator sulfitos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">98\u20ac\/kg<\/div>\r\n <\/div>\r\n \r\n <div class=\"menu-item\" data-allergens=\"pescado,sulfitos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Lubina<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator pescado\"><\/span>\r\n <span class=\"indicator sulfitos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">88\u20ac\/kg<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"pescado,sulfitos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Besugo<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator pescado\"><\/span>\r\n <span class=\"indicator sulfitos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">135\u20ac\/kg<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"pescado,sulfitos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Rey \/ Palometa roja \/ Virrey<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator pescado\"><\/span>\r\n <span class=\"indicator sulfitos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">135\u20ac\/kg<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"pescado,sulfitos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">San Pedro<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator pescado\"><\/span>\r\n <span class=\"indicator sulfitos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">88\u20ac\/kg<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"pescado,sulfitos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Rodaballo<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator pescado\"><\/span>\r\n <span class=\"indicator sulfitos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">88\u20ac\/kg<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"pescado,sulfitos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Lenguado<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator pescado\"><\/span>\r\n <span class=\"indicator sulfitos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">92\u20ac\/kg<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"pescado,sulfitos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Sargo<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator pescado\"><\/span>\r\n <span class=\"indicator sulfitos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">58\u20ac\/kg<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"pescado,sulfitos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Cabracho<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator pescado\"><\/span>\r\n <span class=\"indicator sulfitos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">88\u20ac\/kg<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"pescado,sulfitos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Salmonete<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator pescado\"><\/span>\r\n <span class=\"indicator sulfitos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">88\u20ac\/kg<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"pescado,sulfitos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Rape<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator pescado\"><\/span>\r\n <span class=\"indicator sulfitos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">68\u20ac\/kg<\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"carta-section\">\r\n <h2 class=\"section-title\">CARNE A LA BRASA<\/h2>\r\n \r\n <div class=\"menu-item\" data-allergens=\"\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Chuleta de ganado mayor<\/div> \r\n <div class=\"item-description\">(raza Simmental con m\u00e1s de 30 dias de maduraci\u00f3n)<\/div>\r\n <\/div>\r\n <div class=\"item-price\">88\u20ac\/kg<\/div>\r\n <\/div>\r\n <\/div>\r\n \r\n <div class=\"carta-section\">\r\n <h2 class=\"section-title\">POSTRES<\/h2>\r\n \r\n <div class=\"menu-item\" data-allergens=\"lacteos,huevos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Flan<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator lacteos\"><\/span>\r\n <span class=\"indicator huevos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">9.50\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"lacteos,huevos,frutos-secos,cereales\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Tostada de pan brioche<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator lacteos\"><\/span>\r\n <span class=\"indicator huevos\"><\/span>\r\n <span class=\"indicator frutos-secos\"><\/span>\r\n <span class=\"indicator cereales\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">9.50\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"lacteos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Cuajada de leche de oveja<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator lacteos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">9.50\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"lacteos,huevos,frutos-secos,cereales\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Tarta de queso al horno<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator lacteos\"><\/span>\r\n <span class=\"indicator huevos\"><\/span>\r\n <span class=\"indicator frutos-secos\"><\/span>\r\n <span class=\"indicator cereales\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">9.50\u20ac<\/div>\r\n <\/div>\r\n \r\n <div class=\"menu-item\" data-allergens=\"lacteos,huevos,frutos-secos,sesamo,soja,cereales,frutos-secos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Texturas de chocolate<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator lacteos\"><\/span>\r\n <span class=\"indicator huevos\"><\/span>\r\n <span class=\"indicator frutos-secos\"><\/span>\r\n <span class=\"indicator sesamo\"><\/span>\r\n <span class=\"indicator soja\"><\/span>\r\n <span class=\"indicator cereales\"><\/span>\r\n <span class=\"indicator frutos-secos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">9.50\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"lacteos,huevos,frutos-secos,cereales\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Tarta de manzana con helado de nata y nueces<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator lacteos\"><\/span>\r\n <span class=\"indicator huevos\"><\/span>\r\n <span class=\"indicator frutos-secos\"><\/span>\r\n <span class=\"indicator cereales\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">9.50\u20ac<\/div>\r\n <\/div>\r\n\r\n <div class=\"menu-item\" data-allergens=\"lacteos,huevos,frutos-secos,cereales\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Nuestro postre c\u00edtrico (Lemon pie)<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator lacteos\"><\/span>\r\n <span class=\"indicator huevos\"><\/span>\r\n <span class=\"indicator frutos-secos\"><\/span>\r\n <span class=\"indicator cereales\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">9.50\u20ac<\/div>\r\n <\/div>\r\n \r\n <div class=\"menu-item\" data-allergens=\"lacteos\">\r\n <div class=\"item-info\">\r\n <div class=\"item-name\">Irland\u00e9s<\/div>\r\n <div class=\"item-indicators\">\r\n <span class=\"indicator lacteos\"><\/span>\r\n <\/div>\r\n <\/div>\r\n <div class=\"item-price\">16\u20ac<\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"footer-notes\">\r\n <p><strong>Nota:<\/strong> Todos los entrantes son raciones individualizadas.<\/p>\r\n <p>Trabajamos con productos frescos, es por ello que la carta variar\u00e1 seg\u00fan temporada.<\/p>\r\n <p>Consulta disponibilidad con el jefe de sala.<\/p>\r\n <p><\/p>\r\n <p>Todos nuestros precios incluyen IVA y est\u00e1n indicados en Euros.<\/p>\r\n <p>Soliciten informaci\u00f3n de al\u00e9rgenos a nuestro personal.<\/p>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"carta-image\">\r\n <img decoding=\"async\" src=\"\/wp-content\/allergens\/menu-restaurante.jpg\">\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"allergen-legend\">\r\n <div class=\"allergen-grid\">\r\n <div class=\"allergen-item\" data-allergen=\"apio\">\r\n <div class=\"allergen-icon color\">\r\n <img decoding=\"async\" src=\"\/wp-content\/allergens\/apio.png\">\r\n <\/div>\r\n <div class=\"allergen-name\">APIO<\/div>\r\n <\/div>\r\n <div class=\"allergen-item\" data-allergen=\"altramuz\">\r\n <div class=\"allergen-icon color\">\r\n <img decoding=\"async\" src=\"\/wp-content\/allergens\/altramuz.png\">\r\n <\/div>\r\n <div class=\"allergen-name\">ALTRAMUZ<\/div>\r\n <\/div>\r\n <div class=\"allergen-item\" data-allergen=\"cacahuetes\">\r\n <div class=\"allergen-icon color\">\r\n <img decoding=\"async\" src=\"\/wp-content\/allergens\/cacahuetes.png\">\r\n <\/div>\r\n <div class=\"allergen-name\">CACAHUETES<\/div>\r\n <\/div>\r\n <div class=\"allergen-item\" data-allergen=\"cereales\">\r\n <div class=\"allergen-icon color\">\r\n <img decoding=\"async\" src=\"\/wp-content\/allergens\/gluten.png\">\r\n <\/div>\r\n <div class=\"allergen-name\">CEREALES<\/div>\r\n <\/div>\r\n <div class=\"allergen-item\" data-allergen=\"crustaceos\">\r\n <div class=\"allergen-icon color\">\r\n <img decoding=\"async\" src=\"\/wp-content\/allergens\/crustaceos.png\">\r\n <\/div>\r\n <div class=\"allergen-name\">CRUST\u00c1CEOS<\/div>\r\n <\/div>\r\n <div class=\"allergen-item\" data-allergen=\"frutos-secos\">\r\n <div class=\"allergen-icon color\">\r\n <img decoding=\"async\" src=\"\/wp-content\/allergens\/frutos-secos.png\">\r\n <\/div>\r\n <div class=\"allergen-name\">FRUTOS SECOS<\/div>\r\n <\/div>\r\n <div class=\"allergen-item\" data-allergen=\"huevos\">\r\n <div class=\"allergen-icon color\">\r\n <img decoding=\"async\" src=\"\/wp-content\/allergens\/huevos.png\">\r\n <\/div>\r\n <div class=\"allergen-name\">HUEVOS<\/div>\r\n <\/div>\r\n <div class=\"allergen-item\" data-allergen=\"lacteos\">\r\n <div class=\"allergen-icon color\">\r\n <img decoding=\"async\" src=\"\/wp-content\/allergens\/lacteos.png\">\r\n <\/div>\r\n <div class=\"allergen-name\">L\u00c1CTEOS<\/div>\r\n <\/div>\r\n <div class=\"allergen-item\" data-allergen=\"moluscos\">\r\n <div class=\"allergen-icon color\">\r\n <img decoding=\"async\" src=\"\/wp-content\/allergens\/moluscos.png\">\r\n <\/div>\r\n <div class=\"allergen-name\">MOLUSCOS<\/div>\r\n <\/div>\r\n <div class=\"allergen-item\" data-allergen=\"mostaza\">\r\n <div class=\"allergen-icon color\">\r\n <img decoding=\"async\" src=\"\/wp-content\/allergens\/mostaza.png\">\r\n <\/div>\r\n <div class=\"allergen-name\">MOSTAZA<\/div>\r\n <\/div>\r\n <div class=\"allergen-item\" data-allergen=\"sesamo\">\r\n <div class=\"allergen-icon color\">\r\n <img decoding=\"async\" src=\"\/wp-content\/allergens\/sesamo.png\">\r\n <\/div>\r\n <div class=\"allergen-name\">S\u00c9SAMO<\/div>\r\n <\/div>\r\n <div class=\"allergen-item\" data-allergen=\"soja\">\r\n <div class=\"allergen-icon color\">\r\n <img decoding=\"async\" src=\"\/wp-content\/allergens\/soja.png\">\r\n <\/div>\r\n <div class=\"allergen-name\">SOJA<\/div>\r\n <\/div>\r\n <div class=\"allergen-item\" data-allergen=\"sulfitos\">\r\n <div class=\"allergen-icon color\">\r\n <img decoding=\"async\" src=\"\/wp-content\/allergens\/sulfitos.png\">\r\n <\/div>\r\n <div class=\"allergen-name\">SULFITOS<\/div>\r\n <\/div>\r\n <div class=\"allergen-item\" data-allergen=\"pescado\">\r\n <div class=\"allergen-icon color\">\r\n <img decoding=\"async\" src=\"\/wp-content\/allergens\/\/pescado.png\">\r\n <\/div>\r\n <div class=\"allergen-name\">PESCADO<\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <script>\r\n \/\/ Array para almacenar los al\u00e9rgenos activos\r\n let activeAllergens = [];\r\n\r\n \/\/ Funci\u00f3n para filtrar los elementos del men\u00fa\r\n function filterMenuItems() {\r\n const menuItems = document.querySelectorAll('.menu-item');\r\n \r\n menuItems.forEach(item => {\r\n \/\/ Verificar si el atributo data-allergens existe y no es null\/undefined\r\n const allergensData = item.dataset.allergens;\r\n const itemAllergens = allergensData ? allergensData.split(',').filter(a => a.trim() !== '') : [];\r\n \r\n \/\/ Si no hay al\u00e9rgenos activos, mostrar todos los platos normalmente\r\n if (activeAllergens.length === 0) {\r\n item.classList.remove('grayed-out');\r\n return;\r\n }\r\n \r\n \/\/ Verificar si el plato contiene alguno de los al\u00e9rgenos activos\r\n const hasActiveAllergen = itemAllergens.some(allergen => \r\n activeAllergens.includes(allergen.trim())\r\n );\r\n \r\n \/\/ Si contiene un al\u00e9rgeno activo, ponerlo en gris\r\n if (hasActiveAllergen) {\r\n item.classList.add('grayed-out');\r\n } else {\r\n item.classList.remove('grayed-out');\r\n }\r\n });\r\n }\r\n\r\n \/\/ Funci\u00f3n para inicializar el filtro de al\u00e9rgenos\r\n function initAllergenFilter() {\r\n const allergenItems = document.querySelectorAll('.allergen-item');\r\n \r\n allergenItems.forEach(item => {\r\n item.addEventListener('click', function() {\r\n const allergen = this.dataset.allergen;\r\n \r\n \/\/ Verificar que el al\u00e9rgeno existe\r\n if (!allergen) return;\r\n \r\n \/\/ Toggle del al\u00e9rgeno activo\r\n if (activeAllergens.includes(allergen)) {\r\n \/\/ Remover del array\r\n activeAllergens = activeAllergens.filter(a => a !== allergen);\r\n this.classList.remove('active');\r\n } else {\r\n \/\/ Agregar al array\r\n activeAllergens.push(allergen);\r\n this.classList.add('active');\r\n }\r\n \r\n \/\/ Actualizar la visualizaci\u00f3n de los platos\r\n filterMenuItems();\r\n });\r\n });\r\n }\r\n\r\n \/\/ Inicializar cuando se carga la p\u00e1gina\r\n document.addEventListener('DOMContentLoaded', function() {\r\n try {\r\n initAllergenFilter();\r\n console.log('Sistema de filtros de al\u00e9rgenos inicializado correctamente');\r\n } catch (error) {\r\n console.error('Error al inicializar el sistema de filtros:', error);\r\n }\r\n });\r\n <\/script>\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\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>Carta del Restaurante Carta del Restaurante ENTRANTES Todos los entrantes son raciones individualizadas Ensalada de bonito HONDARTZAPE (nuestra conserva) 17\u20ac Sopa de pescado 20\u20ac Jam\u00f3n ib\u00e9rico de bellota “JOSELITO” 32\u20ac Lomo ib\u00e9rico de bellota “JOSELITO” 28\u20ac Anchoa mariposa en salaz\u00f3n “LA MACHINA” (Santo\u00f1a) 6\u20ac\/unid Excellent de claire Esmeralda de claire (en temporada) 5\u20ac\/unid ENTRANTES A… <a href=\"https:\/\/hondartzape.com\/?page_id=5412\" rel=\"bookmark\">Leer m\u00e1s »<span class=\"screen-reader-text\">Carta<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"page-templates\/template-pagebuilder-full-width.php","meta":{"neve_meta_sidebar":"","neve_meta_container":"","neve_meta_enable_content_width":"","neve_meta_content_width":0,"neve_meta_title_alignment":"","neve_meta_author_avatar":"","neve_post_elements_order":"","neve_meta_disable_header":"","neve_meta_disable_footer":"","neve_meta_disable_title":"","footnotes":""},"class_list":["post-5412","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/hondartzape.com\/index.php?rest_route=\/wp\/v2\/pages\/5412","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/hondartzape.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/hondartzape.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/hondartzape.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/hondartzape.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=5412"}],"version-history":[{"count":34,"href":"https:\/\/hondartzape.com\/index.php?rest_route=\/wp\/v2\/pages\/5412\/revisions"}],"predecessor-version":[{"id":5518,"href":"https:\/\/hondartzape.com\/index.php?rest_route=\/wp\/v2\/pages\/5412\/revisions\/5518"}],"wp:attachment":[{"href":"https:\/\/hondartzape.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=5412"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}