.spi8achat {
  --chat-accent: #d7262e;
  --chat-bg: #ffffff;
  --chat-soft: #f4f5f7;
  --chat-text: #202124;
  --chat-muted: #6b7280;
  width: 100%;
  box-sizing: border-box;
  border: 1px solid rgba(0,0,0,.12);
  border-radius: 14px;
  background: var(--chat-bg);
  color: var(--chat-text);
  overflow: hidden;
  box-shadow: 0 6px 24px rgba(0,0,0,.08);
}
.spi8achat *, .spi8achat *::before, .spi8achat *::after { box-sizing: border-box; }
.spi8achat__header { display:flex; align-items:center; gap:.55rem; padding:.8rem 1rem; background:#111827; color:#fff; }
.spi8achat__dot { flex:0 0 auto; width:.65rem; height:.65rem; border-radius:50%; background:#22c55e; box-shadow:0 0 0 .2rem rgba(34,197,94,.18); }
.spi8achat__status { min-height:1.4rem; padding:.35rem .8rem 0; font-size:.82rem; color:var(--chat-muted); }
.spi8achat__messages { height:320px; overflow-y:auto; padding:.65rem .8rem; scroll-behavior:smooth; }
.spi8achat__empty { text-align:center; color:var(--chat-muted); padding:2rem .5rem; }
.spi8achat__item { position:relative; margin:0 0 .55rem; padding:.55rem .7rem; background:var(--chat-soft); border-radius:10px; overflow-wrap:anywhere; }
.spi8achat__meta { display:flex; gap:.45rem; align-items:baseline; margin-bottom:.15rem; }
.spi8achat__name { font-weight:700; }
.spi8achat__time { font-size:.72rem; color:var(--chat-muted); }
.spi8achat__delete { margin-left:auto; border:0; background:transparent; color:#b91c1c; cursor:pointer; font-size:.78rem; }
.spi8achat__form { display:grid; grid-template-columns:minmax(0, 1fr); gap:.65rem; width:100%; padding:.8rem; border-top:1px solid rgba(0,0,0,.1); }
.spi8achat__field { display:grid; grid-template-columns:minmax(0, 1fr); gap:.25rem; width:100%; margin:0; }
.spi8achat__label { display:block; font-size:.82rem; font-weight:600; line-height:1.3; }
.spi8achat__form input, .spi8achat__form textarea { display:block; width:100%; max-width:100%; min-width:0; margin:0; border:1px solid #cbd5e1; border-radius:8px; padding:.55rem .65rem; font:inherit; line-height:1.35; background:#fff; color:#111827; }
.spi8achat__form textarea { min-height:5.2rem; resize:vertical; }
.spi8achat__form input:focus, .spi8achat__form textarea:focus { outline:2px solid rgba(215,38,46,.25); border-color:var(--chat-accent); }
.spi8achat__website { position:absolute !important; left:-9999px !important; width:1px !important; height:1px !important; }
.spi8achat__send { display:block; width:100%; margin:0; border:0; border-radius:8px; padding:.65rem .9rem; background:var(--chat-accent); color:#fff; font-weight:700; cursor:pointer; }
.spi8achat__send:disabled { opacity:.6; cursor:wait; }
.spi8achat__closed { padding:1rem; text-align:center; border-top:1px solid rgba(0,0,0,.1); color:var(--chat-muted); }
@media (prefers-color-scheme: dark) {
  .spi8achat { --chat-bg:#17191d; --chat-soft:#24272d; --chat-text:#f3f4f6; --chat-muted:#a5acb8; border-color:rgba(255,255,255,.13); }
  .spi8achat__form input, .spi8achat__form textarea { background:#111317; color:#f3f4f6; border-color:#4b5563; }
}