/* 窗口主体：加入毛玻璃、阴影和圆角 */
.os-window {
    position: absolute;
    background: var(--window-bg);
    backdrop-filter: var(--backdrop-blur);
    -webkit-backdrop-filter: var(--backdrop-blur);
    border: 1px solid var(--window-border);
    border-radius: 10px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.2);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    min-width: 250px;
    min-height: 150px;
    /* 默认不加 transition，由 JS 控制何时添加以防止拖拽卡顿 */
    /* 【关键修复】覆盖父层的 none，让窗口实体能够被点击和拖拽 */
    pointer-events: auto;

    /* 失焦时：投影变小，体现 Z 轴高度降低 */
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08); 
    /* 增加过渡动画，让聚焦/失焦切换如丝般顺滑 */
    transition: box-shadow 0.25s ease, opacity 0.25s ease;
}
/* 失焦时的标题栏：背景变灰暗/微透，文字变灰 */
.os-window .window-header {
    background-color: rgba(243, 244, 246, 0.9); /* 浅灰偏透明 */
    color: #9ca3af; /* 灰色文字，内部元素将继承这个颜色 */
    transition: background-color 0.25s, color 0.25s;
}
/* 修复：失焦时的应用小图标半透明且变成黑白 */
.os-window .window-title-container svg {
    opacity: 0.5;
    filter: grayscale(100%);
    transition: all 0.25s ease;
}
/* 失焦时的图标：半透明且变成黑白，进一步降低视觉干扰 */
.os-window .window-title svg {
    opacity: 0.5;
    filter: grayscale(100%);
    transition: all 0.25s ease;
}
/* ==========================================
   2. 窗口聚焦状态 (Active)
   ========================================== */
.os-window.is-active {
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.2); 
}

/* 聚焦时的标题栏：背景亮起，文字恢复正常颜色 */
.os-window.is-active .window-header {
    background-color: var(--window-bg, #ffffff); 
    color: var(--text-primary); /* 修复：使用正确的系统主文本颜色 */
}

/* 修复：聚焦时的图标恢复彩色和全不透明度 */
.os-window.is-active .window-title-container svg {
    opacity: 1;
    filter: none;
}

/* 【核心修复】：拦截 Web OS 注入的深色主题标识，替换原生媒体查询 */
html[data-theme="dark"] .os-window .window-header {
    background-color: rgba(31, 41, 55, 0.8);
    color: #6b7280; /* 失焦时暗灰色 */
}
html[data-theme="dark"] .os-window.is-active .window-header {
    background-color: var(--window-bg, #111827);
    color: var(--text-primary); /* 聚焦时恢复明亮 */
}


/* 带有动画过渡的类（用于最大化、还原） */
/* --- 优化：窗口出场与隐藏动画 --- */
/* 增加 cubic-bezier 让动画更有弹性 */
.os-window.is-animating {
    transition: all 0.35s cubic-bezier(0.2, 0.9, 0.3, 1.1) !important;
}
/* 窗口刚创建或准备关闭时的状态 (缩小并下沉) */
.os-window.is-opening {
    opacity: 0 !important;
    transform: scale(0.85) translateY(30px) !important;
}
/* 最小化状态 (夸张的下沉，模拟吸入任务栏) */
.os-window.is-minimized {
    opacity: 0 !important;
    pointer-events: none !important;
    transform: scale(0.8) translateY(50px) !important;
}
/* =========================================
   拖拽/缩放时的 Iframe 事件阻断保护
========================================= */
/* 当任何一个窗口处于拖拽或缩放状态时，给整个 body 盖上保护罩，
   彻底屏蔽【所有】窗口内部 iframe 的鼠标事件，防止跨窗口吞噬焦点 */
.os-window.is-moving .window-content,
body.is-global-moving .window-content {
    pointer-events: none !important;
}

/* --- 标题栏：左右分布布局 --- */
.window-header {
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 0 0 10px;
    background: transparent;
    border-bottom: 1px solid var(--window-border);
    user-select: none;
    overflow: hidden; /* 第一重保险：绝对不允许任何东西溢出整个 header */
    touch-action: none; /* 【核心新增】：禁止移动端在此处触发默认的页面拖拽回弹 */
}
/* 标题容器 (包含应用小图标和文字) */
.window-title-container {
    display: flex;
    align-items: center;
    gap: 8px;
    padding-left: 10px; /* 让图标离左边框远一点 */
    pointer-events: none;
    color: inherit;
    
    /* 吸收所有剩余空间，但允许缩小 */
    flex: 1; 
    min-width: 0; 
}

/* 限制标题栏里的小图标尺寸 */
.window-title-container svg {
    width: 14px;
    height: 14px;
    flex-shrink: 0; /* 确保左侧的应用小图标绝对不会被挤压变形 */
}

/* 标题文字本身 */
.window-title {
    font-size: 13px;
    font-weight: 500;
    
    position: static !important; 
    text-align: left !important; 
    left: auto !important;
    right: auto !important;
    
    /* 截断溢出文字 */
    white-space: nowrap; 
    overflow: hidden; 
    text-overflow: ellipsis; 
    display: block; 
    margin-right: 15px; /* 强制和右边的按钮保持一段距离 */
}

/* --- 类 Windows 控制按钮组 --- */
.window-controls {
    display: flex;
    height: 100%;
    z-index: 2;
    flex-shrink: 0; /* 绝对不允许缩小 */
}

.control-btn {
    width: 46px; 
    height: 100%;
    border: none;

    color: inherit; 
    transition: background-color 0.1s, color 0.25s;

    display: flex;
    align-items: center;
    justify-content: center;
    cursor: default; 
    transition: background-color 0.1s;
    
    /* 强制覆盖之前残留的红黄绿 macOS 样式 */
    background-color: transparent !important; 
    border-radius: 0 !important;
}

.control-btn svg {
    width: 10px;
    height: 10px;
    pointer-events: none; 
}

/* 悬浮效果 */
.control-btn:hover { background-color: var(--window-border) !important; }
.btn-close:hover { background-color: #e81123 !important; color: #ffffff !important; }


/* 窗口内容区 */
.window-content {
    flex: 1;
    overflow: auto;
    position: relative;
    background: transparent;
}

/* --- 缩放手柄 (8个方向) --- */
.resize-handle {
    position: absolute;
    z-index: 100;
    touch-action: none; /* 【核心新增】：防止边缘缩放时触发手机侧滑返回手势 */
}
.resize-n { top: -3px; left: 10px; right: 10px; height: 6px; cursor: n-resize; }
.resize-s { bottom: -3px; left: 10px; right: 10px; height: 6px; cursor: s-resize; }
.resize-e { top: 10px; bottom: 10px; right: -3px; width: 6px; cursor: e-resize; }
.resize-w { top: 10px; bottom: 10px; left: -3px; width: 6px; cursor: w-resize; }
.resize-nw { top: -3px; left: -3px; width: 10px; height: 10px; cursor: nw-resize; }
.resize-ne { top: -3px; right: -3px; width: 10px; height: 10px; cursor: ne-resize; }
.resize-sw { bottom: -3px; left: -3px; width: 10px; height: 10px; cursor: sw-resize; }
.resize-se { bottom: -3px; right: -3px; width: 10px; height: 10px; cursor: se-resize; }

/* --- 修复：最大化时隐藏所有缩放手柄，防止鼠标指针变化 --- */
.os-window.is-maximized .resize-handle {
    display: none;
    pointer-events: none;
}

/* =========================================
   拖拽/缩放时的 Iframe 事件阻断保护
========================================= */
/* 当窗口处于拖拽或缩放状态时，彻底禁用内容区的鼠标事件 */
.os-window.is-moving .window-content {
    pointer-events: none !important;
}

/* =========================================
   "打开方式" 模态对话框
========================================= */
.open-with-overlay {
    position: fixed; top: 0; left: 0; width: 100vw; height: 100vh;
    background: rgba(0,0,0,0.4); backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px);
    display: flex; align-items: center; justify-content: center; 
    /* 【核心替换】：使用系统顶级对话框 Z-Index 变量 */
    z-index: var(--z-system-dialog);
    opacity: 0; animation: fadeIn 0.2s forwards;
}
@keyframes fadeIn { to { opacity: 1; } }

.open-with-modal {
    background: var(--window-bg, #ffffff); border: 1px solid var(--window-border, #e5e7eb);
    border-radius: 12px; width: 340px; padding: 20px;
    box-shadow: 0 20px 40px rgba(0,0,0,0.2); color: var(--text-primary);
    transform: scale(0.95); animation: popUp 0.2s cubic-bezier(0.2, 0.8, 0.2, 1) forwards;
}
@keyframes popUp { to { transform: scale(1); } }

.open-with-modal h3 { margin: 0 0 8px 0; font-size: 16px; }
.open-with-modal .file-info { font-size: 13px; color: var(--text-secondary); margin-bottom: 15px; word-break: break-all; }

.open-with-app-list {
    max-height: 200px; overflow-y: auto;
    border: 1px solid var(--window-border); border-radius: 8px; margin-bottom: 15px;
}
.open-with-app-item {
    display: flex; align-items: center; gap: 12px; padding: 10px 15px;
    cursor: pointer; border-bottom: 1px solid var(--window-border); transition: background 0.1s;
}
.open-with-app-item:last-child { border-bottom: none; }
.open-with-app-item:hover { background: var(--icon-hover-bg, rgba(0,0,0,0.05)); }
.open-with-app-item svg { width: 24px; height: 24px; }
.open-with-app-item span { font-size: 14px; }

.open-with-actions { display: flex; justify-content: flex-end; }
.open-with-actions button {
    padding: 6px 16px; border-radius: 6px; cursor: pointer; background: transparent;
    border: 1px solid var(--window-border); color: inherit; transition: background 0.1s;
}
.open-with-actions button:hover { background: var(--icon-hover-bg); }

/* 系统环境层（如剥离后的桌面应用） */
.os-window.is-system-env {
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
    border-radius: 0 !important;
    backdrop-filter: none !important;
    pointer-events: auto; /* 必须允许内部交互 */
}
.os-window.is-system-env .window-content {
    background: transparent !important;
}

/* =========================================
   应用休眠状态遮罩 (Visual Freeze Overlay)
========================================= */
.window-suspended-overlay {
    position: absolute; top: 0; left: 0; width: 100%; height: 100%;
    background: var(--window-bg); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    color: var(--text-secondary); z-index: 10; animation: fadeIn 0.3s ease;
}
.window-suspended-overlay svg { width: 56px; height: 56px; margin-bottom: 15px; opacity: 0.4; filter: grayscale(100%); }
.window-suspended-overlay p { font-size: 14px; font-weight: bold; margin: 0; color: var(--text-primary); }
.window-suspended-overlay span { font-size: 12px; opacity: 0.7; margin-top: 6px; }

/* ==========================================
   移动端 (Mobile) 深度体验优化
   ========================================== */
@media screen and (max-width: 768px) {
    /* 【核心修复】：必须使用 !important 击穿 JS 注入的内联 min-width 样式 */
    .os-window {
        min-width: 0 !important;
        min-height: 0 !important;
    }
    /* 1. 强制隐藏窗口右上角的“最大化/还原”按钮 */
    .os-window .btn-max {
        display: none !important;
    }

    /* 2. 隐藏所有边缘缩放手柄，防止误触侧滑返回 */
    .os-window .resize-handle {
        display: none !important;
    }

    /* 3. 完美修复最大化排版：铺满全屏、去除圆角、适配增高的任务栏 */
    .os-window.is-maximized {
        width: 100vw !important;
        /* 【核心修复 1】：放弃 100vh 计算，改为 auto，通过 top 和 bottom 自动撑开 */
        height: auto !important; 
        top: 0 !important;
        left: 0 !important;
        /* 【核心修复 2】：绝对吸附到底部任务栏，彻底消灭缝隙 */
        bottom: 0 !important; 
        border-radius: 0 !important;
        border: none !important;
    }

    /* 强行保护右上角的控制按钮不被长标题挤出屏幕 */
    .window-header {
        position: relative !important;
        padding-right: 0 !important; 
    }
    .window-title-container {
        /* 给右侧按钮留出绝对的 80px 空间 */
        max-width: calc(100% - 80px) !important; 
    }
    .window-controls {
        position: absolute !important;
        right: 0 !important;
        top: 0 !important;
        background: var(--window-bg); /* 给按钮加个底色，防止标题太长文字重叠 */
        box-shadow: -5px 0 10px var(--window-bg); /* 边缘淡出效果 */
    }
    
}

/* ==========================================
   WebOS 焦点修复：防 Iframe 吞噬点击
   ========================================== */
/* 核心魔法：
   排除系统桌面环境（.is-system-env），只对普通的后台应用窗口生效。
   当常规窗口在后台，或正在被拖拽时，强行禁用其内部 iframe 的鼠标事件。
*/
.os-window:not(.is-active):not(.is-system-env) .window-content iframe,
.os-window.is-moving:not(.is-system-env) .window-content iframe {
    pointer-events: none;
}

/* 处于前台激活的常规窗口，以及永远在底层的系统桌面，始终允许交互 */
.os-window.is-active .window-content iframe,
.os-window.is-system-env .window-content iframe {
    pointer-events: auto;
}