/**
 * Table Content List — Flatsome uyumlu stiller
 *
 * İçindekiler alanı: 140px sabit yükseklik, kendi içinde kaydırılabilir.
 */

/* ── CSS Değişkenleri (Flatsome tema renkleriyle uyum) ── */
.tcl-toc {
	--tcl-bg: #f8f9fa;
	--tcl-border: #e2e4e7;
	--tcl-title-color: #333;
	--tcl-link-color: #446084;
	--tcl-link-hover: #334e68;
	--tcl-scrollbar-thumb: #c4c8cc;
	--tcl-scrollbar-track: #f0f1f3;
	--tcl-radius: 4px;
	--tcl-scroll-height: 140px;

	margin: 1.5em 0;
	padding: 0;
	border: 1px solid var(--tcl-border);
	border-radius: var(--tcl-radius);
	background: var(--tcl-bg);
	font-family: inherit;
	font-size: 0.95em;
	line-height: 1.5;
}

/* Flatsome dark mode uyumu */
.dark .tcl-toc,
.dark-mode .tcl-toc {
	--tcl-bg: #2a2a2a;
	--tcl-border: #444;
	--tcl-title-color: #eee;
	--tcl-link-color: #7eb8e0;
	--tcl-link-hover: #a8d4f5;
	--tcl-scrollbar-thumb: #555;
	--tcl-scrollbar-track: #333;
}

/* ── Başlık ── */
.tcl-toc__header,
.tcl-toc__details > summary.tcl-toc__title {
	display: block;
	padding: 12px 16px;
	font-weight: 600;
	font-size: 1.05em;
	color: var(--tcl-title-color);
	border-bottom: 1px solid var(--tcl-border);
	cursor: default;
	list-style: none;
}

.tcl-toc__details > summary.tcl-toc__title {
	cursor: pointer;
}

.tcl-toc__details > summary.tcl-toc__title::-webkit-details-marker {
	display: none;
}

.tcl-toc__details > summary.tcl-toc__title::before {
	content: "▸ ";
	display: inline-block;
	transition: transform 0.2s ease;
}

.tcl-toc__details[open] > summary.tcl-toc__title::before {
	transform: rotate(90deg);
}

/* ── Kaydırılabilir alan — 140px sabit yükseklik ── */
.tcl-toc__scroll {
	max-height: var(--tcl-scroll-height);
	height: var(--tcl-scroll-height);
	overflow-y: auto;
	overflow-x: hidden;
	padding: 10px 16px;
	-webkit-overflow-scrolling: touch;
	scroll-behavior: smooth;

	/* Özel scrollbar */
	scrollbar-width: thin;
	scrollbar-color: var(--tcl-scrollbar-thumb) var(--tcl-scrollbar-track);
}

.tcl-toc__scroll::-webkit-scrollbar {
	width: 6px;
}

.tcl-toc__scroll::-webkit-scrollbar-track {
	background: var(--tcl-scrollbar-track);
	border-radius: 3px;
}

.tcl-toc__scroll::-webkit-scrollbar-thumb {
	background: var(--tcl-scrollbar-thumb);
	border-radius: 3px;
}

.tcl-toc__scroll::-webkit-scrollbar-thumb:hover {
	background: var(--tcl-link-color);
}

/* ── Liste ── */
.tcl-toc__list,
.tcl-toc__sublist {
	margin: 0;
	padding: 0;
	list-style: none;
	counter-reset: tcl-counter;
}

.tcl-toc__list > .tcl-toc__item {
	counter-increment: tcl-counter;
}

.tcl-toc__list > .tcl-toc__item > .tcl-toc__link::before {
	content: counter(tcl-counter) ". ";
	font-weight: 500;
	color: var(--tcl-title-color);
	opacity: 0.6;
}

.tcl-toc__sublist {
	margin-left: 1.2em;
	padding-left: 0;
}

.tcl-toc__sublist .tcl-toc__item {
	list-style: disc;
	margin-left: 1em;
}

.tcl-toc__sublist .tcl-toc__link::before {
	content: none;
}

/* ── Bağlantılar ── */
.tcl-toc__link {
	display: inline-block;
	padding: 4px 0;
	color: var(--tcl-link-color);
	text-decoration: none;
	transition: color 0.15s ease;
	word-break: break-word;
}

.tcl-toc__link:hover,
.tcl-toc__link:focus {
	color: var(--tcl-link-hover);
	text-decoration: underline;
}

.tcl-toc__link:focus-visible {
	outline: 2px solid var(--tcl-link-color);
	outline-offset: 2px;
	border-radius: 2px;
}

.tcl-toc__link.tcl-toc__link--active {
	color: var(--tcl-link-hover);
	font-weight: 600;
}

/* ── Hedef başlıklar — scroll offset (sabit header için) ── */
.entry-content h2[id],
.entry-content h3[id],
.entry-content h4[id],
.entry-content h5[id],
.entry-content h6[id],
.article-inner h2[id],
.article-inner h3[id],
.article-inner h4[id] {
	scroll-margin-top: 80px;
}

/* Flatsome sticky header offset */
.sticky-header-active .entry-content h2[id],
.sticky-header-active .entry-content h3[id],
.sticky-header-active .entry-content h4[id],
.sticky-header-active .article-inner h2[id],
.sticky-header-active .article-inner h3[id],
.sticky-header-active .article-inner h4[id] {
	scroll-margin-top: 120px;
}

/* ── Responsive ── */
@media (max-width: 549px) {
	.tcl-toc {
		margin: 1em 0;
		font-size: 0.9em;
	}

	.tcl-toc__scroll {
		padding: 8px 12px;
	}
}

/* Flatsome entry-content içinde margin sıfırlama */
.entry-content .tcl-toc,
.article-inner .tcl-toc {
	max-width: 100%;
}
