/* TinyMCE 에디터 AI 패널 — admin + 사용자 게시판 글쓰기 공통 (include/function.php 의 _aiCreatePanel) */
._ai-panel {position:fixed; right:24px; top:84px; bottom:24px; width:460px; background:#fff; border:1px solid rgba(15,23,42,.08); border-radius:16px; box-shadow:0 24px 60px -12px rgba(15,23,42,.18), 0 8px 24px -8px rgba(15,23,42,.08); display:flex; flex-direction:column; z-index:10000; font-family:Pretendard, sans-serif; font-size:14px; color:#0f172a; overflow:hidden;}
._ai-header {display:flex; justify-content:space-between; align-items:center; padding:14px 16px 14px 20px; border-bottom:1px solid rgba(15,23,42,.06); background:#fff;}
._ai-header-left {display:flex; align-items:center; gap:10px; min-width:0; flex:1;}
._ai-title {font-size:15px; font-weight:600; color:#0f172a; letter-spacing:-.2px; display:flex; align-items:center; gap:8px;}
._ai-title:before {content:""; width:6px; height:6px; border-radius:50%; background:var(--color-active, #3b82f6); box-shadow:0 0 0 3px color-mix(in srgb, var(--color-active, #3b82f6) 20%, transparent);}
._ai-header-right {display:flex; align-items:center; gap:4px;}
._ai-iconbtn {background:transparent; border:none; cursor:pointer; color:#64748b; padding:8px; line-height:1; border-radius:8px; display:inline-flex; align-items:center; justify-content:center; transition:background .15s, color .15s;}
._ai-iconbtn:hover {background:rgba(15,23,42,.06); color:#0f172a;}
._ai-iconbtn svg {width:16px; height:16px; display:block;}
._ai-back-btn, ._ai-close-btn {background:transparent; border:none; cursor:pointer; color:#64748b; padding:8px; line-height:1; border-radius:8px; display:flex; align-items:center; justify-content:center; transition:background .15s, color .15s;}
._ai-back-btn {font-size:18px; display:none;}
._ai-close-btn {font-size:20px;}
._ai-back-btn:hover, ._ai-close-btn:hover {background:rgba(15,23,42,.06); color:#0f172a;}

/* chat body */
._ai-chat-body {flex:1; min-height:0; overflow-y:auto; padding:20px; background:#f8f9fb;}
._ai-chat-body::-webkit-scrollbar {width:8px;}
._ai-chat-body::-webkit-scrollbar-thumb {background:rgba(15,23,42,.12); border-radius:4px;}
._ai-chat-body::-webkit-scrollbar-thumb:hover {background:rgba(15,23,42,.2);}
._ai-chat-empty {text-align:center; color:#94a3b8; padding:60px 24px; font-size:13px; line-height:1.8;}

/* 메시지 버블 */
._ai-msg {margin-bottom:18px; display:flex; flex-direction:column;}
._ai-msg-user {align-items:flex-end;}
._ai-msg-assistant {align-items:flex-start;}
._ai-msg-label {font-size:10px; color:#94a3b8; margin-bottom:6px; font-weight:700; text-transform:uppercase; letter-spacing:.5px; padding:0 4px;}
._ai-msg-content {max-width:88%; line-height:1.6;}
._ai-msg-user ._ai-msg-content {background:linear-gradient(135deg, var(--color-active, #3b82f6), color-mix(in srgb, var(--color-active, #3b82f6) 85%, #000)); color:#fff; padding:12px 16px; border-radius:18px 18px 4px 18px; box-shadow:0 4px 12px -2px color-mix(in srgb, var(--color-active, #3b82f6) 30%, transparent); white-space:pre-wrap; word-break:break-word;}
._ai-msg-assistant ._ai-msg-content {background:#fff; border:1px solid rgba(15,23,42,.08); border-radius:18px 18px 18px 4px; padding:14px; box-shadow:0 2px 6px -2px rgba(15,23,42,.04);}

/* 코드 박스 */
._ai-code {font-family:"JetBrains Mono", Consolas, Monaco, monospace; font-size:11.5px; line-height:1.55; max-height:220px; overflow-y:auto; white-space:pre-wrap; word-break:break-all; margin:0 0 10px; background:#0f172a; color:#e2e8f0; padding:12px 14px; border-radius:10px;}
._ai-code::-webkit-scrollbar {width:6px; height:6px;}
._ai-code::-webkit-scrollbar-thumb {background:rgba(255,255,255,.15); border-radius:3px;}

/* 적용 버튼 */
._ai-apply-btn {display:inline-flex; align-items:center; gap:6px; padding:6px 16px; background:var(--color-active, #3b82f6); color:#fff; border:none; border-radius:8px; cursor:pointer; font-size:12px; font-weight:600; letter-spacing:-.1px; transition:transform .15s, box-shadow .15s, filter .15s; box-shadow:0 2px 6px -1px color-mix(in srgb, var(--color-active, #3b82f6) 35%, transparent);}
._ai-apply-btn:hover {filter:brightness(1.08); transform:translateY(-1px); box-shadow:0 6px 12px -2px color-mix(in srgb, var(--color-active, #3b82f6) 40%, transparent);}
._ai-apply-btn:active {transform:translateY(0);}

/* footer */
._ai-footer {border-top:1px solid rgba(15,23,42,.06); padding:12px 14px 14px; background:#fff;}
._ai-controls {display:flex; align-items:center; gap:8px; margin-bottom:10px;}
._ai-model {padding:7px 30px 7px 12px; border:1px solid rgba(15,23,42,.12); border-radius:8px; font-size:12.5px; font-weight:500; background:#f8fafc url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6' fill='none'><path d='M1 1l4 4 4-4' stroke='%2364748b' stroke-width='1.5' stroke-linecap='round'/></svg>") right 10px center no-repeat; color:#334155; outline:none; cursor:pointer; appearance:none; -webkit-appearance:none; transition:border-color .15s, background-color .15s, box-shadow .15s;}
._ai-model:hover {border-color:rgba(15,23,42,.2); background-color:#fff;}
._ai-model:focus {border-color:var(--color-active, #3b82f6); box-shadow:0 0 0 3px color-mix(in srgb, var(--color-active, #3b82f6) 15%, transparent); background-color:#fff;}

/* SEO chip */
._ai-seo-wrap {font-size:12.5px; font-weight:500; display:inline-flex; align-items:center; gap:7px; cursor:pointer; color:#64748b; user-select:none; padding:7px 12px; border:1px solid rgba(15,23,42,.12); border-radius:8px; background:#f8fafc; transition:all .15s;}
._ai-seo-wrap:hover {border-color:rgba(15,23,42,.2); background:#fff; color:#334155;}
._ai-seo-wrap:has(._ai-seo:checked) {border-color:color-mix(in srgb, var(--color-active, #3b82f6) 45%, transparent); background:color-mix(in srgb, var(--color-active, #3b82f6) 8%, #fff); color:var(--color-active, #3b82f6);}
._ai-seo {appearance:auto; -webkit-appearance:checkbox; width:14px; height:14px; margin:0; cursor:pointer; accent-color:var(--color-active, #3b82f6);}

/* SEO 입력 그룹 */
._ai-seo-fields {display:flex; flex-direction:column; gap:6px; margin-bottom:10px; padding:12px; border:1px solid rgba(15,23,42,.08); border-radius:10px; background:#f8fafc;}
._ai-seo-fields input {padding:8px 12px; border:1px solid rgba(15,23,42,.1); border-radius:7px; font-size:13px; font-family:inherit; outline:none; background:#fff; color:#0f172a; transition:border-color .15s, box-shadow .15s;}
._ai-seo-fields input::placeholder {color:#94a3b8;}
._ai-seo-fields input:focus {border-color:var(--color-active, #3b82f6); box-shadow:0 0 0 3px color-mix(in srgb, var(--color-active, #3b82f6) 15%, transparent);}

/* 입력 composer */
._ai-composer {display:flex; flex-direction:column; border:1px solid rgba(15,23,42,.14); border-radius:14px; background:#fff; transition:border-color .15s, box-shadow .15s; overflow:hidden;}
._ai-composer:focus-within {border-color:var(--color-active, #3b82f6); box-shadow:0 0 0 3px color-mix(in srgb, var(--color-active, #3b82f6) 15%, transparent);}
._ai-input {width:100%; resize:none; border:none; padding:12px 14px 6px; font-size:14px; font-family:inherit; line-height:1.55; background:transparent; color:#0f172a; outline:none; min-height:60px; max-height:160px;}
._ai-input::placeholder {color:#94a3b8;}
._ai-composer-actions {display:flex; align-items:center; justify-content:space-between; padding:6px 8px 8px;}
._ai-composer-tools {display:flex; align-items:center; gap:2px;}
._ai-tool-btn {background:transparent; border:none; cursor:pointer; color:#64748b; padding:7px; line-height:1; border-radius:8px; display:inline-flex; align-items:center; justify-content:center; transition:background .15s, color .15s;}
._ai-tool-btn:hover {background:rgba(15,23,42,.06); color:var(--color-active, #3b82f6);}
._ai-tool-btn svg {width:18px; height:18px; display:block;}
._ai-send-btn {width:34px; height:34px; background:var(--color-active, #3b82f6); color:#fff; border:none; border-radius:10px; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; padding:0; transition:filter .15s, transform .15s, box-shadow .15s; box-shadow:0 3px 8px -1px color-mix(in srgb, var(--color-active, #3b82f6) 35%, transparent);}
._ai-send-btn:hover {filter:brightness(1.08); transform:translateY(-1px); box-shadow:0 6px 14px -2px color-mix(in srgb, var(--color-active, #3b82f6) 45%, transparent);}
._ai-send-btn:active {transform:translateY(0);}
._ai-send-btn:disabled {background:#cbd5e1; cursor:not-allowed; filter:none; transform:none; box-shadow:none;}
._ai-send-btn svg {width:16px; height:16px; display:block; color:#fff; stroke:#fff;}
._ai-actions, ._ai-newchat-btn {display:none;}

/* 대화 목록 */
._ai-list-view {flex:1; overflow-y:auto; background:#f8f9fb;}
._ai-list-view::-webkit-scrollbar {width:8px;}
._ai-list-view::-webkit-scrollbar-thumb {background:rgba(15,23,42,.12); border-radius:4px;}
._ai-list-header {padding:16px 20px 12px; display:flex; justify-content:flex-end;}
._ai-list-newbtn {padding:9px 18px; background:var(--color-active, #3b82f6); color:#fff; border:none; border-radius:10px; cursor:pointer; font-size:13px; font-weight:600; letter-spacing:-.1px; transition:filter .15s, transform .15s, box-shadow .15s; box-shadow:0 4px 10px -2px color-mix(in srgb, var(--color-active, #3b82f6) 30%, transparent);}
._ai-list-newbtn:hover {filter:brightness(1.08); transform:translateY(-1px); box-shadow:0 6px 16px -2px color-mix(in srgb, var(--color-active, #3b82f6) 40%, transparent);}
._ai-list-newbtn:active {transform:translateY(0);}
._ai-list-items {padding:0 16px 16px;}
._ai-list-item {display:flex; align-items:center; padding:14px 16px; background:#fff; border:1px solid rgba(15,23,42,.06); border-radius:12px; margin-bottom:10px; cursor:pointer; transition:border-color .18s, box-shadow .18s, transform .18s;}
._ai-list-item:hover {border-color:color-mix(in srgb, var(--color-active, #3b82f6) 35%, transparent); box-shadow:0 8px 20px -6px rgba(15,23,42,.1); transform:translateY(-1px);}
._ai-list-info {flex:1; min-width:0;}
._ai-list-title {font-size:13.5px; font-weight:600; color:#0f172a; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; letter-spacing:-.1px;}
._ai-list-date {font-size:11px; color:#94a3b8; margin-top:4px;}
._ai-list-del {background:transparent; border:none; color:#cbd5e1; font-size:14px; cursor:pointer; padding:6px 8px; line-height:1; flex-shrink:0; border-radius:6px; transition:color .15s, background .15s;}
._ai-list-del:hover {color:#ef4444; background:rgba(239,68,68,.08);}
._ai-list-empty {text-align:center; color:#94a3b8; padding:60px 24px; font-size:13px; line-height:1.8;}

/* 이미지 첨부 */
._ai-attach-btn {background:transparent; border:none; cursor:pointer; color:#64748b; padding:7px; line-height:1; border-radius:8px; display:inline-flex; align-items:center; justify-content:center; transition:background .15s, color .15s;}
._ai-attach-btn:hover {background:rgba(15,23,42,.06); color:var(--color-active, #3b82f6);}
._ai-attach-btn svg {width:18px; height:18px; display:block;}
._ai-attach-preview {display:flex; flex-wrap:wrap; gap:8px; padding:10px 12px 0;}
._ai-attach-thumb {position:relative; width:64px; height:64px; border-radius:10px; overflow:hidden; border:1px solid rgba(15,23,42,.08); box-shadow:0 2px 4px -1px rgba(15,23,42,.06);}
._ai-attach-thumb img {width:100%; height:100%; object-fit:cover; display:block;}
._ai-attach-del {position:absolute; top:3px; right:3px; background:rgba(15,23,42,.65); color:#fff; border:none; border-radius:50%; width:20px; height:20px; font-size:12px; line-height:20px; text-align:center; cursor:pointer; padding:0; transition:background .15s, transform .15s;}
._ai-attach-del:hover {background:rgba(15,23,42,.85); transform:scale(1.08);}
