/**
 * Singular article/page: card radius, TOC active state, content images.
 * Custom properties set in template-assets.php (zb-single-article inline).
 */

.single .content-wrapper > .card,
.page .content-wrapper > .card {
	border-radius: var(--zb-card-radius, 20px);
}

/* Sidebar widgets + auto TOC list + comments block */
.single .sidebar .widget,
.page .sidebar .widget {
	border-radius: var(--zb-aux-card-radius, 20px);
}

.single .sidebar > ul.h-navList,
.page .sidebar > ul.h-navList {
	border-radius: var(--zb-aux-card-radius, 20px);
	background-color: var(--ri-white, #fff);
	padding: 0.65rem 0.5rem;
}

.single #comments.entry-comments,
.page #comments.entry-comments {
	border-radius: var(--zb-aux-card-radius, 20px);
	background-color: var(--ri-gray-100, #f7f8f9);
	padding: 1rem 1.1rem;
}

.sidebar .h-navList {
	list-style: none;
	padding-left: 0;
	margin: 0.5rem 0 0;
}

.sidebar .h-navList > li {
	margin: 0.15rem 0;
}

.sidebar .h-navList > li > a {
	display: block;
	padding: 0.4rem 0.55rem;
	border-radius: 10px;
	color: inherit;
	text-decoration: none;
	border: 2px solid transparent;
	transition: border-color 0.2s ease, background-color 0.2s ease, color 0.2s ease;
	line-height: 1.35;
	font-size: 0.9rem;
}

.sidebar .h-navList > li > a:hover {
	background-color: rgba(0, 0, 0, 0.04);
}

.sidebar .h-navList > li.is-active > a {
	border-color: var(--zb-toc-active, #81d742);
	background-color: rgba(129, 215, 66, 0.12);
}

.sidebar .h-navList > li.nav-h2 > a {
	padding-left: 0.85rem;
}

.sidebar .h-navList > li.nav-h3 > a {
	padding-left: 1.35rem;
	font-size: 0.85rem;
}

/* Content images: figures and block-level images in paragraphs */
.single .post-content figure.wp-block-image img:not(.emoji),
.page .post-content figure.wp-block-image img:not(.emoji),
.single .post-content > p > img:not(.emoji),
.page .post-content > p > img:not(.emoji),
.single .post-content .wp-block-gallery img:not(.emoji),
.page .post-content .wp-block-gallery img:not(.emoji),
.single .post-content .wp-caption img:not(.emoji),
.page .post-content .wp-caption img:not(.emoji),
.single .post-content .aligncenter img:not(.emoji),
.page .post-content .aligncenter img:not(.emoji) {
	border-radius: var(--zb-img-radius, 24px);
	box-shadow: var(--zb-img-box-shadow, 0 10px 28px rgba(0, 0, 0, 0.12));
	height: auto;
	max-width: 100%;
}

.single .post-content figure.wp-block-image,
.page .post-content figure.wp-block-image {
	margin-top: 1.25rem;
	margin-bottom: 1.25rem;
}