/* Easy TOC Floating Card - custom edition.
   The script adds .ez-toc-fc-card to #ez-toc-container (and moves it to <body>)
   only on screens wider than the configured minimum width.
   All values come from CSS variables (--ez-fc-*) generated from the settings page. */

body > div#ez-toc-container.ez-toc-fc-card {
	position: fixed !important;
	top: var(--ez-fc-top, 100px) !important;
	width: var(--ez-fc-width, 220px) !important;
	max-width: 90vw !important;
	height: auto !important;
	max-height: calc(100vh - var(--ez-fc-top, 100px) - var(--ez-fc-bottom, 40px)) !important;
	margin: 0 !important;
	padding: 0 var(--ez-fc-px, 14px) var(--ez-fc-py, 12px) !important;
	float: none !important;
	display: block !important;
	box-sizing: border-box !important;
	background: var(--ez-fc-bg, #f5f6fa) !important;
	border: var(--ez-fc-bw, 0) solid var(--ez-fc-bc, #dcdfe8) !important;
	border-radius: var(--ez-fc-radius, 12px) !important;
	box-shadow: var(--ez-fc-shadow, none) !important;
	-webkit-backdrop-filter: blur(var(--ez-fc-blur, 0));
	backdrop-filter: blur(var(--ez-fc-blur, 0));
	font-family: var(--ez-fc-ff, inherit) !important;
	font-size: var(--ez-fc-font, 13px) !important;
	line-height: var(--ez-fc-lh, 1.4) !important;
	z-index: var(--ez-fc-z, 9990) !important;
	overflow-x: hidden !important;
	overflow-y: auto !important;
	overscroll-behavior: contain;
	scrollbar-width: thin;
	scrollbar-color: var(--ez-fc-sbc, #c5c9d6) transparent;
}

body > div#ez-toc-container.ez-toc-fc-left {
	left: var(--ez-fc-side, 20px) !important;
	right: auto !important;
}

body > div#ez-toc-container.ez-toc-fc-right {
	right: var(--ez-fc-side, 20px) !important;
	left: auto !important;
}

/* Vertically centred card */
body > div#ez-toc-container.ez-toc-fc-vcenter {
	top: 50% !important;
	transform: translateY(-50%);
}

body.admin-bar > div#ez-toc-container.ez-toc-fc-card:not(.ez-toc-fc-vcenter) {
	top: calc(var(--ez-fc-top, 100px) + 32px) !important;
	max-height: calc(100vh - var(--ez-fc-top, 100px) - var(--ez-fc-bottom, 40px) - 32px) !important;
}

body > div#ez-toc-container.ez-toc-fc-card::-webkit-scrollbar { width: var(--ez-fc-sbw, 5px); }
body > div#ez-toc-container.ez-toc-fc-card::-webkit-scrollbar-thumb { background: var(--ez-fc-sbc, #c5c9d6); border-radius: 10px; }

/* Show-after-scroll fade */
body > div#ez-toc-container.ez-toc-fc-card.ez-toc-fc-anim {
	transition: opacity .25s ease, visibility .25s ease;
}
body > div#ez-toc-container.ez-toc-fc-card.ez-toc-fc-hidden {
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
}

/* Title row stays visible while the list scrolls */
body > div#ez-toc-container.ez-toc-fc-card .ez-toc-title-container {
	position: sticky;
	top: 0;
	z-index: 2;
	margin: 0 !important;
	padding: var(--ez-fc-py, 12px) 0 6px !important;
	background: var(--ez-fc-bg, #f5f6fa);
	text-align: var(--ez-fc-title-align, left) !important;
}

body > div#ez-toc-container.ez-toc-fc-card .ez-toc-title {
	margin: 0 !important;
	padding: 0 !important;
	font-size: var(--ez-fc-title-size, 13px) !important;
	font-weight: var(--ez-fc-title-weight, 600) !important;
	color: var(--ez-fc-title-color, #222) !important;
	text-align: var(--ez-fc-title-align, left) !important;
}

/* Keep the list fully inside the card's own scrolling */
body > div#ez-toc-container.ez-toc-fc-card nav {
	max-height: none !important;
	overflow: visible !important;
}

body > div#ez-toc-container.ez-toc-fc-card ul.ez-toc-list {
	margin: 0 !important;
	padding: 0 !important;
}

body > div#ez-toc-container.ez-toc-fc-card ul.ez-toc-list ul {
	margin: 0 !important;
	padding-left: var(--ez-fc-indent, 12px) !important;
}

body > div#ez-toc-container.ez-toc-fc-card li {
	margin: 0 !important;
	padding: var(--ez-fc-gap, 3px) 0 !important;
}

body > div#ez-toc-container.ez-toc-fc-card a.ez-toc-link {
	color: var(--ez-fc-link, #333) !important;
	font-size: var(--ez-fc-font, 13px) !important;
	line-height: var(--ez-fc-lh, 1.4) !important;
	text-decoration: none !important;
	box-shadow: none !important;
	border-bottom: 2px solid transparent;
	transition: color .15s ease;
}

body > div#ez-toc-container.ez-toc-fc-card a.ez-toc-link:hover {
	color: var(--ez-fc-hover, #1a56db) !important;
}

body > div#ez-toc-container.ez-toc-fc-card a.ez-toc-link.ez-toc-fc-active {
	color: var(--ez-fc-active, #1a56db) !important;
	font-weight: var(--ez-fc-active-weight, 600) !important;
	border-bottom-color: var(--ez-fc-active, #1a56db);
}

@media print {
	body > div#ez-toc-container.ez-toc-fc-card {
		position: static !important;
		width: auto !important;
		max-height: none !important;
		overflow: visible !important;
		transform: none !important;
	}
}