/* ============================================
   FORJA — Chat Widget Ana Clara
   ============================================ */

.chat-fab{position:fixed;bottom:28px;right:28px;z-index:9990;width:60px;height:60px;border-radius:50%;background:var(--accent,#8C6A3B);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 20px rgba(0,0,0,0.4);transition:transform .3s,box-shadow .3s}
.chat-fab:hover{transform:scale(1.08);box-shadow:0 6px 28px rgba(0,0,0,0.5)}
.chat-fab svg{width:28px;height:28px;fill:#fff;transition:opacity .2s}
.chat-fab--open .chat-fab__icon-chat{opacity:0;position:absolute}
.chat-fab--open .chat-fab__icon-close{opacity:1}
.chat-fab__icon-close{opacity:0;position:absolute}
.chat-fab__badge{position:absolute;top:-2px;right:-2px;width:14px;height:14px;border-radius:50%;background:#7A9B85;border:2px solid var(--grafite,#1F2328);display:none}
.chat-fab__badge--active{display:block;animation:chatPulse 2s infinite}

@keyframes chatPulse{0%,100%{transform:scale(1)}50%{transform:scale(1.3)}}

/* Window */
.chat-window{position:fixed;bottom:100px;right:28px;z-index:9991;width:380px;max-width:calc(100vw - 40px);height:560px;max-height:calc(100vh - 140px);background:#1a1d21;border:1px solid rgba(140,106,59,0.25);border-radius:12px;box-shadow:0 24px 64px rgba(0,0,0,0.6);display:none;flex-direction:column;overflow:hidden;font-family:'Inter',sans-serif}
.chat-window--open{display:flex;animation:chatSlideUp .3s ease}

@keyframes chatSlideUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}

/* Header */
.chat-header{padding:16px 20px;background:linear-gradient(135deg,#1F2328 0%,#2a2e33 100%);border-bottom:1px solid rgba(140,106,59,0.2);display:flex;align-items:center;gap:12px;flex-shrink:0}
.chat-header__avatar{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,#8C6A3B,#A07D4A);display:flex;align-items:center;justify-content:center;font-size:0.75rem;font-weight:600;color:#000;flex-shrink:0}
.chat-header__info{flex:1;min-width:0}
.chat-header__name{font-size:0.8125rem;font-weight:600;color:#F5F2EC;font-family:'Space Grotesk',sans-serif}
.chat-header__status{font-size:0.625rem;color:#7A9B85;display:flex;align-items:center;gap:4px;margin-top:2px}
.chat-header__dot{width:6px;height:6px;border-radius:50%;background:#7A9B85;animation:chatPulse 2s infinite}
.chat-header__brand{font-size:0.5625rem;color:rgba(216,209,199,0.35);letter-spacing:0.12em;text-transform:uppercase;font-family:'Space Grotesk',sans-serif}

/* Messages */
.chat-messages{flex:1;overflow-y:auto;padding:16px 16px 8px;display:flex;flex-direction:column;gap:8px;scrollbar-width:thin;scrollbar-color:rgba(140,106,59,0.2) transparent}
.chat-messages::-webkit-scrollbar{width:4px}
.chat-messages::-webkit-scrollbar-thumb{background:rgba(140,106,59,0.2);border-radius:2px}

.chat-msg{max-width:82%;padding:10px 14px;border-radius:10px;font-size:0.8125rem;line-height:1.55;word-wrap:break-word}
.chat-msg--bot{align-self:flex-start;background:#2a2e33;color:#D8D1C7;border-bottom-left-radius:2px}
.chat-msg--user{align-self:flex-end;background:rgba(140,106,59,0.18);color:#F5F2EC;border-bottom-right-radius:2px}
.chat-msg--system{align-self:center;background:rgba(139,58,58,0.15);color:#C27070;font-size:0.75rem;text-align:center;border-radius:6px;max-width:90%;padding:8px 14px}

.chat-typing{align-self:flex-start;padding:10px 16px;display:none;gap:4px;align-items:center}
.chat-typing--active{display:flex}
.chat-typing span{width:6px;height:6px;background:rgba(140,106,59,0.5);border-radius:50%;animation:chatTyping 1.2s infinite}
.chat-typing span:nth-child(2){animation-delay:.2s}
.chat-typing span:nth-child(3){animation-delay:.4s}

@keyframes chatTyping{0%,100%{opacity:.3;transform:translateY(0)}50%{opacity:1;transform:translateY(-4px)}}

/* Input */
.chat-input{padding:12px 16px;border-top:1px solid rgba(140,106,59,0.15);display:flex;gap:8px;align-items:flex-end;flex-shrink:0;background:#1a1d21}
.chat-input__field{flex:1;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08);border-radius:8px;padding:10px 14px;color:#F5F2EC;font-size:0.8125rem;font-family:'Inter',sans-serif;resize:none;max-height:80px;outline:none;transition:border-color .2s}
.chat-input__field:focus{border-color:rgba(140,106,59,0.4)}
.chat-input__field::placeholder{color:rgba(216,209,199,0.3)}
.chat-input__send{width:36px;height:36px;border-radius:8px;background:var(--accent,#8C6A3B);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:opacity .2s;flex-shrink:0}
.chat-input__send:hover{opacity:.85}
.chat-input__send:disabled{opacity:.3;cursor:not-allowed}
.chat-input__send svg{width:16px;height:16px;fill:#000}

/* Ended state */
.chat-input--ended{justify-content:center;padding:16px}
.chat-input--ended .chat-input__ended-msg{color:rgba(216,209,199,0.4);font-size:0.75rem;text-align:center}

/* Responsive */
@media(max-width:480px){
  .chat-fab{bottom:16px;right:16px;width:54px;height:54px}
  .chat-window{bottom:82px;right:12px;left:12px;width:auto;height:calc(100vh - 100px);max-height:none;border-radius:10px}
}