/*
Theme Name: AgentQL Theme
Theme URI: https://example.com/agentql-theme
Author: RFD
Author URI: https://example.com
Description: 参考 AgentQL（Make the Web AI-Ready）设计风格打造的现代开发者工具风格 WordPress 主题。深色科技感视觉、代码优先展示，完整兼容 Elementor 可视化编辑器：支持 Elementor 全宽画布模板、主题构建器（Header/Footer）位置、CSS 变量可被 Elementor 全局颜色直接引用。自带 AgentQL 风格演示落地页，开箱即用。
Version: 1.2.03
Requires at least: 6.0
Tested up to: 7.0.3
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: agentql-theme
Tags: elementor, dark, developer-tools, saas, one-column, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready, blog, portfolio, full-width-template
*/

/* ============================================================
   1. CSS 变量（设计令牌）—— 可在 Elementor 中以 var() 引用
   ============================================================ */
:root {
	--agent-bg: #0a0c13;
	--agent-bg-soft: #0f131e;
	--agent-bg-card: #141a28;
	--agent-bg-elevated: #1a2233;
	--agent-border: #252d3f;
	--agent-border-light: #333d55;
	--agent-text: #e7eaf3;
	--agent-text-muted: #a0aac2;
	--agent-text-faint: #6d7590;
	--agent-primary: #22d3ee;
	--agent-primary-strong: #0ea5e9;
	--agent-violet: #8b5cf6;
	--agent-accent: #a78bfa;
	--agent-success: #34d399;
	--agent-warning: #fbbf24;
	--agent-danger: #f87171;
	--agent-font: "Inter", "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
	--agent-font-mono: "JetBrains Mono", "Fira Code", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	--agent-radius: 12px;
	--agent-radius-sm: 8px;
	--agent-radius-lg: 20px;
	--agent-glow: 0 0 24px rgba(34, 211, 238, 0.18);
	--agent-shadow: 0 8px 32px rgba(0, 0, 0, 0.45);
}

/* ============================================================
   2. 基础重置与排版
   ============================================================ */
*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
}

body {
	margin: 0;
	font-family: var(--agent-font);
	font-size: 16px;
	line-height: 1.7;
	color: var(--agent-text);
	background-color: var(--agent-bg);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

img {
	max-width: 100%;
	height: auto;
	border-style: none;
	vertical-align: middle;
}

a {
	color: var(--agent-primary);
	text-decoration: none;
	transition: color 0.2s ease;
}

a:hover {
	color: var(--agent-accent);
}

h1, h2, h3, h4, h5, h6 {
	margin: 0 0 0.6em;
	line-height: 1.25;
	font-weight: 700;
	color: #ffffff;
	letter-spacing: -0.02em;
}

p {
	margin: 0 0 1.2em;
}

code,
kbd,
pre,
samp {
	font-family: var(--agent-font-mono);
	font-size: 0.9em;
}

pre {
	overflow: auto;
	padding: 1.25em 1.5em;
	border: 1px solid var(--agent-border);
	border-radius: var(--agent-radius);
	background: #0d0d14;
	color: #d8d8e6;
	line-height: 1.6;
}

blockquote {
	margin: 1.5em 0;
	padding: 0.5em 1.25em;
	border-left: 3px solid var(--agent-primary);
	color: var(--agent-text-muted);
}

table {
	width: 100%;
	border-collapse: collapse;
	margin: 0 0 1.5em;
}

th, td {
	padding: 0.6em 0.8em;
	border-bottom: 1px solid var(--agent-border);
	text-align: left;
}

hr {
	border: 0;
	border-top: 1px solid var(--agent-border);
	margin: 2.5em 0;
}

::selection {
	background: rgba(34, 211, 238, 0.3);
	color: #ffffff;
}

/* 滚动条 */
::-webkit-scrollbar {
	width: 10px;
	height: 10px;
}

::-webkit-scrollbar-track {
	background: var(--agent-bg);
}

::-webkit-scrollbar-thumb {
	background: var(--agent-border-light);
	border-radius: 5px;
}

::-webkit-scrollbar-thumb:hover {
	background: var(--agent-text-faint);
}

/* ============================================================
   3. 布局容器
   ============================================================ */
.agent-container {
	width: 100%;
	max-width: 1200px;
	margin-left: auto;
	margin-right: auto;
	padding-left: 24px;
	padding-right: 24px;
}

.site-content {
	min-height: 60vh;
}

/* 主内容与侧边栏 */
.content-area {
	flex: 1 1 auto;
	min-width: 0;
}

.widget-area {
	flex: 0 0 320px;
	margin-left: 48px;
}

/* 单列布局（Elementor 默认） */
.single-column .content-area {
	width: 100%;
}

/* ============================================================
   4. 头部与导航
   ============================================================ */

/* 顶部工具栏（26px 高）：搜索 + CyberHub，均靠右排列 */
/* 外层条带铺满全宽，底部边框贯穿整行；内层容器与主页面（.agent-container）对齐 */
.agent-topbar {
	width: 100%;
	height: 26px;
	background: rgba(5, 7, 12, 0.6);
	border-bottom: 1px solid var(--agent-border);
	font-size: 11px;
	line-height: 1;
}

.agent-topbar-inner {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 18px;
	height: 26px;
	max-width: 1200px;
	margin-left: auto;
	margin-right: auto;
	padding: 0 24px;
}

.agent-topbar-search {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: transparent;
	border: 0;
	padding: 2px;
	margin: 0;
	color: var(--agent-text-muted);
	cursor: pointer;
	transition: color 0.2s ease;
}

.agent-topbar-search:hover {
	color: #38bdf8;
}

.agent-topbar-cyberhub {
	display: inline-flex;
	align-items: center;
	color: var(--agent-text-muted);
	text-decoration: none;
	font-weight: 700;
	letter-spacing: 0.02em;
	transition: color 0.2s ease;
}

.agent-topbar-cyberhub:hover {
	color: #38bdf8;
}

/* 头部展开搜索框 */
.agent-header-search {
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	right: 0;
	z-index: 999;
	background: rgba(10, 12, 19, 0.97);
	border-bottom: 1px solid var(--agent-border);
	box-shadow: var(--agent-shadow);
	padding: 12px 0;
	-webkit-backdrop-filter: blur(14px);
	backdrop-filter: blur(14px);
}

.agent-header-search.is-open {
	display: block;
}

.agent-search-form {
	display: flex;
	align-items: center;
	gap: 12px;
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 24px;
	color: var(--agent-text-muted);
}

.agent-search-form input[type="search"] {
	flex: 1;
	background: transparent;
	border: 0;
	border-bottom: 1px solid var(--agent-border);
	border-radius: 0;
	color: var(--agent-text);
	font-size: 16px;
	padding: 8px 2px;
	outline: none;
	box-shadow: none;
}

.agent-search-form input[type="search"]:focus {
	border-bottom-color: #38bdf8;
}

.site-header {
	position: sticky;
	top: 0;
	z-index: 1000;
	background: rgba(10, 12, 19, 0.85);
	-webkit-backdrop-filter: blur(14px);
	backdrop-filter: blur(14px);
	border-bottom: 1px solid var(--agent-border);
	transition: background 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}

.site-header .agent-container {
	display: flex;
	align-items: center;
	justify-content: space-between;
	min-height: 80px;
	gap: 24px;
	transition: min-height 0.3s ease;
}

.site-branding {
	display: flex;
	align-items: center;
	gap: 12px;
}

.site-title {
	margin: 0;
	font-size: 20px;
	line-height: 1.2;
	transition: font-size 0.3s ease;
}

.site-title a {
	color: #ffffff;
	font-weight: 800;
	letter-spacing: -0.02em;
}

.site-title a:hover {
	color: var(--agent-primary);
}

.site-description {
	margin: 0;
	font-size: 12px;
	color: var(--agent-text-faint);
}

.custom-logo-link img {
	max-height: 40px;
	width: auto;
	transition: max-height 0.3s ease;
}

.main-navigation ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	align-items: center;
	gap: 8px;
}

.main-navigation li {
	position: relative;
}

.main-navigation a {
	display: inline-block;
	padding: 10px 14px;
	border-radius: var(--agent-radius-sm);
	color: var(--agent-text-muted);
	font-size: 12pt;
	font-weight: 700;
	transition: color 0.2s ease, background 0.2s ease, padding 0.3s ease, font-size 0.3s ease;
}

/* 菜单最后一项（Contact）去掉右边距，使其文字右边缘与顶栏右缘对齐 */
.main-navigation #primary-menu > li:last-child > a,
.main-navigation .menu > li:last-child > a {
	padding-right: 0;
}

.main-navigation a:hover {
	color: #ffffff;
	background: rgba(255, 255, 255, 0.06);
}

/* 当前激活项：亮蓝色 */
.main-navigation .current-menu-item > a,
.main-navigation .current-menu-ancestor > a {
	color: #38bdf8;
	background: rgba(56, 189, 248, 0.08);
	text-shadow: 0 0 12px rgba(56, 189, 248, 0.45);
}

.main-navigation .current-menu-item > a:hover,
.main-navigation .current-menu-ancestor > a:hover {
	color: #38bdf8;
}

/* 下拉菜单 */
.main-navigation .sub-menu {
	position: absolute;
	top: 100%;
	left: 0;
	min-width: 220px;
	padding: 8px;
	border: 1px solid var(--agent-border);
	border-radius: var(--agent-radius-sm);
	background: var(--agent-bg-elevated);
	box-shadow: var(--agent-shadow);
	opacity: 0;
	visibility: hidden;
	transform: translateY(8px);
	transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s;
	z-index: 100;
	display: block;
	flex-direction: column;
	gap: 0;
}

.main-navigation li:hover > .sub-menu,
.main-navigation li:focus-within > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.main-navigation .sub-menu a {
	display: block;
	width: 100%;
	padding: 9px 12px;
}

/* Sticky header：滚动后收缩（logo 变小、菜单变矮），始终固定在顶部 */
.site-header.is-scrolled {
	background: rgba(10, 12, 19, 0.95);
	box-shadow: var(--agent-shadow);
}

/* 滚动后隐藏顶部工具栏，仅保留 logo 与菜单栏 */
.site-header.is-scrolled .agent-topbar {
	display: none;
}

.site-header.is-scrolled .agent-container {
	min-height: 68px;
}

.site-header.is-scrolled .site-title {
	font-size: 17px;
}

.site-header.is-scrolled .custom-logo-link img {
	max-height: 36px; /* 40px 的 90% */
}

.site-header.is-scrolled .main-navigation a {
	padding: 6px 12px;
	font-size: 12pt;
}

/* 移动端菜单按钮 */
.menu-toggle {
	display: none;
	background: transparent;
	border: 1px solid var(--agent-border-light);
	border-radius: var(--agent-radius-sm);
	padding: 10px 14px;
	color: #ffffff;
	cursor: pointer;
	font-size: 14px;
	line-height: 1;
}

.menu-toggle::before {
	content: "\2630\00a0"; /* 汉堡图标 + 空格 */
	font-size: 16px;
}

/* ============================================================
   5. 内容区通用样式
   ============================================================ */
.site-main {
	padding: 64px 0 80px;
}

.page-header,
.entry-header {
	margin-bottom: 32px;
}

.page-title,
.entry-title {
	font-size: clamp(28px, 4vw, 40px);
	font-weight: 800;
}

.entry-content {
	font-size: 16.5px;
}

/* 分页导航 */
.pagination {
	margin: 48px 0 0;
	text-align: center;
}

.pagination .nav-links {
	display: inline-flex;
	gap: 8px;
	align-items: center;
	flex-wrap: wrap;
}

.pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 12px;
	border: 1px solid var(--agent-border);
	border-radius: var(--agent-radius-sm);
	color: var(--agent-text-muted);
	font-size: 14px;
	transition: all 0.2s ease;
}

.pagination .page-numbers.current,
.pagination .page-numbers:hover {
	border-color: var(--agent-primary);
	color: var(--agent-primary);
	background: rgba(34, 211, 238, 0.08);
}

/* 面包屑 / 元信息 */
.entry-meta {
	color: var(--agent-text-faint);
	font-size: 13px;
	margin-bottom: 16px;
}

.entry-meta a {
	color: var(--agent-text-muted);
}

.entry-meta a:hover {
	color: var(--agent-primary);
}

/* 搜索表单 */
.search-form {
	display: flex;
	gap: 8px;
}

.search-form .search-field,
.search-form .search-submit,
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
textarea,
select {
	font-family: var(--agent-font);
	font-size: 15px;
	padding: 12px 16px;
	border: 1px solid var(--agent-border-light);
	border-radius: var(--agent-radius-sm);
	background: var(--agent-bg-soft);
	color: var(--agent-text);
	outline: none;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

input:focus,
textarea:focus,
select:focus {
	border-color: var(--agent-primary);
	box-shadow: 0 0 0 3px rgba(34, 211, 238, 0.15);
}

.search-form .search-submit,
button,
input[type="submit"],
.wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 12px 22px;
	border: 1px solid var(--agent-primary);
	border-radius: var(--agent-radius-sm);
	background: var(--agent-primary);
	color: #04141c;
	font-size: 14px;
	font-weight: 700;
	cursor: pointer;
	transition: all 0.2s ease;
}

button:hover,
input[type="submit"]:hover,
.search-form .search-submit:hover {
	background: var(--agent-accent);
	border-color: var(--agent-accent);
	color: #0a0a0f;
}

/* 评论 */
.comment-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.comment-list .children {
	list-style: none;
	margin: 0 0 0 48px;
	padding: 0;
}

.comment-body {
	padding: 20px 0;
	border-bottom: 1px solid var(--agent-border);
}

.comment-meta {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 8px;
}

.avatar {
	border-radius: 50%;
}

.comment-form label {
	display: block;
	margin-bottom: 6px;
	font-size: 14px;
	color: var(--agent-text-muted);
}

.comment-form input,
.comment-form textarea {
	width: 100%;
	margin-bottom: 16px;
}

/* ============================================================
   6. 页脚
   ============================================================ */
.site-footer {
	margin-top: auto;
	border-top: 1px solid var(--agent-border);
	background: var(--agent-bg-soft);
}

.footer-widgets {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 32px;
	padding: 56px 0 40px;
}

.site-info {
	padding: 24px 0 32px;
	border-top: 1px solid var(--agent-border);
	font-size: 13px;
	color: var(--agent-text-faint);
	text-align: center;
}

.site-info a {
	color: var(--agent-text-muted);
}

.site-info a:hover {
	color: var(--agent-primary);
}

.footer-widgets .widget-title {
	font-size: 14px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--agent-text-muted);
	margin-bottom: 16px;
}

.footer-widgets ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.footer-widgets li {
	margin-bottom: 10px;
}

.footer-widgets a {
	color: var(--agent-text-faint);
	font-size: 14px;
}

.footer-widgets a:hover {
	color: var(--agent-primary);
}

/* 页脚菜单 */
.footer-navigation ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 8px 24px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.footer-navigation a {
	color: var(--agent-text-faint);
	font-size: 13px;
}

/* ============================================================
   7. 文章卡片（博客列表）
   ============================================================ */
.agent-posts-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
	gap: 28px;
}

.agent-card {
	display: flex;
	flex-direction: column;
	border: 1px solid var(--agent-border);
	border-radius: var(--agent-radius-lg);
	background: var(--agent-bg-card);
	overflow: hidden;
	transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
}

.agent-card:hover {
	transform: translateY(-4px);
	border-color: var(--agent-border-light);
	box-shadow: var(--agent-shadow);
}

.agent-card .post-thumbnail {
	display: block;
	aspect-ratio: 16 / 9;
	overflow: hidden;
}

.agent-card .post-thumbnail img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.4s ease;
}

.agent-card:hover .post-thumbnail img {
	transform: scale(1.04);
}

.agent-card .agent-card-body {
	display: flex;
	flex-direction: column;
	flex: 1;
	padding: 24px;
}

.agent-card .entry-title {
	font-size: 20px;
	margin-bottom: 10px;
}

.agent-card .entry-excerpt {
	color: var(--agent-text-muted);
	font-size: 14.5px;
	flex: 1;
}

.agent-card .agent-card-footer {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-top: 18px;
	padding-top: 16px;
	border-top: 1px solid var(--agent-border);
	font-size: 13px;
	color: var(--agent-text-faint);
}

.agent-read-more {
	color: var(--agent-primary);
	font-weight: 600;
}

.agent-read-more:hover {
	color: var(--agent-accent);
}

/* 错误页与搜索空结果 */
.error-404,
.no-results {
	text-align: center;
	padding: 80px 24px;
}

.error-404 .error-code {
	font-size: clamp(64px, 12vw, 128px);
	font-weight: 900;
	background: linear-gradient(135deg, var(--agent-primary), var(--agent-violet));
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	line-height: 1;
	margin-bottom: 16px;
}

/* ============================================================
   8. 响应式
   ============================================================ */
@media (max-width: 1024px) {
	.content-area + .widget-area {
		margin-left: 0;
		margin-top: 48px;
	}

	/* 窄桌面/平板横屏：横向菜单收缩字号与间距，避免挤压 logo */
	.main-navigation a {
		padding: 8px 10px;
		font-size: 11pt;
	}

	.footer-widgets {
		grid-template-columns: repeat(2, 1fr);
	}
}

/* 平板与手机：统一使用汉堡菜单（断点提前到 960px，覆盖平板竖屏/小平板） */
@media (max-width: 960px) {
	.menu-toggle {
		display: inline-flex;
		align-items: center;
		gap: 6px;
		padding: 8px 14px;
		font-size: 14px;
		font-weight: 700;
		color: var(--agent-text);
		background: rgba(255, 255, 255, 0.04);
		border: 1px solid var(--agent-border-light);
		border-radius: var(--agent-radius-sm);
		cursor: pointer;
	}

	.menu-toggle::before {
		font-size: 16px;
	}

	/* 菜单容器：移动端默认收起、点击按钮展开为全宽下拉 */
	.main-navigation {
		position: static;
	}

	.main-navigation .menu-primary-container,
	.main-navigation > div:not(.menu-toggle),
	.main-navigation > ul#primary-menu {
		display: none;
		position: absolute;
		top: 100%;
		left: 0;
		right: 0;
		background: rgba(16, 20, 31, 0.97);
		-webkit-backdrop-filter: blur(14px);
		backdrop-filter: blur(14px);
		border-bottom: 1px solid var(--agent-border);
		border-radius: 0 0 var(--agent-radius) var(--agent-radius);
		padding: 12px 16px 18px;
		box-shadow: var(--agent-shadow);
		z-index: 1000;
	}

	.main-navigation.toggled > div:not(.menu-toggle),
	.main-navigation.toggled > ul#primary-menu {
		display: block;
	}

	.main-navigation ul {
		flex-direction: column;
		align-items: stretch;
		gap: 4px;
	}

	.main-navigation li {
		width: 100%;
	}

	/* 触摸友好的大点击区域 */
	.main-navigation a {
		display: block;
		width: 100%;
		padding: 14px 14px;
		font-size: 15px;
		border-radius: var(--agent-radius-sm);
	}

	.main-navigation .sub-menu {
		position: static;
		opacity: 1;
		visibility: visible;
		transform: none;
		box-shadow: none;
		border: none;
		border-left: 2px solid var(--agent-border);
		border-radius: 0;
		background: transparent;
		margin: 2px 0 6px;
		padding: 4px 0 4px 14px;
		display: block;
		min-width: 0;
	}

	.main-navigation .sub-menu a {
		padding: 10px 12px;
		font-size: 14px;
	}

	/* iOS Safari：输入框小于 16px 聚焦时会自动放大，统一为 16px */
	input[type="text"],
	input[type="email"],
	input[type="url"],
	input[type="password"],
	input[type="search"],
	input[type="number"],
	input[type="tel"],
	textarea,
	select {
		font-size: 16px;
	}

	.footer-widgets {
		grid-template-columns: 1fr;
	}
}

/* 手机：进一步收紧左右留白与顶栏字号 */
@media (max-width: 600px) {
	.agent-topbar-inner,
	.agent-container {
		padding-left: 16px;
		padding-right: 16px;
	}

	.site-header .agent-container {
		gap: 12px;
		min-height: 64px;
	}

	.agent-topbar {
		font-size: 10px;
	}
}

/* 减少动效偏好 */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}