/* 24h chat widget (all pages except home) */
/* ── AI CHAT ── */
.ai-chat { scroll-margin-top: calc(var(--nav-h) + 24px); max-width: 760px; margin: 2rem auto 0; background: var(--white); border-radius: calc(var(--radius) + 4px); box-shadow: var(--shadow-md); overflow: hidden; display: flex; flex-direction: column; border: 1px solid var(--line); }
.ai-chat-head { display: flex; align-items: center; gap: 12px; padding: 1.1rem 1.4rem; background: var(--deep); color: #fff; }
.ai-chat-avatar { width: 42px; height: 42px; border-radius: 50%; background: var(--gold); display: flex; align-items: center; justify-content: center; font-size: 1.05rem; flex-shrink: 0; }
.ai-chat-title { display: flex; flex-direction: column; gap: 2px; min-width: 0; flex: 1; }
.ai-chat-title strong { font-family: 'Noto Serif KR', serif; font-size: 1.05rem; font-weight: 600; }
.ai-chat-title span { font-size: .78rem; color: rgba(255,255,255,.65); display: flex; align-items: center; gap: 6px; }
.ai-dot { width: 7px; height: 7px; border-radius: 50%; background: #6FCF7F; display: inline-block; }
.ai-chat-reset { display: inline-flex; align-items: center; gap: 6px; border: 1px solid rgba(255,255,255,.2); background: transparent; color: rgba(255,255,255,.8); border-radius: 999px; padding: .4rem .8rem; font-size: .78rem; cursor: pointer; transition: background .2s, color .2s; font-family: inherit; }
.ai-chat-reset:hover { background: rgba(255,255,255,.1); color: #fff; }
.ai-chat-log { height: 440px; overflow-y: auto; padding: 1.4rem; display: flex; flex-direction: column; gap: .9rem; background: var(--cream); scroll-behavior: smooth; overscroll-behavior: contain; }
.ai-msg { display: flex; gap: 10px; max-width: 88%; animation: aiIn .25s ease-out; }
.ai-msg.user { align-self: flex-end; flex-direction: row-reverse; }
.ai-msg-icon { width: 30px; height: 30px; border-radius: 50%; background: var(--gold); color: #fff; display: flex; align-items: center; justify-content: center; font-size: .78rem; flex-shrink: 0; margin-top: 2px; }
.ai-msg.user .ai-msg-icon { display: none; }
.ai-bubble { padding: .8rem 1rem; border-radius: 14px; font-size: .94rem; line-height: 1.75; white-space: pre-wrap; word-break: keep-all; overflow-wrap: anywhere; }
.ai-msg.bot .ai-bubble { background: var(--white); color: var(--text); border: 1px solid var(--line); border-top-left-radius: 4px; }
.ai-msg.user .ai-bubble { background: var(--accent); color: #fff; border-top-right-radius: 4px; }
.ai-msg.error .ai-bubble { background: #FDECEA; border-color: #F5C2BE; color: #8A2A22; }
.ai-done { align-self: center; display: inline-flex; align-items: center; gap: 8px; background: #E8F5E9; color: #2E6B33; border: 1px solid #BFE0C2; border-radius: 999px; padding: .45rem 1rem; font-size: .82rem; font-weight: 600; animation: aiIn .25s ease-out; }
.ai-typing { display: inline-flex; gap: 4px; padding: .3rem 0; }
.ai-typing i { width: 7px; height: 7px; border-radius: 50%; background: var(--gold); opacity: .4; animation: aiDot 1.2s infinite; }
.ai-typing i:nth-child(2) { animation-delay: .15s; }
.ai-typing i:nth-child(3) { animation-delay: .3s; }
.ai-chat-chips { display: flex; gap: .5rem; padding: .8rem 1.2rem 0; overflow-x: auto; scrollbar-width: none; }
.ai-chat-chips::-webkit-scrollbar { display: none; }
.ai-chat-chips button { flex-shrink: 0; border: 1px solid var(--line); background: var(--white); color: var(--accent); border-radius: 999px; padding: .45rem .9rem; font-size: .82rem; cursor: pointer; font-family: inherit; transition: background .2s, border-color .2s; }
.ai-chat-chips button:hover { background: var(--cream); border-color: var(--gold); }
.ai-chat-input { display: flex; align-items: flex-end; gap: .6rem; padding: .9rem 1.2rem; }
.ai-chat-input textarea { flex: 1; resize: none; border: 1px solid var(--line); border-radius: 12px; padding: .75rem .95rem; font-family: inherit; font-size: 16px; line-height: 1.5; color: var(--text); background: var(--white); max-height: 140px; outline: none; transition: border-color .2s, box-shadow .2s; }
.ai-chat-input textarea:focus { border-color: var(--gold); box-shadow: 0 0 0 3px rgba(201,168,76,.18); }
.ai-chat-input button { width: 46px; height: 46px; border: none; border-radius: 12px; background: var(--gold); color: #fff; font-size: 1rem; cursor: pointer; flex-shrink: 0; transition: background .2s, transform .15s; }
.ai-chat-input button:hover:not(:disabled) { background: var(--accent); }
.ai-chat-input button:active:not(:disabled) { transform: scale(.95); }
.ai-chat-input button:disabled { opacity: .45; cursor: not-allowed; }
.ai-chat-notice { padding: 0 1.2rem 1rem; font-size: .74rem; line-height: 1.6; color: var(--text-muted); }
.ai-chat-notice i { color: var(--gold); margin-right: 3px; }
.ai-relay-status { padding: .55rem 1rem; background: #f3f5ec; color: #48603e; font-size: .76rem; line-height: 1.6; border-bottom: 1px solid var(--line); flex-shrink: 0; }
.ai-relay-status.is-error { background: #fff4df; color: #805719; }
.ai-msg.staff .ai-msg-icon { background: #47684b; }
.ai-msg.staff .ai-bubble { border-color: #a5bca2; background: #f3f8ef; }
.ai-staff-name { display: block; color: #36593b; font-size: .76rem; margin-bottom: .3rem; }
.chat-fab.has-unread::before { content: '새 답장'; position: absolute; right: 0; top: -12px; background: #b34432; color: #fff; border: 2px solid #fff; border-radius: 20px; padding: 2px 8px; font-size: 12px; white-space: nowrap; }
@keyframes aiIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@keyframes aiDot { 0%, 80%, 100% { opacity: .3; transform: translateY(0); } 40% { opacity: 1; transform: translateY(-3px); } }
@media (max-width: 768px) {
  .ai-chat-log { height: 62vh; min-height: 360px; padding: 1rem; }
  .ai-msg { max-width: 94%; }
  .ai-chat-head { padding: .9rem 1rem; }
  .ai-chat-reset span { display: none; }
  .ai-chat-input { padding: .8rem 1rem; }
  .ai-chat-chips { padding: .7rem 1rem 0; }
  .ai-chat-notice { padding: 0 1rem .9rem; }
}
@media (prefers-reduced-motion: reduce) { .ai-msg, .ai-done { animation: none; } .ai-chat-log { scroll-behavior: auto; } }

/* ── Floating 24h chat widget (bottom-right) ── */
.chat-widget{position:fixed;right:22px;bottom:22px;z-index:1100;display:flex;flex-direction:column;align-items:flex-end;gap:14px;pointer-events:none}
.chat-widget>*{pointer-events:auto}
.chat-fab{display:inline-flex;align-items:center;gap:10px;height:58px;padding:0 20px 0 16px;border:0;border-radius:999px;background:var(--deep);color:#fff;font:600 .95rem 'Noto Sans KR',sans-serif;cursor:pointer;box-shadow:0 10px 28px rgba(44,36,22,.32);transition:transform .2s,box-shadow .2s,background .2s}
.chat-fab:hover{transform:translateY(-2px);box-shadow:0 14px 34px rgba(44,36,22,.38);background:#3a2f1c}
.chat-fab:focus-visible{outline:3px solid var(--gold-light);outline-offset:3px}
.chat-fab-icon{position:relative;width:28px;height:28px;display:flex;align-items:center;justify-content:center;font-size:1.25rem;color:var(--gold-bright,#f5c842)}
.chat-fab-icon .fa-xmark{position:absolute;opacity:0;transform:rotate(-60deg) scale(.6);transition:opacity .2s,transform .25s}
.chat-fab-icon .fa-comments{transition:opacity .2s,transform .25s}
.chat-fab[aria-expanded="true"] .fa-comments{opacity:0;transform:rotate(60deg) scale(.6)}
.chat-fab[aria-expanded="true"] .fa-xmark{opacity:1;transform:none}
.chat-fab::after{content:'';position:absolute;inset:-4px;border-radius:999px;border:2px solid rgba(201,168,76,.55);opacity:0;animation:fabPulse 2.6s ease-out 1.2s 3}
.chat-fab{position:relative}
@keyframes fabPulse{0%{opacity:.9;transform:scale(.96)}100%{opacity:0;transform:scale(1.14)}}
.chat-panel{width:min(400px,calc(100vw - 28px));max-height:min(640px,calc(100dvh - 130px));display:flex;flex-direction:column;border-radius:20px;overflow:hidden;box-shadow:0 22px 60px rgba(44,36,22,.3);transform-origin:bottom right;animation:panelIn .26s cubic-bezier(.23,1,.32,1)}
.chat-panel[hidden]{display:none}
@keyframes panelIn{from{opacity:0;transform:translateY(14px) scale(.96)}to{opacity:1;transform:none}}
.chat-panel .ai-chat{margin:0;max-width:none;width:100%;border-radius:20px;box-shadow:none;border:0;flex:1;min-height:0}
.chat-panel .ai-chat-log{height:auto;flex:1;min-height:240px;max-height:none}
.ai-chat-close{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;border:0;border-radius:50%;background:rgba(255,255,255,.12);color:#fff;cursor:pointer;flex-shrink:0;transition:background .2s}
.ai-chat-close:hover{background:rgba(255,255,255,.22)}
.ai-chat-close i{font-size:1rem}
.chat-panel .ai-chat-reset span{display:none}
@media(max-width:640px){
  .chat-widget{right:12px;bottom:12px}
  .chat-fab{height:54px;padding:0 16px}
  .chat-fab-label{display:none}
  .chat-panel{width:calc(100vw - 24px);max-height:calc(100dvh - 96px)}
}
@media(prefers-reduced-motion:reduce){.chat-panel{animation:none}.chat-fab::after{animation:none}}

/* ── Chat panel: compact header, wider panel ── */
.chat-panel{width:min(470px,calc(100vw - 28px))}
.chat-panel .ai-chat-head{padding:.6rem .9rem;gap:10px}
.chat-panel .ai-chat-avatar{width:34px;height:34px;font-size:.95rem}
.chat-panel .ai-chat-title{gap:0}
.chat-panel .ai-chat-title strong{font-size:.98rem;line-height:1.35}
.chat-panel .ai-chat-title span{font-size:.74rem;line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
.chat-panel .ai-chat-title span .ai-dot{display:inline-block;margin-right:6px;vertical-align:middle}
.chat-panel .ai-chat-close{width:30px;height:30px}
.chat-panel .ai-chat-close i{font-size:.9rem}
.chat-panel .ai-chat-log{padding:1rem}
@media(max-width:640px){.chat-panel{width:calc(100vw - 24px)}}