/**
 * 布局工具样式（Elementor 感知）。
 *
 * 这些类在 Elementor 编辑器中也可被引用/覆盖，方便“元素内修”。
 */

/* ---------- Container / Grid（与 Bootstrap 兼容的轻量实现） ---------- */
.container,
.site-header__inner,
.footer-inner {
	width: 100%;
	margin-right: auto;
	margin-left: auto;
	padding-right: 15px;
	padding-left: 15px;
	max-width: var(--yy-container-width, 1140px); /* Elementor Pro container width 常用值；可被自定义器覆盖 */
}

/* “狭窄容器”：默认收窄到 --yy-narrow-container-width（可用 Customizer「布局设置 → 狭窄容器宽度」调整）。 */
.narrow-container {
	width: 100%;
	margin-right: auto;
	margin-left: auto;
	padding-right: 15px;
	padding-left: 15px;
	max-width: var(--yy-narrow-container-width, 960px);
}

.container-fluid {
	width: 100%;
	margin-right: auto;
	margin-left: auto;
	padding-right: 15px;
	padding-left: 15px;
}

.blog-grid {
	display: grid;
	gap: 24px;
	grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
	margin-top: 16px;
}

/* ---------- Utility：元素间距 / 对齐（可被 Elementor Custom CSS 覆盖） ---------- */
.py-4 { padding-block: 2rem; }
.py-5 { padding-block: 3.5rem; }
.mt-auto { margin-top: auto !important; }

.text-center   { text-align: center;   }

/* ---------- Card（Elementor Posts widget 也可复用同一卡片变量） ---------- */
.card {
	display: flex;
	flex-direction: column;
	border: 1px solid var(--yy-border, #e5e7eb);
	border-radius: .5rem;
	overflow: hidden;
	background: #fff;
}
.card-thumb img { width:100%; height:180px; object-fit:cover; display:block; }
.card-body    { padding:1.25rem; flex:1 1 auto; }
.card-title   { margin-top:0; color:#22262c; font-size:1.15rem; line-height:1.3; }

/* ---------- Button（Elementor button widget 可覆盖 --yy-btn-bg） ---------- */
.btn {
	display:inline-block;
	font-weight:600;
	color:var(--yy-on-accent,#fff);
	border-radius:.375em;
	padding:.5rem .875rem;
}
a .btn { text-decoration:none; }
/* 主按钮默认使用全局主色，跟随「外观 → 自定义 → 全局调色板」变化 */
.btn-primary {
	background:var(--yy-primary,#0d6efd);
	border-color:var(--yy-primary,#0d6efd);
	color:#fff;
}

/* ---------- Entry 元信息、分页 ---------- */
.entry-header + .post-thumbnail-wrap img,
.post-thumbnail-wrap img { width:100%; object-fit:cover; max-height:360px; border-radius:.4rem; }

.page-links a, .pagination a { color:var(--yy-primary,#0d6efd); }
