/**
 * Sen Computer — floating AI chat widget.
 * Self-contained: adding/removing this file + its <script> tag changes nothing else on the site.
 */

.chat-widget-launcher {
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 999;
  width: 58px;
  height: 58px;
  border-radius: 50%;
  background: var(--eerie-black);
  color: var(--white);
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 8px 24px -6px hsla(0, 0%, 0%, 0.35);
  transition: transform 100ms ease-out;
}

.chat-widget-launcher:active { transform: scale(0.94); }

.chat-widget-launcher .sc-icon { font-size: 26px; }

.chat-widget-launcher .chat-widget-badge {
  position: absolute;
  top: -2px;
  right: -2px;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: var(--salmon-pink);
  border: 2px solid var(--white);
}

@media (prefers-reduced-motion: no-preference) {
  .chat-widget-launcher .chat-widget-badge { animation: chat-widget-pulse 2.2s ease-out 3; }
}

@keyframes chat-widget-pulse {
  0% { box-shadow: 0 0 0 0 hsla(353, 100%, 78%, 0.55); }
  100% { box-shadow: 0 0 0 10px hsla(353, 100%, 78%, 0); }
}

.chat-widget-panel {
  position: fixed;
  right: 20px;
  bottom: 90px;
  z-index: 999;
  width: min(360px, calc(100vw - 40px));
  height: min(520px, calc(100vh - 140px));
  background: var(--white);
  border-radius: 18px;
  box-shadow: 0 1px 2px hsla(0, 0%, 0%, 0.04), 0 20px 48px -12px hsla(0, 0%, 0%, 0.28);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  transform-origin: bottom right;
  opacity: 0;
  transform: scale(0.9) translateY(10px);
  pointer-events: none;
  transition: opacity 220ms cubic-bezier(0.22, 1, 0.36, 1), transform 220ms cubic-bezier(0.22, 1, 0.36, 1);
}

.chat-widget-panel.is-open {
  opacity: 1;
  transform: scale(1) translateY(0);
  pointer-events: auto;
}

@media (prefers-reduced-motion: reduce) {
  .chat-widget-panel { transition: opacity 150ms ease-out; transform: none !important; }
  .chat-widget-launcher .chat-widget-badge { animation: none; }
}

.chat-widget-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 16px;
  background: var(--eerie-black);
  color: var(--white);
  flex-shrink: 0;
}

.chat-widget-header h2 {
  font-size: var(--fs-7);
  font-weight: var(--weight-600);
}

.chat-widget-header p {
  font-size: var(--fs-9);
  color: hsla(0, 0%, 100%, 0.65);
}

.chat-widget-close {
  color: var(--white);
  font-size: 22px;
  padding: 4px;
  transition: opacity 150ms ease-out;
}

.chat-widget-close:hover { opacity: 0.7; }

.chat-widget-messages {
  flex: 1;
  overflow-y: auto;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.chat-widget-bubble {
  max-width: 84%;
  padding: 10px 13px;
  border-radius: 14px;
  font-size: var(--fs-8);
  line-height: 1.45;
  white-space: pre-wrap;
}

.chat-widget-bubble.from-assistant {
  align-self: flex-start;
  background: var(--cultured);
  color: var(--eerie-black);
  border-bottom-left-radius: 4px;
}

.chat-widget-bubble.from-user {
  align-self: flex-end;
  background: var(--eerie-black);
  color: var(--white);
  border-bottom-right-radius: 4px;
}

.chat-widget-typing {
  align-self: flex-start;
  display: none;
  gap: 4px;
  padding: 12px 14px;
  background: var(--cultured);
  border-radius: 14px;
  border-bottom-left-radius: 4px;
}

.chat-widget-typing.is-visible { display: flex; }

.chat-widget-typing span {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--sonic-silver-aa);
  animation: chat-widget-bounce 1.1s ease-in-out infinite;
}

.chat-widget-typing span:nth-child(2) { animation-delay: 0.15s; }
.chat-widget-typing span:nth-child(3) { animation-delay: 0.3s; }

@keyframes chat-widget-bounce {
  0%, 60%, 100% { transform: translateY(0); opacity: 0.5; }
  30% { transform: translateY(-4px); opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .chat-widget-typing span { animation: none; opacity: 0.8; }
}

.chat-widget-form {
  display: flex;
  gap: 8px;
  padding: 12px;
  border-top: 1px solid var(--cultured);
  flex-shrink: 0;
}

.chat-widget-input {
  flex: 1;
  font: inherit;
  font-size: var(--fs-8);
  padding: 10px 12px;
  border: 1px solid var(--cultured);
  border-radius: 10px;
  background: var(--white);
  color: var(--eerie-black);
  transition: border-color 180ms ease-out, box-shadow 180ms ease-out;
}

.chat-widget-input:focus-visible {
  outline: none;
  border-color: var(--salmon-pink);
  box-shadow: 0 0 0 4px hsla(353, 100%, 78%, 0.22);
}

.chat-widget-send {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: var(--eerie-black);
  color: var(--white);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: transform 100ms ease-out, opacity 200ms ease-out;
}

.chat-widget-send:active { transform: scale(0.92); }
.chat-widget-send:disabled { opacity: 0.5; }

.chat-widget-send .sc-icon { font-size: 18px; }