/* ===========================================================================
   PLEVIX — VIXI, vzhľad plávajúceho asistenta
   ---------------------------------------------------------------------------
   Panel sa farebne drží stránky, na ktorej stojí: na tmavej domovskej je
   tmavý, na svetlých podstránkach svetlý. Biele okno na tmavej stránke
   vyzeralo ako cudzí prvok.

   Prázdny stav nie je prázdny — namiesto veľkej medzery sú návrhy otázok
   ako karty. Rýchle otázky sa zabalia do riadkov, nikdy nemajú vodorovný
   posuvník.
   =========================================================================== */

#pxVixi{
  --pxv-bg:#fff; --pxv-bg2:#f7f8fc; --pxv-line:#e3e7f0;
  --pxv-ink:#1f2937; --pxv-dim:#5b6779; --pxv-soft:#f4f3ff;
  --pxv-acc:#4f46e5; --pxv-acc2:#7c3aed;
  font-family:'IBM Plex Sans',system-ui,sans-serif}
html.px-domov #pxVixi,
html[data-plevix-theme="dark"] #pxVixi{
  --pxv-bg:#0F1424; --pxv-bg2:#0A0E1A; --pxv-line:rgba(148,163,184,.2);
  --pxv-ink:#EEF1F7; --pxv-dim:#98A2B8; --pxv-soft:rgba(99,102,241,.14)}

/* ── plávajúce tlačidlo ───────────────────────────────────────────────── */
.pxv-launch{position:fixed;right:22px;bottom:22px;z-index:1000;display:flex;align-items:center;
  gap:10px;padding:9px 17px 9px 9px;border:0;border-radius:999px;cursor:pointer;font-family:inherit;
  background:linear-gradient(135deg,#6366F1,#7C3AED);color:#fff;
  box-shadow:0 16px 40px rgba(79,70,229,.45),0 1px 0 rgba(255,255,255,.25) inset;
  transition:transform .18s,box-shadow .18s}
.pxv-launch:hover{transform:translateY(-2px);box-shadow:0 22px 52px rgba(79,70,229,.6),0 1px 0 rgba(255,255,255,.25) inset}
.pxv-launch:focus-visible{outline:2px solid #fff;outline-offset:3px}
.pxv-launch[aria-expanded="true"]{transform:scale(.94);opacity:.6}
.pxv-avatar{position:relative;width:38px;height:38px;flex:0 0 auto;display:grid;place-items:center;
  border-radius:50%;background:rgba(255,255,255,.18);
  font:800 13px 'IBM Plex Sans',system-ui,sans-serif;color:#fff}
.pxv-launch .pxv-avatar:after{content:"";position:absolute;right:-1px;bottom:-1px;width:11px;height:11px;
  border-radius:50%;background:#34D399;border:2px solid #6366F1;animation:pxvTlk 2.6s ease-in-out infinite}
@keyframes pxvTlk{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.18);opacity:.75}}
.pxv-copy{display:flex;flex-direction:column;text-align:left;line-height:1.2}
.pxv-copy b{font:700 13px 'IBM Plex Sans',system-ui,sans-serif}
.pxv-copy small{font:500 10.5px 'IBM Plex Sans',system-ui,sans-serif;color:#DDD6FE}

/* ── panel ────────────────────────────────────────────────────────────── */
.pxv-panel{position:fixed;right:22px;bottom:22px;z-index:1001;
  width:min(400px,calc(100vw - 24px));height:min(640px,calc(100vh - 44px));
  display:grid;grid-template-rows:auto 1fr auto auto auto;overflow:hidden;
  border:1px solid var(--pxv-line);border-radius:24px;background:var(--pxv-bg);
  box-shadow:0 32px 80px rgba(9,12,26,.5);
  animation:pxvIn .22s cubic-bezier(.2,.8,.2,1)}
.pxv-panel[hidden]{display:none}
@keyframes pxvIn{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}

.pxv-head{position:relative;display:flex;align-items:center;gap:11px;padding:16px;
  border-bottom:1px solid var(--pxv-line);
  background:linear-gradient(135deg,rgba(99,102,241,.16),transparent 70%)}
.pxv-head:after{content:"";position:absolute;left:0;right:0;top:0;height:2px;
  background:linear-gradient(90deg,transparent,#818CF8,transparent)}
.pxv-head .pxv-avatar{background:linear-gradient(135deg,#6366F1,#8B5CF6);
  box-shadow:0 6px 18px rgba(99,102,241,.5)}
.pxv-head>span:nth-child(2){flex:1 1 auto;min-width:0;display:flex;flex-direction:column}
.pxv-head b{font:700 13.5px 'IBM Plex Sans',system-ui,sans-serif;color:var(--pxv-ink)}
.pxv-head small{margin-top:3px;display:flex;align-items:center;gap:6px;
  font:400 11px 'IBM Plex Sans',system-ui,sans-serif;color:var(--pxv-dim)}
.pxv-head small:before{content:"";width:6px;height:6px;border-radius:50%;background:#34D399;flex:0 0 auto}
.pxv-head button{width:34px;height:34px;flex:0 0 auto;border:1px solid var(--pxv-line);
  border-radius:11px;cursor:pointer;background:transparent;color:var(--pxv-dim);font-size:18px;line-height:1}
.pxv-head button:hover{background:var(--pxv-soft);color:var(--pxv-ink)}

/* ── správy ───────────────────────────────────────────────────────────── */
.pxv-msgs{padding:16px 16px 6px;overflow-y:auto;background:var(--pxv-bg2);
  display:flex;flex-direction:column;gap:10px;scrollbar-width:thin}
.pxv-msgs::-webkit-scrollbar{width:8px}
.pxv-msgs::-webkit-scrollbar-thumb{background:var(--pxv-line);border-radius:6px}
.pxv-msg{max-width:86%;padding:12px 14px;
  font:400 13px/1.62 'IBM Plex Sans',system-ui,sans-serif;white-space:pre-wrap;
  animation:pxvMsg .2s ease-out}
@keyframes pxvMsg{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.pxv-msg.bot{align-self:flex-start;border-radius:16px 16px 16px 5px;
  background:var(--pxv-bg);border:1px solid var(--pxv-line);color:var(--pxv-ink)}
.pxv-msg.ja{align-self:flex-end;border-radius:16px 16px 5px 16px;
  background:linear-gradient(135deg,#6366F1,#4F46E5);color:#fff;
  box-shadow:0 8px 22px rgba(79,70,229,.32)}

/* píše… */
.pxv-typing{display:flex;gap:5px;align-items:center;padding:14px}
.pxv-typing i{width:7px;height:7px;border-radius:50%;background:var(--pxv-dim);display:block;
  animation:pxvDot 1.2s ease-in-out infinite}
.pxv-typing i:nth-child(2){animation-delay:.15s}
.pxv-typing i:nth-child(3){animation-delay:.3s}
@keyframes pxvDot{0%,60%,100%{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}

/* ── návrhy v prázdnom stave ──────────────────────────────────────────── */
.pxv-tips{display:flex;flex-direction:column;gap:7px;margin-top:4px}
.pxv-tips button{display:flex;align-items:center;gap:10px;width:100%;text-align:left;cursor:pointer;
  padding:12px 14px;border-radius:13px;border:1px solid var(--pxv-line);background:var(--pxv-bg);
  font:600 12.5px 'IBM Plex Sans',system-ui,sans-serif;color:var(--pxv-ink);
  transition:border-color .15s,background .15s,transform .15s}
.pxv-tips button:hover{border-color:var(--pxv-acc);background:var(--pxv-soft);transform:translateY(-1px)}
.pxv-tips button i{font-style:normal;color:var(--pxv-acc);font-weight:700}
.pxv-tips button span{flex:1 1 auto;min-width:0}

/* ── rýchle otázky ────────────────────────────────────────────────────── */
.pxv-quick{display:flex;flex-wrap:wrap;gap:6px;padding:11px 14px;border-top:1px solid var(--pxv-line)}
.pxv-quick button{cursor:pointer;border:1px solid var(--pxv-line);border-radius:999px;
  padding:8px 12px;background:transparent;color:var(--pxv-dim);
  font:600 11px 'IBM Plex Sans',system-ui,sans-serif;transition:border-color .15s,color .15s}
.pxv-quick button:hover{border-color:var(--pxv-acc);color:var(--pxv-ink)}

/* ── vstup ────────────────────────────────────────────────────────────── */
.pxv-form{display:flex;align-items:flex-end;gap:8px;padding:12px 14px;border-top:1px solid var(--pxv-line)}
.pxv-form textarea{flex:1 1 auto;min-width:0;resize:none;min-height:46px;max-height:120px;
  padding:13px 15px;border:1px solid var(--pxv-line);border-radius:16px;background:var(--pxv-bg2);
  color:var(--pxv-ink);font:400 13px/1.5 inherit}
.pxv-form textarea::placeholder{color:var(--pxv-dim)}
.pxv-form textarea:focus{outline:0;border-color:var(--pxv-acc);background:var(--pxv-bg)}
.pxv-form button{width:46px;height:46px;flex:0 0 auto;border:0;border-radius:15px;cursor:pointer;
  background:linear-gradient(135deg,#6366F1,#4F46E5);color:#fff;font-size:17px;
  box-shadow:0 8px 20px rgba(79,70,229,.35);transition:transform .15s}
.pxv-form button:hover{transform:translateY(-1px)}
.pxv-note{margin:0;padding:0 16px 13px;text-align:center;
  font:400 10.5px/1.5 'IBM Plex Sans',system-ui,sans-serif;color:var(--pxv-dim)}

@media (max-width:640px){
  .pxv-launch{right:12px;bottom:12px;padding:9px}
  .pxv-copy{display:none}
  .pxv-panel{right:10px;left:10px;width:auto;bottom:10px;height:min(600px,calc(100vh - 20px))}
}
@media (prefers-reduced-motion: reduce){
  .pxv-panel,.pxv-msg{animation:none}
  .pxv-launch .pxv-avatar:after,.pxv-typing i{animation:none}
}