/* DEIA demo chat widget styles. Theme via CSS vars on :root or a wrapper:
   --dw-primary (header/user bubbles), --dw-primary-deep, --dw-accent (launcher),
   --dw-accent-ink (icon on accent), --dw-paper, --dw-ink, --dw-muted, --dw-border */
:root {
  --dw-primary: #0E2A47;
  --dw-primary-deep: #091D33;
  --dw-accent: #D4A545;
  --dw-accent-ink: #091D33;
  --dw-paper: #FFFFFF;
  --dw-paper-tint: #F4F6FA;
  --dw-ink: #1A2433;
  --dw-muted: #51607A;
  --dw-border: #DDE4EE;
}

.dw-root {
  font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 15px;
  line-height: 1.5;
}

.dw-launcher {
  position: fixed;
  bottom: 1.5rem;
  right: 1.5rem;
  z-index: 9999;
  height: 56px;
  width: 56px;
  border: none;
  border-radius: 50%;
  background: var(--dw-accent);
  color: var(--dw-accent-ink);
  cursor: pointer;
  box-shadow: 0 6px 18px rgba(9, 29, 51, 0.35);
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.12s ease;
}

.dw-launcher:hover { transform: translateY(-2px); }
.dw-launcher svg { height: 26px; width: 26px; }

.dw-panel {
  position: fixed;
  bottom: 5.75rem;
  right: 1.5rem;
  z-index: 9999;
  width: min(360px, calc(100vw - 2rem));
  height: min(520px, calc(100vh - 8rem));
  display: flex;
  flex-direction: column;
  background: var(--dw-paper);
  border: 1px solid var(--dw-border);
  border-radius: 12px;
  box-shadow: 0 12px 32px rgba(9, 29, 51, 0.25);
  overflow: hidden;
}

.dw-head {
  background: var(--dw-primary);
  color: var(--dw-paper);
  padding: 0.8rem 1rem;
  display: flex;
  align-items: center;
  gap: 0.6rem;
  font-weight: 600;
  flex: none;
}

.dw-head img { height: 26px; width: 26px; }
.dw-title { flex: 1; }

.dw-badge {
  font-size: 0.66rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  border-radius: 999px;
  padding: 0.15rem 0.55rem;
}

.dw-badge-live { background: var(--dw-accent); color: var(--dw-accent-ink); }
.dw-badge-scripted { background: var(--dw-paper-tint); color: var(--dw-muted); }

.dw-note {
  flex: none;
  font-size: 0.74rem;
  color: var(--dw-muted);
  background: var(--dw-paper-tint);
  border-bottom: 1px solid var(--dw-border);
  padding: 0.45rem 1rem;
}

.dw-msgs {
  flex: 1;
  overflow-y: auto;
  padding: 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}

.dw-msg {
  max-width: 85%;
  padding: 0.55rem 0.85rem;
  border-radius: 12px;
  color: var(--dw-ink);
  word-wrap: break-word;
}

.dw-user {
  align-self: flex-end;
  background: var(--dw-primary);
  color: var(--dw-paper);
  border-bottom-right-radius: 4px;
}

.dw-bot {
  align-self: flex-start;
  background: var(--dw-paper-tint);
  border: 1px solid var(--dw-border);
  border-bottom-left-radius: 4px;
}

.dw-typing { opacity: 0.6; letter-spacing: 0.2em; }

.dw-input {
  flex: none;
  display: flex;
  gap: 0.5rem;
  padding: 0.75rem;
  border-top: 1px solid var(--dw-border);
  background: var(--dw-paper);
}

.dw-input input {
  flex: 1;
  font-family: inherit;
  font-size: 0.95rem;
  padding: 0.55rem 0.9rem;
  border: 1px solid var(--dw-border);
  border-radius: 999px;
  background: var(--dw-paper-tint);
  color: var(--dw-ink);
  outline: none;
}

.dw-input input:focus { border-color: var(--dw-primary); }

.dw-send {
  border: none;
  border-radius: 50%;
  height: 40px;
  width: 40px;
  background: var(--dw-accent);
  color: var(--dw-accent-ink);
  font-size: 1rem;
  cursor: pointer;
}

.dw-send:disabled { opacity: 0.5; cursor: default; }

@media (max-width: 480px) {
  .dw-panel {
    right: 0.75rem;
    bottom: 5.25rem;
    width: calc(100vw - 1.5rem);
    height: min(70vh, 520px);
  }
  .dw-launcher { bottom: 1rem; right: 1rem; }
}
