/* BusyAccess Chat Widget — refined */
.n8n-chat-widget {
  --chat--color-primary: var(--n8n-chat-primary-color, #0a5a9f);
  --chat--color-secondary: var(--n8n-chat-secondary-color, #083d68);
  --chat--color-background: var(--n8n-chat-background-color, #ffffff);
  --chat--color-font: var(--n8n-chat-font-color, #1b1b1b);
  font-family: 'Geist Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}
.n8n-chat-widget * { box-sizing: border-box; }

/* ===== Shell ===== */
.n8n-chat-widget .chat-container{
  position:fixed;
  bottom:calc(20px + env(safe-area-inset-bottom, 0));
  right:20px;
  z-index:1000;
  display:none;
  width:380px;
  height:600px;
  background:var(--chat--color-background);
  border-radius:12px;
  box-shadow:0 8px 32px rgba(133,79,255,.15);
  border:1px solid rgba(133,79,255,.2);
  overflow:hidden;
  font-family:inherit;
}
.n8n-chat-widget .chat-container.position-left{ right:auto; left:20px; }
.n8n-chat-widget .chat-container.open{ display:flex; flex-direction:column; }

/* ===== Header ===== */
.n8n-chat-widget .brand-header{
  padding:16px;
  display:flex;
  align-items:center;
  gap:12px;
  border-bottom:1px solid rgba(133,79,255,.1);
  position:relative;
}
.n8n-chat-widget .brand-header img{ width:32px; height:32px; }
.n8n-chat-widget .brand-header span{
  font-size:18px; font-weight:500; color:var(--chat--color-font);
}
.n8n-chat-widget .close-button{
  position:absolute; right:16px; top:50%; transform:translateY(-50%);
  background:none; border:none; color:var(--chat--color-font); cursor:pointer;
  padding:4px; display:flex; align-items:center; justify-content:center;
  transition:opacity .2s; font-size:20px; opacity:.6;
}
.n8n-chat-widget .close-button:hover{ opacity:1; }

/* ===== New conversation screen ===== */
.n8n-chat-widget .new-conversation{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  padding:20px; text-align:center; width:100%; max-width:300px;
}
.n8n-chat-widget .welcome-text{
  font-size:24px; font-weight:600; color:var(--chat--color-font);
  margin-bottom:24px; line-height:1.3;
}
.n8n-chat-widget .new-chat-btn{
  display:flex; align-items:center; justify-content:center; gap:8px; width:100%;
  padding:16px 24px;
  background:linear-gradient(135deg,var(--chat--color-primary) 0%,var(--chat--color-secondary) 100%);
  color:#fff; border:none; border-radius:8px; cursor:pointer; font-size:16px;
  transition:transform .3s; font-weight:500; font-family:inherit; margin-bottom:12px;
}
.n8n-chat-widget .new-chat-btn:hover{ transform:scale(1.02); }
.n8n-chat-widget .message-icon{ width:20px; height:20px; }
.n8n-chat-widget .response-text{ font-size:14px; color:var(--chat--color-font); opacity:.7; margin:0; }

/* ===== Chat interface ===== */
.n8n-chat-widget .chat-interface{ display:none; flex-direction:column; height:100%; }
.n8n-chat-widget .chat-interface.active{ display:flex; }

.n8n-chat-widget .chat-messages{
  flex:1; overflow-y:auto; padding:20px; background:var(--chat--color-background);
  display:flex; flex-direction:column;
  overscroll-behavior: contain; /* prevent page bounce behind the widget */
}

.n8n-chat-widget .chat-message{
  padding:12px 16px; margin:8px 0; border-radius:12px; max-width:80%;
  word-wrap:break-word; font-size:14px; line-height:1.5;
}
.n8n-chat-widget .chat-message.user{
  background:linear-gradient(135deg,var(--chat--color-primary) 0%,var(--chat--color-secondary) 100%);
  color:#fff; align-self:flex-end; box-shadow:0 4px 12px rgba(133,79,255,.2); border:none;
}
.n8n-chat-widget .chat-message.bot{
  background:var(--chat--color-background);
  border:1px solid rgba(133,79,255,.2);
  color:var(--chat--color-font);
  align-self:flex-start;
  box-shadow:0 4px 12px rgba(0,0,0,.05);
}

/* ===== Input area — improved sizing and alignment ===== */
.n8n-chat-widget .chat-input{
  padding:12px 16px; background:var(--chat--color-background);
  border-top:1px solid rgba(133,79,255,.1);
  display:flex; gap:10px; align-items:flex-end; /* line up button with textarea bottom */
}
.n8n-chat-widget .chat-input textarea{
  flex:1; width:100%; min-height:48px; max-height:120px;
  line-height:1.4; padding:12px 14px;
  border:1px solid rgba(133,79,255,.2); border-radius:10px;
  background:var(--chat--color-background); color:var(--chat--color-font);
  resize:none; overflow-y:auto; font-family:inherit; font-size:14px;
  -webkit-appearance:none; appearance:none;
}
.n8n-chat-widget .chat-input textarea::placeholder{ color:var(--chat--color-font); opacity:.6; }
/* Hide thin internal scrollbars for a cleaner look */
.n8n-chat-widget .chat-input textarea::-webkit-scrollbar{ width:0; height:0; }
.n8n-chat-widget .chat-input textarea{ scrollbar-width:none; }

.n8n-chat-widget .chat-input button{
  background:linear-gradient(135deg,var(--chat--color-primary) 0%,var(--chat--color-secondary) 100%);
  color:#fff; border:none; border-radius:10px; /* match textarea */
  height:48px; padding:0 18px; cursor:pointer; transition:transform .2s;
  font-family:inherit; font-weight:600;
}
.n8n-chat-widget .chat-input button:hover{ transform:scale(1.05); }

/* ===== Toggle FAB ===== */
.n8n-chat-widget .chat-toggle{
  position:fixed;
  bottom:calc(20px + env(safe-area-inset-bottom, 0));
  right:20px; width:60px; height:60px; border-radius:30px;
  background:linear-gradient(135deg,var(--chat--color-primary) 0%,var(--chat--color-secondary) 100%);
  color:#fff; border:none; cursor:pointer; box-shadow:0 4px 12px rgba(133,79,255,.3);
  z-index:999; transition:transform .3s; display:flex; align-items:center; justify-content:center;
}
.n8n-chat-widget .chat-toggle.position-left{ right:auto; left:20px; }
.n8n-chat-widget .chat-toggle:hover{ transform:scale(1.05); }
.n8n-chat-widget .chat-toggle svg{ width:24px; height:24px; fill:currentColor; }

/* ===== Footer (hidden) — remove n8n reference ===== */
.n8n-chat-widget .chat-footer{ display:none !important; }
.n8n-chat-widget .chat-footer a{ display:none !important; }

/* ===== Mobile tuning ===== */
@media (max-width: 480px){
  .n8n-chat-widget .chat-container{
    width:min(94vw, 380px);
    height:72vh;
    right:12px; left:12px;
    bottom:12px;
  }
  .n8n-chat-widget .chat-toggle{
    bottom:12px; right:12px;
  }
}

/* ===== Accessibility: reduce motion ===== */
@media (prefers-reduced-motion: reduce){
  .n8n-chat-widget .new-chat-btn,
  .n8n-chat-widget .chat-toggle,
  .n8n-chat-widget .chat-input button{
    transition:none !important;
    transform:none !important;
  }
}
