/* reading.css — Reading progress, share, dark toggle, TOC, reading time */
.cn-progress {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	height: var(--cn-progress-height, 4px);
	z-index: 99999;
	background: transparent;
	pointer-events: none;
}

.cn-progress__fill {
	display: block;
	height: 100%;
	width: 0;
	background: var(--cn-progress-color, var(--cn-accent));
	transition: width 0.08s linear;
}

/* ============ Share buttons ============ */
.cn-share {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
	font-family: var(--cn-font-body);
}

.cn-share__label {
	font-size: 13px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--cn-muted);
	margin-right: 4px;
}

.cn-share__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	padding: 0;
	border-radius: 50%;
	border: none;
	cursor: pointer;
	text-decoration: none;
	color: #fff;
	transition: transform 0.15s ease, opacity 0.15s ease;
}

.cn-share__btn svg {
	display: block;
}

.cn-share__btn:hover {
	transform: translateY(-2px);
	opacity: 0.92;
	color: #fff;
}

.cn-share__btn--x { background: #000; }
.cn-share__btn--facebook { background: #1877F2; }
.cn-share__btn--whatsapp { background: #25D366; }
.cn-share__btn--telegram { background: #229ED9; }
.cn-share__btn--copy { background: var(--cn-primary); }

.cn-share--inline {
	margin: 28px 0;
	padding: 16px 0;
	border-top: 1px solid rgba(107, 114, 128, 0.25);
	border-bottom: 1px solid rgba(107, 114, 128, 0.25);
}

.cn-share--floating {
	position: fixed;
	left: 16px;
	top: 50%;
	transform: translateY(-50%);
	flex-direction: column;
	z-index: 9000;
	background: var(--cn-card);
	border-radius: 999px;
	padding: 10px 6px;

}

.cn-share--floating .cn-share__label {
	display: none;
}

@media (max-width: 1100px) {
	.cn-share--floating {
		display: none;
	}
}

/* ============ Dark mode toggle ============ */
.cn-dark-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	border: 2px solid rgba(107, 114, 128, 0.35);
	background: var(--cn-card);
	cursor: pointer;
	transition: transform 0.15s ease, border-color 0.15s ease;
}

.cn-dark-toggle:hover {
	transform: scale(1.06);
	border-color: var(--cn-accent);
}

.cn-dark-toggle__icon {
	width: 22px;
	height: 22px;
	display: block;
	background: none !important;
	border-radius: 0 !important;
}
/* Sun icon (light mode) */
.cn-dark-toggle__icon::before {
	content: '';
	display: block;
	width: 22px;
	height: 22px;
	background: no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23EA580C' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='4.5'/%3E%3Cpath d='M12 2v2.5M12 19.5V22M4.9 4.9l1.8 1.8M17.3 17.3l1.8 1.8M2 12h2.5M19.5 12H22M4.9 19.1l1.8-1.8M17.3 6.7l1.8-1.8'/%3E%3C/svg%3E");
}
/* Moon icon (dark mode) */
html[data-theme="dark"] .cn-dark-toggle__icon::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%23FBBF24'%3E%3Cpath d='M21 12.8A9 9 0 1 1 11.2 3a7 7 0 0 0 9.8 9.8z'/%3E%3C/svg%3E");
}
html[data-theme="dark"] .cn-dark-toggle__icon {
	background: none !important;
}

.cn-dark-float {
	position: fixed;
	right: 18px;
	bottom: 18px;
	z-index: 9000;
}

.cn-dark-float .cn-dark-toggle {

}

/* ============ Table of contents ============ */
.cn-toc {
	background: var(--cn-card);
	border: 1px solid rgba(107, 114, 128, 0.25);
	border-radius: var(--cn-radius);
	padding: 16px 20px;
	margin: 24px 0;
	font-family: var(--cn-font-body);
}

.cn-toc__summary {
	font-family: var(--cn-font-heading);
	font-weight: 800;
	font-size: 16px;
	color: var(--cn-text);
	cursor: pointer;
	list-style: none;
	display: flex;
	align-items: center;
	gap: 8px;
}

.cn-toc__summary::-webkit-details-marker {
	display: none;
}

.cn-toc__summary::before {
	content: "+";
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: var(--cn-accent);
	color: #fff;
	font-size: 14px;
	font-weight: 700;
	flex-shrink: 0;
}

.cn-toc[open] .cn-toc__summary::before {
	content: "−";
}

.cn-toc__list {
	margin: 12px 0 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.cn-toc__item a {
	color: var(--cn-text);
	text-decoration: none;
	font-size: 14px;
	line-height: 1.5;
}

.cn-toc__item a:hover {
	color: var(--cn-accent);
}

.cn-toc__item--h3 {
	padding-left: 18px;
}

/* ============ Reading time ============ */
.cn-reading-time {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-family: var(--cn-font-body);
	font-size: 13px;
	font-weight: 600;
	color: var(--cn-muted);
	background: rgba(107, 114, 128, 0.12);
	border-radius: 999px;
	padding: 6px 14px;
	margin: 0 0 16px;
}

/* ============ Newsletter ============ */
