/**
 * 航拍素材商用授权价格表样式表
 * 设计原则：简洁专业、易读性强、响应式布局
 * 核心要求：保持所有单元格内容居中
 */

/* ==================== 全局容器样式 ==================== */
#aerial-price {
    /* 限制最大宽度避免在大屏幕上过宽 */
    max-width: 1000px;
    /* 上下边距20px，左右自动居中 */
    margin: 20px auto;
    /* 内边距创造呼吸空间 */
    padding: 20px;
    /* 纯白背景 */
    background: white;
    /* 轻微阴影创造层次感 */
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
    /* 圆角软化边缘 */
    border-radius: 8px;
    /* 使用现代无衬线字体 */
    font-family: 'Helvetica Neue', Arial, sans-serif;
}

/* ==================== 主标题样式 ==================== */
#aerial-price h1 {
    /* 文字居中 */
    text-align: center;
    /* 深灰色文字 */
    color: #333;
    /* 底部留白 */
    margin-bottom: 25px;
    /* 适当放大字号 */
    font-size: 24px;
    /* 轻微字重 */
    font-weight: 500;
}

/* ==================== 表格基础样式 ==================== */
#price-table {
    /* 100%宽度填充容器 */
    width: 100%;
    /* 合并边框模式 - 重要表格样式 */
    border-collapse: collapse;
    /* 表格底部留白 */
    margin-bottom: 25px;
}

/* ==================== 表头样式 ==================== */
#price-table thead {
    /* 蓝色背景 */
    background-color: #3498db;
    /* 白色文字 */
    color: white;
}

/* ==================== 单元格基础样式 ==================== */
#price-table td, #price-table th {
    /* 水平居中 - 核心要求 */
    text-align: center;
    /* 垂直居中 - 核心要求 */
    vertical-align: middle;
    /* 单元格内边距 */
    padding: 12px 15px;
    /* 1px实线边框 */
    border: 1px solid #e0e0e0;
}

/* 表头单元格特殊样式 */
#price-table th {
    /* 中等字重 */
    font-weight: 500;
    /* 边框颜色略深 */
    border-color: #ddd;
}

/* ==================== 表格内容样式 ==================== */
/* 斑马条纹效果 - 偶数行背景色 */
#price-table tbody tr:nth-child(even) {
    background-color: #f8f9fa;  /* 浅灰色背景 */
}

/* 价格高亮单元格 */
#price-table td.highlight {
    /* 加粗显示 */
    font-weight: bold;
    /* 红色强调 */
    color: #e74c3c;
}

/* ==================== 合并平台名称特殊样式 ==================== */
/* 合并单元格容器 */
.merged-cell .merged-platforms {
    /* 弹性布局 */
    display: flex;
    /* 垂直排列 */
    flex-direction: column;
    /* 项目间距 */
    gap: 8px;
}

/* ==================== 说明部分样式 ==================== */
.note {
    /* 浅灰色背景 */
    background-color: #f8f9fa;
    /* 内边距 */
    padding: 15px;
    /* 圆角 */
    border-radius: 5px;
    /* 左侧蓝色边框作为视觉提示 */
    border-left: 4px solid #3498db;
}

/* 说明标题 */
.note strong {
    color: #333;  /* 深灰色 */
}

/* 无序列表样式 */
.note ul {
    margin-top: 10px;  /* 上边距 */
    padding-left: 20px;  /* 左缩进 */
}

/* 列表项样式 */
.note li {
    margin-bottom: 5px;  /* 项间距 */
    color: #555;  /* 中灰色文字 */
}









/* 表头样式 */
#aerial-price #price-table thead {
    background-color: #3498db;  /* 蓝色背景 */
    color: white;              /* 白色文字 */
}

/* 表头单元格 */
#aerial-price #price-table thead th {
    background-color: inherit;  /* 继承thead的背景色 */
    color: inherit;            /* 继承thead的文字色 */
    border-color: #2980b9;     /* 深蓝色边框 */
    font-weight: 500;          /* 中等字重 */
    padding: 12px 15px;        /* 内边距 */
}