.site-chat { position: fixed; right: max(18px, env(safe-area-inset-right)); bottom: max(18px, env(safe-area-inset-bottom)); z-index: 90; font-family: var(--font-display, Manrope, sans-serif); color: var(--ink, #172333); }
.site-chat [hidden] { display: none !important; }
.site-chat button, .site-chat input, .site-chat textarea { font: inherit; }
.site-chat .site-chat-toggle { font-size: 14px; font-weight: 800; }
.site-chat-toggle { --chat-size: 52px; position: relative; display: block; width: var(--chat-size); height: var(--chat-size); padding: 0; overflow: hidden; border: 1px solid #cf4a21; border-radius: 999px; background: #cf4a21; color: #fff; font-size: 14px; font-weight: 800; cursor: pointer; box-shadow: 0 9px 24px #17233322; transition: width .34s cubic-bezier(.22, 1, .36, 1), background-color .2s, box-shadow .2s; }
.site-chat-toggle svg { position: absolute; right: calc((var(--chat-size) - 23px) / 2 - 1px); top: calc((var(--chat-size) - 23px) / 2 - 1px); width: 23px; height: 23px; }
.site-chat-toggle-label { position: absolute; right: var(--chat-size); top: 50%; white-space: nowrap; opacity: 0; transform: translate(8px, -50%); transition: opacity .12s, transform .25s cubic-bezier(.22, 1, .36, 1); pointer-events: none; }
.site-chat-toggle:is(:focus-visible, [aria-expanded="true"]) { width: 174px; }
.site-chat-toggle:is(:focus-visible, [aria-expanded="true"]) .site-chat-toggle-label { opacity: 1; transform: translate(0, -50%); transition-delay: .05s; }
@media (hover: hover) and (pointer: fine) {
  .site-chat-toggle:hover { width: 174px; background: #b9431e; box-shadow: 0 12px 28px #17233335; }
  .site-chat-toggle:hover .site-chat-toggle-label { opacity: 1; transform: translate(0, -50%); transition-delay: .05s; }
}
.site-chat-panel { position: absolute; right: 0; bottom: calc(100% + 14px); display: flex; flex-direction: column; width: min(390px, calc(100vw - 28px)); height: min(600px, calc(100dvh - 105px)); overflow: hidden; border: 1px solid var(--line, #dfe4e8); border-radius: 18px; background: #fff; box-shadow: 0 22px 72px #10182733; }
.site-chat-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; padding: 18px 19px; background: #14243a; color: #fff; }
.site-chat-header strong { display: block; font-size: 18px; line-height: 1.3; }
.site-chat-header p { margin: 5px 0 0; color: #d7e0eb; font-size: 12px; line-height: 1.45; }
.site-chat-header button { flex: none; width: 34px; height: 34px; border: 1px solid #ffffff66; border-radius: 50%; background: transparent; color: #fff; font-size: 27px; line-height: 1; cursor: pointer; }
.site-chat-content { display: flex; flex-direction: column; min-height: 0; flex: 1; padding: 16px 18px 18px; }
.site-chat-status { margin: 0 0 12px; padding: 10px 12px; border-radius: 9px; background: #f4f6f8; color: #34445a; font-size: 12px; line-height: 1.5; }
.site-chat-start { display: flex; flex-direction: column; gap: 11px; min-height: 0; overflow-y: auto; }
.site-chat-start > p { margin: 0 0 2px; font-size: 13px; line-height: 1.55; color: var(--muted, #566577); }
.site-chat-start label, .site-chat-message-form label { display: grid; gap: 5px; font-size: 12px; font-weight: 750; }
.site-chat-start input:not([type="checkbox"]), .site-chat-message-form textarea { width: 100%; min-height: 40px; box-sizing: border-box; padding: 9px 11px; border: 1px solid #cbd4df; border-radius: 8px; background: #fff; color: var(--ink, #172333); font-size: 14px; }
.site-chat-message-form textarea { min-height: 82px; resize: vertical; }
.site-chat-start .site-chat-consent { display: flex; align-items: flex-start; gap: 9px; font-size: 11px; font-weight: 500; line-height: 1.55; }
.site-chat-consent input { flex: none; width: 16px; height: 16px; margin: 1px 0 0; accent-color: #e55a2b; }
.site-chat a { color: #184575; text-decoration: underline; text-underline-offset: 2px; }
.site-chat-primary { align-self: flex-start; min-height: 44px; padding: 8px 17px; border: 1px solid #cf4a21; border-radius: 8px; background: #cf4a21; color: #fff; font-size: 14px; font-weight: 700; cursor: pointer; }
.site-chat-primary:hover { background: #b93f1b; }
.site-chat button:disabled { opacity: .55; cursor: wait; }
.site-chat :is(button, input, textarea, a):focus-visible { outline: 3px solid #214b79; outline-offset: 2px; }
.site-chat-conversation { display: flex; flex: 1; min-height: 0; flex-direction: column; }
.site-chat-messages { display: flex; flex: 1; min-height: 100px; flex-direction: column; gap: 10px; overflow-y: auto; margin: 0 0 12px; padding: 2px 2px 8px; list-style: none; }
.site-chat-message { align-self: flex-start; max-width: 88%; padding: 10px 12px; border-radius: 11px 11px 11px 3px; background: #eef3f8; overflow-wrap: anywhere; }
.site-chat-message--visitor { align-self: flex-end; border-radius: 11px 11px 3px 11px; background: #ffe9dd; }
.site-chat-message strong { display: block; margin-bottom: 3px; font-size: 11px; }
.site-chat-message p { margin: 0; white-space: pre-wrap; font-size: 13px; line-height: 1.55; }
.site-chat-message-form { display: grid; gap: 7px; }
.site-chat-actions { display: flex; gap: 11px; align-items: center; }
.site-chat-actions > button:not(.site-chat-primary), .site-chat-new { border: 0; padding: 7px 0; background: none; color: #184575; font-size: 12px; font-weight: 750; text-decoration: underline; cursor: pointer; }
.site-chat-alternative { margin: 13px 0 0; padding-top: 11px; border-top: 1px solid var(--line, #dfe4e8); color: var(--muted, #566577); font-size: 11px; line-height: 1.5; }
@media (max-width: 480px) {
  .site-chat { right: 12px; bottom: max(12px, env(safe-area-inset-bottom)); }
  .site-chat-toggle { --chat-size: 48px; }
  .site-chat-panel { width: calc(100vw - 24px); height: min(630px, calc(100dvh - 88px)); }
}
@media (prefers-reduced-motion: reduce) { .site-chat-toggle, .site-chat-toggle-label { transition: none; } }
