/* Listo assistant styles, shared by every page since 9 Oct 2026 (moved from index.html).
   The panel carries its own colour values so it looks the same on pages with other palettes. */
.chat,.chat-launch{--card:#FFFFFF;--line:#E6EBF0;--navy:#0B1B2B;--sea:#0F4C81;--sea-ice:#9CCBF2;--sea-soft:#EAF2FA;--sea-light:#4C9FE0;
  --ink:#0B1B2B;--ink-2:#3A4A5C;--muted:#5B6B7C;--ground:#F5F7FA;--wa:#198844;
  --display:"Oswald","Plus Jakarta Sans",system-ui,sans-serif;--text:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",sans-serif}
.chat{font-family:var(--text);color:var(--ink);text-align:left}
.chat *{box-sizing:border-box}
.chat input{font:inherit;border:1.5px solid var(--line);background:#fff;color:var(--ink)}
.chat .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:13px 18px;font:700 .9rem var(--text);text-decoration:none;border:0;cursor:pointer}
.chat .btn-wa{background:var(--wa);color:#fff}
/* chat */
.chat-launch{position:fixed;right:18px;bottom:18px;z-index:40;display:inline-flex;align-items:center;gap:10px;background:var(--wa);color:#fff;border:0;border-radius:999px;
  padding:12px 18px 12px 14px;font:700 .92rem var(--text);cursor:pointer;box-shadow:0 12px 30px rgba(25,136,68,.35);animation:listoNudge 2.6s ease-in-out 1.2s 3}
.chat-launch svg{width:22px;height:22px}
.chat-launch:focus-visible{outline:3px solid var(--sea-light);outline-offset:2px}
.chat-launch:after{content:"";position:absolute;inset:0;border-radius:inherit;background:var(--wa);z-index:-1;animation:ping 2.8s ease-out infinite}
@keyframes listoNudge{0%,100%{transform:scale(1)}8%{transform:scale(1.07)}18%{transform:scale(1)}}
.chat{position:fixed;right:18px;bottom:18px;z-index:41;width:min(400px,calc(100vw - 24px));height:min(780px,calc(100vh - 36px));max-height:calc(100vh - 36px);
  background:var(--card);border:1px solid var(--line);border-radius:22px;box-shadow:0 30px 80px rgba(11,27,43,.28);display:flex;flex-direction:column;overflow:hidden;transition:height .28s ease}
.chat[hidden]{display:none}
@media (max-width:640px){.chat{right:10px;left:10px;bottom:10px;width:auto;height:min(560px,78vh);max-height:78vh}}
.chat .ch{background:var(--navy);padding:14px 16px;display:flex;align-items:center;gap:10px}
/* White, explicitly: the panel inherits navy ink from .chat and the header band IS navy, so a mark drawn in currentColor would be invisible. The old tick carried its own fill and hid this. */
.chat .ch .av{width:auto;height:22px;flex:none}.chat .ch .av svg{display:block;height:100%;width:auto}
.chat .ch b{display:block;font-family:var(--display);font-size:1rem;color:#fff}
.chat .ch small{font-size:.75rem;color:var(--sea-ice);display:flex;align-items:center;gap:6px}
.chat .ch small:before{content:"";width:7px;height:7px;border-radius:50%;background:#4FC08D;animation:liveDot 2.2s ease-in-out infinite}
.chat .ch button{margin-left:auto;background:transparent;border:0;color:#C7D4E1;font-size:1.3rem;cursor:pointer;line-height:1;padding:4px 6px}
.chat .log{padding:14px;overflow-y:auto;display:flex;flex-direction:column;gap:10px;flex:1;background:var(--ground)}
.msg{max-width:86%;padding:10px 13px;border-radius:16px;font-size:.93rem;line-height:1.45;white-space:pre-line}
.msg.bot{background:var(--card);border:1px solid var(--line);border-bottom-left-radius:6px;align-self:flex-start;color:var(--ink)}
.msg.me{background:var(--sea);color:#fff;border-bottom-right-radius:6px;align-self:flex-end;font-weight:600}
.chips-row{display:flex;flex-wrap:wrap;gap:6px;align-self:flex-start;max-width:100%}
.chips-row button{border:1.5px solid var(--sea);background:var(--card);color:var(--sea);border-radius:999px;padding:7px 12px;font:600 .84rem var(--text);cursor:pointer}
.chips-row button:hover{background:var(--sea-soft)}
.chips-row.chips-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px;width:100%;align-self:stretch}
.chips-row.chips-grid button{padding:9px 8px;font-size:.78rem;line-height:1.15;min-height:40px;white-space:normal;text-align:center}
.chips-row.chips-grid button.wide{grid-column:1 / -1}
.dtrow{display:flex;flex-direction:column;gap:6px;width:100%;align-self:stretch}
.dtrow label{font:700 .78rem var(--text);color:var(--ink-2)}
.dtrow input,.dtrow select,.dtrow textarea{width:100%;min-height:44px;padding:10px 12px;border:1.5px solid var(--line);border-radius:12px;background:var(--card);color:var(--ink);font:600 .95rem var(--text)}
.dtrow select{-webkit-appearance:none;appearance:none;background-image:url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235B6B7C' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 10px center;background-size:18px;padding-right:34px}
.dtrow textarea{min-height:88px;line-height:1.35;resize:vertical}
.dtrow input:focus,.dtrow select:focus,.dtrow textarea:focus{outline:2px solid var(--sea);outline-offset:1px}
.dtrow .dterr{margin:0;font:600 .76rem var(--text);color:#B42318}
.dtrow .dtnote{margin:0;font:500 .74rem var(--text);color:var(--muted)}
.dtrow .btn{width:100%;margin-top:2px}
.mktbox{display:flex;align-items:flex-start;gap:9px;cursor:pointer;font:600 .8rem var(--text);color:var(--ink);line-height:1.35}
.mktbox input{width:20px;height:20px;min-height:20px;flex:0 0 auto;margin:0;padding:0;accent-color:var(--sea);cursor:pointer}
.chat .in{display:flex;gap:8px;padding:10px;border-top:1px solid var(--line);background:var(--card)}
.chat .in input{flex:1;padding:11px 12px;border-radius:12px}
.chat .in button{border:0;background:var(--sea);color:#fff;border-radius:12px;padding:0 16px;font:700 .9rem var(--text);cursor:pointer}
.chat .in button:disabled{opacity:.5;cursor:default}
.chat .send{margin:0 14px 14px;align-self:stretch}
.chat .send .btn{width:100%}
@keyframes ping{0%{transform:scale(.85);opacity:.55}70%,100%{transform:scale(1.55);opacity:0}}
@keyframes liveDot{0%,100%{opacity:1}50%{opacity:.35}}
@media (prefers-reduced-motion:reduce){.chat-launch,.chat-launch:after,.chat .ch small:before{animation:none!important}.chat{transition:none}}