{"id":13,"date":"2026-05-27T07:04:03","date_gmt":"2026-05-27T07:04:03","guid":{"rendered":"https:\/\/i-please.com\/?page_id=13"},"modified":"2026-07-08T09:00:02","modified_gmt":"2026-07-08T09:00:02","slug":"demo-hotel-vall-de-ter","status":"publish","type":"page","link":"https:\/\/i-please.com\/","title":{"rendered":"Demo Hotel Vall de Ter"},"content":{"rendered":"\n<p class=\"wp-block-paragraph\">El que veu el client<\/p>\n\n\n\n<style>\n.iplease-guest-screen{\n  --ip-blue-950:#021126;\n  --ip-blue-900:#041b3d;\n  --ip-blue-800:#063b7a;\n  --ip-blue-700:#0757c8;\n  --ip-blue-600:#0b63e5;\n  --ip-blue-500:#178bff;\n  --ip-blue-300:#7cc4ff;\n  --ip-white:#ffffff;\n  --ip-soft:#f4f8ff;\n  --ip-border:#e4edf8;\n  --ip-text:#06172f;\n  --ip-muted:#627089;\n  --ip-green:#0b7a45;\n  --ip-red:#ba2b2b;\n  --ip-orange:#b85c00;\n  --ip-shadow:0 18px 45px rgba(4,27,61,.16);\n\n  width:100%;\n  min-height:100vh;\n  background:#edf4fb;\n  display:flex;\n  justify-content:center;\n  font-family:Arial, Helvetica, sans-serif;\n  color:var(--ip-text);\n}\n\n.iplease-guest-screen,\n.iplease-guest-screen *{\n  box-sizing:border-box;\n}\n\n.ipg-phone{\n  width:100%;\n  max-width:460px;\n  min-height:100vh;\n  background:#fff;\n  overflow:hidden;\n  position:relative;\n  box-shadow:0 0 45px rgba(4,27,61,.12);\n}\n\n.ipg-hero{\n  position:relative;\n  min-height:260px;\n  padding:18px 28px 78px;\n  color:white;\n  overflow:hidden;\n  background:\n    linear-gradient(90deg,rgba(2,18,45,.96) 0%,rgba(4,42,92,.84) 46%,rgba(4,92,175,.28) 100%),\n    radial-gradient(circle at 78% 18%,rgba(125,196,255,.42),transparent 30%),\n    linear-gradient(180deg,rgba(4,27,61,.12) 0%,rgba(4,27,61,.42) 100%),\n    url(\"https:\/\/i-please.com\/wp-content\/uploads\/2026\/05\/f-header-mount.webp\") center center\/cover no-repeat,\n    linear-gradient(155deg,#05152e 0%,#063b7a 52%,#1296ff 100%);\n}\n\n.ipg-hero:before{\n  content:\"\";\n  position:absolute;\n  inset:0;\n  background:\n    linear-gradient(145deg,transparent 0 48%,rgba(255,255,255,.08) 48.2% 49%,transparent 49.2%),\n    linear-gradient(160deg,transparent 0 55%,rgba(255,255,255,.1) 55.2% 56%,transparent 56.2%),\n    linear-gradient(18deg,transparent 0 58%,rgba(2,18,45,.25) 58.3% 100%);\n  opacity:.82;\n  pointer-events:none;\n}\n\n.ipg-hero:after{\n  content:\"\";\n  position:absolute;\n  left:0;\n  right:0;\n  bottom:0;\n  height:84px;\n  background:\n    linear-gradient(8deg,rgba(3,33,74,.66) 0 34%,transparent 34.5%),\n    linear-gradient(-10deg,rgba(0,77,140,.42) 0 45%,transparent 45.5%);\n  pointer-events:none;\n}\n\n.ipg-hero-top{\n  position:relative;\n  z-index:2;\n  display:flex;\n  justify-content:space-between;\n  align-items:flex-start;\n  gap:18px;\n}\n\n.ipg-hotel-logo{\n  display:flex;\n  flex-direction:column;\n  align-items:flex-start;\n  gap:4px;\n}\n\n.ipg-hotel-logo svg{\n  width:112px;\n  height:auto;\n  display:block;\n}\n\n.ipg-hotel-name{\n  font-size:23px;\n  letter-spacing:4px;\n  font-weight:700;\n  line-height:1;\n}\n\n.ipg-hotel-sub{\n  margin-top:6px;\n  font-size:12px;\n  letter-spacing:6px;\n  font-weight:500;\n  opacity:.9;\n}\n\n.ipg-lang{\n  display:flex;\n  align-items:center;\n  gap:8px;\n  background:rgba(2,18,45,.56);\n  border:1px solid rgba(255,255,255,.16);\n  padding:10px 13px;\n  border-radius:999px;\n  color:white;\n  font-size:13px;\n  line-height:1;\n  backdrop-filter:blur(8px);\n}\n\n.ipg-lang svg{\n  width:18px;\n  height:18px;\n  stroke:white;\n}\n\n.ipg-welcome{\n  position:relative;\n  z-index:2;\n  margin-top:30px;\n}\n\n.ipg-welcome-title{\n  font-size:31px;\n  line-height:1.08;\n  letter-spacing:-.5px;\n  margin:0;\n  font-weight:400;\n}\n\n.ipg-welcome-title strong{\n  display:block;\n  font-size:45px;\n  font-weight:800;\n  letter-spacing:-1.8px;\n}\n\n.ipg-subtitle{\n  margin:10px 0 0;\n  font-size:17px;\n  line-height:1.45;\n  opacity:.95;\n}\n\n.ipg-room-badge{\n  display:inline-flex;\n  align-items:center;\n  gap:8px;\n  margin-top:12px;\n  padding:8px 12px;\n  border-radius:999px;\n  background:rgba(255,255,255,.12);\n  border:1px solid rgba(255,255,255,.22);\n  color:#fff;\n  font-size:12px;\n  font-weight:600;\n  backdrop-filter:blur(8px);\n}\n\n.ipg-room-badge svg{\n  width:15px;\n  height:15px;\n  stroke:white;\n  fill:none;\n  stroke-width:2;\n}\n\n.ipg-small-brand{\n  position:absolute;\n  right:22px;\n  bottom:25px;\n  z-index:3;\n  display:flex;\n  align-items:center;\n  justify-content:center;\n  opacity:.98;\n}\n\n.ipg-small-brand img{\n  width:86px;\n  height:auto;\n  display:block;\n  filter:brightness(0) invert(1);\n}\n\n.ipg-main-card{\n  position:relative;\n  z-index:5;\n  margin:-22px 10px 0;\n  padding:22px 20px 0;\n  background:white;\n  border-radius:24px 24px 0 0;\n  box-shadow:0 -8px 28px rgba(4,27,61,.12);\n}\n\n.ipg-section-title{\n  margin:0 0 6px;\n  font-size:22px;\n  letter-spacing:-.2px;\n  font-weight:800;\n}\n\n.ipg-section-subtitle{\n  margin:0 0 16px;\n  color:var(--ip-muted);\n  font-size:15px;\n  line-height:1.45;\n}\n\n.ipg-grid{\n  display:grid;\n  grid-template-columns:repeat(2,1fr);\n  gap:10px;\n}\n\n.ipg-service{\n  min-height:116px;\n  border:1px solid var(--ip-border);\n  background:#fff;\n  border-radius:16px;\n  box-shadow:0 8px 18px rgba(4,27,61,.07);\n  padding:13px 9px 11px;\n  display:flex;\n  flex-direction:column;\n  justify-content:center;\n  align-items:center;\n  text-align:center;\n  cursor:pointer;\n  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;\n  -webkit-tap-highlight-color:transparent;\n}\n\n.ipg-service:hover,\n.ipg-service.active{\n  transform:translateY(-2px);\n  border-color:#bad8ff;\n  background:#f9fcff;\n  box-shadow:0 12px 24px rgba(4,86,200,.14);\n}\n\n.ipg-service svg{\n  width:40px;\n  height:40px;\n  stroke:var(--ip-blue-600);\n  stroke-width:1.7;\n  fill:none;\n  stroke-linecap:round;\n  stroke-linejoin:round;\n  margin-bottom:8px;\n}\n\n.ipg-service-title{\n  font-size:13px;\n  line-height:1.15;\n  font-weight:800;\n  color:#06172f;\n  min-height:30px;\n}\n\n.ipg-service-desc{\n  margin-top:5px;\n  font-size:11px;\n  line-height:1.22;\n  color:#627089;\n}\n\n.ipg-arrow{\n  margin-top:5px;\n  font-size:18px;\n  color:#06172f;\n  line-height:1;\n}\n\n.ipg-value-strip{\n  display:grid;\n  grid-template-columns:repeat(3,1fr);\n  gap:8px;\n  margin:16px 0 0;\n}\n\n.ipg-value{\n  background:#f5f9ff;\n  border:1px solid #e2edf9;\n  border-radius:13px;\n  padding:10px 7px;\n  text-align:center;\n}\n\n.ipg-value strong{\n  display:block;\n  font-size:15px;\n  color:#063b7a;\n  line-height:1;\n}\n\n.ipg-value span{\n  display:block;\n  margin-top:5px;\n  font-size:10.5px;\n  color:#627089;\n  line-height:1.2;\n}\n\n.ipg-panel{\n  margin-top:13px;\n  padding:14px;\n  border:1px solid #dce8f7;\n  background:#f7fbff;\n  border-radius:16px;\n  display:none;\n}\n\n.ipg-panel.visible{\n  display:block;\n}\n\n.ipg-panel-top{\n  display:flex;\n  gap:10px;\n  align-items:flex-start;\n  margin-bottom:8px;\n}\n\n.ipg-panel-icon{\n  width:38px;\n  height:38px;\n  flex:0 0 38px;\n  border-radius:13px;\n  background:linear-gradient(135deg,#0757c8,#178bff);\n  display:flex;\n  align-items:center;\n  justify-content:center;\n  color:white;\n  font-size:18px;\n  font-weight:800;\n}\n\n.ipg-panel h3{\n  margin:0 0 5px;\n  font-size:17px;\n  line-height:1.2;\n}\n\n.ipg-panel p{\n  margin:0 0 10px;\n  color:#627089;\n  font-size:13px;\n  line-height:1.45;\n}\n\n.ipg-panel select,\n.ipg-panel input,\n.ipg-panel textarea{\n  width:100%;\n  border:1px solid #d8e5f4;\n  border-radius:11px;\n  min-height:42px;\n  padding:10px 12px;\n  margin-bottom:8px;\n  font-family:Arial, Helvetica, sans-serif;\n  font-size:13px;\n  color:#06172f;\n  outline:none;\n  background:white;\n}\n\n.ipg-panel textarea{\n  min-height:76px;\n  resize:vertical;\n}\n\n.ipg-panel button{\n  width:100%;\n  height:43px;\n  border:0;\n  border-radius:12px;\n  background:linear-gradient(135deg,#0757c8,#178bff);\n  color:white;\n  font-weight:800;\n  cursor:pointer;\n}\n\n.ipg-panel button:disabled{\n  opacity:.48;\n  cursor:not-allowed;\n}\n\n.ipg-info-result{\n  display:none;\n  margin:0 0 9px;\n  padding:11px;\n  border-radius:12px;\n  background:#fff;\n  border:1px solid #d8e5f4;\n  color:#34516d;\n  font-size:13px;\n  line-height:1.45;\n}\n\n.ipg-info-result.visible{\n  display:block;\n}\n\n.ipg-note{\n  margin-top:10px;\n  padding:10px;\n  border-radius:11px;\n  background:#eef7ff;\n  color:#34516d;\n  font-size:12px;\n  line-height:1.4;\n}\n\n.ipg-success{\n  display:none;\n  margin-top:10px;\n  padding:12px;\n  border-radius:12px;\n  background:#ecfdf5;\n  border:1px solid #b7efd4;\n  color:#075b37;\n  font-size:13px;\n  line-height:1.45;\n}\n\n.ipg-success.visible{\n  display:block;\n}\n\n.ipg-history{\n  margin-top:14px;\n  padding:14px;\n  border-radius:16px;\n  background:#ffffff;\n  border:1px solid #e2edf9;\n  box-shadow:0 8px 18px rgba(4,27,61,.05);\n  display:none;\n}\n\n.ipg-history.visible{\n  display:block;\n}\n\n.ipg-history-head{\n  display:flex;\n  justify-content:space-between;\n  align-items:flex-start;\n  gap:12px;\n  margin-bottom:10px;\n}\n\n.ipg-history-head h3{\n  margin:0;\n  font-size:16px;\n  line-height:1.2;\n}\n\n.ipg-history-head span{\n  color:#627089;\n  font-size:12px;\n  white-space:nowrap;\n}\n\n.ipg-history-list{\n  display:grid;\n  gap:8px;\n}\n\n.ipg-history-item{\n  border:1px solid #e6eef8;\n  background:#f8fbff;\n  border-radius:13px;\n  padding:10px;\n}\n\n.ipg-history-item strong{\n  display:block;\n  font-size:13px;\n  line-height:1.25;\n}\n\n.ipg-history-item p{\n  margin:5px 0 0;\n  color:#627089;\n  font-size:12px;\n  line-height:1.35;\n}\n\n.ipg-history-meta{\n  display:flex;\n  justify-content:space-between;\n  align-items:center;\n  gap:8px;\n  margin-top:8px;\n  font-size:11px;\n  color:#7b8798;\n}\n\n.ipg-status{\n  display:inline-flex;\n  align-items:center;\n  justify-content:center;\n  border-radius:999px;\n  padding:4px 7px;\n  font-size:10.5px;\n  font-weight:800;\n  background:#fff4d8;\n  color:#8a4a00;\n}\n\n.ipg-chat-box{\n  margin-top:14px;\n  background:linear-gradient(135deg,#0757c8 0%,#199dff 100%);\n  border-radius:16px;\n  padding:13px 12px 12px;\n  color:white;\n  box-shadow:0 12px 24px rgba(7,87,200,.25);\n}\n\n.ipg-chat-head{\n  display:flex;\n  align-items:center;\n  gap:10px;\n  margin-bottom:10px;\n}\n\n.ipg-bot{\n  width:40px;\n  height:40px;\n  flex:0 0 40px;\n  border-radius:50%;\n  background:white;\n  display:flex;\n  align-items:center;\n  justify-content:center;\n  overflow:hidden;\n}\n\n.ipg-bot img{\n  width:30px;\n  height:30px;\n  object-fit:contain;\n  display:block;\n}\n\n.ipg-chat-title{\n  font-size:15px;\n  font-weight:700;\n  line-height:1.2;\n}\n\n.ipg-chat-title span{\n  display:block;\n  font-size:12px;\n  font-weight:400;\n  opacity:.82;\n  margin-top:4px;\n}\n\n.ipg-chat-form{\n  display:flex;\n  gap:8px;\n  align-items:center;\n}\n\n.ipg-chat-form input{\n  flex:1;\n  height:40px;\n  border:0;\n  outline:0;\n  border-radius:999px;\n  padding:0 16px;\n  color:#06172f;\n  font-size:14px;\n  background:white;\n}\n\n.ipg-send{\n  width:42px;\n  height:42px;\n  border:0;\n  border-radius:50%;\n  background:#031a3b;\n  display:flex;\n  align-items:center;\n  justify-content:center;\n  cursor:pointer;\n  flex:0 0 42px;\n}\n\n.ipg-send svg{\n  width:20px;\n  height:20px;\n  stroke:white;\n}\n\n.ipg-privacy{\n  display:flex;\n  align-items:center;\n  justify-content:center;\n  gap:12px;\n  padding:12px 0 13px;\n  color:#68758b;\n  font-size:12px;\n  line-height:1.2;\n}\n\n.ipg-privacy-item{\n  display:flex;\n  align-items:center;\n  gap:6px;\n  white-space:nowrap;\n}\n\n.ipg-privacy-item svg{\n  width:14px;\n  height:14px;\n  stroke:#68758b;\n}\n\n.ipg-separator{\n  width:1px;\n  height:20px;\n  background:#d6dee9;\n}\n\n.ipg-footer{\n  background:linear-gradient(135deg,#052653 0%,#063f82 55%,#021a3d 100%);\n  color:white;\n  padding:15px 22px 17px;\n  border-radius:22px 22px 0 0;\n  display:grid;\n  grid-template-columns:1fr 1fr;\n  gap:14px;\n  align-items:center;\n}\n\n.ipg-footer-block{\n  display:flex;\n  align-items:center;\n  gap:10px;\n}\n\n.ipg-footer svg{\n  width:39px;\n  height:39px;\n  stroke:rgba(255,255,255,.72);\n  fill:none;\n  stroke-width:1.4;\n  flex:0 0 39px;\n}\n\n.ipg-footer p{\n  margin:0;\n  font-size:11px;\n  line-height:1.35;\n  opacity:.82;\n}\n\n.ipg-footer strong{\n  display:block;\n  font-size:14px;\n  line-height:1.3;\n  opacity:1;\n}\n\n@media(max-width:380px){\n  .ipg-hero{\n    padding-left:23px;\n    padding-right:23px;\n  }\n\n  .ipg-welcome-title{\n    font-size:28px;\n  }\n\n  .ipg-welcome-title strong{\n    font-size:39px;\n  }\n\n  .ipg-grid{\n    gap:8px;\n  }\n\n  .ipg-service{\n    min-height:108px;\n    padding-left:7px;\n    padding-right:7px;\n  }\n\n  .ipg-service svg{\n    width:36px;\n    height:36px;\n  }\n\n  .ipg-service-title{\n    font-size:12px;\n  }\n\n  .ipg-service-desc{\n    font-size:10.5px;\n  }\n\n  .ipg-value-strip{\n    gap:6px;\n  }\n\n  .ipg-value{\n    padding-left:5px;\n    padding-right:5px;\n  }\n\n  .ipg-value span{\n    font-size:10px;\n  }\n\n  .ipg-footer{\n    padding-left:18px;\n    padding-right:18px;\n  }\n\n  .ipg-privacy{\n    gap:8px;\n    font-size:11px;\n  }\n\n  .ipg-small-brand img{\n    width:76px;\n  }\n}\n<\/style>\n\n<section class=\"iplease-guest-screen\">\n  <div class=\"ipg-phone\">\n\n    <header class=\"ipg-hero\">\n\n      <div class=\"ipg-hero-top\">\n\n        <div class=\"ipg-hotel-logo\" aria-label=\"Hotel Vall del Ter\">\n          <svg viewBox=\"0 0 190 95\" aria-hidden=\"true\">\n            <path d=\"M26 45 L62 15 L91 45\" stroke=\"white\" stroke-width=\"4\" fill=\"none\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><\/path>\n            <path d=\"M70 45 L112 8 L158 45\" stroke=\"white\" stroke-width=\"4\" fill=\"none\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><\/path>\n            <path d=\"M42 34 L50 28 L57 35\" stroke=\"white\" stroke-width=\"3\" fill=\"none\" stroke-linecap=\"round\"><\/path>\n            <path d=\"M96 27 L104 20 L113 30\" stroke=\"white\" stroke-width=\"3\" fill=\"none\" stroke-linecap=\"round\"><\/path>\n          <\/svg>\n          <div class=\"ipg-hotel-name\">VALL DEL TER<\/div>\n          <div class=\"ipg-hotel-sub\">RIPOLL\u00c8S<\/div>\n        <\/div>\n\n        <div class=\"ipg-lang\">\n          <svg viewBox=\"0 0 24 24\" fill=\"none\">\n            <circle cx=\"12\" cy=\"12\" r=\"9\"><\/circle>\n            <path d=\"M3 12h18\"><\/path>\n            <path d=\"M12 3c3 3 3 15 0 18\"><\/path>\n            <path d=\"M12 3c-3-3-3 15 0 18\"><\/path>\n          <\/svg>\n          Catal\u00e0\n        <\/div>\n\n      <\/div>\n\n      <div class=\"ipg-welcome\">\n        <h1 class=\"ipg-welcome-title\">\n          Hola! S\u00f3c el teu\n          <strong>i-please<\/strong>\n        <\/h1>\n\n        <p class=\"ipg-subtitle\">La recepci\u00f3 digital de l\u2019Hotel Vall del Ter.<\/p>\n        <p class=\"ipg-subtitle\">Demana, informa\u2019t, reserva o avisa sense trucades ni esperes.<\/p>\n\n        <div class=\"ipg-room-badge\">\n          <svg viewBox=\"0 0 24 24\">\n            <rect x=\"4\" y=\"4\" width=\"16\" height=\"16\" rx=\"4\"><\/rect>\n            <path d=\"M9 9h6\"><\/path>\n            <path d=\"M9 13h6\"><\/path>\n          <\/svg>\n          <span id=\"ipgRoomVisible\">Habitaci\u00f3 204 \u00b7 Estada activa<\/span>\n        <\/div>\n      <\/div>\n\n      <div class=\"ipg-small-brand\">\n        <img decoding=\"async\" src=\"https:\/\/i-please.com\/wp-content\/uploads\/2026\/05\/i-please_logo10.png\" alt=\"i-please Smart Guest Assistant\">\n      <\/div>\n\n    <\/header>\n\n    <main class=\"ipg-main-card\">\n\n      <h2 class=\"ipg-section-title\">En qu\u00e8 et podem ajudar?<\/h2>\n      <p class=\"ipg-section-subtitle\">Tria una \u00e0rea. La recepci\u00f3 rebr\u00e0 la petici\u00f3 amb la teva habitaci\u00f3 i el servei sol\u00b7licitat.<\/p>\n\n      <section class=\"ipg-grid\">\n\n        <button class=\"ipg-service\" type=\"button\" data-service=\"necessito\">\n          <svg viewBox=\"0 0 64 64\">\n            <path d=\"M16 16h30a8 8 0 0 1 0 16H16a8 8 0 0 1 0-16z\"><\/path>\n            <path d=\"M16 32h34a8 8 0 0 1 0 16H16a8 8 0 0 1 0-16z\"><\/path>\n            <path d=\"M16 24h31\"><\/path>\n            <path d=\"M16 40h35\"><\/path>\n          <\/svg>\n          <span class=\"ipg-service-title\">Necessito<br>alguna cosa<\/span>\n          <span class=\"ipg-service-desc\">Tovalloles, manta, neteja&#8230;<\/span>\n          <span class=\"ipg-arrow\">\u203a<\/span>\n        <\/button>\n\n        <button class=\"ipg-service\" type=\"button\" data-service=\"incidencia\">\n          <svg viewBox=\"0 0 64 64\">\n            <path d=\"M22 46l20-20\"><\/path>\n            <path d=\"M39 15a10 10 0 0 0 10 10L26 48a9 9 0 0 1-11-11l23-23z\"><\/path>\n            <path d=\"M48 48l6 6\"><\/path>\n          <\/svg>\n          <span class=\"ipg-service-title\">Tinc una<br>incid\u00e8ncia<\/span>\n          <span class=\"ipg-service-desc\">Aigua, calefacci\u00f3, clau&#8230;<\/span>\n          <span class=\"ipg-arrow\">\u203a<\/span>\n        <\/button>\n\n        <button class=\"ipg-service\" type=\"button\" data-service=\"hotel\">\n          <svg viewBox=\"0 0 64 64\">\n            <circle cx=\"32\" cy=\"32\" r=\"22\"><\/circle>\n            <path d=\"M32 28v17\"><\/path>\n            <path d=\"M32 19h.1\"><\/path>\n          <\/svg>\n          <span class=\"ipg-service-title\">Informaci\u00f3<br>de l\u2019hotel<\/span>\n          <span class=\"ipg-service-desc\">WiFi, esmorzar, check-out&#8230;<\/span>\n          <span class=\"ipg-arrow\">\u203a<\/span>\n        <\/button>\n\n        <button class=\"ipg-service\" type=\"button\" data-service=\"extras\">\n          <svg viewBox=\"0 0 64 64\">\n            <path d=\"M14 42h36\"><\/path>\n            <path d=\"M18 42c0-14 10-24 20-24s20 10 20 24\"><\/path>\n            <path d=\"M36 14a4 4 0 1 0-8 0\"><\/path>\n            <path d=\"M10 48h48\"><\/path>\n          <\/svg>\n          <span class=\"ipg-service-title\">Reserves<br>i extres<\/span>\n          <span class=\"ipg-service-desc\">Restaurant, taxi, late check-out&#8230;<\/span>\n          <span class=\"ipg-arrow\">\u203a<\/span>\n        <\/button>\n\n        <button class=\"ipg-service\" type=\"button\" data-service=\"ripolles\">\n          <svg viewBox=\"0 0 64 64\">\n            <path d=\"M8 48l18-28 13 20 8-12 9 20H8z\"><\/path>\n            <path d=\"M39 40l8 8\"><\/path>\n            <path d=\"M48 15c7 2 9 9 4 15\"><\/path>\n          <\/svg>\n          <span class=\"ipg-service-title\">Qu\u00e8 fer<br>a prop<\/span>\n          <span class=\"ipg-service-desc\">Rutes, pobles, restaurants&#8230;<\/span>\n          <span class=\"ipg-arrow\">\u203a<\/span>\n        <\/button>\n\n        <button class=\"ipg-service\" type=\"button\" data-service=\"valoracio\">\n          <svg viewBox=\"0 0 64 64\">\n            <path d=\"M32 10l6.6 13.4l14.8 2.1l-10.7 10.4l2.5 14.7L32 43.6l-13.2 7l2.5-14.7L10.6 25.5l14.8-2.1L32 10z\"><\/path>\n          <\/svg>\n          <span class=\"ipg-service-title\">Com va<br>l\u2019estada?<\/span>\n          <span class=\"ipg-service-desc\">Valoraci\u00f3 o ajuda abans de marxar<\/span>\n          <span class=\"ipg-arrow\">\u203a<\/span>\n        <\/button>\n\n      <\/section>\n\n      <section class=\"ipg-value-strip\">\n        <div class=\"ipg-value\">\n          <strong>24\/7<\/strong>\n          <span>Servei digital<\/span>\n        <\/div>\n        <div class=\"ipg-value\">\n          <strong>QR<\/strong>\n          <span>Sense instal\u00b7lar res<\/span>\n        <\/div>\n        <div class=\"ipg-value\">\n          <strong id=\"ipgRoomMini\">204<\/strong>\n          <span>Habitaci\u00f3 vinculada<\/span>\n        <\/div>\n      <\/section>\n\n      <section id=\"ipgPanel\" class=\"ipg-panel\">\n        <div class=\"ipg-panel-top\">\n          <div class=\"ipg-panel-icon\" id=\"ipgPanelIcon\">i<\/div>\n          <div>\n            <h3 id=\"ipgPanelTitle\">Enviar una petici\u00f3<\/h3>\n            <p id=\"ipgPanelText\">La recepci\u00f3 rebr\u00e0 la teva sol\u00b7licitud.<\/p>\n          <\/div>\n        <\/div>\n\n        <select id=\"ipgRequestType\">\n          <option value=\"\">Selecciona una opci\u00f3<\/option>\n        <\/select>\n\n        <div id=\"ipgInfoResult\" class=\"ipg-info-result\"><\/div>\n\n        <input id=\"ipgRequestDetail\" type=\"text\" placeholder=\"Hora, quantitat o detall addicional\">\n\n        <textarea id=\"ipgRequestMessage\" placeholder=\"Escriu aqu\u00ed la teva petici\u00f3...\"><\/textarea>\n\n        <button type=\"button\" id=\"ipgSendRequest\">Enviar a recepci\u00f3<\/button>\n\n        <div class=\"ipg-note\" id=\"ipgPanelNote\">\n          Les peticions amb cost queden pendents de confirmaci\u00f3 per part de recepci\u00f3.\n        <\/div>\n\n        <div id=\"ipgSuccess\" class=\"ipg-success\"><\/div>\n      <\/section>\n\n      <section class=\"ipg-history\" id=\"ipgHistory\">\n        <div class=\"ipg-history-head\">\n          <h3>Les teves \u00faltimes peticions<\/h3>\n          <span>Habitaci\u00f3 204<\/span>\n        <\/div>\n        <div class=\"ipg-history-list\" id=\"ipgHistoryList\"><\/div>\n      <\/section>\n\n      <section class=\"ipg-chat-box\">\n        <div class=\"ipg-chat-head\">\n          <div class=\"ipg-bot\">\n            <img decoding=\"async\" src=\"https:\/\/i-please.com\/wp-content\/uploads\/2026\/05\/i-please-logo-ICO.png\" alt=\"i-please\">\n          <\/div>\n          <div class=\"ipg-chat-title\">\n            O escriu directament a recepci\u00f3\n            <span>La consulta quedar\u00e0 vinculada a la teva habitaci\u00f3.<\/span>\n          <\/div>\n        <\/div>\n\n        <div class=\"ipg-chat-form\">\n          <input id=\"ipgQuickMessage\" type=\"text\" placeholder=\"Escriu aqu\u00ed...\">\n          <button class=\"ipg-send\" type=\"button\" id=\"ipgQuickSend\" aria-label=\"Enviar consulta\">\n            <svg viewBox=\"0 0 24 24\" fill=\"none\">\n              <path d=\"M22 2L11 13\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><\/path>\n              <path d=\"M22 2L15 22L11 13L2 9L22 2z\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><\/path>\n            <\/svg>\n          <\/button>\n        <\/div>\n      <\/section>\n\n      <section class=\"ipg-privacy\">\n        <div class=\"ipg-privacy-item\">\n          <svg viewBox=\"0 0 24 24\" fill=\"none\">\n            <rect x=\"5\" y=\"10\" width=\"14\" height=\"10\" rx=\"2\"><\/rect>\n            <path d=\"M8 10V7a4 4 0 0 1 8 0v3\"><\/path>\n          <\/svg>\n          Canal privat.\n        <\/div>\n\n        <div class=\"ipg-separator\"><\/div>\n\n        <div class=\"ipg-privacy-item\">\n          <svg viewBox=\"0 0 24 24\" fill=\"none\">\n            <path d=\"M12 3l8 4v5c0 5-3.5 8-8 9c-4.5-1-8-4-8-9V7l8-4z\"><\/path>\n            <path d=\"M9 12l2 2l4-5\"><\/path>\n          <\/svg>\n          Sense instal\u00b7laci\u00f3.\n        <\/div>\n      <\/section>\n\n    <\/main>\n\n    <footer class=\"ipg-footer\">\n      <div class=\"ipg-footer-block\">\n        <svg viewBox=\"0 0 64 64\">\n          <path d=\"M14 56V20l18-12l18 12v36\"><\/path>\n          <path d=\"M22 56V42h8v14\"><\/path>\n          <path d=\"M22 25h6\"><\/path>\n          <path d=\"M36 25h6\"><\/path>\n          <path d=\"M22 34h6\"><\/path>\n          <path d=\"M36 34h6\"><\/path>\n          <path d=\"M10 56h44\"><\/path>\n        <\/svg>\n        <div>\n          <p>Gr\u00e0cies per triar<\/p>\n          <strong>Hotel Vall del Ter<\/strong>\n          <p>Esperem que gaudeixis de la teva estada!<\/p>\n        <\/div>\n      <\/div>\n\n      <div class=\"ipg-footer-block\">\n        <svg viewBox=\"0 0 64 64\">\n          <path d=\"M14 28c10-9 26-9 36 0\"><\/path>\n          <path d=\"M22 38c6-5 14-5 20 0\"><\/path>\n          <path d=\"M30 48h4\"><\/path>\n        <\/svg>\n        <div>\n          <strong>WiFi: VallDelTer<\/strong>\n          <p>Clau: benvinguts<\/p>\n        <\/div>\n      <\/div>\n    <\/footer>\n\n  <\/div>\n<\/section>\n\n<script>\n(function(){\n  const STORAGE_KEY = 'iplease_guest_requests_v1';\n  const ROOM_NUMBER = '204';\n\n  const roomVisible = document.getElementById('ipgRoomVisible');\n  const roomMini = document.getElementById('ipgRoomMini');\n\n  if(roomVisible){\n    roomVisible.textContent = 'Habitaci\u00f3 ' + ROOM_NUMBER + ' \u00b7 Estada activa';\n  }\n\n  if(roomMini){\n    roomMini.textContent = ROOM_NUMBER;\n  }\n\n  const services = {\n    necessito:{\n      icon:'\u2713',\n      type:'Servei intern',\n      status:'Pendent',\n      priority:'Normal',\n      title:'Necessito alguna cosa',\n      text:'Demana serveis b\u00e0sics de l\u2019habitaci\u00f3. Recepci\u00f3 ho rebr\u00e0 amb el n\u00famero d\u2019habitaci\u00f3.',\n      detailPlaceholder:'Quantitat, moment o detall addicional',\n      messagePlaceholder:'Exemple: Si pot ser, abans de sopar.',\n      note:'Aquestes peticions s\u00f3n serveis habituals de l\u2019habitaci\u00f3.',\n      options:[\n        '2 tovalloles extra',\n        '1 manta extra',\n        '1 coix\u00ed extra',\n        'Reposar amenities',\n        'Neteja de l\u2019habitaci\u00f3',\n        'Aigua per a l\u2019habitaci\u00f3',\n        'Assecador',\n        'Contactar amb recepci\u00f3'\n      ]\n    },\n    incidencia:{\n      icon:'!',\n      type:'Incid\u00e8ncia',\n      status:'Revisi\u00f3 priorit\u00e0ria',\n      priority:'Alta',\n      title:'Tinc una incid\u00e8ncia',\n      text:'Explica qu\u00e8 passa perqu\u00e8 recepci\u00f3 pugui revisar-ho.',\n      detailPlaceholder:'On passa? Habitaci\u00f3, bany, porta, calefacci\u00f3...',\n      messagePlaceholder:'Explica breument la incid\u00e8ncia.',\n      note:'Les incid\u00e8ncies es mostren amb prioritat alta a recepci\u00f3.',\n      options:[\n        'No funciona la calefacci\u00f3',\n        'No surt aigua calenta',\n        'Problema amb la clau',\n        'Problema amb el WiFi',\n        'Soroll o mol\u00e8sties',\n        'Alguna cosa est\u00e0 trencada',\n        'Neteja incorrecta',\n        'Altres incid\u00e8ncies'\n      ]\n    },\n    hotel:{\n      icon:'i',\n      type:'Informaci\u00f3',\n      status:'Consulta',\n      priority:'Baixa',\n      title:'Informaci\u00f3 de l\u2019hotel',\n      text:'Consulta la informaci\u00f3 b\u00e0sica de l\u2019hotel.',\n      detailPlaceholder:'Vols preguntar alguna cosa m\u00e9s?',\n      messagePlaceholder:'Escriu una consulta si necessites m\u00e9s informaci\u00f3.',\n      note:'La informaci\u00f3 principal est\u00e0 disponible en qualsevol moment.',\n      options:[\n        'WiFi',\n        'Horari esmorzar',\n        'Hora de check-out',\n        'P\u00e0rquing',\n        'Normes de l\u2019hotel',\n        'Horari de recepci\u00f3',\n        'Com arribar',\n        'Altres consultes'\n      ],\n      info:{\n        'WiFi':'WiFi: VallDelTer \u00b7 Clau: benvinguts',\n        'Horari esmorzar':'Esmorzar de 08:00 a 10:30.',\n        'Hora de check-out':'Check-out fins a les 11:00. Late check-out subjecte a disponibilitat.',\n        'P\u00e0rquing':'P\u00e0rquing exterior gratu\u00eft segons disponibilitat.',\n        'Normes de l\u2019hotel':'No es permet fumar a les habitacions. Respecta el descans dels altres hostes a partir de les 23:00.',\n        'Horari de recepci\u00f3':'Recepci\u00f3 disponible de 08:00 a 22:00.',\n        'Com arribar':'Recepci\u00f3 pot enviar-te la ubicaci\u00f3 exacta si ho necessites.',\n        'Altres consultes':'Escriu la teva consulta i recepci\u00f3 la revisar\u00e0.'\n      }\n    },\n    extras:{\n      icon:'\u20ac',\n      type:'Reserva \/ Extra',\n      status:'Pendent de confirmaci\u00f3',\n      priority:'Confirmaci\u00f3',\n      title:'Reserves i extres',\n      text:'Reserva serveis o demana extres. Recepci\u00f3 confirmar\u00e0 disponibilitat.',\n      detailPlaceholder:'Hora, persones, dia o prefer\u00e8ncia',\n      messagePlaceholder:'Exemple: Taxi dem\u00e0 a les 09:00 per a 2 persones.',\n      note:'Les peticions amb cost o disponibilitat queden pendents de confirmaci\u00f3.',\n      options:[\n        'Reservar restaurant',\n        'Taxi',\n        'Late check-out',\n        'Cava o beguda a l\u2019habitaci\u00f3',\n        'Esmorzar extra',\n        'P\u00edcnic per excursi\u00f3',\n        'Activitat local',\n        'Altres extres'\n      ]\n    },\n    ripolles:{\n      icon:'\u2301',\n      type:'Recomanaci\u00f3 local',\n      status:'Pendent',\n      priority:'Normal',\n      title:'Qu\u00e8 fer a prop',\n      text:'Demana recomanacions locals durant la teva estada.',\n      detailPlaceholder:'Adults, nens, temps disponible o prefer\u00e8ncia',\n      messagePlaceholder:'Exemple: Volem una ruta f\u00e0cil per fer dem\u00e0 al mat\u00ed.',\n      note:'Recepci\u00f3 revisar\u00e0 la teva petici\u00f3 i et recomanar\u00e0 una opci\u00f3 adequada.',\n      options:[\n        'Ruta f\u00e0cil',\n        'Activitat amb nens',\n        'Restaurant proper',\n        'Qu\u00e8 fer si plou',\n        'Pobles per visitar',\n        'Miradors i natura',\n        'Activitats culturals',\n        'Altres recomanacions'\n      ]\n    },\n    valoracio:{\n      icon:'\u2605',\n      type:'Satisfacci\u00f3',\n      status:'Seguiment',\n      priority:'Important',\n      title:'Com va l\u2019estada?',\n      text:'Explica com est\u00e0 anant la teva estada o demana ajuda abans de marxar.',\n      detailPlaceholder:'Vols que recepci\u00f3 et contacti?',\n      messagePlaceholder:'Explica qu\u00e8 podem millorar o qu\u00e8 t\u2019est\u00e0 agradant.',\n      note:'La teva opini\u00f3 ajuda l\u2019hotel a millorar el servei durant l\u2019estada.',\n      options:[\n        'Tot va perfecte',\n        'Hi ha una cosa a millorar',\n        'Vull parlar amb recepci\u00f3',\n        'He tingut una incid\u00e8ncia',\n        'Excel\u00b7lent estada',\n        'Preparar check-out',\n        'Deixar comentari intern'\n      ]\n    }\n  };\n\n  const panel = document.getElementById('ipgPanel');\n  const panelIcon = document.getElementById('ipgPanelIcon');\n  const title = document.getElementById('ipgPanelTitle');\n  const text = document.getElementById('ipgPanelText');\n  const select = document.getElementById('ipgRequestType');\n  const detail = document.getElementById('ipgRequestDetail');\n  const message = document.getElementById('ipgRequestMessage');\n  const note = document.getElementById('ipgPanelNote');\n  const success = document.getElementById('ipgSuccess');\n  const infoResult = document.getElementById('ipgInfoResult');\n  const history = document.getElementById('ipgHistory');\n  const historyList = document.getElementById('ipgHistoryList');\n\n  let currentKey = '';\n\n  document.querySelectorAll('.ipg-service').forEach(btn=>{\n    btn.addEventListener('click',()=>{\n      document.querySelectorAll('.ipg-service').forEach(b=>b.classList.remove('active'));\n      btn.classList.add('active');\n\n      currentKey = btn.getAttribute('data-service');\n      const data = services[currentKey];\n\n      panelIcon.textContent = data.icon;\n      title.textContent = data.title;\n      text.textContent = data.text;\n      detail.placeholder = data.detailPlaceholder;\n      message.placeholder = data.messagePlaceholder;\n      note.textContent = data.note;\n\n      select.innerHTML = '<option value=\"\">Selecciona una opci\u00f3<\/option>';\n      data.options.forEach(opt=>{\n        const option = document.createElement('option');\n        option.value = opt;\n        option.textContent = opt;\n        select.appendChild(option);\n      });\n\n      detail.value = '';\n      message.value = '';\n      infoResult.classList.remove('visible');\n      infoResult.innerHTML = '';\n      success.classList.remove('visible');\n      success.textContent = '';\n\n      panel.classList.add('visible');\n      panel.scrollIntoView({behavior:'smooth',block:'nearest'});\n    });\n  });\n\n  select.addEventListener('change',()=>{\n    const data = services[currentKey];\n    const selected = select.value;\n\n    infoResult.classList.remove('visible');\n    infoResult.innerHTML = '';\n\n    if(data && data.info && data.info[selected]){\n      infoResult.innerHTML = '<strong>Resposta r\u00e0pida:<\/strong><br>' + escapeHtml(data.info[selected]);\n      infoResult.classList.add('visible');\n    }\n  });\n\n  document.getElementById('ipgSendRequest').addEventListener('click',()=>{\n    const req = buildRequest();\n\n    if(!isValidRequest(req)){\n      success.innerHTML =\n        '<strong>Falta informaci\u00f3.<\/strong><br>' +\n        'Selecciona una opci\u00f3 o escriu un missatge per enviar la petici\u00f3 a recepci\u00f3.';\n      success.classList.add('visible');\n      return;\n    }\n\n    saveRequest(req);\n    renderHistory();\n\n    success.innerHTML =\n      '<strong>Petici\u00f3 enviada correctament.<\/strong><br>' +\n      'Recepci\u00f3 ha rebut la sol\u00b7licitud de l\u2019habitaci\u00f3 ' + escapeHtml(req.room) + '.<br>' +\n      'Refer\u00e8ncia: ' + escapeHtml(req.id);\n\n    success.classList.add('visible');\n  });\n\n  document.getElementById('ipgQuickSend').addEventListener('click',()=>{\n    const quick = document.getElementById('ipgQuickMessage');\n    const value = quick.value.trim();\n\n    panel.classList.add('visible');\n    panelIcon.textContent = '\u2192';\n    title.textContent = 'Consulta directa a recepci\u00f3';\n    text.textContent = 'La recepci\u00f3 rebr\u00e0 la teva consulta.';\n    select.innerHTML = '<option value=\"Consulta directa\" selected>Consulta directa<\/option>';\n    detail.placeholder = 'Detall addicional';\n    message.placeholder = 'Escriu aqu\u00ed la consulta...';\n    detail.value = '';\n    message.value = value;\n    note.textContent = 'La consulta quedar\u00e0 vinculada a la teva habitaci\u00f3.';\n    infoResult.classList.remove('visible');\n    infoResult.innerHTML = '';\n    success.classList.remove('visible');\n    success.textContent = '';\n    currentKey = 'consultaRapida';\n\n    if(value){\n      const req = {\n        id:createRequestId(),\n        room:ROOM_NUMBER,\n        type:'Consulta directa',\n        service:'Consulta directa',\n        detail:'Consulta enviada des del camp r\u00e0pid',\n        message:value,\n        priority:'Normal',\n        status:'Pendent',\n        createdAt:currentTime(),\n        source:'QR habitaci\u00f3'\n      };\n\n      saveRequest(req);\n      renderHistory();\n\n      success.innerHTML =\n        '<strong>Consulta enviada correctament.<\/strong><br>' +\n        'Recepci\u00f3 ha rebut el missatge de l\u2019habitaci\u00f3 ' + escapeHtml(req.room) + '.<br>' +\n        'Refer\u00e8ncia: ' + escapeHtml(req.id);\n\n      success.classList.add('visible');\n      quick.value = '';\n    }else{\n      success.innerHTML =\n        '<strong>Escriu la consulta.<\/strong><br>' +\n        'Pots escriure el missatge i enviar-lo directament a recepci\u00f3.';\n      success.classList.add('visible');\n    }\n\n    panel.scrollIntoView({behavior:'smooth',block:'nearest'});\n  });\n\n  function buildRequest(){\n    let data = services[currentKey];\n\n    if(!data){\n      data = {\n        type:'Consulta directa',\n        status:'Pendent',\n        priority:'Normal'\n      };\n    }\n\n    const requestType = select.value || '';\n    const requestDetail = detail.value.trim();\n    const requestMessage = message.value.trim();\n\n    return {\n      id:createRequestId(),\n      room:ROOM_NUMBER,\n      type:data.type || 'Servei intern',\n      service:requestType || 'Petici\u00f3 general',\n      detail:requestDetail || 'Sense detall addicional',\n      message:requestMessage || 'Petici\u00f3 enviada des de l\u2019habitaci\u00f3.',\n      priority:data.priority || 'Normal',\n      status:data.status || 'Pendent',\n      createdAt:currentTime(),\n      source:'QR habitaci\u00f3',\n      area:data.title || 'Petici\u00f3'\n    };\n  }\n\n  function isValidRequest(req){\n    const selectedValue = select.value && select.value.trim();\n    const detailValue = detail.value && detail.value.trim();\n    const messageValue = message.value && message.value.trim();\n\n    return Boolean(selectedValue || detailValue || messageValue);\n  }\n\n  function saveRequest(req){\n    try{\n      const stored = window.localStorage.getItem(STORAGE_KEY);\n      const requests = stored ? JSON.parse(stored) : [];\n      requests.unshift(req);\n      window.localStorage.setItem(STORAGE_KEY,JSON.stringify(requests));\n    }catch(e){}\n\n    try{\n      window.dispatchEvent(new CustomEvent('ipleaseGuestRequestCreated',{detail:req}));\n    }catch(e){}\n  }\n\n  function renderHistory(){\n    let requests = [];\n\n    try{\n      const stored = window.localStorage.getItem(STORAGE_KEY);\n      requests = stored ? JSON.parse(stored) : [];\n    }catch(e){\n      requests = [];\n    }\n\n    const roomRequests = requests\n      .filter(req=>String(req.room) === ROOM_NUMBER)\n      .slice(0,3);\n\n    if(!roomRequests.length){\n      history.classList.remove('visible');\n      historyList.innerHTML = '';\n      return;\n    }\n\n    history.classList.add('visible');\n    historyList.innerHTML = '';\n\n    roomRequests.forEach(req=>{\n      const item = document.createElement('div');\n      item.className = 'ipg-history-item';\n\n      item.innerHTML =\n        '<strong>' + escapeHtml(req.service || 'Petici\u00f3') + '<\/strong>' +\n        '<p>' + escapeHtml(req.message || 'Petici\u00f3 enviada a recepci\u00f3.') + '<\/p>' +\n        '<div class=\"ipg-history-meta\">' +\n          '<span>' + escapeHtml(req.createdAt || '') + ' \u00b7 Ref. ' + escapeHtml(req.id || '') + '<\/span>' +\n          '<span class=\"ipg-status\">' + escapeHtml(req.status || 'Pendent') + '<\/span>' +\n        '<\/div>';\n\n      historyList.appendChild(item);\n    });\n  }\n\n  function createRequestId(){\n    return 'IP-' + Math.random().toString(36).substring(2,8).toUpperCase();\n  }\n\n  function currentTime(){\n    return new Date().toLocaleTimeString('ca-ES',{hour:'2-digit',minute:'2-digit'});\n  }\n\n  function escapeHtml(str){\n    return String(str).replace(\/[&<>\"']\/g,function(m){\n      return ({\n        '&':'&amp;',\n        '<':'&lt;',\n        '>':'&gt;',\n        '\"':'&quot;',\n        \"'\":'&#039;'\n      })[m];\n    });\n  }\n\n  renderHistory();\n})();\n<\/script>\n\n\n\n<p class=\"wp-block-paragraph\">El que veu la recepci\u00f3<\/p>\n\n\n\n<style>\n.iplease-reception-screen{\n  --ipr-blue-950:#021126;\n  --ipr-blue-900:#041b3d;\n  --ipr-blue-800:#063b7a;\n  --ipr-blue-700:#0757c8;\n  --ipr-blue-600:#0b63e5;\n  --ipr-blue-500:#178bff;\n  --ipr-soft:#edf4fb;\n  --ipr-card:#ffffff;\n  --ipr-border:#e2eaf5;\n  --ipr-text:#06172f;\n  --ipr-muted:#627089;\n  --ipr-green:#0b7a45;\n  --ipr-red:#b42318;\n  --ipr-orange:#b85c00;\n  --ipr-yellow:#fff4d8;\n  --ipr-shadow:0 18px 45px rgba(4,27,61,.14);\n\n  width:100%;\n  min-height:100vh;\n  background:#edf4fb;\n  padding:34px 14px 48px;\n  font-family:Arial, Helvetica, sans-serif;\n  color:var(--ipr-text);\n}\n\n.iplease-reception-screen,\n.iplease-reception-screen *{\n  box-sizing:border-box;\n}\n\n.ipr-wrap{\n  width:100%;\n  max-width:1040px;\n  margin:0 auto;\n}\n\n.ipr-shell{\n  background:#ffffff;\n  border:1px solid rgba(4,27,61,.08);\n  border-radius:28px;\n  box-shadow:var(--ipr-shadow);\n  overflow:hidden;\n}\n\n.ipr-header{\n  position:relative;\n  overflow:hidden;\n  background:\n    radial-gradient(circle at 92% 0%,rgba(124,196,255,.38),transparent 32%),\n    linear-gradient(135deg,#041b3d 0%,#063b7a 52%,#0b63e5 100%);\n  color:#ffffff;\n  padding:24px 26px 24px;\n}\n\n.ipr-header:after{\n  content:\"\";\n  position:absolute;\n  inset:auto -60px -85px auto;\n  width:240px;\n  height:240px;\n  border-radius:50%;\n  background:rgba(255,255,255,.08);\n  pointer-events:none;\n}\n\n.ipr-top{\n  position:relative;\n  z-index:2;\n  display:flex;\n  align-items:flex-start;\n  justify-content:space-between;\n  gap:18px;\n}\n\n.ipr-brand{\n  display:flex;\n  align-items:center;\n  gap:13px;\n}\n\n.ipr-brand-logo{\n  width:48px;\n  height:48px;\n  border-radius:16px;\n  background:white;\n  display:flex;\n  align-items:center;\n  justify-content:center;\n  overflow:hidden;\n  flex:0 0 48px;\n}\n\n.ipr-brand-logo img{\n  width:34px;\n  height:34px;\n  object-fit:contain;\n  display:block;\n}\n\n.ipr-brand-text strong{\n  display:block;\n  font-size:22px;\n  line-height:1.1;\n  letter-spacing:-.4px;\n}\n\n.ipr-brand-text span{\n  display:block;\n  margin-top:4px;\n  font-size:13px;\n  opacity:.82;\n}\n\n.ipr-hotel-pill{\n  display:flex;\n  align-items:center;\n  gap:8px;\n  padding:10px 13px;\n  border-radius:999px;\n  background:rgba(255,255,255,.12);\n  border:1px solid rgba(255,255,255,.18);\n  backdrop-filter:blur(8px);\n  font-size:12px;\n  font-weight:800;\n  white-space:nowrap;\n}\n\n.ipr-hotel-pill span{\n  width:8px;\n  height:8px;\n  border-radius:50%;\n  background:#7df0b5;\n  box-shadow:0 0 0 5px rgba(125,240,181,.14);\n}\n\n.ipr-headline{\n  position:relative;\n  z-index:2;\n  margin-top:24px;\n  display:grid;\n  grid-template-columns:minmax(0,1.15fr) minmax(260px,.85fr);\n  gap:24px;\n  align-items:end;\n}\n\n.ipr-headline h2{\n  margin:0;\n  font-size:34px;\n  line-height:1.05;\n  letter-spacing:-1.2px;\n}\n\n.ipr-headline p{\n  margin:10px 0 0;\n  color:rgba(255,255,255,.82);\n  font-size:15px;\n  line-height:1.5;\n}\n\n.ipr-live-box{\n  background:rgba(2,17,38,.34);\n  border:1px solid rgba(255,255,255,.15);\n  border-radius:18px;\n  padding:16px;\n  backdrop-filter:blur(10px);\n}\n\n.ipr-live-box strong{\n  display:block;\n  font-size:14px;\n  margin-bottom:8px;\n}\n\n.ipr-live-row{\n  display:flex;\n  align-items:center;\n  justify-content:space-between;\n  gap:10px;\n  padding:7px 0;\n  border-top:1px solid rgba(255,255,255,.1);\n  font-size:12px;\n  color:rgba(255,255,255,.78);\n}\n\n.ipr-live-row:first-of-type{\n  border-top:0;\n}\n\n.ipr-live-row b{\n  color:white;\n}\n\n.ipr-kpis{\n  display:grid;\n  grid-template-columns:repeat(4,1fr);\n  gap:12px;\n  padding:18px 20px;\n  background:#f7fbff;\n  border-bottom:1px solid var(--ipr-border);\n}\n\n.ipr-kpi{\n  background:white;\n  border:1px solid var(--ipr-border);\n  border-radius:18px;\n  padding:14px 14px;\n  box-shadow:0 7px 18px rgba(4,27,61,.05);\n}\n\n.ipr-kpi span{\n  display:block;\n  color:#627089;\n  font-size:12px;\n  line-height:1.25;\n}\n\n.ipr-kpi strong{\n  display:block;\n  margin-top:8px;\n  color:#06172f;\n  font-size:28px;\n  line-height:1;\n  letter-spacing:-.8px;\n}\n\n.ipr-kpi small{\n  display:block;\n  margin-top:6px;\n  color:#8a95a8;\n  font-size:11px;\n}\n\n.ipr-body{\n  display:grid;\n  grid-template-columns:minmax(0,1fr) 330px;\n  gap:0;\n  min-height:560px;\n}\n\n.ipr-main{\n  padding:20px;\n  border-right:1px solid var(--ipr-border);\n}\n\n.ipr-side{\n  padding:20px;\n  background:#fbfdff;\n}\n\n.ipr-section-head{\n  display:flex;\n  justify-content:space-between;\n  align-items:flex-start;\n  gap:14px;\n  margin-bottom:14px;\n}\n\n.ipr-section-head h3{\n  margin:0;\n  font-size:20px;\n  letter-spacing:-.3px;\n}\n\n.ipr-section-head p{\n  margin:5px 0 0;\n  color:#627089;\n  font-size:13px;\n  line-height:1.4;\n}\n\n.ipr-refresh{\n  border:0;\n  border-radius:999px;\n  min-height:36px;\n  padding:0 13px;\n  background:#eaf3ff;\n  color:#063b7a;\n  font-size:12px;\n  font-weight:800;\n  cursor:pointer;\n}\n\n.ipr-filters{\n  display:flex;\n  gap:8px;\n  flex-wrap:wrap;\n  margin-bottom:14px;\n}\n\n.ipr-filter{\n  border:1px solid #d9e6f5;\n  background:white;\n  color:#627089;\n  border-radius:999px;\n  padding:8px 11px;\n  font-size:12px;\n  font-weight:800;\n  cursor:pointer;\n}\n\n.ipr-filter.active{\n  background:#063b7a;\n  border-color:#063b7a;\n  color:white;\n}\n\n.ipr-list{\n  display:flex;\n  flex-direction:column;\n  gap:10px;\n}\n\n.ipr-empty{\n  display:none;\n  padding:26px;\n  text-align:center;\n  border:1px dashed #cfdced;\n  border-radius:18px;\n  color:#627089;\n  background:#f8fbff;\n  font-size:14px;\n  line-height:1.5;\n}\n\n.ipr-empty.visible{\n  display:block;\n}\n\n.ipr-card{\n  border:1px solid var(--ipr-border);\n  background:white;\n  border-radius:18px;\n  padding:14px;\n  box-shadow:0 8px 18px rgba(4,27,61,.05);\n  cursor:pointer;\n  transition:transform .16s ease, border-color .16s ease, box-shadow .16s ease;\n}\n\n.ipr-card:hover,\n.ipr-card.active{\n  transform:translateY(-1px);\n  border-color:#b9d8ff;\n  box-shadow:0 13px 24px rgba(4,86,200,.11);\n}\n\n.ipr-card-top{\n  display:flex;\n  justify-content:space-between;\n  gap:12px;\n  align-items:flex-start;\n}\n\n.ipr-room{\n  display:flex;\n  align-items:center;\n  gap:10px;\n}\n\n.ipr-room-icon{\n  width:42px;\n  height:42px;\n  border-radius:14px;\n  background:linear-gradient(135deg,#0757c8,#178bff);\n  color:white;\n  display:flex;\n  align-items:center;\n  justify-content:center;\n  font-size:17px;\n  font-weight:900;\n  flex:0 0 42px;\n}\n\n.ipr-card-title strong{\n  display:block;\n  font-size:15px;\n  line-height:1.25;\n}\n\n.ipr-card-title span{\n  display:block;\n  margin-top:4px;\n  color:#627089;\n  font-size:12px;\n}\n\n.ipr-badges{\n  display:flex;\n  flex-direction:column;\n  align-items:flex-end;\n  gap:6px;\n}\n\n.ipr-badge{\n  display:inline-flex;\n  align-items:center;\n  justify-content:center;\n  border-radius:999px;\n  padding:5px 8px;\n  font-size:10.5px;\n  font-weight:900;\n  white-space:nowrap;\n}\n\n.ipr-badge.pending{\n  color:#8a4a00;\n  background:#fff4d8;\n}\n\n.ipr-badge.progress{\n  color:#063b7a;\n  background:#e2f0ff;\n}\n\n.ipr-badge.resolved{\n  color:#0b7a45;\n  background:#e7f8ef;\n}\n\n.ipr-badge.urgent{\n  color:#b42318;\n  background:#fff0ee;\n}\n\n.ipr-badge.extra{\n  color:#7a3d00;\n  background:#fff2df;\n}\n\n.ipr-badge.info{\n  color:#063b7a;\n  background:#eaf3ff;\n}\n\n.ipr-card-message{\n  margin:12px 0 0;\n  padding:11px;\n  border-radius:13px;\n  background:#f7fbff;\n  color:#34516d;\n  font-size:13px;\n  line-height:1.45;\n}\n\n.ipr-card-meta{\n  display:flex;\n  align-items:center;\n  justify-content:space-between;\n  gap:10px;\n  margin-top:11px;\n  color:#8a95a8;\n  font-size:11px;\n}\n\n.ipr-detail{\n  border:1px solid var(--ipr-border);\n  background:white;\n  border-radius:20px;\n  padding:16px;\n  box-shadow:0 8px 20px rgba(4,27,61,.05);\n}\n\n.ipr-detail h3{\n  margin:0;\n  font-size:18px;\n}\n\n.ipr-detail-sub{\n  margin:6px 0 14px;\n  color:#627089;\n  font-size:13px;\n  line-height:1.4;\n}\n\n.ipr-detail-box{\n  display:grid;\n  gap:8px;\n  margin-bottom:14px;\n}\n\n.ipr-detail-row{\n  display:flex;\n  justify-content:space-between;\n  gap:10px;\n  padding:9px 0;\n  border-bottom:1px solid #edf2f8;\n  font-size:13px;\n}\n\n.ipr-detail-row span{\n  color:#627089;\n}\n\n.ipr-detail-row strong{\n  text-align:right;\n}\n\n.ipr-detail-message{\n  margin:0 0 14px;\n  padding:12px;\n  border-radius:14px;\n  background:#f7fbff;\n  border:1px solid #e1ebf7;\n  color:#34516d;\n  font-size:13px;\n  line-height:1.45;\n}\n\n.ipr-status-actions{\n  display:grid;\n  grid-template-columns:1fr 1fr;\n  gap:8px;\n}\n\n.ipr-status-actions button{\n  min-height:39px;\n  border:0;\n  border-radius:12px;\n  font-size:12px;\n  font-weight:900;\n  cursor:pointer;\n}\n\n.ipr-status-actions .start{\n  background:#eaf3ff;\n  color:#063b7a;\n}\n\n.ipr-status-actions .done{\n  background:#e7f8ef;\n  color:#0b7a45;\n}\n\n.ipr-status-actions .confirm{\n  background:#fff2df;\n  color:#9a4f00;\n}\n\n.ipr-status-actions .cancel{\n  background:#fff0ee;\n  color:#b42318;\n}\n\n.ipr-mini-card{\n  margin-top:14px;\n  border:1px solid var(--ipr-border);\n  background:white;\n  border-radius:20px;\n  padding:16px;\n  box-shadow:0 8px 20px rgba(4,27,61,.04);\n}\n\n.ipr-mini-card h4{\n  margin:0 0 8px;\n  font-size:15px;\n}\n\n.ipr-mini-card p{\n  margin:0;\n  color:#627089;\n  font-size:13px;\n  line-height:1.45;\n}\n\n.ipr-mini-list{\n  margin:12px 0 0;\n  padding:0;\n  list-style:none;\n}\n\n.ipr-mini-list li{\n  display:flex;\n  align-items:flex-start;\n  gap:8px;\n  padding:8px 0;\n  border-top:1px solid #edf2f8;\n  color:#34516d;\n  font-size:12.5px;\n  line-height:1.35;\n}\n\n.ipr-mini-list li:before{\n  content:\"\";\n  width:7px;\n  height:7px;\n  border-radius:50%;\n  background:#178bff;\n  margin-top:5px;\n  flex:0 0 7px;\n}\n\n@media(max-width:820px){\n  .ipr-headline{\n    grid-template-columns:1fr;\n    gap:18px;\n  }\n\n  .ipr-kpis{\n    grid-template-columns:repeat(2,1fr);\n  }\n\n  .ipr-body{\n    grid-template-columns:1fr;\n  }\n\n  .ipr-main{\n    border-right:0;\n    border-bottom:1px solid var(--ipr-border);\n  }\n\n  .ipr-side{\n    background:white;\n  }\n}\n\n@media(max-width:520px){\n  .iplease-reception-screen{\n    padding-left:10px;\n    padding-right:10px;\n  }\n\n  .ipr-shell{\n    border-radius:24px;\n  }\n\n  .ipr-header{\n    padding:22px 20px;\n  }\n\n  .ipr-top{\n    flex-direction:column;\n  }\n\n  .ipr-hotel-pill{\n    align-self:flex-start;\n  }\n\n  .ipr-headline h2{\n    font-size:29px;\n  }\n\n  .ipr-kpis{\n    gap:8px;\n    padding:14px;\n  }\n\n  .ipr-kpi{\n    padding:12px;\n    border-radius:16px;\n  }\n\n  .ipr-kpi strong{\n    font-size:25px;\n  }\n\n  .ipr-main,\n  .ipr-side{\n    padding:16px;\n  }\n\n  .ipr-section-head{\n    flex-direction:column;\n  }\n\n  .ipr-card-top{\n    flex-direction:column;\n  }\n\n  .ipr-badges{\n    flex-direction:row;\n    align-items:flex-start;\n  }\n}\n<\/style>\n\n<section class=\"iplease-reception-screen\" id=\"ipReceptionScreen\">\n  <div class=\"ipr-wrap\">\n    <div class=\"ipr-shell\">\n\n      <header class=\"ipr-header\">\n        <div class=\"ipr-top\">\n          <div class=\"ipr-brand\">\n            <div class=\"ipr-brand-logo\">\n              <img decoding=\"async\" src=\"https:\/\/i-please.com\/wp-content\/uploads\/2026\/05\/i-please-logo-ICO.png\" alt=\"i-please\">\n            <\/div>\n            <div class=\"ipr-brand-text\">\n              <strong>Recepci\u00f3 i-please<\/strong>\n              <span>Gesti\u00f3 de peticions, incid\u00e8ncies i serveis dels hostes<\/span>\n            <\/div>\n          <\/div>\n\n          <div class=\"ipr-hotel-pill\">\n            <span><\/span>\n            Hotel Vall del Ter\n          <\/div>\n        <\/div>\n\n        <div class=\"ipr-headline\">\n          <div>\n            <h2>Peticions de les habitacions, ordenades en un sol lloc.<\/h2>\n            <p>Recepci\u00f3 pot veure cada sol\u00b7licitud, prioritzar-la i marcar-ne l\u2019estat fins que quedi resolta.<\/p>\n          <\/div>\n\n          <div class=\"ipr-live-box\">\n            <strong>Servei actiu<\/strong>\n            <div class=\"ipr-live-row\">\n              <span>Canal dels hostes<\/span>\n              <b>QR habitaci\u00f3<\/b>\n            <\/div>\n            <div class=\"ipr-live-row\">\n              <span>Recepci\u00f3<\/span>\n              <b>08:00 &#8211; 22:00<\/b>\n            <\/div>\n            <div class=\"ipr-live-row\">\n              <span>Habitacions<\/span>\n              <b>24 vinculades<\/b>\n            <\/div>\n          <\/div>\n        <\/div>\n      <\/header>\n\n      <section class=\"ipr-kpis\">\n        <div class=\"ipr-kpi\">\n          <span>Peticions pendents<\/span>\n          <strong id=\"iprKpiPending\">0<\/strong>\n          <small>Per revisar<\/small>\n        <\/div>\n\n        <div class=\"ipr-kpi\">\n          <span>Incid\u00e8ncies<\/span>\n          <strong id=\"iprKpiUrgent\">0<\/strong>\n          <small>Prioritat alta<\/small>\n        <\/div>\n\n        <div class=\"ipr-kpi\">\n          <span>Extres pendents<\/span>\n          <strong id=\"iprKpiExtras\">0<\/strong>\n          <small>Per confirmar<\/small>\n        <\/div>\n\n        <div class=\"ipr-kpi\">\n          <span>Resoltes avui<\/span>\n          <strong id=\"iprKpiResolved\">0<\/strong>\n          <small>Servei completat<\/small>\n        <\/div>\n      <\/section>\n\n      <section class=\"ipr-body\">\n\n        <main class=\"ipr-main\">\n          <div class=\"ipr-section-head\">\n            <div>\n              <h3>Peticions rebudes<\/h3>\n              <p>Sol\u00b7licituds enviades pels hostes des del seu m\u00f2bil.<\/p>\n            <\/div>\n\n            <button type=\"button\" class=\"ipr-refresh\" id=\"iprRefresh\">Actualitzar<\/button>\n          <\/div>\n\n          <div class=\"ipr-filters\">\n            <button type=\"button\" class=\"ipr-filter active\" data-filter=\"all\">Totes<\/button>\n            <button type=\"button\" class=\"ipr-filter\" data-filter=\"pending\">Pendents<\/button>\n            <button type=\"button\" class=\"ipr-filter\" data-filter=\"urgent\">Incid\u00e8ncies<\/button>\n            <button type=\"button\" class=\"ipr-filter\" data-filter=\"extra\">Extres<\/button>\n            <button type=\"button\" class=\"ipr-filter\" data-filter=\"resolved\">Resoltes<\/button>\n          <\/div>\n\n          <div class=\"ipr-empty\" id=\"iprEmpty\">\n            No hi ha peticions en aquest apartat.\n          <\/div>\n\n          <div class=\"ipr-list\" id=\"iprRequestList\"><\/div>\n        <\/main>\n\n        <aside class=\"ipr-side\">\n          <div class=\"ipr-detail\" id=\"iprDetail\">\n            <h3>Fitxa de petici\u00f3<\/h3>\n            <p class=\"ipr-detail-sub\">Selecciona una petici\u00f3 per veure\u2019n el detall.<\/p>\n\n            <div class=\"ipr-detail-box\">\n              <div class=\"ipr-detail-row\">\n                <span>Habitaci\u00f3<\/span>\n                <strong id=\"iprDetailRoom\">&#8211;<\/strong>\n              <\/div>\n              <div class=\"ipr-detail-row\">\n                <span>Tipus<\/span>\n                <strong id=\"iprDetailType\">&#8211;<\/strong>\n              <\/div>\n              <div class=\"ipr-detail-row\">\n                <span>Servei<\/span>\n                <strong id=\"iprDetailService\">&#8211;<\/strong>\n              <\/div>\n              <div class=\"ipr-detail-row\">\n                <span>Prioritat<\/span>\n                <strong id=\"iprDetailPriority\">&#8211;<\/strong>\n              <\/div>\n              <div class=\"ipr-detail-row\">\n                <span>Estat<\/span>\n                <strong id=\"iprDetailStatus\">&#8211;<\/strong>\n              <\/div>\n              <div class=\"ipr-detail-row\">\n                <span>Hora<\/span>\n                <strong id=\"iprDetailTime\">&#8211;<\/strong>\n              <\/div>\n            <\/div>\n\n            <div class=\"ipr-detail-message\" id=\"iprDetailMessage\">\n              Aqu\u00ed apareixer\u00e0 el missatge de la petici\u00f3.\n            <\/div>\n\n            <div class=\"ipr-status-actions\">\n              <button type=\"button\" class=\"start\" id=\"iprMarkProgress\">En curs<\/button>\n              <button type=\"button\" class=\"done\" id=\"iprMarkResolved\">Resoldre<\/button>\n              <button type=\"button\" class=\"confirm\" id=\"iprMarkConfirmed\">Confirmar<\/button>\n              <button type=\"button\" class=\"cancel\" id=\"iprMarkCancelled\">Cancel\u00b7lar<\/button>\n            <\/div>\n          <\/div>\n\n          <div class=\"ipr-mini-card\">\n            <h4>Protocol de recepci\u00f3<\/h4>\n            <p>Cada petici\u00f3 queda associada a una habitaci\u00f3, un servei, una hora i un estat.<\/p>\n            <ul class=\"ipr-mini-list\">\n              <li>Les incid\u00e8ncies es mostren amb prioritat alta.<\/li>\n              <li>Els extres queden pendents de confirmaci\u00f3.<\/li>\n              <li>Les peticions resoltes passen a l\u2019historial del dia.<\/li>\n              <li>La recepci\u00f3 pot actualitzar l\u2019estat en qualsevol moment.<\/li>\n            <\/ul>\n          <\/div>\n\n          <div class=\"ipr-mini-card\">\n            <h4>Informaci\u00f3 del servei<\/h4>\n            <p>Els hostes poden enviar peticions des del m\u00f2bil sense instal\u00b7lar cap aplicaci\u00f3.<\/p>\n            <ul class=\"ipr-mini-list\">\n              <li>Acc\u00e9s mitjan\u00e7ant QR a cada habitaci\u00f3.<\/li>\n              <li>Informaci\u00f3 b\u00e0sica de l\u2019hotel sempre disponible.<\/li>\n              <li>Serveis, incid\u00e8ncies, reserves i recomanacions locals.<\/li>\n              <li>Seguiment de satisfacci\u00f3 durant l\u2019estada.<\/li>\n            <\/ul>\n          <\/div>\n        <\/aside>\n\n      <\/section>\n\n    <\/div>\n  <\/div>\n<\/section>\n\n<script>\n(function(){\n  const STORAGE_KEY = 'iplease_guest_requests_v1';\n\n  let requests = loadRequests();\n  let activeFilter = 'all';\n  let selectedId = requests.length ? requests[0].id : null;\n\n  const list = document.getElementById('iprRequestList');\n  const empty = document.getElementById('iprEmpty');\n\n  const kpiPending = document.getElementById('iprKpiPending');\n  const kpiUrgent = document.getElementById('iprKpiUrgent');\n  const kpiExtras = document.getElementById('iprKpiExtras');\n  const kpiResolved = document.getElementById('iprKpiResolved');\n\n  const detailRoom = document.getElementById('iprDetailRoom');\n  const detailType = document.getElementById('iprDetailType');\n  const detailService = document.getElementById('iprDetailService');\n  const detailPriority = document.getElementById('iprDetailPriority');\n  const detailStatus = document.getElementById('iprDetailStatus');\n  const detailTime = document.getElementById('iprDetailTime');\n  const detailMessage = document.getElementById('iprDetailMessage');\n\n  document.querySelectorAll('.ipr-filter').forEach(btn=>{\n    btn.addEventListener('click',()=>{\n      document.querySelectorAll('.ipr-filter').forEach(b=>b.classList.remove('active'));\n      btn.classList.add('active');\n      activeFilter = btn.getAttribute('data-filter');\n      renderList();\n    });\n  });\n\n  document.getElementById('iprRefresh').addEventListener('click',()=>{\n    refreshRequests();\n  });\n\n  document.getElementById('iprMarkProgress').addEventListener('click',()=>{\n    updateSelectedStatus('En curs');\n  });\n\n  document.getElementById('iprMarkResolved').addEventListener('click',()=>{\n    updateSelectedStatus('Resolt');\n  });\n\n  document.getElementById('iprMarkConfirmed').addEventListener('click',()=>{\n    updateSelectedStatus('Confirmat');\n  });\n\n  document.getElementById('iprMarkCancelled').addEventListener('click',()=>{\n    updateSelectedStatus('Cancel\u00b7lat');\n  });\n\n  window.addEventListener('ipleaseGuestRequestCreated',function(event){\n    if(event && event.detail){\n      refreshRequests(event.detail.id);\n    }\n  });\n\n  window.addEventListener('storage',function(event){\n    if(event.key === STORAGE_KEY){\n      refreshRequests();\n    }\n  });\n\n  setInterval(function(){\n    refreshRequests(null,true);\n  },3000);\n\n  function refreshRequests(preferredId,silent){\n    const previousLength = requests.length;\n    requests = loadRequests();\n\n    if(preferredId){\n      selectedId = preferredId;\n    }else if(requests.length && (!selectedId || !requests.some(r=>r.id === selectedId))){\n      selectedId = requests[0].id;\n    }else if(!requests.length){\n      selectedId = null;\n    }\n\n    if(!silent || previousLength !== requests.length){\n      render();\n    }\n  }\n\n  function render(){\n    renderKpis();\n    renderList();\n    renderDetail();\n  }\n\n  function renderKpis(){\n    const pending = requests.filter(r=>!isResolved(r.status)).length;\n    const urgent = requests.filter(r=>isUrgent(r)).length;\n    const extras = requests.filter(r=>isExtra(r)).length;\n    const resolved = requests.filter(r=>isResolved(r.status)).length;\n\n    kpiPending.textContent = pending;\n    kpiUrgent.textContent = urgent;\n    kpiExtras.textContent = extras;\n    kpiResolved.textContent = resolved;\n  }\n\n  function renderList(){\n    const filtered = requests.filter(req=>{\n      if(activeFilter === 'pending'){\n        return !isResolved(req.status);\n      }\n\n      if(activeFilter === 'urgent'){\n        return isUrgent(req);\n      }\n\n      if(activeFilter === 'extra'){\n        return isExtra(req);\n      }\n\n      if(activeFilter === 'resolved'){\n        return isResolved(req.status);\n      }\n\n      return true;\n    });\n\n    list.innerHTML = '';\n\n    if(filtered.length === 0){\n      empty.classList.add('visible');\n      return;\n    }\n\n    empty.classList.remove('visible');\n\n    filtered.forEach(req=>{\n      const card = document.createElement('article');\n      card.className = 'ipr-card' + (req.id === selectedId ? ' active' : '');\n      card.setAttribute('data-id',req.id);\n\n      card.innerHTML =\n        '<div class=\"ipr-card-top\">' +\n          '<div class=\"ipr-room\">' +\n            '<div class=\"ipr-room-icon\">' + escapeHtml(req.room) + '<\/div>' +\n            '<div class=\"ipr-card-title\">' +\n              '<strong>' + escapeHtml(req.service) + '<\/strong>' +\n              '<span>' + escapeHtml(req.type) + ' \u00b7 ' + escapeHtml(req.source || 'QR habitaci\u00f3') + '<\/span>' +\n            '<\/div>' +\n          '<\/div>' +\n          '<div class=\"ipr-badges\">' +\n            '<span class=\"ipr-badge ' + statusClass(req) + '\">' + escapeHtml(req.status) + '<\/span>' +\n            '<span class=\"ipr-badge ' + priorityClass(req) + '\">' + escapeHtml(req.priority) + '<\/span>' +\n          '<\/div>' +\n        '<\/div>' +\n        '<div class=\"ipr-card-message\">' +\n          escapeHtml(req.message) +\n        '<\/div>' +\n        '<div class=\"ipr-card-meta\">' +\n          '<span>Ref. ' + escapeHtml(req.id) + '<\/span>' +\n          '<span>' + escapeHtml(req.createdAt) + '<\/span>' +\n        '<\/div>';\n\n      card.addEventListener('click',()=>{\n        selectedId = req.id;\n        renderList();\n        renderDetail();\n      });\n\n      list.appendChild(card);\n    });\n  }\n\n  function renderDetail(){\n    const selected = requests.find(r=>r.id === selectedId) || requests[0];\n\n    if(!selected){\n      detailRoom.textContent = '-';\n      detailType.textContent = '-';\n      detailService.textContent = '-';\n      detailPriority.textContent = '-';\n      detailStatus.textContent = '-';\n      detailTime.textContent = '-';\n      detailMessage.textContent = 'No hi ha cap petici\u00f3 seleccionada.';\n      return;\n    }\n\n    selectedId = selected.id;\n\n    detailRoom.textContent = selected.room || '-';\n    detailType.textContent = selected.type || '-';\n    detailService.textContent = selected.service || '-';\n    detailPriority.textContent = selected.priority || '-';\n    detailStatus.textContent = selected.status || '-';\n    detailTime.textContent = selected.createdAt || '-';\n\n    detailMessage.innerHTML =\n      '<strong>Detall:<\/strong> ' + escapeHtml(selected.detail || 'Sense detall addicional') +\n      '<br><br><strong>Missatge:<\/strong> ' + escapeHtml(selected.message || 'Sense missatge') +\n      '<br><br><strong>Refer\u00e8ncia:<\/strong> ' + escapeHtml(selected.id || '-');\n  }\n\n  function updateSelectedStatus(newStatus){\n    if(!selectedId){\n      return;\n    }\n\n    requests = requests.map(req=>{\n      if(req.id === selectedId){\n        return Object.assign({},req,{status:newStatus});\n      }\n\n      return req;\n    });\n\n    saveRequests();\n    render();\n  }\n\n  function isResolved(status){\n    const s = String(status || '').toLowerCase();\n    return s.includes('resolt') || s.includes('confirmat') || s.includes('cancel');\n  }\n\n  function isUrgent(req){\n    const type = String(req.type || '').toLowerCase();\n    const priority = String(req.priority || '').toLowerCase();\n    const status = String(req.status || '').toLowerCase();\n\n    return type.includes('incid') || priority.includes('alta') || status.includes('priorit');\n  }\n\n  function isExtra(req){\n    const type = String(req.type || '').toLowerCase();\n    const priority = String(req.priority || '').toLowerCase();\n\n    return type.includes('extra') || type.includes('reserva') || priority.includes('confirm');\n  }\n\n  function statusClass(req){\n    const status = String(req.status || '').toLowerCase();\n\n    if(status.includes('priorit')){\n      return 'urgent';\n    }\n\n    if(status.includes('curs')){\n      return 'progress';\n    }\n\n    if(status.includes('resolt') || status.includes('confirmat') || status.includes('cancel')){\n      return 'resolved';\n    }\n\n    if(status.includes('confirmaci\u00f3')){\n      return 'extra';\n    }\n\n    if(status.includes('consulta')){\n      return 'info';\n    }\n\n    return 'pending';\n  }\n\n  function priorityClass(req){\n    if(isUrgent(req)){\n      return 'urgent';\n    }\n\n    if(isExtra(req)){\n      return 'extra';\n    }\n\n    if(String(req.priority || '').toLowerCase().includes('baixa')){\n      return 'info';\n    }\n\n    if(isResolved(req.status)){\n      return 'resolved';\n    }\n\n    return 'pending';\n  }\n\n  function loadRequests(){\n    try{\n      const stored = window.localStorage.getItem(STORAGE_KEY);\n\n      if(!stored){\n        return [];\n      }\n\n      const parsed = JSON.parse(stored);\n\n      if(!Array.isArray(parsed)){\n        return [];\n      }\n\n      return parsed;\n    }catch(e){\n      return [];\n    }\n  }\n\n  function saveRequests(){\n    try{\n      window.localStorage.setItem(STORAGE_KEY,JSON.stringify(requests));\n    }catch(e){}\n  }\n\n  function escapeHtml(str){\n    return String(str).replace(\/[&<>\"']\/g,function(m){\n      return ({\n        '&':'&amp;',\n        '<':'&lt;',\n        '>':'&gt;',\n        '\"':'&quot;',\n        \"'\":'&#039;'\n      })[m];\n    });\n  }\n\n  render();\n})();\n<\/script>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>El que veu el client VALL DEL TER RIPOLL\u00c8S Catal\u00e0 Hola! S\u00f3c el teu i-please La recepci\u00f3 digital de l\u2019Hotel Vall del Ter. Demana, informa\u2019t, reserva o avisa sense trucades ni esperes. Habitaci\u00f3 204 \u00b7 Estada activa En qu\u00e8 et podem ajudar? Tria una \u00e0rea. La recepci\u00f3 rebr\u00e0 la petici\u00f3 amb la teva habitaci\u00f3 i [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"class_list":["post-13","page","type-page","status-publish","hentry"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.6 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Demo Hotel Vall de Ter - i-please Smart Guest Assistant<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/i-please.com\/\" \/>\n<meta property=\"og:locale\" content=\"ca_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Demo Hotel Vall de Ter - i-please Smart Guest Assistant\" \/>\n<meta property=\"og:description\" content=\"El que veu el client VALL DEL TER RIPOLL\u00c8S Catal\u00e0 Hola! S\u00f3c el teu i-please La recepci\u00f3 digital de l\u2019Hotel Vall del Ter. Demana, informa\u2019t, reserva o avisa sense trucades ni esperes. Habitaci\u00f3 204 \u00b7 Estada activa En qu\u00e8 et podem ajudar? Tria una \u00e0rea. La recepci\u00f3 rebr\u00e0 la petici\u00f3 amb la teva habitaci\u00f3 i [&hellip;]\" \/>\n<meta property=\"og:url\" content=\"https:\/\/i-please.com\/\" \/>\n<meta property=\"og:site_name\" content=\"i-please Smart Guest Assistant\" \/>\n<meta property=\"article:modified_time\" content=\"2026-07-08T09:00:02+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/i-please.com\/wp-content\/uploads\/2026\/05\/i-please_logo10.png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"3 minuts\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/i-please.com\\\/\",\"url\":\"https:\\\/\\\/i-please.com\\\/\",\"name\":\"Demo Hotel Vall de Ter - i-please Smart Guest Assistant\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/i-please.com\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/i-please.com\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/i-please.com\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/i-please.com\\\/wp-content\\\/uploads\\\/2026\\\/05\\\/i-please_logo10.png\",\"datePublished\":\"2026-05-27T07:04:03+00:00\",\"dateModified\":\"2026-07-08T09:00:02+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/i-please.com\\\/#breadcrumb\"},\"inLanguage\":\"ca\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/i-please.com\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"ca\",\"@id\":\"https:\\\/\\\/i-please.com\\\/#primaryimage\",\"url\":\"https:\\\/\\\/i-please.com\\\/wp-content\\\/uploads\\\/2026\\\/05\\\/i-please_logo10.png\",\"contentUrl\":\"https:\\\/\\\/i-please.com\\\/wp-content\\\/uploads\\\/2026\\\/05\\\/i-please_logo10.png\",\"width\":283,\"height\":256},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/i-please.com\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/i-please.com\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Demo Hotel Vall de Ter\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/i-please.com\\\/#website\",\"url\":\"https:\\\/\\\/i-please.com\\\/\",\"name\":\"i-please Smart Guest Assistant\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/i-please.com\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"ca\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Demo Hotel Vall de Ter - i-please Smart Guest Assistant","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/i-please.com\/","og_locale":"ca_ES","og_type":"article","og_title":"Demo Hotel Vall de Ter - i-please Smart Guest Assistant","og_description":"El que veu el client VALL DEL TER RIPOLL\u00c8S Catal\u00e0 Hola! S\u00f3c el teu i-please La recepci\u00f3 digital de l\u2019Hotel Vall del Ter. Demana, informa\u2019t, reserva o avisa sense trucades ni esperes. Habitaci\u00f3 204 \u00b7 Estada activa En qu\u00e8 et podem ajudar? Tria una \u00e0rea. La recepci\u00f3 rebr\u00e0 la petici\u00f3 amb la teva habitaci\u00f3 i [&hellip;]","og_url":"https:\/\/i-please.com\/","og_site_name":"i-please Smart Guest Assistant","article_modified_time":"2026-07-08T09:00:02+00:00","og_image":[{"url":"https:\/\/i-please.com\/wp-content\/uploads\/2026\/05\/i-please_logo10.png","type":"","width":"","height":""}],"twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"3 minuts"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/i-please.com\/","url":"https:\/\/i-please.com\/","name":"Demo Hotel Vall de Ter - i-please Smart Guest Assistant","isPartOf":{"@id":"https:\/\/i-please.com\/#website"},"primaryImageOfPage":{"@id":"https:\/\/i-please.com\/#primaryimage"},"image":{"@id":"https:\/\/i-please.com\/#primaryimage"},"thumbnailUrl":"https:\/\/i-please.com\/wp-content\/uploads\/2026\/05\/i-please_logo10.png","datePublished":"2026-05-27T07:04:03+00:00","dateModified":"2026-07-08T09:00:02+00:00","breadcrumb":{"@id":"https:\/\/i-please.com\/#breadcrumb"},"inLanguage":"ca","potentialAction":[{"@type":"ReadAction","target":["https:\/\/i-please.com\/"]}]},{"@type":"ImageObject","inLanguage":"ca","@id":"https:\/\/i-please.com\/#primaryimage","url":"https:\/\/i-please.com\/wp-content\/uploads\/2026\/05\/i-please_logo10.png","contentUrl":"https:\/\/i-please.com\/wp-content\/uploads\/2026\/05\/i-please_logo10.png","width":283,"height":256},{"@type":"BreadcrumbList","@id":"https:\/\/i-please.com\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/i-please.com\/"},{"@type":"ListItem","position":2,"name":"Demo Hotel Vall de Ter"}]},{"@type":"WebSite","@id":"https:\/\/i-please.com\/#website","url":"https:\/\/i-please.com\/","name":"i-please Smart Guest Assistant","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/i-please.com\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"ca"}]}},"_links":{"self":[{"href":"https:\/\/i-please.com\/index.php?rest_route=\/wp\/v2\/pages\/13","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/i-please.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/i-please.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/i-please.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/i-please.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=13"}],"version-history":[{"count":9,"href":"https:\/\/i-please.com\/index.php?rest_route=\/wp\/v2\/pages\/13\/revisions"}],"predecessor-version":[{"id":32,"href":"https:\/\/i-please.com\/index.php?rest_route=\/wp\/v2\/pages\/13\/revisions\/32"}],"wp:attachment":[{"href":"https:\/\/i-please.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=13"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}