/*
 Theme Name: Twenty Twelve Simple
 Theme URI: https://wordpress.org/themes/twentytwelve/
 Author: Custom Dev
 Author URI: #
 Description: 复刻Twenty Twelve，优化简洁大方导航，一级菜单18px，全站纯白背景
 Version: 1.0
 Tested up to: 7.0
 Requires at least: 3.5
 Requires PHP: 5.2.4
 License: GNU General Public License v2 or later
 Text Domain: twentytwelvesimple
 Template: twentytwelve
*/
/* -------------------------- 主题头部声明区域 --------------------------
1. Template: twentytwelve 代表这是Twenty Twelve的【子主题】，会自动继承父主题所有模板文件
2. 子主题优势：修改全部保存在本文件，升级原版Twenty Twelve不会覆盖自定义样式
3. Text Domain 翻译文本域，用于WP多语言功能
------------------------------------------------------------------------ */

/* =Reset 全局样式重置（复刻原版TT12标准重置，清除浏览器默认边距、边框、列表样式）
作用：统一所有标签初始状态，消除不同浏览器自带默认样式差异，避免布局错乱
------------------------------------------------------------------------ */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
	margin: 0; /* 清除所有标签默认外边距 */
	padding: 0; /* 清除所有标签默认内边距 */
	border: 0; /* 清除所有标签默认边框 */
	font-size: 100%; /* 统一字体基准大小，不继承标签默认字号 */
	vertical-align: baseline; /* 统一垂直对齐基准线 */
}
body {
	line-height: 1; /* 清除body默认行高，后续自定义舒适阅读行高 */
}
ol, ul {
	list-style: none; /* 清除有序/无序列表默认圆点、数字序号 */
}
blockquote, q {
	quotes: none; /* 清除引用标签默认前后引号 */
}
blockquote:before, blockquote:after, q:before, q:after {
	content: '';
	content: none; /* 彻底移除引用自带引号伪元素 */
}
table {
	border-collapse: collapse; /* 表格边框合并，不出现双线缝隙 */
	border-spacing: 0; /* 清除表格单元格间距 */
}
caption, th, td {
	font-weight: normal; /* 表格标题、单元格默认不加粗 */
	text-align: left; /* 表格文字默认左对齐 */
}
h1, h2, h3, h4, h5, h6 {
	clear: both; /* 标题自动清除浮动，避免被左右浮动元素遮挡 */
}
html {
	overflow-y: scroll; /* 页面强制显示垂直滚动条，防止页面切换时宽度跳动 */
	font-size: 100%;
	-webkit-text-size-adjust: 100%; /* 移动端禁止浏览器自动放大文字 */
	-ms-text-size-adjust: 100%; /* IE移动端文字适配 */
}
a:focus {
	outline: thin dotted; /* 链接键盘聚焦时显示虚线提示框（无障碍访问） */
}
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section {
	display: block; /* HTML5语义标签统一转为块级元素，正常占满整行宽度 */
}
audio, canvas, video {
	display: inline-block; /* 媒体行内块，可设置宽高且同行显示 */
}
audio:not([controls]) {
	display: none; /* 无播放控件的音频直接隐藏 */
}
del {
	color: #333; /* 删除文字深灰色 */
}
ins {
	background: #fff9c0; /* 新增文字黄色高亮底色 */
	text-decoration: none;
}
hr {
	background-color: #ccc; /* 分割线灰色底色 */
	border: 0;
	height: 1px; /* 分割线高度1像素 */
	margin: 24px;
	margin-bottom: 1.714285714rem; /* rem适配基准字号，底部外边距 */
}
sub, sup {
	font-size: 75%; /* 上下标字号缩小75% */
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}
sup {
	top: -0.5em; /* 上标向上偏移 */
}
sub {
	bottom: -0.25em; /* 下标向下偏移 */
}
small {
	font-size: smaller; /* small标签文字缩小 */
}
img {
	border: 0; /* 图片默认无边框 */
	-ms-interpolation-mode: bicubic; /* IE图片缩放平滑抗锯齿 */
}

/* 浮动清除工具类：解决子元素浮动导致父容器高度塌陷 */
.clear:after, .wrapper:after {
	clear: both; /* 清除左右浮动 */
}
.clear:before, .clear:after, .wrapper:before, .wrapper:after {
	display: table;
	content: ""; /* 伪元素生成空白内容撑开容器高度 */
}

/* -------------------------- 全局基础页面样式 --------------------------
作用：网站整体字体、颜色、页面容器、头部标题基础布局，全站通用
【已修改】body背景改为纯白，移除容器阴影，整体极简纯白风格
------------------------------------------------------------------------ */
html {
	font-size: 87.5%; /* 基准字号14px，1rem=14px，TT12原生标准 */
}
body {
	font-size: 14px;
	font-size: 1rem; /* 正文基础字号14px */
	font-family: Helvetica, Arial, sans-serif; /* 无衬线商务字体，干净简洁 */
	text-rendering: optimizeLegibility; /* 优化文字渲染，字体更平滑 */
	color: #444; /* 正文标准深灰色，不刺眼，阅读舒适 */
	background: #ffffff; /* 网站外层背景：纯白色 */
}
a {
	outline: none;
	color: #21759b; /* WP官方标准蓝色，全站链接主色 */
}
a:hover {
	color: #0f3647; /* 鼠标悬浮链接加深蓝色 */
}
/* 无障碍隐藏文字：仅屏幕阅读器读取，页面视觉完全隐藏 */
.assistive-text, .screen-reader-text {
	position: absolute !important;
	clip-path: inset(50%);
	overflow: hidden;
	height: 1px;
	width: 1px;
}
/* 网站主体白色容器：页面核心内容包裹框 */
.site {
	padding: 0 24px;
	padding: 0 1.714285714rem; /* 容器左右内边距 */
	background-color: #fff; /* 内容区纯白底色 */
	max-width: 960px; /* 页面最大宽度，适配PC端标准资讯站宽度 */
	margin: 48px auto; /* 容器上下外边距、水平居中 */
	box-shadow: none; /* 纯白背景移除阴影，视觉统一干净 */
}
/* 网站头部：站点标题、副标题、导航存放区域 */
/* 网站头部：站点标题、副标题、导航存放区域 */
.site-header {
	padding: 0 0;
	padding: 0rem 0; /* 顶部间距清零，紧贴容器最上方，保留底部正常间距 */
}
/* 站点标题、副标题链接颜色 */
.site-header h1 a, .site-header h2 a {
	color: #515151; /* 标题深灰，不刺眼 */
	text-decoration: none; /* 标题无下划线 */
}
/* 网站大标题 */
/* 网站大标题 */
.site-header h1 {
	font-size: 26px;
	line-height: 1.4; /* 标题行高，如需同步缩小可改为1.4 */
	margin-bottom: 3.5px; /* 空白高度减半，原14px缩小一半 */
}
/* 网站副标题/站点描述 */
.site-header h2 {
	font-weight: normal; /* 副标题不加粗 */
	font-size: 13px;
	color: #757575; /* 浅灰色弱化显示 */
}

/* ========== 导航菜单模块（核心定制区域，一级菜单强制18px，适配PC+手机） ========== */
/* 导航外层容器，控制整体上下间距、居中对齐 */
.main-navigation {
	margin-top: 24px; /* 导航与头部标题间距 */
	text-align: center;
}
/* 移动端汉堡菜单按钮（屏幕小于600px显示） */
.menu-toggle {
	padding: 8px 14px; /* 按钮内边距，增大点击区域 */
	font-size: 16px;
	color: #333;
	background: #f5f7fa; /* 浅蓝灰柔和底色 */
	border: 1px solid #eee; /* 淡分割边框 */
	cursor: pointer; /* 鼠标悬浮显示手型指针 */
	width: 100%; /* 按钮占满容器宽度 */
	text-align: left; /* 按钮文字左对齐 */
}
/* 移动端默认隐藏菜单列表，点击按钮后添加toggled-on类显示 */
.main-navigation ul.nav-menu {
	display: none;
}
/* 菜单展开状态：显示全部菜单项 */
.main-navigation ul.nav-menu.toggled-on {
	display: block;
}
/* 移动端所有一级菜单项通用样式 */
.main-navigation li {
	margin-top: 16px; /* 手机端菜单项上下间距 */
	font-size: 18px; /* 【定制修改】移动端一级菜单固定18px，原版12px偏小 */
	line-height: 1.5;
}
/* 移动端菜单链接文字基础样式 */
.main-navigation a {
	color: #5e5e5e; /* 菜单默认灰色文字 */
	text-decoration: none; /* 菜单无下划线 */
}
/* 移动端菜单链接悬浮变色 */
.main-navigation a:hover {
	color: #21759b; /* 悬浮切换主题蓝色 */
}

/* -------------------------- 桌面大屏媒体查询（屏幕宽度≥600px，PC横向导航） -------------------------- */
@media screen and (min-width: 600px) {
	/* PC端隐藏汉堡按钮 */
	.menu-toggle {
		display: none;
	}
	/* PC横向菜单外层容器 */
	.main-navigation ul.nav-menu {
		display: inline-block !important;
		width: 100%;
		border-top:1px solid #ededed; /* 菜单上分割浅灰线 */
		border-bottom:1px solid #ededed; /* 菜单下分割浅灰线 */
		text-align:left; /* 菜单项左对齐横向排列 */
	}
	/* PC一级菜单项横向布局 */
	.main-navigation li {
		display: inline-block; /* 横向并排 */
		margin:0 30px 0 0; /* 菜单项左右间距 */
		position:relative; /* 为下拉子菜单提供定位基准 */
		font-size:16px; /* 【定制修改】PC一级菜单字号基准18px */
	}
	/* PC一级菜单链接核心样式 */
	.main-navigation li a {
		line-height:3.7; /* 菜单项上下高度，垂直居中文字 */
		text-transform:uppercase; /* 菜单文字大写，原版TT12原生效果 */
		color:#555;
		font-size:16px; /* 强制链接文字18px，覆盖继承字号 */
		letter-spacing:0.4px; /* 文字字间距，更大气舒展 */
	}
	/* PC一级菜单鼠标悬浮文字变黑 */
	.main-navigation li a:hover {
		color:#000;
	}
	/* 下拉子菜单默认隐藏容器，通过定位+裁剪实现收起 */
	.main-navigation li ul {
		position:absolute; /* 相对于一级菜单定位 */
		top:100%; /* 子菜单紧贴一级菜单下方 */
		left:0;
		width:1px;
		height:1px;
		overflow:hidden;
		clip-path:inset(50%); /* 视觉裁剪完全隐藏 */
		z-index:999; /* 层级最高，不会被页面其他内容遮挡 */
	}
	/* 鼠标悬浮一级菜单，展开下拉子菜单 */
	.main-navigation li:hover > ul {
		clip-path:none; /* 取消裁剪，完整显示子菜单 */
		width:auto;
		height:auto;
	}
	/* 下拉子菜单内部li清除横向布局 */
	.main-navigation li ul li {
		display:block;
		margin:0;
	}
	/* 二级下拉菜单链接样式 */
	.main-navigation li ul li a {
		background:#f5f7fa; /* 下拉浅蓝底色，替换原版生硬灰色 */
		display:block;
		font-size:14px; /* 二级菜单小号文字，区分层级 */
		line-height:2;
		padding:8px 16px;
		width:200px; /* 下拉菜单固定宽度 */
		border-bottom:1px solid #eee; /* 子项分割细线 */
	}
	/* 下拉子项悬浮底色、文字变色 */
	.main-navigation li ul li a:hover {
		background:#eef2f7;
		color:#21759b;
	}
	/* 当前访问页面菜单高亮：蓝色加粗区分 */
	.current-menu-item > a {
		color:#2271b1;
		font-weight:bold;
	}
	/* PC端主内容区域：两栏布局，左侧文章65%宽度 */
	.site-content {
		float:left;
		width:65%;
	}
	/* PC侧边栏：右侧27%宽度 */
	.widget-area {
		float:right;
		width:27%;
	}
}

/* -------------------------- 文章、侧边栏、页脚通用基础样式 -------------------------- */
/* 主内容区域顶部外边距，与导航拉开距离 */
.site-content {
	margin:24px 0 0;
}
/* 侧边栏顶部外边距 */
.widget-area {
	margin:24px 0 0;
}
/* 侧边栏每个小工具组件底部间距 */
.widget-area .widget {
	margin-bottom:48px;
}
/* 文章正文阅读行高，宽松舒适，适合资讯新闻阅读 */
.entry-content {
	line-height:1.7;
}
/* 网站底部页脚样式【原生原版footer完整代码】 */
footer[role="contentinfo"] {
	border-top:1px solid #ededed; /* 页脚顶部分割线 */
	padding:24px 0; /* 页脚上下内边距 */
	margin-top:30px; /* 页脚与正文间距 */
	font-size:12px; /* 页脚小字弱化 */
	color:#686868; /* 浅灰色文字 */
	text-align:center; /* 页脚版权文字居中 */
}

/* 仅独立页面page.php 全屏100%宽度，文章single不受影响 */
@media screen and (min-width: 600px) {
    body.page .site-content {
        width: 100%;
        float: none;
    }
    body.page .widget-area {
        display: none; /* 页面自动隐藏侧边栏 */
    }
}