/* RoutersFox · sitio público: botones flotantes (subir / bajar) y Foxi, el asistente virtual con voz */

/* ---------- ir al inicio / al final ---------- */
.jump{position:fixed;left:max(12px,env(safe-area-inset-left));bottom:max(16px,env(safe-area-inset-bottom));z-index:80;display:flex;flex-direction:column;gap:.55rem}
.jump-btn{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;border:2px solid #fff;background:var(--grad-blue);color:#fff;cursor:pointer;box-shadow:0 8px 20px rgba(20,80,158,.4);transition:transform .2s,opacity .25s,visibility .25s}
.jump-btn:hover{transform:translateY(-3px) scale(1.07)}
.jump-btn:focus-visible{outline:3px solid var(--orange);outline-offset:3px}
.jump-btn.off{opacity:0;visibility:hidden;pointer-events:none}
html[data-tema="oscuro"] .jump-btn{border-color:#1a2745}

/* ---------- Foxi ---------- */
.chat{position:fixed;right:max(16px,env(safe-area-inset-right));bottom:max(16px,env(safe-area-inset-bottom));z-index:90;display:flex;flex-direction:column;align-items:flex-end;gap:.7rem;font-family:var(--body)}
.chat-launch{position:relative;width:76px;height:76px;border-radius:50%;border:3px solid #fff;background:linear-gradient(140deg,#ffe3c2,#ffb866);padding:0;cursor:pointer;box-shadow:0 12px 30px rgba(232,112,10,.45);transition:transform .2s;animation:chat-late 2.8s ease-in-out infinite}
.chat-launch:hover{transform:scale(1.08)}
.chat-launch:focus-visible{outline:3px solid var(--blue);outline-offset:3px}
.chat-launch .foxi-face{display:block;width:100%;height:100%;border-radius:50%;overflow:hidden}
.chat-launch img:first-child{width:100%;height:100%;object-fit:cover;display:block}
@keyframes chat-late{0%,100%{box-shadow:0 12px 30px rgba(232,112,10,.45),0 0 0 0 rgba(255,138,26,.5)}60%{box-shadow:0 12px 30px rgba(232,112,10,.45),0 0 0 14px rgba(255,138,26,0)}}
.chat-dot{position:absolute;right:2px;top:2px;width:16px;height:16px;border-radius:50%;background:#2ee59d;border:2px solid #fff}

.chat-hint{position:relative;max-width:260px;background:var(--card);color:var(--ink);border:2px solid var(--line);border-radius:18px 18px 4px 18px;padding:.9rem 1rem;box-shadow:var(--shadow);font-weight:700;font-size:.95rem;animation:chat-in .4s ease}
.chat-hint[hidden]{display:none}
.chat-hint p{margin:0 1rem .5rem 0}
.hint-close{position:absolute;right:6px;top:6px;border:0;background:none;color:var(--muted);cursor:pointer;padding:4px;border-radius:50%;line-height:0}
.hint-voice{display:inline-flex;align-items:center;gap:.4rem;border:0;border-radius:999px;background:var(--grad-or);color:#fff;font:inherit;font-weight:800;font-size:.85rem;padding:.45rem .9rem;cursor:pointer}
.hint-voice[hidden]{display:none}
@keyframes chat-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

.chat-panel{width:min(390px,calc(100vw - 24px));height:min(600px,calc(100dvh - 110px));display:flex;flex-direction:column;background:var(--card);color:var(--ink);border:1px solid var(--line);border-radius:24px;box-shadow:0 24px 60px rgba(10,30,70,.35);overflow:hidden;animation:chat-in .3s ease}
.chat-panel[hidden]{display:none}
.chat-head{display:flex;align-items:center;gap:.7rem;padding:.8rem 1rem;background:var(--grad-blue);color:#fff}
.chat-head .foxi-face,.chat-head>img{width:44px;height:44px;flex:none;border-radius:50%;border:2px solid #fff;background:linear-gradient(140deg,#ffe3c2,#ffb866);overflow:hidden}
.chat-head .foxi-face>img:first-child{width:100%;height:100%;object-fit:cover}
.chat-head div{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.2}
.chat-head strong{font:800 1.05rem var(--head)}
.chat-head span{font-size:.8rem;opacity:.92}
.chat-ico{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;border:0;background:rgba(255,255,255,.2);color:#fff;cursor:pointer;flex:none}
.chat-ico:hover{background:rgba(255,255,255,.35)}
.chat-ico .i-off{display:none}
.chat-ico[aria-pressed="false"] .i-on{display:none}.chat-ico[aria-pressed="false"] .i-off{display:block}

.chat-log{flex:1;overflow-y:auto;padding:1rem;display:flex;flex-direction:column;gap:.6rem;background:var(--bg)}
.msg{max-width:84%;padding:.65rem .95rem;border-radius:18px;font-size:.96rem;line-height:1.45;white-space:pre-wrap;word-wrap:break-word;animation:chat-in .25s ease}
.msg.bot{align-self:flex-start;background:var(--card);border:1px solid var(--line);border-bottom-left-radius:4px;box-shadow:0 2px 8px rgba(20,50,100,.08)}
.msg.user{align-self:flex-end;background:var(--grad-blue);color:#fff;border-bottom-right-radius:4px}
.msg.typing{display:flex;gap:4px;padding:.8rem 1rem}
.msg.typing i{width:8px;height:8px;border-radius:50%;background:var(--orange);animation:chat-dot 1s infinite}
.msg.typing i:nth-child(2){animation-delay:.15s}.msg.typing i:nth-child(3){animation-delay:.3s}
@keyframes chat-dot{0%,60%,100%{transform:translateY(0);opacity:.5}30%{transform:translateY(-5px);opacity:1}}

.chat-vozrow{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem .6rem;padding:.35rem .9rem;background:var(--bg);border-top:1px solid var(--line);font-size:.8rem}
.chat-vozrow[hidden]{display:none}
.chat-vozrow label{display:inline-flex;align-items:center;gap:.3rem;font-weight:800;color:var(--muted)}
.chat-vozrow select{flex:1;min-width:0;padding:.3rem .5rem;border-radius:8px;border:1px solid var(--line);background:var(--card);color:var(--ink);font:inherit;font-size:.8rem}
.chat-vozrow p{flex-basis:100%;margin:0;color:var(--orange2);font-weight:700}
.chat-vozrow p:empty{display:none}
.chat-chips{display:flex;gap:.45rem;overflow-x:auto;padding:.5rem .8rem;background:var(--bg);scrollbar-width:thin}
.chat-chips:empty{display:none}
.chat-chips button,.chat-chips a{flex:none;padding:.45rem .9rem;border-radius:999px;border:1.5px solid var(--blue);background:var(--card);color:var(--ink);font:inherit;font-weight:800;font-size:.85rem;cursor:pointer;text-decoration:none;white-space:nowrap}
.chat-chips button:hover,.chat-chips a:hover{background:var(--blue);color:#fff}
.chat-form{display:flex;gap:.45rem;align-items:center;padding:.7rem .8rem;border-top:1px solid var(--line);background:var(--card)}
.chat-form input{flex:1;min-width:0;padding:.7rem 1rem;border-radius:999px;border:1.5px solid var(--line);background:var(--bg);color:var(--ink);font:inherit}
.chat-form input:focus{outline:none;border-color:var(--blue)}
.chat-form .mic{background:var(--soft);color:var(--blue);border:1.5px solid var(--line)}
.chat-form .mic[hidden]{display:none}
.chat-form .mic.on{background:var(--red);color:#fff;border-color:var(--red);animation:chat-late 1.2s infinite}
.chat-send{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;border:0;background:var(--grad-or);color:#fff;cursor:pointer;flex:none}
.chat-foot{margin:0;padding:.35rem .9rem .6rem;font-size:.72rem;color:var(--muted);background:var(--card);text-align:center}
.chat-foot a{color:var(--link)}

/* minimizada: solo la barra con Foxi y sus botones */
.chat-panel.min{height:auto;width:min(320px,calc(100vw - 24px));cursor:pointer}
.chat-panel.min .chat-log,.chat-panel.min .chat-vozrow,.chat-panel.min .chat-chips,.chat-panel.min .chat-form,.chat-panel.min .chat-foot{display:none}

/* Foxi hablando: mueve la cabeza y parpadea más seguido */
@keyframes chat-habla{0%{transform:translateY(0) rotate(-1.2deg) scale(1)}50%{transform:translateY(-2.5%) rotate(1.2deg) scale(1.035)}100%{transform:translateY(0) rotate(-.6deg) scale(1)}}
.hablando .foxi-face>img:first-child{animation:chat-habla .42s ease-in-out infinite}
.hablando .foxi-face .fx-lid{animation-duration:2.8s}
.chat-launch.hablando{animation:chat-onda 1.1s ease-out infinite}
@keyframes chat-onda{0%{box-shadow:0 12px 30px rgba(232,112,10,.45),0 0 0 0 rgba(31,111,209,.55)}100%{box-shadow:0 12px 30px rgba(232,112,10,.45),0 0 0 18px rgba(31,111,209,0)}}

html[data-tema="oscuro"] .chat-launch,html[data-tema="oscuro"] .jump-btn{box-shadow:0 10px 26px rgba(0,0,0,.55)}
@media (prefers-reduced-motion:reduce){.chat-launch,.hablando .foxi-face>img:first-child,.chat-form .mic.on,.msg.typing i{animation:none!important}}

@media (max-width:640px){
  .chat{right:max(10px,env(safe-area-inset-right));bottom:max(10px,env(safe-area-inset-bottom))}
  .chat-panel{width:min(340px,calc(100vw - 20px));height:min(470px,calc(100dvh - 120px),68dvh);border-radius:20px}
  .chat-launch[aria-expanded="true"]{display:none}
  .chat-launch{width:62px;height:62px}
  .chat-head{padding:.55rem .75rem;gap:.55rem}
  .chat-head .foxi-face,.chat-head>img{width:36px;height:36px}
  .chat-head strong{font-size:.98rem}.chat-head span{font-size:.72rem}
  .chat-ico{width:32px;height:32px}
  .chat-log{padding:.7rem;gap:.45rem}
  .msg{font-size:.9rem;padding:.5rem .8rem;line-height:1.4}
  .chat-chips{padding:.4rem .6rem}
  .chat-chips button,.chat-chips a{padding:.35rem .75rem;font-size:.8rem}
  .chat-form{padding:.5rem .6rem}
  .chat-form input{padding:.55rem .9rem;font-size:16px}
  .chat-send{width:38px;height:38px}
  .chat-foot{padding:.25rem .7rem .45rem;font-size:.66rem}
  .chat-hint{max-width:210px;font-size:.88rem}
  .jump{left:max(8px,env(safe-area-inset-left));bottom:max(10px,env(safe-area-inset-bottom))}
  .jump-btn{width:40px;height:40px}
}
@media print{.jump,.chat{display:none!important}}