/* 
 * 移动端响应式修复
 * 使用触摸设备检测而非单纯基于屏幕宽度
 * 避免移动端横屏时误切换到PC端
 */

/* 替换原有的移动端响应式查询 */
/* 使用 (hover: none) and (pointer: coarse) 来检测触摸设备 */

@media (hover: none) and (pointer: coarse) {
    /* 1. 侧边栏抽屉效果 */
    .sidebar {
        position: fixed !important;
        top: 0; left: 0;
        bottom: var(--icp-footer-height, 36px) !important;
        width: 280px !important;
        max-width: 85vw !important;
        transform: translateX(-100%) !important;
        transition: transform 0.3s ease-in-out !important;
        box-shadow: 2px 0 15px rgba(0,0,0,0.5) !important;
    }
    .sidebar.open { transform: translateX(0) !important; }
    .mobile-menu-btn { display: flex !important; }

    /* 子页：侧栏铺满内容区，账号菜单不被底部版权栏遮挡 */
    body.spa-subpage-active .legacy-page-host .sidebar {
        bottom: 0 !important;
    }

    /* 主页全局版权栏：触摸设备两行排版 */
    #globalSiteFooter.site-footer {
        left: 0 !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        height: auto !important;
        min-height: var(--icp-footer-height, 54px) !important;
        padding: 6px 10px !important;
        gap: 2px !important;
        line-height: 1.35 !important;
        font-size: 11px !important;
        text-align: center !important;
    }

    #globalSiteFooter.site-footer .copyright,
    #globalSiteFooter.site-footer a {
        display: block !important;
        line-height: 1.35 !important;
        max-width: 100% !important;
    }

    #globalSiteFooter.site-footer a {
        white-space: nowrap !important;
    }
    
    /* 2. 移动端 header：标题独占第一行，智能体徽章与工具栏第二行 */
    .chat-header {
        height: auto !important;
        display: grid !important;
        grid-template-columns: 1fr auto !important;
        grid-template-areas:
            "left left"
            "agent toolbar" !important;
        align-items: center !important;
        padding: 8px 12px !important;
        gap: 4px 8px !important;
    }
    .chat-header-left {
        grid-area: left !important;
        width: 100% !important;
        flex-shrink: 0 !important;
        min-width: 0 !important;
    }
    .chat-header-left h2 {
        font-size: 1rem !important;
    }
    .chat-title-cluster {
        flex: 1 1 0% !important;
        min-width: 0 !important;
        overflow: hidden !important;
    }
    .chat-title-text-wrap {
        flex: 0 1 auto !important;
        min-width: 0 !important;
        max-width: 100% !important;
        overflow: hidden !important;
    }
    .chat-title-text-wrap h2 {
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }
    .chat-header-left {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        gap: 8px !important;
        min-width: 0 !important;
    }
    .chat-header-left .mobile-menu-btn {
        flex: 0 0 auto !important;
        flex-shrink: 0 !important;
    }
    .chat-header > .agent-badge {
        grid-area: agent !important;
        justify-self: start !important;
        flex: 0 1 auto !important;
        min-width: 0 !important;
        max-width: min(260px, 48vw) !important;
    }
    .chat-header-toolbar {
        grid-area: toolbar !important;
        width: auto !important;
        flex-shrink: 0 !important;
        justify-content: flex-end !important;
        justify-self: end !important;
    }
    #chatHeaderShareBridgeMount {
        margin-left: auto !important;
    }
    /* toolbar-spacer 已不再需要撑满：
       #chatHeaderToolbarPrimaryBridgeMount { flex:1 } 已承担右推效果 */
    .toolbar-spacer {
        display: none !important;
    }

    /* 3. 移动端模型栏 */
    .model-bar { gap: 4px !important; }
    .model-bar-left {
        flex: 1 !important;
        min-width: 0 !important;
        overflow: hidden !important;
    }
    .model-bar-right {
        flex: 0 0 auto !important;
        min-width: auto !important;
        overflow: visible !important;
        justify-content: flex-end !important;
    }
    .model-bar .model-selector {
        min-width: 0 !important;
        overflow: hidden !important;
    }
    .model-bar .model-selector label {
        display: inline !important;
        font-size: 0.78rem !important;
        flex-shrink: 0 !important;
    }
    .model-bar .model-selector select {
        min-width: 0 !important;
        width: auto !important;
        max-width: 100% !important;
        font-size: 0.78rem !important;
        flex: 0 1 auto !important;
    }
    #chatModelSelect {
        min-width: 170px !important;
        max-width: 100% !important;
    }
    .model-indicator-text {
        max-width: 100% !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
        white-space: nowrap !important;
    }

    /* 侧栏底部菜单（智能体 / 账号）：触摸设备上向上弹出，避免向右被裁切 */
    .sidebar-footer-menu-wrap .sidebar-flyout-panel,
    .auth-menu-wrap--sidebar .sidebar-flyout-panel {
        left: 0 !important;
        right: 0 !important;
        top: auto !important;
        bottom: calc(100% + 8px) !important;
        width: 100% !important;
        max-width: none !important;
        max-height: min(50dvh, calc(100dvh - var(--icp-footer-height, 36px) - 24px)) !important;
    }
}

@media (hover: none) and (pointer: coarse) {
    /* 隐藏历史条数栏和自动压缩栏 */
    .history-bar,
    .compress-bar {
        display: none !important;
    }
}