/* ---------- chat widget ---------- */
#huromChat { position: fixed; right: 22px; bottom: 22px; z-index: 1050; font-family: "Outfit", sans-serif; }
#huromChat .chatLauncher { width: 60px; height: 60px; border: none; border-radius: 50%; background: var(--landing-navy); color: var(--white-color); font-size: 26px; cursor: pointer; box-shadow: var(--landing-shadow-hover); display: flex; align-items: center; justify-content: center; transition: transform 0.25s ease, background 0.25s ease; }
#huromChat .chatLauncher:hover { background: var(--landing-navy-soft); transform: translateY(-3px); }
#huromChat .chatLauncher i { line-height: 1; }
#huromChat .chatPanel { display: flex; flex-direction: column; position: absolute; right: 0; bottom: 70px; width: 360px; max-width: calc(100vw - 32px); background: var(--white-color); border-radius: 18px; overflow: hidden; box-shadow: var(--landing-shadow-hover); opacity: 0; visibility: hidden; transform: translateY(16px); transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s ease; max-height: 85vh; max-height: 85dvh; }
#huromChat.chatOpen .chatPanel { opacity: 1; visibility: visible; transform: translateY(0); }
#huromChat.chatOpen .chatLauncher { transform: rotate(90deg); }
#huromChat .chatHeader { display: flex; align-items: center; gap: 12px; padding: 14px 16px; background: var(--landing-navy); }
#huromChat .chatAvatar { width: 38px; height: 38px; border-radius: 50%; background: var(--theme-color); color: var(--white-color); display: flex; align-items: center; justify-content: center; font-size: 20px; flex-shrink: 0; }
#huromChat .chatHeadMeta { flex: 1; line-height: 1.3; }
#huromChat .chatBotName { display: block; color: var(--white-color); font-size: 15px; font-weight: 500; }
#huromChat .chatStatus { display: flex; align-items: center; gap: 5px; color: var(--theme-color-lighter); font-size: 12px; }
#huromChat .chatStatusDot { width: 7px; height: 7px; border-radius: 50%; background: var(--theme-color); display: inline-block; }
#huromChat .chatClose { border: none; background: transparent; color: #c6d2e2; font-size: 20px; cursor: pointer; padding: 4px; line-height: 1; }
#huromChat .chatClose:hover { color: var(--white-color); }
#huromChat .chatBody { background: var(--landing-img-bg); display: flex; flex-direction: column; flex: 1; min-height: 0; overflow: hidden; }
#huromChat .chatMessages { display: flex; flex-direction: column; flex: 1; min-height: 0; overflow-y: auto; padding: 16px; gap: 12px; }
#huromChat .chatMsg { max-width: 82%; padding: 10px 13px; font-size: 14px; line-height: 1.5; word-wrap: break-word; animation: chatFadeIn 0.3s ease; white-space: pre-line;}
#huromChat .chatMsgBot { align-self: flex-start; background: var(--white-color); border: 1px solid var(--landing-border); color: var(--dark-color); border-radius: 14px 14px 14px 4px; }
#huromChat .chatMsgUser { align-self: flex-end; background: var(--landing-navy); color: var(--white-color); border-radius: 14px 14px 4px 14px; }
#huromChat .chatTyping { display: flex; gap: 4px; align-items: center; }
#huromChat .chatTyping span { width: 7px; height: 7px; border-radius: 50%; background: var(--light-color); display: inline-block; animation: chatBlink 1.2s infinite both; }
#huromChat .chatTyping span:nth-child(2) { animation-delay: 0.2s; }
#huromChat .chatTyping span:nth-child(3) { animation-delay: 0.4s; }
#huromChat .chatChips { display: flex; flex-wrap: wrap; gap: 8px; padding: 0 16px 14px; }
#huromChat .chatChip { background: var(--white-color); border: 1px solid var(--theme-color-lighter); color: var(--theme-color-darker); font-size: 13px; padding: 7px 13px; border-radius: 50px; cursor: pointer; transition: background 0.2s ease, color 0.2s ease; }
#huromChat .chatChip:hover { background: var(--theme-color); border-color: var(--theme-color); color: var(--white-color); }
#huromChat .chatLead { flex-shrink: 0; max-height: 0; overflow: hidden; background: var(--aliceblue); border-top: 1px solid var(--landing-border); transition: max-height 0.3s ease; }
#huromChat .chatLead.chatLeadOpen { max-height: 280px; }
#huromChat .chatHeader, #huromChat .chatInputBar { flex-shrink: 0; }
#huromChat .chatPanel.chatPanelLead .chatInputBar { display: none; }
#huromChat .chatLeadInner { padding: 14px 16px; }
#huromChat .chatLeadTitle { font-size: 14px; font-weight: 500; color: var(--landing-navy); margin: 0 0 10px; }
#huromChat .chatLeadField { width: 100%; border: 1px solid var(--landing-border); border-radius: 10px; padding: 9px 12px; font-size: 14px; margin-bottom: 8px; font-family: inherit; }
#huromChat .chatLeadField:focus { outline: none; border-color: var(--theme-color); }
#huromChat .chatHoneypot { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
#huromChat .chatLeadSubmit { width: 100%; border: none; border-radius: 10px; padding: 10px; background: var(--order-btn); color: var(--white-color); font-weight: 500; font-size: 14px; cursor: pointer; transition: background 0.2s ease; }
#huromChat .chatLeadSubmit:hover { background: var(--order-btn-darker); }
#huromChat .chatLeadError { color: var(--red); font-size: 13px; margin: 6px 0 0; min-height: 16px; }
#huromChat .chatInputBar { display: flex; align-items: center; gap: 10px; padding: 12px 14px; background: var(--white-color); border-top: 1px solid var(--landing-border); }
#huromChat .chatInput { flex: 1; border: none; background: var(--landing-gray-bg); border-radius: 50px; padding: 10px 15px; font-size: 14px; font-family: inherit; }
#huromChat .chatInput:focus { outline: none; }
#huromChat .chatSend { width: 40px; height: 40px; border: none; border-radius: 50%; background: var(--order-btn); color: var(--white-color); font-size: 18px; cursor: pointer; flex-shrink: 0; display: flex; align-items: center; justify-content: center; transition: background 0.2s ease; }
#huromChat .chatSend:hover { background: var(--order-btn-darker); }

#huromChat .chatLeadInner { position: relative; }
#huromChat .chatLeadClose { position: absolute; top: 12px; right: 10px; border: none; background: transparent; color: #9aa5b1; font-size: 18px; cursor: pointer; line-height: 1; padding: 2px; }
#huromChat .chatLeadClose:hover { color: var(--dark-color); }

@keyframes chatFadeIn {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: translateY(0); }
}
@keyframes chatBlink {
    0%, 80%, 100% { opacity: 0.3; }
    40% { opacity: 1; }
}
@media (max-width: 480px) {
    #huromChat { right: 16px; bottom: 16px; }
    #huromChat .chatPanel { width: calc(100vw - 32px); }
}

@media (max-width: 768px) {
    #huromChat .chatPanel { position: fixed; top: 10px; left: 10px; right: 10px; bottom: 10px; width: auto; max-height: none; }
    #huromChat .chatInputBar { flex-shrink: 0; }
}