/* ==========================================================================
   chat-widget.css  —  Eazy Plug local AI chat widget
   LOCAL ONLY. No @import, no remote url(), no web fonts, no CDNs, no trackers.
   Brand palette only: brown #701f00, gold #e09900, taupe #71645d,
   cream #f8f4ee / #f3eee4, white. Open Sans system stack.
   All selectors namespaced .epc-  (Eazy Plug Chat).
   ========================================================================== */

.epc-root{
  --epc-brown:#701f00;
  --epc-gold:#e09900;
  --epc-gold-d:#b97c00;
  --epc-taupe:#71645d;
  --epc-cream:#f8f4ee;
  --epc-card:#f3eee4;
  --epc-ink:#4d453d;
  --epc-muted:#6c736c;
  --epc-line:#e7e0d6;
  --epc-white:#ffffff;
  --epc-font:'Open Sans',Helvetica,Arial,sans-serif;
  --epc-shadow:0 14px 40px rgba(60,40,20,.26);
  position:fixed;
  right:22px;
  bottom:22px;
  z-index:2147483000;
  font-family:var(--epc-font);
}
.epc-root *,
.epc-root *::before,
.epc-root *::after{ box-sizing:border-box; }

/* ---- launcher button ----------------------------------------------------- */
.epc-launcher{
  display:flex;
  align-items:center;
  gap:10px;
  border:0;
  cursor:pointer;
  background:var(--epc-brown);
  color:var(--epc-white);
  font-family:var(--epc-font);
  font-size:15px;
  font-weight:700;
  letter-spacing:.2px;
  padding:13px 18px;
  border-radius:30px;
  box-shadow:var(--epc-shadow);
  transition:transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.epc-launcher:hover{ background:#5c1900; transform:translateY(-1px); }
.epc-launcher:focus-visible{ outline:3px solid var(--epc-gold); outline-offset:2px; }
.epc-launcher__ic{
  width:22px;height:22px;flex:0 0 auto;border-radius:50%;
  background:var(--epc-gold);
  display:inline-flex;align-items:center;justify-content:center;
}
.epc-launcher__ic svg{ width:13px;height:13px;stroke:var(--epc-brown);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round; }
.epc-root.epc-open .epc-launcher{ display:none; }

/* ---- panel --------------------------------------------------------------- */
.epc-panel{
  position:absolute;
  right:0;
  bottom:0;
  width:370px;
  max-width:calc(100vw - 44px);
  height:540px;
  max-height:calc(100vh - 60px);
  display:none;
  flex-direction:column;
  background:var(--epc-cream);
  border:1px solid var(--epc-line);
  border-radius:16px;
  overflow:hidden;
  box-shadow:var(--epc-shadow);
}
.epc-root.epc-open .epc-panel{
  display:flex;
  animation:epc-slide-up .22s ease;
}
@keyframes epc-slide-up{
  from{ opacity:0; transform:translateY(14px); }
  to{ opacity:1; transform:translateY(0); }
}

/* ---- header -------------------------------------------------------------- */
.epc-header{
  display:flex;align-items:center;gap:11px;
  background:linear-gradient(135deg,#701f00 0%,#8a2a06 100%);
  color:var(--epc-white);
  padding:14px 16px;
}
.epc-header__badge{
  width:30px;height:30px;flex:0 0 auto;border-radius:8px;
  background:var(--epc-gold);
  display:inline-flex;align-items:center;justify-content:center;
}
.epc-header__badge svg{ width:17px;height:17px;stroke:var(--epc-brown);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round; }
.epc-header__txt{ flex:1 1 auto;min-width:0; }
.epc-header__title{ font-size:14.5px;font-weight:700;line-height:1.2; }
.epc-header__sub{ font-size:11.5px;opacity:.82;line-height:1.2;margin-top:2px; }
.epc-close{
  border:0;background:rgba(255,255,255,.14);color:var(--epc-white);
  width:30px;height:30px;border-radius:8px;cursor:pointer;flex:0 0 auto;
  display:inline-flex;align-items:center;justify-content:center;
  transition:background .15s ease;
}
.epc-close:hover{ background:rgba(255,255,255,.26); }
.epc-close:focus-visible{ outline:2px solid var(--epc-gold);outline-offset:2px; }
.epc-close svg{ width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round; }

/* ---- messages ------------------------------------------------------------ */
.epc-messages{
  flex:1 1 auto;
  overflow-y:auto;
  padding:16px 14px 6px;
  display:flex;
  flex-direction:column;
  gap:11px;
  scrollbar-width:thin;
}
.epc-msg{
  max-width:86%;
  padding:10px 13px;
  border-radius:13px;
  font-size:14px;
  line-height:1.55;
  white-space:pre-wrap;
  word-wrap:break-word;
  overflow-wrap:anywhere;
}
.epc-msg--bot{
  align-self:flex-start;
  background:var(--epc-white);
  color:var(--epc-ink);
  border:1px solid var(--epc-line);
  border-top-left-radius:4px;
}
.epc-msg--user{
  align-self:flex-end;
  background:var(--epc-brown);
  color:var(--epc-white);
  border-top-right-radius:4px;
}
.epc-msg--error{
  align-self:flex-start;
  background:#fbe7e2;
  color:#7a2a12;
  border:1px solid #efcabb;
  border-top-left-radius:4px;
}

/* link chips under a bot message */
.epc-links{ display:flex;flex-wrap:wrap;gap:7px;margin-top:9px; }
.epc-link{
  display:inline-block;
  font-size:12px;font-weight:600;text-decoration:none;
  color:var(--epc-brown);
  background:var(--epc-card);
  border:1px solid var(--epc-line);
  border-radius:14px;
  padding:5px 11px;
  transition:background .15s ease,border-color .15s ease;
}
.epc-link:hover{ background:#ece3d3;border-color:var(--epc-gold); }
.epc-link:focus-visible{ outline:2px solid var(--epc-gold);outline-offset:1px; }

/* typing indicator */
.epc-typing{ display:inline-flex;gap:4px;align-items:center;padding:2px 0; }
.epc-typing span{
  width:7px;height:7px;border-radius:50%;background:var(--epc-taupe);opacity:.55;
  animation:epc-bounce 1.1s infinite ease-in-out;
}
.epc-typing span:nth-child(2){ animation-delay:.16s; }
.epc-typing span:nth-child(3){ animation-delay:.32s; }
@keyframes epc-bounce{
  0%,80%,100%{ transform:translateY(0);opacity:.45; }
  40%{ transform:translateY(-4px);opacity:.9; }
}

/* ---- composer ------------------------------------------------------------ */
.epc-form{
  display:flex;align-items:flex-end;gap:9px;
  padding:11px 12px;
  background:var(--epc-white);
  border-top:1px solid var(--epc-line);
}
.epc-input{
  flex:1 1 auto;
  resize:none;
  font-family:var(--epc-font);
  font-size:14px;
  line-height:1.4;
  color:var(--epc-ink);
  background:var(--epc-cream);
  border:1px solid var(--epc-line);
  border-radius:11px;
  padding:10px 12px;
  max-height:96px;
  min-height:42px;
}
.epc-input:focus{ outline:2px solid var(--epc-gold);outline-offset:0;border-color:var(--epc-gold); }
.epc-input::placeholder{ color:var(--epc-muted); }
.epc-send{
  flex:0 0 auto;
  border:0;cursor:pointer;
  width:42px;height:42px;border-radius:11px;
  background:var(--epc-gold);
  color:var(--epc-brown);
  display:inline-flex;align-items:center;justify-content:center;
  transition:background .15s ease,opacity .15s ease;
}
.epc-send:hover{ background:var(--epc-gold-d);color:#fff; }
.epc-send:focus-visible{ outline:3px solid var(--epc-brown);outline-offset:2px; }
.epc-send svg{ width:19px;height:19px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round; }
.epc-root.epc-busy .epc-send,
.epc-send:disabled{ opacity:.5;cursor:not-allowed; }
.epc-root.epc-busy .epc-input{ opacity:.7; }

/* footer note */
.epc-foot{
  font-size:10.5px;color:var(--epc-muted);text-align:center;
  padding:0 12px 9px;background:var(--epc-white);
}

/* ---- mobile: full-width panel under 480px -------------------------------- */
@media (max-width:480px){
  .epc-root{ right:14px;bottom:14px; }
  .epc-panel{
    position:fixed;
    right:0;left:0;bottom:0;top:0;
    width:100vw;max-width:100vw;
    height:100vh;max-height:100vh;
    border-radius:0;
    border:0;
  }
}

/* ---- reduced motion ------------------------------------------------------ */
@media (prefers-reduced-motion:reduce){
  .epc-launcher,.epc-link,.epc-send,.epc-close,.epc-msg{ transition:none; }
  .epc-root.epc-open .epc-panel{ animation:none; }
  .epc-typing span{ animation:none;opacity:.6; }
}
