v7.9.1 键盘动画优化 & 菜单位移 & 移动端触摸适配 & 更多增强
   ============================================================ */

/* ---------- 1. 键盘唤起平滑动画增强 ---------- */
/* 
   修复：输入框和welcome-screen等元素同步平滑移动
   - 输入框也有平滑的上移/下移动画
   - welcome-screen等元素跟随输入框同步移动
   - 使用 transform 保证GPU加速，60fps流畅
*/

@media (max-width: 768px) {

    /* 输入区域平滑上移 */
    .input-area {
        transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1),
            padding 0.4s cubic-bezier(0.4, 0, 0.2, 1);
        will-change: transform;
    }

    .keyboard-open .input-area {
        transform: translateY(calc(-1 * min(var(--keyboard-height, 0px) * 0.1, 50px)));
    }

    /* 输入容器也有平滑过渡 */
    .input-container {
        transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1),
            box-shadow 0.3s ease,
            border-color 0.3s ease;
    }

    /* 欢迎屏整体平滑上移 */
    .welcome-screen {
        transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
        will-change: transform;
    }

    .keyboard-open .welcome-screen {
        transform: translateY(calc(-1 * min(var(--keyboard-height, 0px) * 0.15, 80px)));
    }

    /* Logo平滑缩放和上移 */
    .welcome-logo {
        transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1),
            opacity 0.4s ease,
            box-shadow 0.4s ease;
    }

    .keyboard-open .welcome-logo {
        transform: translateY(-6px) scale(0.95);
        opacity: 0.85;
    }

    /* 标题平滑缩放和上移 */
    .welcome-title {
        transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1),
            opacity 0.4s ease;
    }

    .keyboard-open .welcome-title {
        transform: translateY(-4px) scale(0.97);
        opacity: 0.9;
    }

    /* 模式切换平滑上移 */
    .mode-switch {
        transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1),
            opacity 0.4s ease;
    }

    .keyboard-open .mode-switch {
        transform: translateY(-5px);
        opacity: 0.9;
    }

    /* 副标题平滑上移和淡出 */
    .welcome-subtitle {
        transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1),
            opacity 0.4s ease;
    }

    .keyboard-open .welcome-subtitle {
        transform: translateY(-3px);
        opacity: 0.7;
    }

    /* 建议卡片平滑上移 */
    .suggestion-cards {
        transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1),
            opacity 0.4s ease;
    }

    .keyboard-open .suggestion-cards {
        transform: translateY(-5px);
        opacity: 0.9;
    }
}

/* ---------- 2. 菜单键打开/关闭时元素位移 ---------- */
/* 
   新增：侧边栏打开时，主内容区域元素轻微上移
   - 打开菜单时，header和内容轻微上移，留出空间感
   - 关闭时平滑下移回来
   - 位移幅度不大，保持距顶部有一定距离
*/

.sidebar-open .header {
    transform: translateY(-8px);
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

.sidebar-open .chat-container {
    transform: translateY(-8px);
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

.sidebar-open .input-area {
    transform: translateY(-8px);
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

/* 菜单打开时，欢迎屏元素也轻微上移 */
.sidebar-open .welcome-screen {
    transform: translateY(-12px);
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
}

.sidebar-open .welcome-logo {
    transform: scale(0.97);
    opacity: 0.9;
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1),
        opacity 0.35s ease;
}

.sidebar-open .welcome-title {
    transform: scale(0.98);
    opacity: 0.95;
    transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1),
        opacity 0.35s ease;
}

/* ---------- 3. 移动端触摸动画适配 ---------- */
/* 
   优化：为移动端添加触摸反馈动画，同时保留hover效果
   - 使用 :active 伪类实现触摸时的反馈
   - 移动端优先触摸反馈，桌面端保留hover
*/

/* 通用按钮触摸反馈 */
.btn-primary,
.btn-secondary,
.new-chat-btn,
.send-btn,
.action-btn,
.mode-btn,
.input-tool-btn,
.sidebar-footer-btn,
.settings-item,
.theme-option,
.history-item,
.suggestion-card {
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
}

/* 移动端触摸时的按压效果 */
@media (max-width: 768px) {

    /* 主按钮触摸效果 */
    .btn-primary:active {
        transform: scale(0.96) translateY(0);
        box-shadow: 0 2px 8px rgba(77, 91, 255, 0.2);
        transition-duration: 0.1s;
    }

    /* 次要按钮触摸效果 */
    .btn-secondary:active {
        transform: scale(0.96);
        transition-duration: 0.1s;
    }

    /* 新建对话按钮触摸效果 */
    .new-chat-btn:active {
        transform: scale(0.97) translateY(0);
        background-color: var(--bg-tertiary);
        transition-duration: 0.1s;
    }

    /* 发送按钮触摸效果 */
    .send-btn:active:not(:disabled) {
        transform: scale(0.9);
        background: rgba(66, 110, 254, 0.2);
        transition-duration: 0.1s;
    }

    /* 模式按钮触摸效果 */
    .mode-btn:active {
        transform: scale(0.95);
        transition-duration: 0.1s;
    }

    .mode-btn:active .mode-icon {
        transform: scale(0.9);
        transition-duration: 0.1s;
    }

    /* 工具按钮触摸效果 */
    .input-tool-btn:active {
        transform: scale(0.94) translateY(0);
        background: var(--bg-tertiary);
        transition-duration: 0.1s;
    }

    .input-tool-btn:active svg {
        transform: scale(0.85);
        transition-duration: 0.1s;
    }

    /* 建议卡片触摸效果 */
    .suggestion-card:active {
        transform: translateY(1px) scale(0.98);
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
        transition-duration: 0.1s;
    }

    /* 历史项触摸效果 */
    .history-item:active {
        background-color: var(--bg-tertiary);
        transform: scale(0.98);
        transition-duration: 0.1s;
    }

    /* 设置项触摸效果 */
    .settings-item:active {
        transform: translateX(2px) scale(0.99);
        background-color: var(--bg-tertiary);
        transition-duration: 0.1s;
    }

    /* 侧边栏按钮触摸效果 */
    .sidebar-footer-btn:active {
        background-color: var(--bg-tertiary);
        transform: scale(0.97);
        transition-duration: 0.1s;
    }

    .sidebar-footer-btn:active svg {
        transform: scale(0.9);
        transition-duration: 0.1s;
    }

    /* 主题切换触摸效果 */
    .theme-option:active {
        transform: scale(0.95);
        transition-duration: 0.1s;
    }

    /* 头像触摸效果 */
    .sidebar-avatar:active,
    .profile-avatar:active {
        transform: scale(0.95);
        transition-duration: 0.1s;
    }

    /* 菜单按钮触摸效果 */
    .menu-btn:active {
        background-color: var(--bg-tertiary);
        transform: scale(0.9);
        transition-duration: 0.1s;
    }

    /* 麦克风按钮触摸效果 */
    .mic-toggle-btn:active {
        transform: scale(0.9);
        background: var(--bg-tertiary);
        transition-duration: 0.1s;
    }
}

/* 桌面端保留hover效果 */
@media (min-width: 769px) {
    .btn-primary:hover {
        transform: translateY(-2px);
        box-shadow: 0 6px 20px rgba(77, 91, 255, 0.3);
    }

    .btn-primary:active {
        transform: translateY(0) scale(0.98);
        box-shadow: 0 2px 8px rgba(77, 91, 255, 0.2);
    }

    .new-chat-btn:hover {
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(77, 91, 255, 0.15);
        border-color: var(--accent-color);
    }

    .new-chat-btn:active {
        transform: translateY(0) scale(0.98);
    }

    .send-btn:hover:not(:disabled) {
        background: rgba(66, 110, 254, 0.08);
        transform: scale(1.05);
    }

    .send-btn:active:not(:disabled) {
        background: rgba(66, 110, 254, 0.15);
        transform: scale(0.95);
    }

    .suggestion-card:hover {
        transform: translateY(-3px);
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
    }

    .suggestion-card:active {
        transform: translateY(-1px) scale(0.98);
        box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    }
}

/* ---------- 4. 历史项左滑删除修复 ---------- */
/* 
   修复：移动端历史项左滑显示删除按钮
   - 优化滑动阈值和动画
   - 确保删除按钮正确显示
   - 添加红色背景和删除图标
*/

.history-item {
    position: relative;
    overflow: hidden;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    touch-action: pan-y;
}

.history-item.swiped {
    transform: translateX(-70px);
}

/* 滑动删除按钮背景 */
.history-item .swipe-delete-bg {
    position: absolute;
    right: 0;
    top: 0;
    width: 70px;
    height: 100%;
    background: #ef4444;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 0;
}

.history-item .swipe-delete-btn {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.2);
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 18px;
    border: none;
    cursor: pointer;
    transition: all 0.2s ease;
}

.history-item .swipe-delete-btn:active {
    transform: scale(0.9);
    background: rgba(255, 255, 255, 0.3);
}

/* 桌面端保持原有的hover显示效果 */
@media (min-width: 769px) {
    .history-item.swiped {
        transform: none;
    }

    .history-item .swipe-delete-bg {
        display: none;
    }

    .history-item .delete-btn {
        position: absolute;
        right: 8px;
        top: 50%;
        transform: translateY(-50%) scale(0.8);
        width: 24px;
        height: 24px;
        opacity: 0;
        background-color: var(--bg-tertiary);
        color: var(--text-secondary);
        border-radius: 4px;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: opacity 0.2s ease, transform 0.2s ease, background-color 0.2s ease;
    }

    .history-item:hover .delete-btn {
        opacity: 1;
        transform: translateY(-50%) scale(1);
    }

    .history-item .delete-btn:hover {
        background-color: #fee2e2;
        color: #ef4444;
        transform: translateY(-50%) scale(1.1);
    }
}

/* ---------- 5. 移除输入框hover边框变色 ---------- */
/* 
   修复：移除输入框hover时的边框变色效果
   只保留focus时的边框效果
*/

.input-container:hover {
    border-color: var(--border-color) !important;
    box-shadow: none !important;
    transform: none !important;
}

/* 只在focus时才有边框变化 */
.input-container:focus-within {
    border-color: var(--accent-color);
    box-shadow: 0 0 0 3px rgba(77, 91, 255, 0.1);
    transform: translateY(-1px);
}

/* ---------- 6. 右上角新建对话按钮 ---------- */
/* 
   新增：右上角新建对话图标按钮
   - 样式与菜单键保持一致
   - 支持深浅主题
   - 有触摸/悬停动画
*/

.header-right {
    display: flex;
    align-items: center;
    gap: 4px;
}

.new-chat-header-btn {
    width: 40px;
    height: 40px;
    border: none;
    background: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: var(--radius-sm);
    color: var(--text-primary);
    transition: all 0.2s ease;
    -webkit-tap-highlight-color: transparent;
}

.new-chat-header-btn:hover {
    background-color: var(--bg-secondary);
}

.new-chat-header-btn:active {
    transform: scale(0.9);
    background-color: var(--bg-tertiary);
    transition-duration: 0.1s;
}

.new-chat-header-btn svg {
    width: 22px;
    height: 22px;
    transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.new-chat-header-btn:hover svg {
    transform: rotate(90deg) scale(1.1);
}

.new-chat-header-btn:active svg {
    transform: rotate(90deg) scale(0.9);
}

/* 深色模式适配 */
[data-theme="dark"] .new-chat-header-btn {
    color: var(--text-primary);
}

[data-theme="dark"] .new-chat-header-btn:hover {
    background-color: var(--bg-secondary);
}

/* ---------- 7. 更多微交互动画 ---------- */

/* 输入工具按钮激活状态增强 */
.input-tool-btn.active {
    transform: scale(1.05);
    animation: toolBtnGlow 2s ease-in-out infinite;
}

@keyframes toolBtnGlow {

    0%,
    100% {
        box-shadow: 0 0 0 0 rgba(66, 110, 254, 0.3);
    }

    50% {
        box-shadow: 0 0 0 4px rgba(66, 110, 254, 0);
    }
}

/* 模式切换滑块弹性增强 */
.mode-slider {
    transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1),
        width 0.4s cubic-bezier(0.34, 1.56, 0.64, 1),
        background 0.3s ease;
}

/* 消息气泡出现动画优化 */
.message {
    animation-duration: 0.4s;
    animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

/* 侧边栏遮罩渐变 */
.sidebar-overlay {
    transition: opacity 0.3s ease, visibility 0.3s ease;
}

/* 统计卡片数字跳动 */
.stat-card-value {
    display: inline-block;
    transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1),
        color 0.3s ease;
}

.stat-card:hover .stat-card-value {
    transform: scale(1.08);
    color: var(--accent-color);
}

/* 加载点动画优化 */
.typing-dot {
    animation: typingBounce 1.4s infinite ease-in-out;
}

/* 减少动画偏好适配 */
@media (prefers-reduced-motion: reduce) {

    .input-area,
    .welcome-screen,
    .welcome-logo,
    .welcome-title,
    .mode-switch,
    .welcome-subtitle,
    .suggestion-cards,
    .header,
    .chat-container {
        transition: none !important;
        animation: none !important;
    }



    .sidebar-open .header,
    .sidebar-open .chat-container,
    .sidebar-open .input-area,
    .sidebar-open .welcome-screen,
    .sidebar-open .welcome-logo,
    .sidebar-open .welcome-title {
        transform: none !important;
    }

    .input-tool-btn.active,
    .send-btn:not(:disabled) {
        animation: none !important;
    }

    .new-chat-header-btn:hover svg {
        transform: none !important;
    }
}

/* ============================================================
   v7.9.1 增强结束
   ============================================================ */