/* =============================================================
   GiangXAI Blog — Custom Styles
   Bổ sung cho theme.json, xử lý các trường hợp đặc biệt
   ============================================================= */

/* ----- Reset & Base ----- */
*, *::before, *::after { box-sizing: border-box; }

/* ----- Header sticky blur ----- */
.site-header {
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	z-index: 100;
}

/* ----- Post card hover ----- */
.post-card {
	transition: box-shadow 0.2s ease, transform 0.2s ease;
	overflow: hidden;
}

.post-card:hover {
	box-shadow: 0 8px 30px rgba(14, 165, 233, 0.12);
	transform: translateY(-2px);
}

.post-card .wp-block-post-featured-image img {
	transition: transform 0.3s ease;
}

.post-card:hover .wp-block-post-featured-image img {
	transform: scale(1.04);
}

/* ----- Article content styles ----- */
.wp-block-post-content {
	--flow-space: 1.5em;
}

.wp-block-post-content > * + * {
	margin-block-start: var(--flow-space);
}

.wp-block-post-content p {
	line-height: 1.8;
}

.wp-block-post-content a {
	text-decoration: underline;
	text-underline-offset: 3px;
}

/* ----- Code block ----- */
.wp-block-code {
	overflow-x: auto;
	font-size: 0.875rem !important;
	line-height: 1.7;
}

.wp-block-code code {
	font-family: var(--wp--preset--font-family--mono);
}

/* Inline code */
.wp-block-post-content code:not(.wp-block-code code) {
	background: var(--wp--preset--color--base-2);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 0.25rem;
	padding: 0.1em 0.4em;
	font-size: 0.875em;
	font-family: var(--wp--preset--font-family--mono);
	color: var(--wp--preset--color--secondary);
}

/* ----- Table ----- */
.wp-block-table table {
	width: 100%;
	border-collapse: collapse;
	font-size: var(--wp--preset--font-size--sm);
}

.wp-block-table th,
.wp-block-table td {
	padding: 0.75rem 1rem;
	border: 1px solid var(--wp--preset--color--border);
	text-align: left;
}

.wp-block-table thead th {
	background: var(--wp--preset--color--base-2);
	font-weight: 600;
}

.wp-block-table tbody tr:nth-child(even) {
	background: var(--wp--preset--color--base-2);
}

/* ----- Category badge ----- */
.wp-block-post-terms a {
	display: inline-block;
	background: rgba(14, 165, 233, 0.1);
	color: var(--wp--preset--color--primary) !important;
	padding: 0.2em 0.6em;
	border-radius: 2rem;
	text-decoration: none !important;
	transition: background 0.2s;
}

.wp-block-post-terms a:hover {
	background: rgba(14, 165, 233, 0.2);
}

/* ----- Archive header ----- */
.archive-header {
	background: linear-gradient(135deg, rgba(14, 165, 233, 0.05) 0%, rgba(139, 92, 246, 0.05) 100%) !important;
	border: 1px solid var(--wp--preset--color--border) !important;
}

/* ----- Pagination ----- */
.wp-block-query-pagination {
	display: flex;
	gap: 0.5rem;
	flex-wrap: wrap;
	justify-content: center;
}

.wp-block-query-pagination a,
.wp-block-query-pagination .current {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.5rem;
	height: 2.5rem;
	padding: 0 0.75rem;
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 0.5rem;
	font-size: var(--wp--preset--font-size--sm);
	font-weight: 500;
	text-decoration: none;
	transition: all 0.2s;
}

.wp-block-query-pagination a:hover {
	border-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--primary);
}

.wp-block-query-pagination .current {
	background: var(--wp--preset--color--primary);
	border-color: var(--wp--preset--color--primary);
	color: #fff;
}

/* ----- Author bio box ----- */
.post-author-bio {
	display: flex;
	gap: 1rem;
}

/* ----- Search form ----- */
.wp-block-search__input {
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 0.5rem;
	padding: 0.6rem 1rem;
	font-size: var(--wp--preset--font-size--sm);
	transition: border-color 0.2s;
}

.wp-block-search__input:focus {
	outline: none;
	border-color: var(--wp--preset--color--primary);
	box-shadow: 0 0 0 3px rgba(14, 165, 233, 0.15);
}

.wp-block-search__button {
	background: var(--wp--preset--color--primary) !important;
	border-color: var(--wp--preset--color--primary) !important;
	color: #fff !important;
	border-radius: 0.5rem !important;
	transition: background 0.2s !important;
}

.wp-block-search__button:hover {
	background: var(--wp--preset--color--accent) !important;
	border-color: var(--wp--preset--color--accent) !important;
}

/* ----- Footer ----- */
.site-footer .wp-block-latest-posts li {
	list-style: none;
	padding: 0.3rem 0;
	border-bottom: 1px solid rgba(255,255,255,0.07);
}

.site-footer .wp-block-latest-posts a {
	color: var(--wp--preset--color--contrast-3) !important;
	text-decoration: none;
	transition: color 0.2s;
	font-size: var(--wp--preset--font-size--sm);
}

.site-footer .wp-block-latest-posts a:hover {
	color: var(--wp--preset--color--primary) !important;
}

.site-footer .wp-block-categories-list {
	padding: 0;
	list-style: none;
}

.site-footer .wp-block-categories-list li {
	padding: 0.3rem 0;
}

.site-footer .wp-block-categories-list a {
	color: var(--wp--preset--color--contrast-3) !important;
	text-decoration: none;
	font-size: var(--wp--preset--font-size--sm);
	transition: color 0.2s;
}

.site-footer .wp-block-categories-list a:hover {
	color: var(--wp--preset--color--primary) !important;
}

/* ----- Responsive ----- */
@media (max-width: 768px) {
	.wp-block-post-template.is-flex-container.is-flex-container-3-columns > li {
		width: 100% !important;
	}
}

@media (max-width: 1024px) {
	.wp-block-post-template.is-flex-container.is-flex-container-3-columns > li {
		width: calc(50% - 1rem) !important;
	}
}