/* NovaWave AI Chatbot - Widget Styles */
:root {
    --nwcb-primary: #E53E3E;
    --nwcb-bg: #ffffff;
    --nwcb-text: #1a1a1a;
    --nwcb-bot-bubble: #f0f0f0;
    --nwcb-user-bubble: var(--nwcb-primary);
    --nwcb-shadow: 0 8px 40px rgba(0,0,0,0.18);
    --nwcb-radius: 18px;
    --nwcb-w: 370px;
    --nwcb-h: 520px;
}

#nwcb-root { position: fixed; z-index: 999999; font-family: 'Segoe UI', 'Hind Siliguri', sans-serif; }
#nwcb-root.nwcb-pos-bottom-right { bottom: 24px; right: 24px; }
#nwcb-root.nwcb-pos-bottom-left  { bottom: 24px; left: 24px; }

/* Size variants */
#nwcb-root.nwcb-size-compact { --nwcb-w: 320px; --nwcb-h: 440px; }
#nwcb-root.nwcb-size-large   { --nwcb-w: 420px; --nwcb-h: 600px; }

/* Dark mode */
#nwcb-root.nwcb-dark { --nwcb-bg: #1e1e2e; --nwcb-text: #e0e0e0; --nwcb-bot-bubble: #2d2d3f; }

/* Toggle Button */
#nwcb-toggle {
    width: 60px; height: 60px; border-radius: 50%;
    background: var(--nwcb-primary); border: none; cursor: pointer;
    box-shadow: var(--nwcb-shadow); display: flex; align-items: center; justify-content: center;
    color: #fff; transition: transform .2s, box-shadow .2s;
    position: relative;
}
#nwcb-toggle:hover { transform: scale(1.08); box-shadow: 0 12px 48px rgba(0,0,0,0.25); }
#nwcb-toggle svg { width: 26px; height: 26px; }
.nwcb-toggle-icon { display: flex; align-items: center; justify-content: center; }

.nwcb-badge {
    position: absolute; top: -4px; right: -4px;
    background: #ff4757; color: #fff; font-size: 11px; font-weight: 700;
    width: 20px; height: 20px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
    border: 2px solid #fff;
}

/* Chat Window */
#nwcb-window {
    position: absolute; bottom: 72px;
    width: var(--nwcb-w); height: var(--nwcb-h);
    background: var(--nwcb-bg); border-radius: var(--nwcb-radius);
    box-shadow: var(--nwcb-shadow); display: flex; flex-direction: column;
    overflow: hidden; animation: nwcb-slideup .25s ease;
}
#nwcb-root.nwcb-pos-bottom-right #nwcb-window { right: 0; }
#nwcb-root.nwcb-pos-bottom-left  #nwcb-window { left: 0; }

@keyframes nwcb-slideup {
    from { opacity:0; transform: translateY(16px) scale(.97); }
    to   { opacity:1; transform: translateY(0) scale(1); }
}

/* Header */
.nwcb-header {
    background: var(--nwcb-primary);
    padding: 14px 16px; display: flex; align-items: center; gap: 12px;
    color: #fff; flex-shrink: 0;
}
.nwcb-header-avatar { width: 42px; height: 42px; border-radius: 50%; overflow: hidden; flex-shrink: 0; border: 2px solid rgba(255,255,255,.4); }
.nwcb-header-avatar img { width: 100%; height: 100%; object-fit: cover; }
.nwcb-avatar-initials {
    width: 100%; height: 100%; background: rgba(255,255,255,.25);
    display: flex; align-items: center; justify-content: center;
    font-size: 18px; font-weight: 700; color: #fff;
}
.nwcb-header-info { flex: 1; }
.nwcb-header-name { font-weight: 700; font-size: 15px; }
.nwcb-header-status { font-size: 12px; opacity: .9; display: flex; align-items: center; gap: 5px; margin-top: 2px; }
.nwcb-dot { width: 8px; height: 8px; background: #69ff7a; border-radius: 50%; display: inline-block; animation: nwcb-pulse 2s infinite; }
@keyframes nwcb-pulse { 0%,100%{opacity:1} 50%{opacity:.4} }

.nwcb-close-btn { background: none; border: none; cursor: pointer; color: rgba(255,255,255,.8); padding: 4px; display: flex; align-items: center; }
.nwcb-close-btn:hover { color: #fff; }
.nwcb-close-btn svg { width: 20px; height: 20px; }

/* Messages */
.nwcb-messages {
    flex: 1; overflow-y: auto; padding: 16px 14px;
    display: flex; flex-direction: column; gap: 10px;
    color: var(--nwcb-text);
}
.nwcb-messages::-webkit-scrollbar { width: 4px; }
.nwcb-messages::-webkit-scrollbar-thumb { background: #ddd; border-radius: 4px; }

.nwcb-msg { display: flex; gap: 8px; max-width: 90%; animation: nwcb-msgin .2s ease; }
@keyframes nwcb-msgin { from{opacity:0;transform:translateY(6px)} to{opacity:1;transform:translateY(0)} }

.nwcb-msg.bot  { align-self: flex-start; }
.nwcb-msg.user { align-self: flex-end; flex-direction: row-reverse; }

.nwcb-msg-avatar { width: 30px; height: 30px; border-radius: 50%; overflow: hidden; flex-shrink: 0; background: var(--nwcb-primary); display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700; color: #fff; }
.nwcb-msg-avatar img { width: 100%; height: 100%; object-fit: cover; }

.nwcb-msg-bubble {
    padding: 10px 14px; border-radius: 16px; font-size: 14px; line-height: 1.55;
    max-width: 100%; word-wrap: break-word;
}
.nwcb-msg.bot  .nwcb-msg-bubble { background: var(--nwcb-bot-bubble); color: var(--nwcb-text); border-bottom-left-radius: 4px; }
.nwcb-msg.user .nwcb-msg-bubble { background: var(--nwcb-primary); color: #fff; border-bottom-right-radius: 4px; }

/* Typing indicator */
.nwcb-typing { padding: 6px 14px 4px; display: flex; align-items: center; gap: 8px; }
.nwcb-typing-bubble {
    background: var(--nwcb-bot-bubble); border-radius: 16px; padding: 10px 14px;
    display: flex; gap: 4px; align-items: center;
}
.nwcb-typing-bubble span {
    width: 7px; height: 7px; border-radius: 50%; background: #aaa;
    animation: nwcb-bounce .9s infinite;
}
.nwcb-typing-bubble span:nth-child(2) { animation-delay: .15s; }
.nwcb-typing-bubble span:nth-child(3) { animation-delay: .3s; }
@keyframes nwcb-bounce { 0%,80%,100%{transform:translateY(0)} 40%{transform:translateY(-5px)} }

/* WhatsApp Button */
.nwcb-whatsapp-btn {
    display: inline-flex; align-items: center; gap: 6px; margin-top: 8px;
    padding: 8px 14px; background: #25D366; color: #fff; border: none;
    border-radius: 20px; font-size: 13px; font-weight: 600; cursor: pointer; text-decoration: none;
}
.nwcb-whatsapp-btn:hover { background: #1ebe5d; }

/* Input */
.nwcb-input-wrap {
    padding: 10px 12px; border-top: 1px solid rgba(0,0,0,.08);
    display: flex; gap: 8px; align-items: flex-end; flex-shrink: 0;
    background: var(--nwcb-bg);
}
#nwcb-input {
    flex: 1; border: 1.5px solid #e0e0e0; border-radius: 22px;
    padding: 10px 14px; font-size: 14px; resize: none; outline: none;
    font-family: inherit; max-height: 100px; overflow-y: auto;
    background: var(--nwcb-bg); color: var(--nwcb-text);
    transition: border-color .2s;
}
#nwcb-input:focus { border-color: var(--nwcb-primary); }
#nwcb-send {
    width: 42px; height: 42px; border-radius: 50%; background: var(--nwcb-primary);
    border: none; cursor: pointer; color: #fff; display: flex; align-items: center; justify-content: center;
    flex-shrink: 0; transition: background .2s, transform .1s;
}
#nwcb-send:hover { background: #c53030; transform: scale(1.05); }
#nwcb-send:active { transform: scale(.97); }
#nwcb-send svg { width: 18px; height: 18px; }

.nwcb-footer { text-align: center; font-size: 11px; color: #aaa; padding: 4px 0 8px; flex-shrink: 0; background: var(--nwcb-bg); }

/* Responsive */
@media (max-width: 480px) {
    #nwcb-window { width: calc(100vw - 20px) !important; }
    #nwcb-root.nwcb-pos-bottom-right { right: 10px; }
    #nwcb-root.nwcb-pos-bottom-left  { left: 10px; }
}
