/*!* Sidebar Table of Contents — ToolBeltData *!*/

/* Hide TOC when there are no headings to list */
.wp-block-uagb-table-of-contents:has(.uagb-toc__list-wrap:empty),
.wp-block-uagb-table-of-contents:has(.uagb-toc__list-wrap > .uagb-toc__list:empty) {
	display: none !important;
}

/* Disable view transitions on pages with TOC */
.sq-single-post:has(.wp-block-uagb-table-of-contents) {
	view-transition-name: none;
}

/* Offset anchor scroll so headings clear fixed header + TOC bar */
.sq-single-post__content h2[id],
.sq-single-post__content h3[id],
.sq-single-post__content h4[id] {
	scroll-margin-top: 140px;
}

@media (max-width: 900px) {
	.sq-single-post__content h2[id],
	.sq-single-post__content h3[id],
	.sq-single-post__content h4[id] {
		scroll-margin-top: 180px;
	}
}

/* ==========================================================================
   DESKTOP (>900px) — Sticky sidebar with left border + orange pill
   ========================================================================== */
@media (min-width: 901px) {

	/* Columns stretch for sticky to work full-length */
	.single-post .sq-single-post:has(.wp-block-uagb-table-of-contents) .sq-single-post__layout,
	.page .sq-single-post:has(.wp-block-uagb-table-of-contents) .sq-single-post__layout {
		align-items: stretch !important;
	}

	.single-post .sq-single-post:has(.wp-block-uagb-table-of-contents) .sq-single-post__sidebar,
	.page .sq-single-post:has(.wp-block-uagb-table-of-contents) .sq-single-post__sidebar {
		position: relative;
		align-self: stretch !important;
	}

	.single-post .sq-single-post__sidebar .wp-block-uagb-table-of-contents,
	.page .sq-single-post__sidebar .wp-block-uagb-table-of-contents {
		display: block;
		position: sticky;
		width: fit-content;
		left: 0;
		top: 100px;
		background: none;
		height: fit-content;
		box-shadow: none;
	}

	.sq-single-post__sidebar .wp-block-uagb-table-of-contents .nav-close {
		display: none;
	}

	.sq-single-post__sidebar .wp-block-uagb-table-of-contents.active {
		animation: none;
		transform: none;
	}

	/* TOC wrap */
	.sq-single-post__sidebar .wp-block-uagb-table-of-contents div.uagb-toc__wrap {
		padding: 24px 0;
		border: none;
		max-width: 100%;
		background: none;
	}

	/* Title: GT Walsheim Medium 16px, uppercase */
	.sq-single-post__sidebar .wp-block-uagb-table-of-contents .uagb-toc__title {
		color: #202227;
		font-family: "GT Walsheim", sans-serif;
		margin-left: 25px;
		font-size: 16px;
		font-style: normal;
		font-weight: 500;
		line-height: 30px;
		letter-spacing: 0.8px;
		text-transform: uppercase;
		margin-bottom: 24px;
	}

	/* Left border line */
	.sq-single-post__sidebar .wp-block-uagb-table-of-contents .uagb-toc__list-wrap {
		border-left: 2px solid #D3DBE2;
		overflow: initial;
		margin-left: 0;
	}

	/* Top-level list — reset UAGB default padding, use margin only */
	.sq-single-post__sidebar .wp-block-uagb-table-of-contents .uagb-toc__list-wrap > .uagb-toc__list {
		margin-left: 26px;
		padding-left: 0;
	}

	.sq-single-post__sidebar .wp-block-uagb-table-of-contents .uagb-toc__list-wrap > .uagb-toc__list > li {
		list-style-type: none !important;
		position: relative;
	}

	/* Top-level links */
	.sq-single-post__sidebar .wp-block-uagb-table-of-contents .uagb-toc__list-wrap > .uagb-toc__list > li > a {
		text-decoration: none;
		display: block;
		font-size: 16px;
		font-weight: 400;
		line-height: 25px;
		font-family: "Inter", sans-serif;
		color: #202227;
	}

	/* Orange pill indicator — default hidden */
	.sq-single-post__sidebar .wp-block-uagb-table-of-contents .uagb-toc__list-wrap > .uagb-toc__list > li > a::before {
		content: '';
		transition: opacity 0.2s ease-in-out;
		display: none;
		opacity: 0;
		position: absolute;
		width: 12px;
		height: 41px;
		background: #FF4A24;
		border-radius: 10px;
		left: -33px;
		top: 50%;
		transform: translateY(-50%);
	}

	/* Active + hover state: show pill + bold */
	.sq-single-post__sidebar .wp-block-uagb-table-of-contents .uagb-toc__list-wrap > .uagb-toc__list > li > a:hover,
	.sq-single-post__sidebar .wp-block-uagb-table-of-contents .uagb-toc__list-wrap > .uagb-toc__list > li > a.toc-active {
		font-weight: 600;
	}

	.sq-single-post__sidebar .wp-block-uagb-table-of-contents .uagb-toc__list-wrap > .uagb-toc__list > li > a:hover::before,
	.sq-single-post__sidebar .wp-block-uagb-table-of-contents .uagb-toc__list-wrap > .uagb-toc__list > li > a.toc-active::before {
		display: block;
		opacity: 1;
	}

	/* Sub-level links */
	.sq-single-post__sidebar .wp-block-uagb-table-of-contents .uagb-toc__list .uagb-toc__list > li {
		list-style-type: none !important;
		position: relative;
	}

	.sq-single-post__sidebar .wp-block-uagb-table-of-contents .uagb-toc__list .uagb-toc__list > li a {
		text-decoration: none;
		font-size: 16px;
		font-weight: 400;
		line-height: 25px;
		font-family: "Inter", sans-serif;
		display: block;
		color: #202227;
	}

	.sq-single-post__sidebar .wp-block-uagb-table-of-contents .uagb-toc__list .uagb-toc__list > li a::before {
		content: '';
		transition: opacity 0.2s ease-in-out;
		display: none;
		opacity: 0;
		position: absolute;
		width: 12px;
		height: 41px;
		background: #FF4A24;
		border-radius: 10px;
		left: -68px;
		top: 50%;
		transform: translateY(-50%);
	}

	.sq-single-post__sidebar .wp-block-uagb-table-of-contents .uagb-toc__list .uagb-toc__list > li a:hover,
	.sq-single-post__sidebar .wp-block-uagb-table-of-contents .uagb-toc__list .uagb-toc__list > li a.toc-active {
		font-weight: 600;
	}

	.sq-single-post__sidebar .wp-block-uagb-table-of-contents .uagb-toc__list .uagb-toc__list > li a:hover::before,
	.sq-single-post__sidebar .wp-block-uagb-table-of-contents .uagb-toc__list .uagb-toc__list > li a.toc-active::before {
		display: block;
		opacity: 1;
	}
}

/* ==========================================================================
   MOBILE (<=900px) — Fixed top bar with dropdown panel
   ========================================================================== */
@media (max-width: 900px) {

	/* Stack columns when TOC is present */
	.single-post .wp-block-columns:has(.wp-block-uagb-table-of-contents):not(.is-not-stacked-on-mobile) > .wp-block-column {
		flex-basis: 100% !important;
		min-width: 0;
		flex-grow: 1;
	}

	div.wp-block-uagb-table-of-contents {
		position: fixed;
		top: 74px;
		left: 0;
		width: 100%;
		z-index: 3;
		border-radius: 0;
		padding: 0;
		display: flex;
		flex-direction: column;
		background: none;
		box-shadow: none;
		transform: translateY(-100%);
		transition: transform 0.3s ease;
	}

	div.wp-block-uagb-table-of-contents.active {
		transform: translateY(0);
		box-shadow: none;
		animation: none;
	}

	div.wp-block-uagb-table-of-contents::before {
		display: none;
	}

	/* Inner wrap */
	div.wp-block-uagb-table-of-contents .uagb-toc__wrap {
		width: 100%;
		padding: 0;
		background: none;
		border: none;
	}

	/* Title bar — dark navy */
	div.wp-block-uagb-table-of-contents .uagb-toc__title {
		position: relative;
		padding: 16px 72px 16px 24px;
		background: #202227;
		box-shadow: 0 2px 3px rgba(0, 0, 0, 0.07);
		font-family: "GT Walsheim", sans-serif;
		font-weight: 500;
		font-size: 18px;
		line-height: 25px;
		color: white;
		text-transform: none;
		letter-spacing: 0;
	}

	/* Orange toggle button */
	div.wp-block-uagb-table-of-contents button.nav-close {
		position: absolute !important;
		right: 20px !important;
		top: 50% !important;
		left: auto !important;
		transform: translateY(-50%) !important;
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		padding: 4px 8px !important;
		margin: 0 !important;
		background: #FF4A24 !important;
		border: none !important;
		border-radius: 4px !important;
		cursor: pointer;
		z-index: 1;
	}

	div.wp-block-uagb-table-of-contents button.nav-close svg {
		width: 28px;
		height: 28px;
		fill: white;
		display: block;
		margin-left: 0 !important;
	}

	div.wp-block-uagb-table-of-contents button.nav-close .toc-icon-close {
		display: none;
	}

	/* Dropdown list panel */
	div.wp-block-uagb-table-of-contents .uagb-toc__list-wrap {
		background: #202227;
		opacity: 0;
		pointer-events: none;
		transition: opacity 0.3s ease;
		padding: 0 24px 24px;
		max-height: calc(100vh - 200px);
		overflow-y: auto;
		display: flex;
	}

	div.wp-block-uagb-table-of-contents .uagb-toc__list-wrap::-webkit-scrollbar-track {
		background-color: #202227;
		border-radius: 12px;
	}

	div.wp-block-uagb-table-of-contents .uagb-toc__list-wrap::-webkit-scrollbar {
		width: 12px;
	}

	div.wp-block-uagb-table-of-contents .uagb-toc__list-wrap::-webkit-scrollbar-thumb {
		background: #4E555F;
		border: 3px solid transparent;
		border-radius: 12px;
		background-clip: content-box;
	}

	/* All mobile text white */
	div.wp-block-uagb-table-of-contents .uagb-toc__wrap a,
	div.wp-block-uagb-table-of-contents .uagb-toc__wrap .uagb-toc__title {
		color: white;
	}

	div.wp-block-uagb-table-of-contents ol.uagb-toc__list,
	div.wp-block-uagb-table-of-contents .uagb-toc__list {
		margin-left: 0;
		list-style: none !important;
		padding-left: 0;
		padding-right: 24px;
	}

	div.wp-block-uagb-table-of-contents .uagb-toc__list li {
		list-style: none !important;
	}

	div.wp-block-uagb-table-of-contents .uagb-toc__list li::marker {
		content: none;
		display: none;
	}

	div.wp-block-uagb-table-of-contents .uagb-toc__list li a {
		text-decoration: none;
		font-weight: 500;
		font-family: "Inter", sans-serif;
		font-size: 16px;
		line-height: 25px;
	}

	div.wp-block-uagb-table-of-contents .uagb-toc__list ul.uagb-toc__list {
		margin-left: 36px;
		list-style: none !important;
		padding-left: 0;
	}

	div.wp-block-uagb-table-of-contents .uagb-toc__list ul.uagb-toc__list a {
		font-weight: 400;
	}

	/* Panel open state */
	div.wp-block-uagb-table-of-contents.panel-open .nav-close .toc-icon-dots {
		display: none;
	}

	div.wp-block-uagb-table-of-contents.panel-open .nav-close .toc-icon-close {
		display: block;
	}

	div.wp-block-uagb-table-of-contents.panel-open .uagb-toc__list-wrap {
		opacity: 1;
		pointer-events: all;
	}
}