/* =================== hc-livechat.css =================== */
.hc-livechat {
position: fixed; right: 20px; bottom: 20px; z-index: 70; font-family: var(--hc-sans, "Outfit", -apple-system, sans-serif)
}
.hc-livechat__fab {
width: 60px; height: 60px; border-radius: 50%; background: linear-gradient(135deg, var(--hc-ink, #1a1714), #2a221c); color: var(--hc-paper, #ffffff); border: none; cursor: pointer; display: grid; place-items: center; box-shadow: 0 10px 28px rgba(26, 23, 20, 0.32); position: relative; transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.3s
}
.hc-livechat__fab:hover {
transform: translateY(-2px) scale(1.04); box-shadow: 0 16px 36px rgba(26, 23, 20, 0.4)
}
.hc-livechat__fab::after {
content: ""; position: absolute; inset: -6px; border-radius: 50%; background: radial-gradient(circle, rgba(212, 184, 150, 0.35), transparent 65%); opacity: 0; transition: opacity 0.28s; z-index: -1; pointer-events: none
}
.hc-livechat__fab:hover::after {
opacity: 1
}
.hc-livechat__dot {
position: absolute; top: 8px; right: 8px; width: 10px; height: 10px; border-radius: 50%; background: var(--hc-green, var(--hc-success, #3d6b4f)); border: 2px solid var(--hc-ink, #1a1714); animation: hc-pulse-glow 2s ease-in-out infinite
}
.hc-livechat__fab svg {
color: var(--hc-gold, #d4b896)
}
.hc-livechat__panel {
position: absolute; bottom: 76px; right: 0; width: 340px; max-width: calc(100vw - 40px); background: var(--hc-bg, #f8f6f3); border: 1px solid rgba(26, 23, 20, 0.1); border-radius: 18px; box-shadow: 0 24px 72px rgba(18, 14, 11, 0.24); overflow: hidden; transform-origin: bottom right; animation: hc-livechat-pop 0.22s cubic-bezier(0.22, 1, 0.36, 1)
}
.hc-livechat__panel[hidden] {
display: none
}
.hc-livechat__header {
padding: 18px 20px; background: linear-gradient(135deg, var(--hc-ink, #1a1714), #2a221c); color: var(--hc-paper, #ffffff); position: relative; overflow: hidden
}
.hc-livechat__header::after {
content: ""; position: absolute; top: 0; right: 0; width: 180px; height: 120px; background: radial-gradient(ellipse at top right, rgba(212, 184, 150, 0.25), transparent 60%); pointer-events: none
}
.hc-livechat__eyebrow {
font-family: var(--hc-mono, "JetBrains Mono", monospace); font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--hc-gold, #d4b896); display: flex; align-items: center; gap: 6px; margin-bottom: 6px; position: relative
}
.hc-livechat__eyebrow i {
display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: var(--hc-success, #3d6b4f); animation: hc-pulse-glow 2s ease-in-out infinite
}
.hc-livechat__title {
font-family: var(--hc-serif, "Playfair Display", Georgia, serif); font-weight: 500; font-size: 18px; margin: 0 0 2px; position: relative
}
.hc-livechat__sub {
font-size: 12px; color: rgba(255, 255, 255, 0.6); margin: 0; position: relative
}
.hc-livechat__close {
position: absolute; top: 14px; right: 14px; width: 28px; height: 28px; border-radius: 50%; background: rgba(255, 255, 255, 0.1); border: none; color: var(--hc-paper, #ffffff); font-size: 13px; cursor: pointer; z-index: 2
}
.hc-livechat__body {
padding: 18px 20px
}
.hc-livechat__body p {
font-size: 13px; line-height: 1.55; margin: 0 0 12px; color: var(--hc-ink-soft, rgba(26, 23, 20, 0.72))
}
.hc-livechat__channels {
display: grid; gap: 8px; margin-bottom: 16px
}
.hc-livechat__channel {
display: flex; align-items: center; gap: 12px; padding: 12px 14px; background: var(--hc-paper, #ffffff); border: 1px solid rgba(26, 23, 20, 0.08); border-radius: 12px; text-decoration: none; color: var(--hc-ink, #1a1714); transition: transform 0.2s ease, border-color 0.2s ease
}
.hc-livechat__channel:hover {
transform: translateX(2px); border-color: var(--hc-accent, #8b7355)
}
.hc-livechat__channel-ico {
width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; flex: none; font-size: 16px
}



.hc-livechat__channel-body {
display: flex; flex-direction: column; gap: 2px; min-width: 0
}
.hc-livechat__channel-body strong {
font-weight: 500; font-size: 13.5px
}
.hc-livechat__channel-body span {
font-size: 11.5px; color: var(--hc-muted, rgba(26, 23, 20, 0.58))
}
.hc-livechat__form {
display: grid; gap: 8px; padding-top: 14px; border-top: 1px dashed rgba(26, 23, 20, 0.12)
}
.hc-livechat__form label {
font-size: 11px; color: var(--hc-muted, rgba(26, 23, 20, 0.55)); letter-spacing: 0.04em; text-transform: uppercase; font-family: var(--hc-mono, "JetBrains Mono", monospace)
}
.hc-livechat__form input, .hc-livechat__form textarea {
width: 100%; padding: 10px 12px; background: var(--hc-paper, #ffffff); border: 1px solid rgba(26, 23, 20, 0.1); border-radius: 10px; font-size: 13px; font-family: inherit; outline: none; resize: vertical
}
.hc-livechat__form input:focus, .hc-livechat__form textarea:focus {
border-color: var(--hc-accent, #8b7355)
}
.hc-livechat__submit {
padding: 10px 14px; background: var(--hc-ink, #1a1714); color: #f8f6f3; border: none; border-radius: 999px; font-size: 13px; font-weight: 500; cursor: pointer; transition: transform 0.2s ease
}
.hc-livechat__submit:hover {
transform: translateY(-1px)
}
.hc-livechat__done {
padding: 14px; background: rgba(61, 107, 79, 0.08); border: 1px solid rgba(61, 107, 79, 0.22); border-radius: 10px; font-size: 13px; color: var(--hc-green, var(--hc-success, #3d6b4f)); text-align: center
}

.hc-livechat__channel--tg .hc-livechat__channel-ico {
background: rgba(42, 170, 226, 0.14); color: #2aaae2
}

.hc-livechat__channel--wa .hc-livechat__channel-ico {
background: rgba(37, 211, 102, 0.14); color: #25d366
}

.hc-livechat__channel--phone .hc-livechat__channel-ico {
background: rgba(139, 115, 85, 0.14); color: var(--hc-accent, #8b7355)
}