/* Base layout */
#dcc-chatbot-root{position:fixed; inset:auto 1rem 1rem auto; z-index:2147483000}
#dcc-chatbot-root .dcc-bot__launcher{
  position:fixed; right:1rem; bottom:1rem; width:56px; height:56px;
  border-radius:999px; border:none; background:#0b6; color:#fff; font-size:22px; box-shadow:0 6px 20px rgba(0,0,0,.2); cursor:pointer
}
#dcc-chatbot-root .dcc-bot__overlay{
  position:fixed; inset:0; background:rgba(0,0,0,.15); backdrop-filter:saturate(120%) blur(1px);
}

/* Panel (closed = inert) */
#dcc-chatbot-root .dcc-bot__panel{
  position:fixed; right:1rem; bottom:5.25rem; width:360px; height:560px;
  max-height:70vh; background:#fff; border-radius:16px; box-shadow:0 12px 40px rgba(0,0,0,.25);
  display:flex; flex-direction:column; overflow:hidden;

  /* closed state */
  pointer-events:none; opacity:0; visibility:hidden; transform:translateY(8px);
  transition:opacity .18s ease, transform .18s ease, visibility 0s .18s;
}
#dcc-chatbot-root .dcc-bot__overlay{ display:none; pointer-events:none }
#dcc-chatbot-root.is-open .dcc-bot__panel{
  pointer-events:auto; opacity:1; visibility:visible; transform:none; transition:opacity .18s ease, transform .18s ease, visibility 0s
}
#dcc-chatbot-root.is-open .dcc-bot__overlay{ display:block; pointer-events:auto }

/* Header/body */
.dcc-bot__header{display:flex; align-items:center; justify-content:space-between; padding:.6rem .75rem; background:#0b6; color:#fff}
.dcc-bot__title{font-weight:700; font-size:15px}
.dcc-bot__close{background:transparent; border:none; color:#fff; font-size:18px; cursor:pointer}
.dcc-bot__body{display:flex; flex-direction:column; gap:.5rem; height:100%; background:#f7f7f9}
.dcc-bot__messages{flex:1; overflow:auto; padding:.75rem}

/* Bubbles */
.dcc-bot__msg{max-width:86%; padding:.55rem .7rem; border-radius:12px; margin:.25rem 0; line-height:1.35}
.dcc-bot__msg--me{background:#e6f7ef; margin-left:auto}
.dcc-bot__msg--bot{background:#fff; margin-right:auto; border:1px solid #eee}

/* Input */
.dcc-bot__form{display:flex; gap:.5rem; padding:.5rem .75rem; background:#fff; border-top:1px solid #eee}
.dcc-bot__form input{flex:1; border:1px solid #ddd; border-radius:10px; padding:.55rem .65rem}
.dcc-bot__send{border:none; background:#0b6; color:#fff; padding:.55rem .8rem; border-radius:10px; cursor:pointer}

/* Chips */
.dcc-bot__chips{display:flex; flex-wrap:wrap; gap:.35rem; padding:0 .75rem .25rem}
.dcc-bot__chips button{border:1px solid #ddd; background:#fff; border-radius:999px; padding:.25rem .55rem; cursor:pointer}

/* Typing */
.dcc-typing .dots{display:inline-flex; gap:4px; margin-left:.4rem}
.dcc-typing .dot{width:6px; height:6px; border-radius:50%; background:#bbb; display:inline-block; animation:dccDots 1s infinite ease-in-out}
.dcc-typing .dot:nth-child(2){animation-delay:.15s}
.dcc-typing .dot:nth-child(3){animation-delay:.3s}
@keyframes dccDots{0%,80%,100%{opacity:.2; transform:translateY(0)}40%{opacity:1; transform:translateY(-3px)}}

/* Lists & notes */
.dcc-lines{list-style:none; padding:0; margin:.25rem 0}
.dcc-lines li{display:flex; justify-content:space-between; gap:.5rem; padding:.15rem 0; border-bottom:1px dashed #eee}
.dcc-lines li:last-child{border-bottom:none}
.dcc-lines-plain{padding-left:1.1rem; margin:.25rem 0 .5rem}
.dcc-lines-plain li{margin:.2rem 0}
.dcc-note{font-size:.92rem; color:#666; margin:.25rem 0}
.dcc-sub{font-weight:600; color:#333; margin:.3rem 0 .2rem}

/* Naira glyph & fonts */
#dcc-chatbot-root, #dcc-chatbot-root .dcc-bot__panel, #dcc-chatbot-root .dcc-bot__msg{
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Noto Sans",Arial,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol",sans-serif
}
#dcc-chatbot-root .naira{
  font-family:"Noto Sans","Segoe UI Symbol","Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif; font-weight:600
}

/* Mobile sizing */
@media (max-width:640px){
  #dcc-chatbot-root .dcc-bot__panel{right:.75rem; left:.75rem; bottom:5rem; width:auto; height:min(70vh,520px)}
}
/* Keep chips visible at the top while messages scroll */
#dcc-chatbot-root .dcc-bot__chips{
  position: sticky;
  top: 0;
  z-index: 2;
  background: #f7f7f9;      /* same as .dcc-bot__body background */
  padding: .5rem .75rem .35rem;
  border-bottom: 1px solid #eee;
}

/* Slightly tighten messages padding (since chips moved above) */
#dcc-chatbot-root .dcc-bot__messages{
  padding: .6rem .75rem;
}