/**
 * 项目面板 - 列表视图样式
 * 使用 review- 前缀确保样式独立
 * 符合规范：<400行
 */

/* 列表视图容器 - 紧凑列显示 */
#review-panel .review-folder-content:not(.review-thumbnail-view) {
    padding: var(--review-spacing-md, var(--spacing-md));
    /* 列表模式列对齐：统一表头/行数据的 Grid 定义（适度缩小） */
    /* 第三列为“大小”，适当加宽以避免换行；第三、四列之间通过 padding 做额外间距 */
    --review-list-grid-columns: 40px minmax(160px, 1fr) 96px 100px 72px 64px 64px 80px;
    --review-list-grid-gap: 12px;
    --review-list-grid-padding: 8px 14px;
}

/* 列表表头 */
#review-panel .review-list-header {
    display: grid;
    grid-template-columns: var(--review-list-grid-columns);
    gap: var(--review-list-grid-gap);
    align-items: center;
    padding: var(--review-list-grid-padding);
    background: var(--bg-secondary);
    border-radius: var(--review-radius-sm, var(--radius-sm));
    margin-bottom: 6px;
    font-size: 11px;
    font-weight: 600;
    color: var(--text-secondary);
    font-family: "Microsoft YaHei", "微软雅黑", "SimSun", "宋体", "Arial", sans-serif;
}

#review-panel .review-list-header > div {
    display: flex;
    align-items: center;
}

#review-panel .review-list-header .review-header-size {
    justify-content: flex-end;
    /* 列表头：大小列文字略弱 + 明显与时间列拉开一点距离 */
    color: var(--text-muted, rgba(255, 255, 255, 0.4));
    padding-right: 18px;
}

#review-panel .review-list-header .review-header-time,
#review-panel .review-list-header .review-header-uploader {
    color: var(--text-muted, rgba(255, 255, 255, 0.4));
}

#review-panel .review-list-header .review-header-version,
#review-panel .review-list-header .review-header-status {
    justify-content: center;
}

#review-panel .review-list-header .review-header-actions {
    justify-content: flex-end;
}

/* 列表项 - 使用 Grid 布局实现列对齐（紧凑行高） */
#review-panel .review-content-item {
    display: grid;
    grid-template-columns: var(--review-list-grid-columns);
    gap: var(--review-list-grid-gap);
    align-items: center;
    padding: var(--review-list-grid-padding);
    border-bottom: 1px solid var(--review-border-color, var(--border-primary));
    cursor: pointer;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    border-radius: var(--review-radius-sm, var(--radius-sm));
    margin: 2px 0;
    font-size: 12px;
    font-family: "Microsoft YaHei", "微软雅黑", "SimSun", "宋体", "Arial", sans-serif;
    color: var(--review-text-primary, var(--text-primary));
    min-height: 44px;
}

/* 文件夹行特殊样式（保留扩展点） */
#review-panel .review-content-item.folder .review-name {
    font-weight: 600;
    /* 文件夹名称加粗显示 */
}

#review-panel .review-content-item:hover {
    background: var(--bg-hover);
    box-shadow: var(--shadow-sm);
}

#review-panel .review-content-item.active {
    background: var(--gradient-primary);
    color: var(--text-primary);
    font-weight: 600;
    box-shadow: var(--shadow-md);
}

#review-panel .review-content-item.active:hover {
    background: linear-gradient(135deg, #764ba2 0%, #667eea 100%);
    box-shadow: var(--shadow-lg);
}

/* 列表缩略图/图标容器（紧凑尺寸） */
#review-panel .review-content-item .review-icon,
#review-panel .review-content-item .review-icon.review-list-thumbnail-container {
    width: 40px;
    height: 40px;
    position: relative;
    background: var(--bg-tertiary);
    border-radius: 5px;
    border: 1px solid var(--review-border-color, var(--border-primary));
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    font-size: 20px;
    transition: all 0.2s ease;
    flex-shrink: 0;
}

/* 文件夹图标特殊样式 */
#review-panel .review-content-item .review-icon:not(.review-list-thumbnail-container) {
    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
    background: var(--bg-tertiary);
}

#review-panel .review-content-item:hover .review-icon {
    transform: scale(1.05);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

/* 选中状态下的图标 */
#review-panel .review-content-item.active .review-icon {
    border-color: rgba(255, 255, 255, 0.3);
}

/* 兼容 list-thumbnail-preview（供 thumbnail-loader 使用） */
#review-panel .review-content-item .review-list-thumbnail-container.list-thumbnail-preview,
#review-panel .review-content-item .list-thumbnail-preview {
    width: 100%;
    height: 100%;
    min-width: 0;
    min-height: 0;
}

/* 列表模式缩略图图片样式 */
#review-panel .review-content-item .list-thumbnail-image {
    max-width: 100% !important;
    max-height: 100% !important;
    width: auto !important;
    height: auto !important;
    object-fit: contain !important;
    display: block;
    margin: 0 auto;
}

/* 确保列表模式不使用cover样式 */
#review-panel .review-content-item .list-thumbnail-preview img {
    object-fit: contain !important;
}

/* 文件名 - 固定宽度，超出显示省略号 */
#review-panel .review-content-item .review-name,
#review-panel .review-content-item .review-file-name {
    font-size: 12px;
    line-height: 1.4;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 500;
    cursor: pointer;
    position: relative;
}

/* 文件大小 */
#review-panel .review-content-item .review-size {
    font-size: 11px;
    /* 再弱一点的提示色 */
    color: var(--text-muted, rgba(255, 255, 255, 0.4));
    text-align: right;
    /* 通过额外 padding-right 明显拉开与“上传时间”列的视觉间距 */
    padding-right: 18px;
    /* 始终一行显示：数值 + 单位不换行 */
    white-space: nowrap;
}

/* 上传时间 */
#review-panel .review-content-item .review-time {
    font-size: 11px;
    color: var(--text-muted, rgba(255, 255, 255, 0.4));
    white-space: nowrap;
}

/* 上传者（项目面板列表独立列） */
#review-panel .review-content-item .review-uploader {
    font-size: 11px;
    color: var(--text-muted, rgba(255, 255, 255, 0.4));
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-family: "Microsoft YaHei", "微软雅黑", "SimSun", "宋体", "Arial", sans-serif;
}

/* 版本号 */
#review-panel .review-content-item .review-version {
    font-size: 11px;
    color: var(--review-text-secondary, var(--text-secondary));
    text-align: center;
}

/* 状态包装器 */
#review-panel .review-content-item .review-status-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
}

/* 状态标记 */
#review-panel .review-content-item .review-status-badge {
    font-size: 10px;
    padding: 3px 6px;
    border-radius: 10px;
    font-weight: 600;
    white-space: nowrap;
}

/* 无状态时不显示任何内容，避免黑色底框 */
#review-panel .review-content-item .review-status-badge.review-status-badge--empty,
#review-panel .review-content-item .review-status-badge:empty {
    display: none;
}

/* 操作按钮组 */
#review-panel .review-content-item .review-actions {
    display: flex;
    gap: 6px;
    align-items: center;
    justify-content: flex-end;
    opacity: 0;
    transition: opacity 0.2s ease;
}

#review-panel .review-content-item:hover .review-actions {
    opacity: 1;
}

#review-panel .review-content-item .review-action-btn {
    width: 24px;
    height: 24px;
    border: none;
    background: var(--bg-secondary);
    border-radius: 4px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--text-secondary);
    transition: all 0.2s ease;
}

#review-panel .review-content-item .review-action-btn:hover {
    background: var(--bg-accent);
    color: var(--text-primary);
    transform: scale(1.1);
}

/* 文件信息（向后兼容） */
#review-panel .review-content-item .review-file-info {
    font-size: 11px;
    color: var(--review-text-secondary, var(--text-secondary));
}

/* 空文件夹 */
#review-panel .review-empty-folder {
    text-align: center;
    padding: 60px 20px;
}

#review-panel .review-empty-folder .review-placeholder {
    color: var(--text-muted);
    font-size: 16px;
    font-family: "Microsoft YaHei", "微软雅黑", "SimSun", "宋体", "Arial", sans-serif;
}

/* 响应式设计 */
@media (max-width: 1400px) {
    #review-panel .review-list-header,
    #review-panel .review-content-item {
        grid-template-columns: var(--review-list-grid-columns);
        gap: var(--review-list-grid-gap);
    }
    #review-panel .review-folder-content:not(.review-thumbnail-view) {
        /* 保持“大小”列略宽，避免长数字换行 */
        --review-list-grid-columns: 40px minmax(140px, 1fr) 88px 90px 64px 56px 56px 72px;
        --review-list-grid-gap: 10px;
    }
}

@media (max-width: 1200px) {
    #review-panel .review-list-header,
    #review-panel .review-content-item {
        grid-template-columns: var(--review-list-grid-columns);
        gap: var(--review-list-grid-gap);
        padding: var(--review-list-grid-padding);
    }
    #review-panel .review-folder-content:not(.review-thumbnail-view) {
        --review-list-grid-columns: 40px minmax(120px, 1fr) 80px 84px 60px 52px 52px 68px;
        --review-list-grid-gap: 8px;
        --review-list-grid-padding: 6px 12px;
    }
    
    #review-panel .review-list-header {
        font-size: 10px;
    }
    
    #review-panel .review-content-item {
        font-size: 11px;
    }
}

@media (max-width: 1000px) {
    /* 隐藏操作按钮列 */
    #review-panel .review-list-header .review-header-actions {
        display: none;
    }
    
    #review-panel .review-content-item .review-actions {
        display: none;
    }
    
    #review-panel .review-list-header,
    #review-panel .review-content-item {
        grid-template-columns: var(--review-list-grid-columns);
        gap: var(--review-list-grid-gap);
    }
    #review-panel .review-folder-content:not(.review-thumbnail-view) {
        --review-list-grid-columns: 40px minmax(120px, 1fr) 80px 84px 56px 52px 52px 68px;
        --review-list-grid-gap: 8px;
    }
}