{"id":19,"date":"2026-04-24T19:58:31","date_gmt":"2026-04-24T19:58:31","guid":{"rendered":"http:\/\/h000001.hotelscsm.panoram4.com\/kiosco\/"},"modified":"2026-04-27T12:17:23","modified_gmt":"2026-04-27T12:17:23","slug":"kiosco","status":"publish","type":"page","link":"https:\/\/h000001.hotelscsm.panoram4.com\/ca\/","title":{"rendered":"Inicio"},"content":{"rendered":"        <style>\n            .kiosk-wrap {\n                height:100vh;\n                width:100%;\n                overflow:hidden;\n                display:flex;\n                flex-direction:column;\n                justify-content:flex-end;\n                padding:40px 60px;\n                box-sizing:border-box;\n                position:relative;\n            }\n\n            .sub-grid-wrapper {\n                max-height:0;\n                opacity:0;\n                visibility:hidden;\n                overflow:hidden;\n                transform:translateY(30px);\n                transition:\n                    max-height 0.5s cubic-bezier(0.4,0,0.2,1),\n                    opacity 0.4s ease,\n                    transform 0.5s cubic-bezier(0.4,0,0.2,1),\n                    margin 0.4s ease;\n                border-radius:20px;\n                margin-bottom:0;\n                width:100%;\n            }\n\n            .sub-grid-wrapper.active {\n                max-height:250px;\n                opacity:1;\n                visibility:visible;\n                transform:translateY(0);\n                margin-bottom:20px;\n            }\n\n            .sub-grid .kt {\n                opacity:0;\n                transition:all 0.4s ease;\n            }\n\n            .sub-grid-wrapper.active .sub-grid .kt {\n                opacity:1;\n            }\n\n            .kiosk-grid {\n                display:flex;\n                flex-direction:row;\n                height:180px;\n                align-items:flex-end;\n                overflow-x:auto;\n                overflow-y:hidden;\n                scrollbar-width:none;\n                -ms-overflow-style:none;\n                width:100%;\n                overscroll-behavior-x:contain;\n                touch-action:pan-x;\n                will-change: scroll-left;\n            }\n\n            .kiosk-grid > * + * {\n                \/* margin-left:15px; *\/\n                margin-inline-start:15px;\n            }\n\n            .kiosk-grid::-webkit-scrollbar {\n                display:none;\n            }\n\n            .kt {\n                position:relative;\n                flex:0 0 270px;\n                height:150px;\n                width:270px;\n                background-size:cover;\n                background-position:center;\n                border-radius:14px;\n                text-decoration:none;\n                display:block;\n                transition:transform 0.3s, border 0.3s;\n            }\n\n            .kt-shadow::after {\n                content:'';\n                position:absolute;\n                left:0;\n                right:0;\n                bottom:0;\n                height:75%;\n                background:linear-gradient(to top, rgba(0,0,0,.75), rgba(0,0,0,0));\n                pointer-events:none;\n                border-radius:0 0 14px 14px;\n            }\n\n\n            .kt:focus-visible { outline: none }\n\n            .kt.keyboard-selected {\n                transform:translateY(-8px);\n                outline: none;\n                border: none;\n                z-index: 20;\n            }\n\n            .kt-label {\n                position:absolute;\n                left:0;\n                right:0;\n                bottom:25px;\n                color:#fff;\n                text-align:center;\n                font-size:20px;\n                line-height: 1.1;\n                z-index:1;\n                margin-inline:5px;\n            }\n\n            .kiosk-nav-arrow {\n                position:absolute;\n                bottom:40px;\n                width:60px;\n                height:160px;\n                display:flex;\n                align-items:center;\n                justify-content:center;\n                z-index:10;\n                cursor:pointer;\n                color:white;\n                font-size:40px;\n                opacity:0.5;\n                transition:opacity 0.3s, background 0.3s;\n                user-select:none;\n            }\n\n            .kiosk-nav-arrow:hover,\n            .kiosk-nav-arrow:focus {\n                opacity:1;\n            }\n\n            .kiosk-nav-left  { left:0; }\n            .kiosk-nav-right { right:0; }\n\n            html[dir=\"rtl\"] .kiosk-nav-left {\n                transform: rotate(180deg);\n            }\n\n            html[dir=\"rtl\"] .kiosk-nav-right {\n                transform: rotate(180deg);\n            }\n\n            .is-information { color:black !important; }\n\n            .kiosk-debug-mode {\n                background-image: url('\/wp-content\/uploads\/2026\/06\/debug-bg.png') !important;\n                background-repeat: no-repeat;\n                background-size: cover;\n            }\n\n            .kiosk-qr-mode .kt[data-action-type=\"buttons\"],\n            .kiosk-qr-mode .kt[data-action-type=\"page\"][data-content-type=\"venta\"] {\n                display:none !important;\n            }\n\n            .kiosk-wrap:not(.kiosk-qr-mode) > #kioskGrid .kt-child-tile {\n                display:none !important;\n            }\n\n            @media (max-width: 1024px) {\n\n                body {\n                    background: black !important;\n                }\n\n                \/* En m\u00f3vil no usamos las flechas *\/\n                .kiosk-nav-arrow {\n                    display: none !important;\n                }\n\n                \/* Los submen\u00fas no se despliegan como en desktop *\/\n                .sub-grid-wrapper {\n                    display: none !important;\n                }\n\n                .kiosk-wrap {\n                    height: auto;\n                    min-height: 100vh;\n                    overflow-y: auto;\n                    justify-content: flex-start;\n                    padding: 20px;\n                }\n\n                \/* Men\u00fa principal vertical *\/\n                .kiosk-grid#kioskGrid {\n                    display: flex;\n                    flex-direction: column;\n                    height: auto;\n                    width: 100%;\n                    overflow-x: visible;\n                    overflow-y: visible;\n                    align-items: center;\n                    touch-action: auto;\n                    scroll-behavior: smooth;\n                    will-change: scroll-left;\n                }\n\n                .kiosk-grid#kioskGrid > * + * {\n                    margin-left: 0;\n                    margin-inline-start: 0;\n                    margin-top: 20px;\n                }\n\n                .kt {\n                    flex: 0 0 auto;\n                    width: 100%;\n                    max-width: 360px;\n                    height: 180px;\n                }\n            }\n            \n        <\/style>\n\n                \n        <div class=\"kiosk-wrap\" id=\"kioskApp\">\n            <div class=\"sub-grid-wrapper\" id=\"subWrapper\" data-current=\"\">\n                <div class=\"kiosk-grid sub-grid\" id=\"subGrid\"><\/div>\n            <\/div>\n\n            <div class=\"kiosk-nav-arrow kiosk-nav-left\" id=\"kioskPrev\" role=\"button\" tabindex=\"0\" aria-label=\"Previous items\">\u2039<\/div>\n            <div class=\"kiosk-nav-arrow kiosk-nav-right\" id=\"kioskNext\" role=\"button\" tabindex=\"0\" aria-label=\"Next items\">\u203a<\/div>\n\n            <div class=\"kiosk-grid\" id=\"kioskGrid\">\n                \n                                            <a\n                            class=\"kt kt-has-submenu\"\n                            data-title=\"main:Information\"\n                            data-content-type=\"informativo\"\n                            data-action-type=\"buttons\"\n                            href=\"#\"\n                            style=\"background-image:url('https:\/\/hotelscsm.panoram4.com\/wp-content\/uploads\/panoram4-buttons\/default-info.jpg')\"\n                            onclick=\"handleTileClick(event, &quot;main:Information&quot;)\"\n                        >\n                                                            <span class=\"kt-label is-information\">Information<\/span>\n                                                    <\/a>\n\n                                                    <a\n                                class=\"kt kt-child-tile\"\n                                data-child-key=\"child:Information\"\n                                data-content-type=\"informativo\"\n                                data-action-type=\"page\"\n                                href=\"https:\/\/h000001.hotelscsm.panoram4.com\/ca\/information\/\"\n                                style=\"background-image:url('https:\/\/hotelscsm.panoram4.com\/wp-content\/uploads\/panoram4-buttons\/default-info.jpg')\"\n                            >\n                                                                    <span class=\"kt-label is-information\">Information<\/span>\n                                                            <\/a>\n                                                    <a\n                                class=\"kt kt-shadow kt-child-tile\"\n                                data-child-key=\"child:Event Halls &amp; Events\"\n                                data-content-type=\"informativo\"\n                                data-action-type=\"page\"\n                                href=\"https:\/\/h000001.hotelscsm.panoram4.com\/ca\/event-halls-events\/\"\n                                style=\"background-image:url('https:\/\/h000001.hotelscsm.panoram4.com\/wp-content\/uploads\/sites\/18\/2026\/05\/17_DSC8596.jpg')\"\n                            >\n                                                                    <span class=\"kt-label\">Event Halls &amp; Events<\/span>\n                                                            <\/a>\n                        \n                    \n                \n                                            <a\n                            class=\"kt\"\n                            data-content-type=\"venta\"\n                            data-action-type=\"page\"\n                            href=\"https:\/\/h000001.hotelscsm.panoram4.com\/ca\/dining-service\/\"\n                            style=\"background-image:url('https:\/\/hotelscsm.panoram4.com\/wp-content\/uploads\/panoram4-buttons\/default-dining.jpg')\"\n                        >\n                                                            <span class=\"kt-label\">Dining Service<\/span>\n                                                    <\/a>\n                    \n                \n                                            <a\n                            class=\"kt kt-has-submenu\"\n                            data-title=\"main:Room Services\"\n                            data-content-type=\"venta\"\n                            data-action-type=\"buttons\"\n                            href=\"#\"\n                            style=\"background-image:url('https:\/\/hotelscsm.panoram4.com\/wp-content\/uploads\/panoram4-buttons\/default-room.jpg')\"\n                            onclick=\"handleTileClick(event, &quot;main:Room Services&quot;)\"\n                        >\n                                                            <span class=\"kt-label\">Room Services<\/span>\n                                                    <\/a>\n\n                                                    <a\n                                class=\"kt kt-child-tile\"\n                                data-child-key=\"child:Room Services\"\n                                data-content-type=\"venta\"\n                                data-action-type=\"page\"\n                                href=\"https:\/\/h000001.hotelscsm.panoram4.com\/ca\/room-services\/\"\n                                style=\"background-image:url('https:\/\/hotelscsm.panoram4.com\/wp-content\/uploads\/panoram4-buttons\/default-room.jpg')\"\n                            >\n                                                                    <span class=\"kt-label\">Room Services<\/span>\n                                                            <\/a>\n                                                    <a\n                                class=\"kt kt-shadow kt-child-tile\"\n                                data-child-key=\"child:Laundry &amp; Dry Cleaning\"\n                                data-content-type=\"venta\"\n                                data-action-type=\"page\"\n                                href=\"https:\/\/h000001.hotelscsm.panoram4.com\/ca\/laundry-dry-cleaning\/\"\n                                style=\"background-image:url('https:\/\/h000001.hotelscsm.panoram4.com\/wp-content\/uploads\/sites\/18\/2026\/05\/plancha.jpg')\"\n                            >\n                                                                    <span class=\"kt-label\">Laundry &amp; Dry Cleaning<\/span>\n                                                            <\/a>\n                        \n                    \n                \n                                            <a\n                            class=\"kt\"\n                            data-content-type=\"venta\"\n                            data-action-type=\"page\"\n                            href=\"https:\/\/h000001.hotelscsm.panoram4.com\/ca\/hotel-services\/\"\n                            style=\"background-image:url('https:\/\/hotelscsm.panoram4.com\/wp-content\/uploads\/panoram4-buttons\/default-hotel.jpg')\"\n                        >\n                                                            <span class=\"kt-label\">Hotel Services<\/span>\n                                                    <\/a>\n                    \n                \n                                            <a\n                            class=\"kt kt-has-submenu\"\n                            data-title=\"main:Experiences\"\n                            data-content-type=\"venta\"\n                            data-action-type=\"buttons\"\n                            href=\"#\"\n                            style=\"background-image:url('https:\/\/hotelscsm.panoram4.com\/wp-content\/uploads\/panoram4-buttons\/default-experiences.jpg')\"\n                            onclick=\"handleTileClick(event, &quot;main:Experiences&quot;)\"\n                        >\n                                                            <span class=\"kt-label\">Experiences<\/span>\n                                                    <\/a>\n\n                                                    <a\n                                class=\"kt kt-child-tile\"\n                                data-child-key=\"child:Experiences\"\n                                data-content-type=\"venta\"\n                                data-action-type=\"page\"\n                                href=\"https:\/\/h000001.hotelscsm.panoram4.com\/ca\/experiences\/\"\n                                style=\"background-image:url('https:\/\/hotelscsm.panoram4.com\/wp-content\/uploads\/panoram4-buttons\/default-experiences.jpg')\"\n                            >\n                                                                    <span class=\"kt-label\">Experiences<\/span>\n                                                            <\/a>\n                                                    <a\n                                class=\"kt kt-child-tile\"\n                                data-child-key=\"child:Ticketing\"\n                                data-content-type=\"informativo\"\n                                data-action-type=\"external\"\n                                href=\"https:\/\/s.ticketinhotel.es\/en\/web\/1\"\n                                style=\"background-image:url('https:\/\/h000001.hotelscsm.panoram4.com\/wp-content\/uploads\/sites\/18\/2026\/05\/Ticketing.png')\"\n                            >\n                                                            <\/a>\n                        \n                    \n                \n                                            <a\n                            class=\"kt kt-shadow\"\n                            data-content-type=\"venta\"\n                            data-action-type=\"page\"\n                            href=\"https:\/\/h000001.hotelscsm.panoram4.com\/ca\/merchandising\/\"\n                            style=\"background-image:url('https:\/\/h000001.hotelscsm.panoram4.com\/wp-content\/uploads\/sites\/18\/2026\/05\/magnific_mikado-buenavista-scent-a_2960823199.jpeg')\"\n                        >\n                                                            <span class=\"kt-label\">Merchandising<\/span>\n                                                    <\/a>\n                    \n                \n                                            <a\n                            class=\"kt\"\n                            data-content-type=\"informativo\"\n                            data-action-type=\"external\"\n                            href=\"https:\/\/www.pressreader.com\/es\"\n                            style=\"background-image:url('https:\/\/h000001.hotelscsm.panoram4.com\/wp-content\/uploads\/sites\/18\/2026\/05\/PressReader-1.png')\"\n                        >\n                                                    <\/a>\n                    \n                            <\/div>\n        <\/div>\n\n        <script>\n        (function() {\n            'use strict';\n\n            const kioskData = {\"main:Information\":{\"key\":\"main:Information\",\"title\":\"Information\",\"action_type\":\"buttons\",\"content_type\":\"informativo\",\"link\":\"https:\\\/\\\/h000001.hotelscsm.panoram4.com\\\/ca\\\/information\\\/\",\"img\":\"https:\\\/\\\/hotelscsm.panoram4.com\\\/wp-content\\\/uploads\\\/panoram4-buttons\\\/default-info.jpg\",\"is_panorama\":true,\"display_title\":1,\"display_shadow\":0,\"parent_title\":\"\",\"children\":[\"child:Information\",\"child:Event Halls & Events\"]},\"main:Dining Service\":{\"key\":\"main:Dining Service\",\"title\":\"Dining Service\",\"action_type\":\"page\",\"content_type\":\"venta\",\"link\":\"https:\\\/\\\/h000001.hotelscsm.panoram4.com\\\/ca\\\/dining-service\\\/\",\"img\":\"https:\\\/\\\/hotelscsm.panoram4.com\\\/wp-content\\\/uploads\\\/panoram4-buttons\\\/default-dining.jpg\",\"is_panorama\":true,\"display_title\":1,\"display_shadow\":0,\"parent_title\":\"\",\"children\":[]},\"main:Room Services\":{\"key\":\"main:Room Services\",\"title\":\"Room Services\",\"action_type\":\"buttons\",\"content_type\":\"venta\",\"link\":\"https:\\\/\\\/h000001.hotelscsm.panoram4.com\\\/ca\\\/room-services\\\/\",\"img\":\"https:\\\/\\\/hotelscsm.panoram4.com\\\/wp-content\\\/uploads\\\/panoram4-buttons\\\/default-room.jpg\",\"is_panorama\":true,\"display_title\":1,\"display_shadow\":0,\"parent_title\":\"\",\"children\":[\"child:Room Services\",\"child:Laundry & Dry Cleaning\"]},\"main:Hotel Services\":{\"key\":\"main:Hotel Services\",\"title\":\"Hotel Services\",\"action_type\":\"page\",\"content_type\":\"venta\",\"link\":\"https:\\\/\\\/h000001.hotelscsm.panoram4.com\\\/ca\\\/hotel-services\\\/\",\"img\":\"https:\\\/\\\/hotelscsm.panoram4.com\\\/wp-content\\\/uploads\\\/panoram4-buttons\\\/default-hotel.jpg\",\"is_panorama\":true,\"display_title\":1,\"display_shadow\":0,\"parent_title\":\"\",\"children\":[]},\"main:Experiences\":{\"key\":\"main:Experiences\",\"title\":\"Experiences\",\"action_type\":\"buttons\",\"content_type\":\"venta\",\"link\":\"https:\\\/\\\/h000001.hotelscsm.panoram4.com\\\/ca\\\/experiences\\\/\",\"img\":\"https:\\\/\\\/hotelscsm.panoram4.com\\\/wp-content\\\/uploads\\\/panoram4-buttons\\\/default-experiences.jpg\",\"is_panorama\":true,\"display_title\":1,\"display_shadow\":0,\"parent_title\":\"\",\"children\":[\"child:Experiences\",\"child:Ticketing\"]},\"main:Merchandising\":{\"key\":\"main:Merchandising\",\"title\":\"Merchandising\",\"action_type\":\"page\",\"content_type\":\"venta\",\"link\":\"https:\\\/\\\/h000001.hotelscsm.panoram4.com\\\/ca\\\/merchandising\\\/\",\"img\":\"https:\\\/\\\/h000001.hotelscsm.panoram4.com\\\/wp-content\\\/uploads\\\/sites\\\/18\\\/2026\\\/05\\\/magnific_mikado-buenavista-scent-a_2960823199.jpeg\",\"is_panorama\":false,\"display_title\":1,\"display_shadow\":1,\"parent_title\":\"\",\"children\":[]},\"main:Pressreader\":{\"key\":\"main:Pressreader\",\"title\":\"Pressreader\",\"action_type\":\"external\",\"content_type\":\"informativo\",\"link\":\"https:\\\/\\\/www.pressreader.com\\\/es\",\"img\":\"https:\\\/\\\/h000001.hotelscsm.panoram4.com\\\/wp-content\\\/uploads\\\/sites\\\/18\\\/2026\\\/05\\\/PressReader-1.png\",\"is_panorama\":false,\"display_title\":0,\"display_shadow\":0,\"parent_title\":\"\",\"children\":[]},\"child:Information\":{\"key\":\"child:Information\",\"title\":\"Information\",\"action_type\":\"page\",\"content_type\":\"informativo\",\"link\":\"https:\\\/\\\/h000001.hotelscsm.panoram4.com\\\/ca\\\/information\\\/\",\"img\":\"https:\\\/\\\/hotelscsm.panoram4.com\\\/wp-content\\\/uploads\\\/panoram4-buttons\\\/default-info.jpg\",\"is_panorama\":true,\"display_title\":1,\"display_shadow\":0,\"parent_title\":\"Information\",\"children\":[]},\"child:Event Halls & Events\":{\"key\":\"child:Event Halls & Events\",\"title\":\"Event Halls & Events\",\"action_type\":\"page\",\"content_type\":\"informativo\",\"link\":\"https:\\\/\\\/h000001.hotelscsm.panoram4.com\\\/ca\\\/event-halls-events\\\/\",\"img\":\"https:\\\/\\\/h000001.hotelscsm.panoram4.com\\\/wp-content\\\/uploads\\\/sites\\\/18\\\/2026\\\/05\\\/17_DSC8596.jpg\",\"is_panorama\":false,\"display_title\":1,\"display_shadow\":1,\"parent_title\":\"Information\",\"children\":[]},\"child:Room Services\":{\"key\":\"child:Room Services\",\"title\":\"Room Services\",\"action_type\":\"page\",\"content_type\":\"venta\",\"link\":\"https:\\\/\\\/h000001.hotelscsm.panoram4.com\\\/ca\\\/room-services\\\/\",\"img\":\"https:\\\/\\\/hotelscsm.panoram4.com\\\/wp-content\\\/uploads\\\/panoram4-buttons\\\/default-room.jpg\",\"is_panorama\":true,\"display_title\":1,\"display_shadow\":0,\"parent_title\":\"Room Services\",\"children\":[]},\"child:Laundry & Dry Cleaning\":{\"key\":\"child:Laundry & Dry Cleaning\",\"title\":\"Laundry & Dry Cleaning\",\"action_type\":\"page\",\"content_type\":\"venta\",\"link\":\"https:\\\/\\\/h000001.hotelscsm.panoram4.com\\\/ca\\\/laundry-dry-cleaning\\\/\",\"img\":\"https:\\\/\\\/h000001.hotelscsm.panoram4.com\\\/wp-content\\\/uploads\\\/sites\\\/18\\\/2026\\\/05\\\/plancha.jpg\",\"is_panorama\":false,\"display_title\":1,\"display_shadow\":1,\"parent_title\":\"Room Services\",\"children\":[]},\"child:Experiences\":{\"key\":\"child:Experiences\",\"title\":\"Experiences\",\"action_type\":\"page\",\"content_type\":\"venta\",\"link\":\"https:\\\/\\\/h000001.hotelscsm.panoram4.com\\\/ca\\\/experiences\\\/\",\"img\":\"https:\\\/\\\/hotelscsm.panoram4.com\\\/wp-content\\\/uploads\\\/panoram4-buttons\\\/default-experiences.jpg\",\"is_panorama\":true,\"display_title\":1,\"display_shadow\":0,\"parent_title\":\"Experiences\",\"children\":[]},\"child:Ticketing\":{\"key\":\"child:Ticketing\",\"title\":\"Ticketing\",\"action_type\":\"external\",\"content_type\":\"informativo\",\"link\":\"https:\\\/\\\/s.ticketinhotel.es\\\/en\\\/web\\\/1\",\"img\":\"https:\\\/\\\/h000001.hotelscsm.panoram4.com\\\/wp-content\\\/uploads\\\/sites\\\/18\\\/2026\\\/05\\\/Ticketing.png\",\"is_panorama\":false,\"display_title\":0,\"display_shadow\":0,\"parent_title\":\"Experiences\",\"children\":[]}};\n            const isQRRequest = false;\n\n            window.handleTileClick = function(event, titleKey) {\n                if (isQRRequest || window.matchMedia('(max-width: 1024px)').matches) {\n                    return;\n                }\n\n                event.preventDefault();\n\n                const tile = kioskData[titleKey];\n                if (!tile || tile.action_type !== 'buttons') {\n                    return;\n                }\n\n                const wrap = document.getElementById('subWrapper');\n                const grid = document.getElementById('subGrid');\n                if (!wrap || !grid) {\n                    return;\n                }\n\n                if (wrap.classList.contains('active') && wrap.dataset.current === titleKey) {\n                    wrap.classList.remove('active');\n                    wrap.dataset.current = '';\n                    return;\n                }\n\n                if (wrap.classList.contains('active')) {\n                    wrap.classList.remove('active');\n                    window.setTimeout(function() {\n                        buildSubMenu(titleKey, wrap, grid);\n                    }, 320);\n                } else {\n                    buildSubMenu(titleKey, wrap, grid);\n                }\n            };\n\n            function buildSubMenu(titleKey, wrap, grid) {\n                const tile = kioskData[titleKey];\n                if (!tile) return;\n\n                grid.innerHTML = '';\n\n                (tile.children || []).forEach(function(childKey, index) {\n                    const child = kioskData[childKey];\n                    if (!child) return;\n\n                    const a = document.createElement('a');\n                    a.className = 'kt' + (parseInt(child.display_shadow, 10) === 1 ? ' kt-shadow' : '');\n                    a.href = child.link || '#';\n                    a.style.backgroundImage = child.img ? 'url(\"' + child.img.replace(\/\"\/g, '\\\\\"') + '\")' : '';\n                    a.style.transitionDelay = (index * 0.06) + 's';\n\n                    if (parseInt(child.display_title, 10) === 1) {\n\n                        const span = document.createElement('span');\n\n                        span.className =\n                            'kt-label' +\n                            (child.title === 'Information' ? ' is-information' : '');\n\n                        let translatedTitle = child.title || '';\n\n                        const originalChildren = document.querySelectorAll(\n                            '#kioskGrid .kt-child-tile'\n                        );\n\n                        for (let i = 0; i < originalChildren.length; i++) {\n\n                            if (\n                                originalChildren[i].getAttribute('data-child-key') === childKey\n                            ) {\n\n                                const originalLabel =\n                                    originalChildren[i].querySelector('.kt-label');\n\n                                if (originalLabel) {\n                                    translatedTitle = originalLabel.textContent;\n                                }\n\n                                break;\n                            }\n                        }\n\n                        span.textContent = translatedTitle;\n\n                        a.appendChild(span);\n                    }\n\n                    grid.appendChild(a);\n                });\n\n                if (tile.children && tile.children.length) {\n                    wrap.classList.add('active');\n                    wrap.dataset.current = titleKey;\n                    grid.scrollLeft = 0;\n\n                } else {\n                    wrap.classList.remove('active');\n                    wrap.dataset.current = '';\n                }\n            }\n\n            function scrollGrid(grid, amount) {\n                if (!grid) return;\n                if (typeof grid.scrollBy === 'function') {\n                    grid.scrollBy({ left: amount, behavior: 'smooth' });\n                } else {\n                    grid.scrollLeft += amount;\n                }\n            }\n\n            function setupHorizontalNavigation() {\n                const grid = document.getElementById('kioskGrid');\n                const prev = document.getElementById('kioskPrev');\n                const next = document.getElementById('kioskNext');\n                if (!grid || !prev || !next) return;\n\n                const step = 350;\n\n                \/\/ Clics r\u00e1pidos por si acaso\n                prev.addEventListener('click', function() { scrollGrid(grid, -step); });\n                next.addEventListener('click', function() { scrollGrid(grid, step); });\n\n                [prev, next].forEach(function(button) {\n                    button.addEventListener('keydown', function(event) {\n                        if (event.key === 'Enter' || event.key === ' ') {\n                            event.preventDefault();\n                            button.click();\n                        }\n                    });\n                });\n\n                let animationFrameId = null;\n                let currentSpeed = 0;\n                const acceleration = 0.8; \/\/ Controla la suavidad de arrancada y frenada\n\n                function startContinuousScroll(targetSpeed) {\n                    currentSpeed = targetSpeed;\n\n                    if (animationFrameId) return;\n\n                    function stepScroll() {\n                        \/\/ Movemos el scroll de forma fraccionada y fluida por frame\n                        if (currentSpeed !== 0) {\n                            grid.scrollLeft += currentSpeed;\n                            animationFrameId = window.requestAnimationFrame(stepScroll);\n                        } else {\n                            animationFrameId = null;\n                        }\n                    }\n\n                    animationFrameId = window.requestAnimationFrame(stepScroll);\n                }\n\n                function stopContinuousScroll() {\n                    currentSpeed = 0;\n                    if (animationFrameId) {\n                        window.cancelAnimationFrame(animationFrameId);\n                        animationFrameId = null;\n                    }\n                }\n\n                \/\/ Hover en flecha izquierda (velocidad negativa = izquierda)\n                prev.addEventListener('mouseenter', function() { startContinuousScroll(-12); }); \/\/ Cambia -6 por el n\u00famero que desees\n                prev.addEventListener('mouseleave', stopContinuousScroll);\n\n                \/\/ Hover en flecha derecha (velocidad positiva = derecha)\n                next.addEventListener('mouseenter', function() { startContinuousScroll(12); }); \/\/ Cambia 6 por el n\u00famero que desees\n                next.addEventListener('mouseleave', stopContinuousScroll);\n\n                \/\/ Soporte para rueda del rat\u00f3n de forma nativa\n                grid.addEventListener('wheel', function(event) {\n                    if (grid.scrollWidth > grid.clientWidth) {\n                        event.preventDefault();\n                        const delta = event.deltaX !== 0 ? event.deltaX : event.deltaY;\n                        grid.scrollLeft += delta;\n                    }\n                }, { passive: false });\n            }\n\n            function setupKeyboardNavigation() {\n\n                let selectedMainIndex = 0;\n                let selectedSubIndex = -1;\n                let navigationLevel = 'main';\n                let keyboardOwnedByCart = false;\n\n                function getMainTiles() {\n                    const grid = document.getElementById('kioskGrid');\n                    if (!grid) return [];\n\n                    return Array.from(\n                        grid.querySelectorAll('.kt:not(.kt-child-tile)')\n                    ).filter(function(tile) {\n                        return tile.offsetParent !== null;\n                    });\n                }\n\n                function getSubTiles() {\n                    const grid = document.getElementById('subGrid');\n                    if (!grid) return [];\n\n                    return Array.from(\n                        grid.querySelectorAll('.kt')\n                    );\n                }\n\n                \/*\n                * =========================================================\n                * SINCRONIZAR RAT\u00d3N \u2192 ESTADO INTERNO DEL MEN\u00da\n                * =========================================================\n                *\/\n                if (\n                    window.P4Keyboard &&\n                    typeof window.P4Keyboard.onSelectionChange === 'function'\n                ) {\n\n                    window.P4Keyboard.onSelectionChange(function(element) {\n\n                        const kioskApp = document.getElementById('kioskApp');\n\n                        if (!kioskApp || !element || !kioskApp.contains(element)) {\n                            return;\n                        }\n\n                        const subGrid = document.getElementById('subGrid');\n\n                        \/*\n                        * El elemento pertenece al submen\u00fa.\n                        *\/\n                        if (\n                            subGrid &&\n                            subGrid.contains(element)\n                        ) {\n\n                            const subTiles = getSubTiles();\n                            const index = subTiles.indexOf(element);\n\n                            if (index >= 0) {\n                                navigationLevel = 'sub';\n                                selectedSubIndex = index;\n                            }\n\n                            return;\n                        }\n\n                        \/*\n                        * El elemento pertenece al men\u00fa principal.\n                        *\/\n                        const mainTiles = getMainTiles();\n                        const index = mainTiles.indexOf(element);\n\n                        if (index >= 0) {\n                            navigationLevel = 'main';\n                            selectedMainIndex = index;\n                            selectedSubIndex = -1;\n                        }\n\n                    });\n                }\n\n                \/*\n                * Solo mostramos visualmente cu\u00e1l est\u00e1 seleccionado.\n                * NO hacemos focus().\n                *\/\n                function setSelectedTile(tile) {\n\n                    if (!tile) return;\n\n                    keyboardOwnedByCart = false;\n\n                    \/*\n                    * La selecci\u00f3n visual ahora la gestiona el sistema global.\n                    *\/\n                    if (\n                        window.P4Keyboard &&\n                        typeof window.P4Keyboard.setSelection === 'function'\n                    ) {\n                        window.P4Keyboard.setSelection(tile);\n                    } else {\n                        \/*\n                        * Fallback por si el JS global todav\u00eda no carg\u00f3.\n                        *\/\n                        document.querySelectorAll(\n                            '.keyboard-selected, .kiosk-keyboard-selected'\n                        ).forEach(function(el) {\n                            el.classList.remove('keyboard-selected');\n                            el.classList.remove('kiosk-keyboard-selected');\n                        });\n\n                        tile.classList.add('keyboard-selected');\n                    }\n\n                    const grid = tile.closest('.kiosk-grid');\n\n                    if (grid) {\n                        const tileLeft  = tile.offsetLeft;\n                        const tileRight = tileLeft + tile.offsetWidth;\n                        const viewLeft  = grid.scrollLeft;\n                        const viewRight = viewLeft + grid.clientWidth;\n\n                        if (tileLeft < viewLeft) {\n                            grid.scrollTo({\n                                left: Math.max(0, tileLeft - 20),\n                                behavior: 'smooth'\n                            });\n                        } else if (tileRight > viewRight) {\n                            grid.scrollTo({\n                                left: tileRight - grid.clientWidth + 20,\n                                behavior: 'smooth'\n                            });\n                        }\n                    }\n                }\n\n                function goToCart(){\n\n                    if(!window.P4CartKeyboard){\n                        return;\n                    }\n\n                    \/*\n                    * Guardamos exactamente el estado actual.\n                    *\/\n                    var returnLevel = navigationLevel;\n                    var returnMainIndex = selectedMainIndex;\n                    var returnSubIndex = selectedSubIndex;\n\n                    if(\n                        window.P4CartKeyboard.select(function(){\n\n                            \/*\n                            * El carrito devuelve el control al men\u00fa.\n                            *\/\n                            keyboardOwnedByCart = false;\n\n                            navigationLevel = returnLevel;\n                            selectedMainIndex = returnMainIndex;\n                            selectedSubIndex = returnSubIndex;\n\n                            if(returnLevel === 'main'){\n\n                                var mainTiles = getMainTiles();\n\n                                if(mainTiles[selectedMainIndex]){\n                                    setSelectedTile(\n                                        mainTiles[selectedMainIndex]\n                                    );\n                                }\n\n                                return;\n                            }\n\n                            if(returnLevel === 'sub'){\n\n                                var subTiles = getSubTiles();\n\n                                if(subTiles[selectedSubIndex]){\n                                    setSelectedTile(\n                                        subTiles[selectedSubIndex]\n                                    );\n                                }\n\n                                return;\n                            }\n\n                        })\n                    ){\n\n                        keyboardOwnedByCart = true;\n\n                        \/*\n                        * Quitamos inmediatamente el foco visual\n                        * del men\u00fa.\n                        *\/\n                        document.querySelectorAll(\n                            '.kt.keyboard-selected'\n                        ).forEach(function(el){\n\n                            el.classList.remove(\n                                'keyboard-selected'\n                            );\n\n                        });\n                    }\n                }\n\n                \/*\n                * Inicialmente seleccionamos el primer bot\u00f3n del men\u00fa principal.\n                *\/\n                function ensureMainSelection() {\n\n                    const mainTiles = getMainTiles();\n\n                    if (!mainTiles.length) {\n                        selectedMainIndex = -1;\n                        return;\n                    }\n\n                    if (\n                        selectedMainIndex < 0 ||\n                        selectedMainIndex >= mainTiles.length\n                    ) {\n                        selectedMainIndex = 0;\n                    }\n\n                    setSelectedTile(mainTiles[selectedMainIndex]);\n                }\n\n                \/*\n                * Busca el \u00edndice del padre actualmente abierto.\n                *\/\n                function getCurrentParentIndex() {\n\n                    const wrap = document.getElementById('subWrapper');\n\n                    if (!wrap || !wrap.classList.contains('active')) {\n                        return -1;\n                    }\n\n                    const titleKey = wrap.dataset.current;\n\n                    const mainTiles = getMainTiles();\n\n                    return mainTiles.findIndex(function(tile) {\n                        return tile.dataset.title === titleKey;\n                    });\n                }\n\n                function activateTile(tile) {\n\n                    if (!tile) return;\n\n                    \/*\n                    * Tile con submenu.\n                    *\/\n                    if (tile.classList.contains('kt-has-submenu')) {\n\n                        const titleKey = tile.dataset.title;\n\n                        window.handleTileClick(\n                            {\n                                preventDefault: function() {}\n                            },\n                            titleKey\n                        );\n\n                        return;\n                    }\n\n                    \/*\n                    * Tile normal.\n                    *\/\n                    const href = tile.getAttribute('href');\n\n                    if (href && href !== '#') {\n                        window.location.href = href;\n                    }\n                }\n\n                document.addEventListener('keydown', function(event) {\n\n                    \/*\n                    * Solo navegaci\u00f3n de teclado en desktop.\n                    * Tu CSS ya cambia el comportamiento en <=1024px.\n                    *\/\n                    if (window.matchMedia('(max-width: 1024px)').matches) {\n                        return;\n                    }\n\n                    if (keyboardOwnedByCart) {\n                        return;\n                    }\n\n                    if(window.P4CartKeyboardOpen){\n                        return;\n                    }\n\n                    const mainTiles = getMainTiles();\n\n                    if (!mainTiles.length) {\n                        return;\n                    }\n\n                    \/*\n                    * =========================================================\n                    * ENTER\n                    * =========================================================\n                    *\/\n                    if (event.key === 'Enter') {\n\n                        event.preventDefault();\n\n                        if (navigationLevel === 'main') {\n\n                            var tile = null;\n\n                            if (\n                                window.P4Keyboard &&\n                                typeof window.P4Keyboard.getSelection === 'function'\n                            ) {\n                                tile = window.P4Keyboard.getSelection();\n                            }\n\n                            \/*\n                            * Fallback al estado interno.\n                            *\/\n                            if (!tile) {\n                                tile = mainTiles[selectedMainIndex];\n                            }\n\n                            \/*\n                            * Nos aseguramos de que el seleccionado\n                            * realmente pertenece al men\u00fa principal.\n                            *\/\n                            if (\n                                !tile ||\n                                mainTiles.indexOf(tile) === -1\n                            ) {\n                                tile = mainTiles[selectedMainIndex];\n                            }\n\n                            if (!tile) return;\n\n                            activateTile(tile);\n\n                            return;\n\n                            } else {\n\n                            const subTiles = getSubTiles();\n                            var tile = null;\n\n                            if (\n                                window.P4Keyboard &&\n                                typeof window.P4Keyboard.getSelection === 'function'\n                            ) {\n                                tile = window.P4Keyboard.getSelection();\n                            }\n\n                            \/*\n                            * Fallback al estado interno.\n                            *\/\n                            if (!tile) {\n                                tile = subTiles[selectedSubIndex];\n                            }\n\n                            \/*\n                            * Verificamos que pertenece al submenu.\n                            *\/\n                            if (\n                                !tile ||\n                                subTiles.indexOf(tile) === -1\n                            ) {\n                                tile = subTiles[selectedSubIndex];\n                            }\n\n                            if (!tile) return;\n\n                            activateTile(tile);\n                            }\n\n                        return;\n                    }\n\n                    \/*\n                    * =========================================================\n                    * ESC\n                    * =========================================================\n                    *\/\n                    if (event.key === 'Escape') {\n\n                        if (navigationLevel === 'sub') {\n\n                            const wrap = document.getElementById('subWrapper');\n\n                            if (wrap) {\n                                wrap.classList.remove('active');\n                                wrap.dataset.current = '';\n                            }\n\n                            navigationLevel = 'main';\n\n                            const parentIndex = getCurrentParentIndex();\n\n                            if (parentIndex >= 0) {\n                                selectedMainIndex = parentIndex;\n                            }\n\n                            const parentTile = mainTiles[selectedMainIndex];\n\n                            setSelectedTile(parentTile);\n\n                            event.preventDefault();\n                        }\n\n                        return;\n                    }\n\n                    \/*\n                    * =========================================================\n                    * MEN\u00da PRINCIPAL\n                    * =========================================================\n                    *\/\n                    if (navigationLevel === 'main') {\n\n                        \/*\n                        * \u2190\n                        *\/\n                        if (event.key === 'ArrowLeft') {\n\n                            event.preventDefault();\n\n                            if (selectedMainIndex > 0) {\n                                selectedMainIndex--;\n                                setSelectedTile(mainTiles[selectedMainIndex]);\n                            }\n\n                            return;\n                        }\n\n                        \/*\n                        * \u2192\n                        *\/\n                        if (event.key === 'ArrowRight') {\n\n                            event.preventDefault();\n\n                            \/*\n                            * NO hacemos wrap-around.\n                            * Si ya estamos en el \u00faltimo, no ocurre nada.\n                            *\/\n                            if (selectedMainIndex < mainTiles.length - 1) {\n                                selectedMainIndex++;\n                                setSelectedTile(mainTiles[selectedMainIndex]);\n                            }\n\n                            return;\n                        }\n\n                        \/*\n                        * \u2193\n                        *\/\n                        if (event.key === 'ArrowDown') {\n                            return;\n                        }\n\n                        \/*\n                        * \u2191\n                        *\n                        * Si el submenu est\u00e1 abierto para el bot\u00f3n actualmente\n                        * seleccionado, entramos en \u00e9l.\n                        *\/\n                        if (event.key === 'ArrowUp') {\n\n                            const tile = mainTiles[selectedMainIndex];\n                            const wrap = document.getElementById('subWrapper');\n\n                            \/*\n                            * Si el tile tiene un submen\u00fa abierto,\n                            * \u2191 entra primero al submen\u00fa.\n                            *\/\n                            if (\n                                tile &&\n                                tile.classList.contains('kt-has-submenu') &&\n                                wrap &&\n                                wrap.classList.contains('active')\n                            ) {\n\n                                event.preventDefault();\n\n                                const subTiles = getSubTiles();\n\n                                if (subTiles.length > 0) {\n\n                                    navigationLevel = 'sub';\n                                    selectedSubIndex = 0;\n\n                                    setSelectedTile(subTiles[0]);\n                                }\n\n                                return;\n                            }\n\n                            \/*\n                            * Si no hay submen\u00fa arriba,\n                            * \u2191 va directamente al carrito.\n                            *\/\n                            event.preventDefault();\n\n                            goToCart();\n\n                            return;\n                        }\n                        return;\n                    }\n\n                    \/*\n                    * =========================================================\n                    * SUBMEN\u00da\n                    * =========================================================\n                    *\/\n                    const subTiles = getSubTiles();\n\n                    if (!subTiles.length) {\n                        navigationLevel = 'main';\n                        selectedSubIndex = -1;\n                        return;\n                    }\n\n                    \/*\n                    * \u2190\n                    *\/\n                    if (event.key === 'ArrowLeft') {\n\n                        event.preventDefault();\n\n                        if (selectedSubIndex > 0) {\n                            selectedSubIndex--;\n                            setSelectedTile(subTiles[selectedSubIndex]);\n                        }\n\n                        return;\n                    }\n\n                    \/*\n                    * \u2192\n                    *\/\n                    if (event.key === 'ArrowRight') {\n\n                        event.preventDefault();\n\n                        \/*\n                        * NO wrap-around.\n                        *\/\n                        if (selectedSubIndex < subTiles.length - 1) {\n                            selectedSubIndex++;\n                            setSelectedTile(subTiles[selectedSubIndex]);\n                        }\n\n                        return;\n                    }\n\n                    \/*\n                    * \u2191\n                    *\n                    * El carrito est\u00e1 por encima del submen\u00fa.\n                    *\/\n                    if (event.key === 'ArrowUp') {\n\n                        event.preventDefault();\n                        goToCart();\n                        return;\n                    }\n\n                    \/*\n                    * \u2191\n                    *\n                    * Volver al padre.\n                    *\/\n                    if (event.key === 'ArrowDown') {\n\n                        event.preventDefault();\n\n                        const parentIndex = getCurrentParentIndex();\n\n                        navigationLevel = 'main';\n\n                        if (parentIndex >= 0) {\n\n                            selectedMainIndex = parentIndex;\n\n                            const parentTile = mainTiles[selectedMainIndex];\n\n                            \/*\n                            * Quitar selecci\u00f3n de cualquier hijo.\n                            *\/\n                            document.querySelectorAll('#subGrid .keyboard-selected').forEach(function(el) {\n                                el.classList.remove('keyboard-selected');\n                            });\n\n                            \/*\n                            * Seleccionar nuevamente el padre.\n                            *\/\n                            setSelectedTile(parentTile);\n                        }\n\n                        return;\n                    }\n                });\n\n                \/*\n                * Selecci\u00f3n inicial.\n                *\/\n                ensureMainSelection();\n            }\n\n            document.addEventListener('DOMContentLoaded', function() {\n                setupHorizontalNavigation();\n                setupKeyboardNavigation();\n            });\n        })();\n        <\/script>\n        \n","protected":false},"excerpt":{"rendered":"","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"_kad_post_transparent":"","_kad_post_title":"","_kad_post_layout":"","_kad_post_sidebar_id":"","_kad_post_content_style":"","_kad_post_vertical_padding":"","_kad_post_feature":"","_kad_post_feature_position":"","_kad_post_header":false,"_kad_post_footer":false,"_kad_post_classname":"","footnotes":""},"class_list":["post-19","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/h000001.hotelscsm.panoram4.com\/ca\/wp-json\/wp\/v2\/pages\/19","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/h000001.hotelscsm.panoram4.com\/ca\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/h000001.hotelscsm.panoram4.com\/ca\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/h000001.hotelscsm.panoram4.com\/ca\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/h000001.hotelscsm.panoram4.com\/ca\/wp-json\/wp\/v2\/comments?post=19"}],"version-history":[{"count":6,"href":"https:\/\/h000001.hotelscsm.panoram4.com\/ca\/wp-json\/wp\/v2\/pages\/19\/revisions"}],"predecessor-version":[{"id":122,"href":"https:\/\/h000001.hotelscsm.panoram4.com\/ca\/wp-json\/wp\/v2\/pages\/19\/revisions\/122"}],"wp:attachment":[{"href":"https:\/\/h000001.hotelscsm.panoram4.com\/ca\/wp-json\/wp\/v2\/media?parent=19"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}