/* ============================================================
   webweb — Asystent (chatbot regulowy, bez integracji)
   Brand: akcent #e8004f, ciemny panel, font dziedziczony
   Zero cookies / zero zapytan zewnetrznych
   v2: mniejszy launcher, pojawia sie po preloaderze, + funkcje
   ============================================================ */

#ww-bot, #ww-bot * { box-sizing: border-box; }

/* Ukryty do momentu gotowosci (po preloaderze) */
#ww-bot{ opacity: 0; visibility: hidden; transition: opacity .45s ease; }
#ww-bot.ww-ready{ opacity: 1; visibility: visible; }

/* ---- Launcher (mniejszy) ---- */
.ww-bot-launcher{
  position: fixed; right: 22px; bottom: 22px;
  width: 50px; height: 50px; border-radius: 50%;
  background: #e8004f; color: #fff; border: none; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 6px 22px rgba(232,0,79,.40), 0 2px 6px rgba(0,0,0,.22);
  z-index: 99990; transition: transform .2s ease, box-shadow .2s ease;
  -webkit-tap-highlight-color: transparent;
}
.ww-bot-launcher:hover{ transform: translateY(-2px) scale(1.05); box-shadow: 0 10px 28px rgba(232,0,79,.55); }
.ww-bot-launcher:focus-visible{ outline: 3px solid #ff7aa8; outline-offset: 3px; }
.ww-bot-launcher svg{ width: 23px; height: 23px; }
.ww-bot-launcher .ww-ico-close{ display: none; }
.ww-bot.is-open .ww-bot-launcher .ww-ico-chat{ display: none; }
.ww-bot.is-open .ww-bot-launcher .ww-ico-close{ display: block; }

/* licznik nieprzeczytanych */
.ww-unread{
  position: absolute; top: -3px; right: -3px; min-width: 18px; height: 18px; padding: 0 4px;
  background: #fff; color: #e8004f; border-radius: 999px; font-size: 11px; font-weight: 800;
  display: none; align-items: center; justify-content: center; line-height: 1;
  box-shadow: 0 2px 6px rgba(0,0,0,.25); border: 2px solid #e8004f;
}
.ww-bot.ww-has-unread:not(.is-open) .ww-unread{ display: flex; }

/* delikatny puls */
.ww-bot-launcher::after{
  content:""; position:absolute; inset:0; border-radius:50%;
  box-shadow: 0 0 0 0 rgba(232,0,79,.4); animation: wwPulse 2.6s ease-out infinite;
}
.ww-bot.is-open .ww-bot-launcher::after,
.ww-bot.seen .ww-bot-launcher::after{ animation: none; }
@keyframes wwPulse{ 0%{box-shadow:0 0 0 0 rgba(232,0,79,.4);} 70%{box-shadow:0 0 0 14px rgba(232,0,79,0);} 100%{box-shadow:0 0 0 0 rgba(232,0,79,0);} }

/* dymek powitalny */
.ww-bot-badge{
  position: fixed; right: 80px; bottom: 30px; z-index: 99990;
  background:#fff; color:#0a0909; font-size:13px; line-height:1.4;
  padding:10px 14px; border-radius: 14px 14px 2px 14px; max-width: 220px;
  box-shadow: 0 8px 24px rgba(0,0,0,.18); border:1px solid #eee;
  font-family: inherit; cursor: pointer; display: none;
  transform: translateY(6px); opacity: 0; transition: opacity .3s ease, transform .3s ease;
}
.ww-bot.ww-badge-show:not(.is-open):not(.seen) .ww-bot-badge{ display:block; transform: translateY(0); opacity: 1; }
.ww-bot-badge b{ color:#e8004f; }
.ww-bot-badge-close{ position:absolute; top:-8px; right:-8px; width:20px; height:20px; border-radius:50%;
  background:#0a0909; color:#fff; border:none; cursor:pointer; font-size:12px; line-height:1; }

/* ---- Panel ---- */
.ww-bot-panel{
  position: fixed; right: 22px; bottom: 84px; z-index: 99991;
  width: 384px; max-width: calc(100vw - 32px);
  height: 580px; max-height: calc(100vh - 120px);
  background: #171414; color: #eeedee; border-radius: 18px;
  border: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 24px 60px rgba(0,0,0,.45);
  display: none; flex-direction: column; overflow: hidden;
  font-family: inherit;
  opacity: 0; transform: translateY(14px) scale(.98);
  transition: opacity .22s ease, transform .22s ease;
}
.ww-bot.is-open .ww-bot-panel{ display: flex; }
.ww-bot.is-anim .ww-bot-panel{ opacity: 1; transform: translateY(0) scale(1); }

/* Header */
.ww-bot-head{
  display:flex; align-items:center; gap:12px; padding:16px 14px 14px;
  background: linear-gradient(135deg, #1f1a1a 0%, #0a0909 100%);
  border-bottom: 1px solid rgba(232,0,79,.25); position:relative;
}
.ww-bot-head::after{ content:""; position:absolute; left:0; right:0; bottom:-1px; height:2px;
  background: linear-gradient(90deg, transparent, #e8004f, transparent); }
.ww-bot-avatar{ width:40px; height:40px; border-radius:50%; background:#e8004f; color:#fff;
  display:flex; align-items:center; justify-content:center; flex:0 0 auto; }
.ww-bot-avatar svg{ width:22px; height:22px; }
.ww-bot-head-txt{ flex:1 1 auto; min-width:0; }
.ww-bot-title{ font-size:15px; font-weight:700; color:#fff; letter-spacing:.2px; }
.ww-bot-sub{ font-size:12px; color:#9a9594; display:flex; align-items:center; gap:6px; margin-top:2px; }
.ww-bot-dot{ width:8px; height:8px; border-radius:50%; background:#16c47f; animation: wwLive 2s infinite; }
@keyframes wwLive{ 0%{box-shadow:0 0 0 0 rgba(22,196,127,.55);} 70%{box-shadow:0 0 0 6px rgba(22,196,127,0);} 100%{box-shadow:0 0 0 0 rgba(22,196,127,0);} }
.ww-head-btns{ display:flex; gap:2px; }
.ww-icobtn{ background:transparent; border:none; color:#cfcaca; cursor:pointer; padding:6px; border-radius:8px; line-height:0; }
.ww-icobtn:hover{ background:rgba(255,255,255,.08); color:#fff; }
.ww-icobtn:focus-visible{ outline:2px solid #ff7aa8; outline-offset:1px; }
.ww-icobtn svg{ width:19px; height:19px; }

/* Messages */
.ww-bot-msgs{ flex:1 1 auto; overflow-y:auto; padding:18px 16px 8px; display:flex; flex-direction:column; gap:12px; scroll-behavior:smooth; }
.ww-bot-msgs::-webkit-scrollbar{ width:8px; } .ww-bot-msgs::-webkit-scrollbar-thumb{ background:rgba(255,255,255,.14); border-radius:8px; }
.ww-row{ display:flex; gap:8px; align-items:flex-end; max-width:100%; animation: wwIn .25s ease; }
@keyframes wwIn{ from{opacity:0; transform:translateY(6px);} to{opacity:1; transform:none;} }
.ww-row.bot{ justify-content:flex-start; }
.ww-row.user{ justify-content:flex-end; }
.ww-bub{ padding:11px 14px; border-radius:16px; font-size:14px; line-height:1.5; max-width:84%; word-wrap:break-word; overflow-wrap:anywhere; }
.ww-row.bot .ww-bub{ background:#2a2525; color:#eeedee; border-bottom-left-radius:4px; }
.ww-row.user .ww-bub{ background:#e8004f; color:#fff; border-bottom-right-radius:4px; }
.ww-bub a.ww-inline{ color:#ff5c8a; text-decoration:underline; }
.ww-bub p{ margin:0 0 8px; } .ww-bub p:last-child{ margin:0; }
.ww-bub ul{ margin:6px 0 0; padding-left:18px; } .ww-bub li{ margin:3px 0; }
.ww-bub strong{ color:#fff; }

/* przyciski-akcje */
.ww-actions{ display:flex; flex-direction:column; gap:8px; margin-top:10px; }
.ww-act{ display:inline-flex; align-items:center; justify-content:space-between; gap:8px;
  background:#e8004f; color:#fff !important; text-decoration:none !important; font-size:13.5px; font-weight:600;
  padding:10px 14px; border-radius:10px; transition: background .15s ease, transform .12s ease; }
.ww-act:hover{ background:#ff1f6a; transform:translateY(-1px); }
.ww-act.ghost{ background:transparent; color:#ff7aa8 !important; border:1px solid rgba(232,0,79,.5); }
.ww-act.ghost:hover{ background:rgba(232,0,79,.12); }
.ww-act svg{ width:15px; height:15px; flex:0 0 auto; }

/* typing */
.ww-typing{ display:flex; gap:4px; padding:12px 14px; }
.ww-typing span{ width:7px; height:7px; border-radius:50%; background:#8a8585; animation: wwBlink 1.2s infinite; }
.ww-typing span:nth-child(2){ animation-delay:.2s; } .ww-typing span:nth-child(3){ animation-delay:.4s; }
@keyframes wwBlink{ 0%,60%,100%{opacity:.3; transform:translateY(0);} 30%{opacity:1; transform:translateY(-3px);} }

/* Quick replies */
.ww-quick{ display:flex; flex-wrap:wrap; gap:7px; padding:6px 14px 12px; border-top:1px solid rgba(255,255,255,.06); }
.ww-chip{ background:transparent; border:1px solid rgba(232,0,79,.55); color:#ff7aa8; font-family:inherit;
  font-size:12.5px; font-weight:600; padding:7px 12px; border-radius:999px; cursor:pointer; transition:all .15s ease; }
.ww-chip:hover{ background:#e8004f; color:#fff; border-color:#e8004f; }
.ww-chip:focus-visible{ outline:2px solid #ff7aa8; outline-offset:2px; }
.ww-chip.ww-chip-alt{ border-color:rgba(255,255,255,.25); color:#cfcaca; }
.ww-chip.ww-chip-alt:hover{ background:rgba(255,255,255,.12); color:#fff; border-color:rgba(255,255,255,.4); }

/* Input */
.ww-bot-input{ display:flex; gap:8px; padding:12px 14px 10px; border-top:1px solid rgba(255,255,255,.08); background:#120f0f; }
.ww-bot-input input{ flex:1 1 auto; background:#241f1f; border:1px solid rgba(255,255,255,.1); color:#fff;
  border-radius:12px; padding:11px 14px; font-size:14px; font-family:inherit; outline:none; }
.ww-bot-input input::placeholder{ color:#8a8585; }
.ww-bot-input input:focus{ border-color:#e8004f; }
.ww-bot-send{ background:#e8004f; border:none; color:#fff; width:44px; height:44px; border-radius:12px; cursor:pointer;
  display:flex; align-items:center; justify-content:center; flex:0 0 auto; transition:background .15s ease; }
.ww-bot-send:hover{ background:#ff1f6a; } .ww-bot-send svg{ width:20px; height:20px; }

.ww-bot-foot{ text-align:center; font-size:10.5px; color:#6a6767; padding:0 0 10px; background:#120f0f; }
.ww-bot-foot a{ color:#8a8585; text-decoration:underline; }

/* Mobile */
@media (max-width: 480px){
  .ww-bot-panel{ right:8px; left:8px; bottom:78px; width:auto; max-width:none; height:calc(100vh - 96px); max-height:none; }
  .ww-bot-badge{ display:none !important; }
  .ww-bot-launcher{ right:16px; bottom:16px; width:46px; height:46px; }
  .ww-bot-launcher svg{ width:21px; height:21px; }
}

/* Reduce motion */
@media (prefers-reduced-motion: reduce){
  .ww-bot-launcher::after, .ww-bot-dot, .ww-row{ animation:none !important; }
  .ww-bot-panel, #ww-bot, .ww-bot-badge{ transition:none !important; }
}

/* ============================================================
   LIGHT MODE (body.light-mode) — jasny panel, ciemny tekst
   Launcher, akcent #e8004f i banki uzytkownika pozostaja.
   ============================================================ */
body.light-mode .ww-bot-panel{
  background:#ffffff; color:#1e1c1c; border-color:rgba(0,0,0,.08);
  box-shadow:0 24px 60px rgba(20,17,17,.22);
}
body.light-mode .ww-bot-head{
  background:linear-gradient(135deg,#ffffff 0%,#f4f0eb 100%);
  border-bottom-color:rgba(232,0,79,.22);
}
body.light-mode .ww-bot-title{ color:#0a0909; }
body.light-mode .ww-bot-sub{ color:#6a6767; }
body.light-mode .ww-icobtn{ color:#6a6767; }
body.light-mode .ww-icobtn:hover{ background:rgba(0,0,0,.06); color:#0a0909; }

body.light-mode .ww-bot-msgs::-webkit-scrollbar-thumb{ background:rgba(0,0,0,.18); }
body.light-mode .ww-row.bot .ww-bub{ background:#f0ede8; color:#2e2b2b; }
body.light-mode .ww-bub strong{ color:#0a0909; }
body.light-mode .ww-bub a.ww-inline{ color:#e8004f; }
/* banki uzytkownika i przyciski-akcje (.ww-act) zostaja akcentowe */

body.light-mode .ww-quick{ border-top-color:rgba(0,0,0,.08); }
body.light-mode .ww-chip{ color:#e8004f; border-color:rgba(232,0,79,.55); }
body.light-mode .ww-chip:hover{ background:#e8004f; color:#fff; }
body.light-mode .ww-chip.ww-chip-alt{ border-color:rgba(0,0,0,.2); color:#6a6767; }
body.light-mode .ww-chip.ww-chip-alt:hover{ background:rgba(0,0,0,.08); color:#0a0909; border-color:rgba(0,0,0,.35); }

body.light-mode .ww-bot-input{ background:#f4f0eb; border-top-color:rgba(0,0,0,.08); }
body.light-mode .ww-bot-input input{ background:#ffffff; border-color:rgba(0,0,0,.15); color:#0a0909; }
body.light-mode .ww-bot-input input::placeholder{ color:#8a8585; }
body.light-mode .ww-bot-input input:focus{ border-color:#e8004f; }

body.light-mode .ww-bot-foot{ background:#f4f0eb; color:#8a8585; }
body.light-mode .ww-bot-foot a{ color:#6a6767; }

body.light-mode .ww-typing span{ background:#b5afaf; }