/* ===== AI 志愿助手：右下角悬浮聊天面板 =====
   视觉对齐预选志愿面板（同主色 #4a90e2、圆形 FAB、滑出动画）。
   层级：scroll-nav(998) < 预选FAB(1000) < 预选面板(1001) < AI(1002+)
   右侧纵向占位：scroll-nav bottom:110px、预选FAB bottom:180px、本FAB bottom:24px */

.ai-fab {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 1002;
    width: 52px;
    height: 52px;
    border-radius: 50%;
    background: var(--primary-color);
    color: #fff;
    border: none;
    box-shadow: 0 6px 18px rgba(74, 144, 226, 0.45);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}
.ai-fab__icon { font-size: 1.6rem; line-height: 1; }
.ai-fab:hover { background: var(--primary-hover); transform: translateY(-2px); box-shadow: 0 8px 22px rgba(74, 144, 226, 0.55); }
.ai-fab.is-active { background: var(--primary-hover); }

/* ===== 面板本体 ===== */
.ai-panel {
    position: fixed;
    right: 24px;
    bottom: 24px;
    z-index: 1003;
    width: 380px;
    max-width: calc(100vw - 32px);
    height: 560px;
    max-height: calc(100vh - 48px);
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.22);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    /* 收起状态：隐藏并下移，配合动画 */
    opacity: 0;
    visibility: hidden;
    transform: translateY(16px) scale(0.98);
    transform-origin: bottom right;
    pointer-events: none;
    transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s;
}
.ai-panel.is-open {
    opacity: 1;
    visibility: visible;
    transform: translateY(0) scale(1);
    pointer-events: auto;
}

/* 头部 */
.ai-panel__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 14px;
    background: var(--primary-color);
    color: #fff;
    flex-shrink: 0;
}
.ai-panel__title { font-weight: 700; font-size: 1rem; }
.ai-panel__actions { display: flex; align-items: center; gap: 6px; }
.ai-btn {
    width: 30px; height: 30px;
    border: none; border-radius: 8px;
    background: rgba(255, 255, 255, 0.18);
    color: #fff; cursor: pointer;
    font-size: 1.1rem; line-height: 1;
    display: flex; align-items: center; justify-content: center;
    transition: background 0.15s ease;
}
.ai-btn:hover { background: rgba(255, 255, 255, 0.32); }
.ai-btn--text { width: auto; padding: 0 10px; font-size: 0.82rem; font-weight: 600; }

/* 消息列表 */
.ai-list {
    flex: 1;
    overflow-y: auto;
    padding: 14px;
    background: #f7f8fa;
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.ai-empty {
    color: var(--text-secondary);
    font-size: 0.86rem;
    line-height: 1.7;
    background: #fff;
    border: 1px solid var(--border-color);
    border-radius: 10px;
    padding: 14px;
}
.ai-empty em { color: var(--primary-color); font-style: normal; }

.ai-msg { display: flex; }
.ai-msg--user { justify-content: flex-end; }
.ai-msg--assistant { justify-content: flex-start; }
.ai-bubble {
    max-width: 85%;
    padding: 9px 13px;
    border-radius: 14px;
    font-size: 0.9rem;
    line-height: 1.6;
    word-wrap: break-word;
    overflow-wrap: anywhere;
    white-space: normal;
}
.ai-msg--user .ai-bubble {
    background: var(--primary-color);
    color: #fff;
    border-bottom-right-radius: 4px;
}
.ai-msg--assistant .ai-bubble {
    background: #fff;
    color: var(--text-main, #2c3e50);
    border: 1px solid var(--border-color);
    border-bottom-left-radius: 4px;
}

/* 助手气泡内的 markdown 元素 */
.ai-bubble p { margin: 0 0 6px; }
.ai-bubble ul { margin: 6px 0; padding-left: 20px; }
.ai-bubble li { margin: 2px 0; }
.ai-bubble strong { font-weight: 700; }
.ai-bubble code {
    background: #eef1f4; padding: 1px 5px; border-radius: 4px;
    font-family: Consolas, Monaco, monospace; font-size: 0.85em;
}
.ai-bubble pre {
    background: #2d2d2d; color: #f0f0f0; padding: 10px;
    border-radius: 8px; overflow-x: auto; margin: 6px 0;
}
.ai-bubble pre code { background: transparent; color: inherit; padding: 0; }
.ai-err { color: #e74c3c; }

/* 助手气泡内的标题 / 分隔线 / 表格（窄气泡内紧凑呈现） */
.ai-bubble .ai-h {
    margin: 8px 0 4px;
    font-weight: 700;
    line-height: 1.4;
    color: var(--text-main, #2c3e50);
}
.ai-bubble h1.ai-h, .ai-bubble h2.ai-h { font-size: 1.02em; }
.ai-bubble h3.ai-h, .ai-bubble h4.ai-h,
.ai-bubble h5.ai-h, .ai-bubble h6.ai-h { font-size: 0.95em; }
.ai-bubble .ai-h:first-child { margin-top: 0; }
.ai-bubble .ai-hr {
    border: none;
    border-top: 1px solid var(--border-color);
    margin: 8px 0;
}
.ai-bubble .ai-table {
    border-collapse: collapse;
    width: 100%;
    margin: 6px 0;
    font-size: 0.82rem;
}
.ai-bubble .ai-table th,
.ai-bubble .ai-table td {
    border: 1px solid var(--border-color);
    padding: 4px 6px;
    text-align: left;
    word-break: break-word;
}
.ai-bubble .ai-table th { background: #f0f2f5; font-weight: 600; }

/* 等待动画（思考中的省略号） */
.ai-bubble.is-pending::after {
    content: '●●●';
    letter-spacing: 2px;
    color: #bcc4cc;
    animation: ai-blink 1.2s infinite;
}
@keyframes ai-blink { 0%, 100% { opacity: 0.3; } 50% { opacity: 1; } }

/* 输入区 */
.ai-input-row {
    display: flex;
    align-items: flex-end;
    gap: 8px;
    padding: 10px 12px;
    border-top: 1px solid var(--border-color);
    background: #fff;
    flex-shrink: 0;
}
.ai-input {
    flex: 1;
    resize: none;
    border: 1px solid var(--border-color);
    border-radius: 10px;
    padding: 9px 12px;
    font-size: 0.9rem;
    line-height: 1.4;
    font-family: inherit;
    max-height: 120px;
    outline: none;
    transition: border-color 0.15s ease, box-shadow 0.15s ease;
}
.ai-input:focus { border-color: var(--primary-color); box-shadow: 0 0 0 3px rgba(74, 144, 226, 0.1); }
.ai-input:disabled { background: #f0f2f5; }
.ai-send, .ai-stop {
    width: 38px; height: 38px;
    border: none; border-radius: 10px;
    cursor: pointer; flex-shrink: 0;
    font-size: 1rem; line-height: 1;
    display: flex; align-items: center; justify-content: center;
    transition: background 0.15s ease, transform 0.15s ease;
}
.ai-send { background: var(--primary-color); color: #fff; }
.ai-send:hover { background: var(--primary-hover); transform: translateY(-1px); }
.ai-stop { background: #e74c3c; color: #fff; }
.ai-stop:hover { background: #c0392b; }

/* 移动端：面板铺满 */
@media (max-width: 768px) {
    .ai-fab { right: 16px; bottom: 16px; width: 48px; height: 48px; }
    .ai-fab__icon { font-size: 1.4rem; }
    .ai-panel {
        right: 0; left: 0; bottom: 0;
        width: 100%; max-width: 100%;
        height: 82vh; max-height: 82vh;
        border-radius: 16px 16px 0 0;
        transform-origin: bottom center;
    }
}