/* TFL Columnist Manager — frontend */
.tflcm-section {
	--tflcm-bg: #e0e0e0;
	--tflcm-text: #161616;
	--tflcm-accent: #9b1c1c;
	--tflcm-img: 96px;
	--tflcm-name: 18px;
	--tflcm-headline: 15px;
	--tflcm-title: 26px;
	--tflcm-radius: 6px;
	--tflcm-gap: 18px;
	--tflcm-pad: 22px;
	--tflcm-space-photo: 12px;
	--tflcm-space-name: 8px;
	--tflcm-perrow: 4;
	--tflcm-clamp: 5;
	--tflcm-bioclamp: 3;
	margin: 36px 0;
}

.tflcm-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 18px;
}

.tflcm-title {
	margin: 0;
	font-size: var(--tflcm-title);
	font-weight: 800;
	letter-spacing: 0.01em;
}

.tflcm-nav {
	display: flex;
	gap: 8px;
}

.tflcm-nav button {
	width: 38px;
	height: 38px;
	border-radius: 50%;
	border: 1px solid rgba(0, 0, 0, 0.15);
	background: #fff;
	color: #161616;
	font-size: 18px;
	line-height: 1;
	cursor: pointer;
	transition: background 0.2s, color 0.2s;
}

.tflcm-nav button:hover {
	background: var(--tflcm-accent);
	border-color: var(--tflcm-accent);
	color: #fff;
}

.tflcm-viewport {
	overflow: hidden;
}

.tflcm-track {
	display: grid;
	grid-template-columns: repeat(var(--tflcm-perrow), 1fr);
	gap: var(--tflcm-gap);
}

/* Slider mode: horizontal scroll-snap */
.tflcm-section.is-slider .tflcm-track {
	display: flex;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	padding-bottom: 6px;
}

.tflcm-section.is-slider .tflcm-track::-webkit-scrollbar {
	display: none;
}

.tflcm-card {
	flex: 0 0 calc((100% - (var(--tflcm-perrow) - 1) * var(--tflcm-gap)) / var(--tflcm-perrow));
	scroll-snap-align: start;
	background: var(--tflcm-bg);
	color: var(--tflcm-text);
	border-radius: var(--tflcm-radius);
	aspect-ratio: 3 / 4;
	padding: var(--tflcm-pad);
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.tflcm-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 12px 28px rgba(0, 0, 0, 0.14);
}

.tflcm-photo {
	width: var(--tflcm-img);
	height: var(--tflcm-img);
	border-radius: 50%;
	overflow: hidden;
	flex: none;
	margin-bottom: var(--tflcm-space-photo);
	background: #fff;
	display: block;
}

.tflcm-photo-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.tflcm-initials {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: calc(var(--tflcm-img) * 0.34);
	font-weight: 800;
	color: #fff;
	background: var(--tflcm-accent);
}

.tflcm-name {
	font-size: var(--tflcm-name);
	margin: 0 0 var(--tflcm-space-name);
	line-height: 1.25;
	font-weight: 600;
}

.tflcm-name.is-bold {
	font-weight: 800;
}

.tflcm-name a {
	color: inherit;
	text-decoration: none;
}

.tflcm-name a:hover {
	color: var(--tflcm-accent);
}

.tflcm-bio {
	font-size: 13px;
	line-height: 1.5;
	opacity: 0.72;
	margin: 0 0 8px;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: var(--tflcm-bioclamp);
	overflow: hidden;
}

.tflcm-headline {
	margin-top: auto;
	font-size: var(--tflcm-headline);
	line-height: 1.5;
	color: inherit;
	text-decoration: none;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: var(--tflcm-clamp);
	overflow: hidden;
}

.tflcm-headline::before {
	content: "\201C";
}

.tflcm-headline::after {
	content: "\201D";
}

.tflcm-headline.is-bold {
	font-weight: 700;
}

.tflcm-headline:hover {
	color: var(--tflcm-accent);
}

/* Mobile: always a swipeable row */
@media (max-width: 768px) {
	.tflcm-track {
		display: flex;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		scrollbar-width: none;
		padding-bottom: 6px;
	}
	.tflcm-track::-webkit-scrollbar {
		display: none;
	}
	.tflcm-card {
		flex: 0 0 64%;
	}
	.tflcm-nav {
		display: none;
	}
	.tflcm-title {
		font-size: 21px;
	}
}

/* Alignment: left / right */
.tflcm-section.align-left .tflcm-card {
	text-align: left;
	align-items: flex-start;
}
.tflcm-section.align-right .tflcm-card {
	text-align: right;
	align-items: flex-end;
}
/* Photo on the left side */
.tflcm-section.photo-left .tflcm-card {
	flex-direction: row;
	align-items: center;
	text-align: left;
	aspect-ratio: auto;
}
.tflcm-section.photo-left .tflcm-photo {
	margin: 0 var(--tflcm-space-photo) 0 0;
}
.tflcm-section.photo-left .tflcm-textcol {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	min-width: 0;
	flex: 1;
}
.tflcm-section.photo-left .tflcm-headline {
	margin-top: 6px;
}

/* Free headline mover: up/down + left/right via sliders */
.tflcm-headline {
	transform: translate(var(--tflcm-headline-dx, 0px), var(--tflcm-headline-dy, 0px));
}

/* v1.4: hairline border (keyline) on circular photos */
.tflcm-photo {
	border: 1px solid #111;
	box-sizing: border-box;
}

/* v1.4: redesigned author page (mobile-first) */
.tflcm-author-page {
	max-width: 1080px;
	margin: 0 auto;
	padding: 32px 20px 48px;
}
.tflcm-author-hero {
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 20px;
	padding: 28px 20px;
	background: #f4f4f4;
	border-radius: 12px;
	margin-bottom: 32px;
}
.tflcm-author-photo {
	width: 140px;
	height: 140px;
	border-radius: 50%;
	object-fit: cover;
	border: 1px solid #111;
	flex: 0 0 auto;
}
.tflcm-author-initials {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: #9b1c1c;
	color: #fff;
	font-size: 44px;
	font-weight: 700;
}
.tflcm-author-kicker {
	margin: 0 0 6px;
	font-size: 12px;
	letter-spacing: 2px;
	text-transform: uppercase;
	color: #9b1c1c;
	font-weight: 700;
}
.tflcm-author-name {
	margin: 0 0 6px;
	font-size: 32px;
	line-height: 1.2;
}
.tflcm-author-job {
	margin: 0 0 12px;
	font-size: 15px;
	color: #555;
	font-weight: 600;
}
.tflcm-author-bio {
	margin: 0 0 16px;
	font-size: 15px;
	line-height: 1.6;
	color: #333;
	max-width: 640px;
}
.tflcm-author-links {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	margin-bottom: 12px;
	flex-wrap: wrap;
}
.tflcm-soc {
	width: 36px;
	height: 36px;
	border-radius: 50%;
	border: 1px solid #111;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	color: #111;
}
.tflcm-soc:hover {
	background: #111;
	color: #fff;
}
.tflcm-weblink {
	font-size: 14px;
	font-weight: 600;
	color: #9b1c1c;
	text-decoration: underline;
}
.tflcm-author-count {
	margin: 0;
	font-size: 13px;
	color: #777;
}
.tflcm-author-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 20px;
}
.tflcm-ag-card {
	background: #fff;
	border: 1px solid #e4e4e4;
	border-radius: 10px;
	overflow: hidden;
	display: flex;
	flex-direction: column;
}
.tflcm-ag-thumb img {
	width: 100%;
	height: auto;
	display: block;
	aspect-ratio: 16/9;
	object-fit: cover;
}
.tflcm-ag-body {
	padding: 14px 16px 16px;
}
.tflcm-ag-cat {
	margin: 0 0 6px;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 1px;
	color: #9b1c1c;
	font-weight: 700;
}
.tflcm-ag-title {
	margin: 0 0 8px;
	font-size: 17px;
	line-height: 1.4;
}
.tflcm-ag-title a {
	color: inherit;
	text-decoration: none;
}
.tflcm-ag-title a:hover {
	color: #9b1c1c;
}
.tflcm-ag-date {
	margin: 0;
	font-size: 13px;
	color: #777;
}
.tflcm-author-pager {
	margin-top: 28px;
	text-align: center;
}
@media (min-width: 640px) {
	.tflcm-author-grid {
		grid-template-columns: repeat(2, 1fr);
	}
	.tflcm-author-hero {
		flex-direction: row;
		text-align: left;
		align-items: center;
		padding: 32px;
	}
	.tflcm-author-links {
		justify-content: flex-start;
	}
}
@media (min-width: 960px) {
	.tflcm-author-grid {
		grid-template-columns: repeat(3, 1fr);
	}
}

/* v1.4 mobile hardening: containment so future setting changes can't break small screens.
   - Cards clip moved/overflowing content instead of spilling into neighbors.
   - Flex children get min-width:0 so long words/headlines never force horizontal overflow.
   - The photo-left variant stacks vertically on phones (a 64%-wide row is too cramped). */
.tflcm-card {
	overflow: hidden;
	min-width: 0;
}
.tflcm-name,
.tflcm-headline {
	overflow-wrap: break-word;
	min-width: 0;
}
@media (max-width: 768px) {
	.tflcm-section.photo-left .tflcm-card {
		flex-direction: column;
		align-items: center;
		text-align: center;
		aspect-ratio: 3 / 4;
	}
	.tflcm-section.photo-left .tflcm-photo {
		margin: 0 0 var(--tflcm-space-photo) 0;
	}
	.tflcm-section.photo-left .tflcm-textcol {
		align-items: center;
	}
}

/* v1.5.0: Author Design Studio — post author box (replaces the theme's .author-box). */
.tflcm-abox {
	display: flex;
	gap: 18px;
	align-items: flex-start;
	background: var(--ab-bg, #ffffff);
	border: 1px solid #111;
	border-radius: var(--ab-radius, 6px);
	padding: 20px;
	margin: 28px 0;
	min-width: 0;
}
.tflcm-abox.no-boxborder {
	border: none;
}
.tflcm-abox-photo {
	flex: 0 0 auto;
	width: var(--ab-photo, 84px);
	height: var(--ab-photo, 84px);
	border-radius: 50%;
	overflow: hidden;
	border: 1px solid #111;
	box-sizing: border-box;
	display: block;
}
.tflcm-abox-photo.no-photoborder {
	border: none;
}
.tflcm-abox-photo img,
.tflcm-abox-img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.tflcm-abox-initials {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #9b1c1c;
	color: #fff;
	font-weight: 700;
	font-size: calc(var(--ab-photo, 84px) * 0.36);
}
.tflcm-abox-text {
	min-width: 0;
	flex: 1;
}
.tflcm-abox-name {
	margin: 0 0 4px;
	font-size: var(--ab-name, 20px);
	line-height: 1.3;
	font-weight: 400;
}
.tflcm-abox-name.is-bold {
	font-weight: 700;
}
.tflcm-abox-name a {
	color: inherit;
	text-decoration: none;
}
.tflcm-abox-job {
	margin: 0 0 8px;
	font-size: 14px;
	color: #555555;
	font-weight: 600;
}
.tflcm-abox-bio {
	margin: 0 0 10px;
	font-size: 15px;
	line-height: 1.6;
	color: #333333;
	display: -webkit-box;
	-webkit-line-clamp: var(--ab-bioclamp, 3);
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.tflcm-abox-link {
	font-size: 14px;
	font-weight: 700;
	color: var(--ab-link, #9b1c1c);
	text-decoration: none;
}
.tflcm-abox-link:hover {
	text-decoration: underline;
}
.tflcm-abox.abox-top {
	flex-direction: column;
	align-items: center;
	text-align: center;
}
@media (max-width: 640px) {
	.tflcm-abox {
		flex-direction: column;
		align-items: center;
		text-align: center;
	}
}

/* v1.5.0: author profile page — settings-driven overrides. */
.tflcm-author-hero {
	background: var(--ap-bg, #f4f4f4);
}
.tflcm-author-photo {
	width: var(--ap-photo, 140px);
	height: var(--ap-photo, 140px);
}
.tflcm-author-photo.no-photoborder {
	border: none;
}
.tflcm-author-name {
	font-size: var(--ap-name, 32px);
}
.tflcm-author-name.no-bold {
	font-weight: 400;
}
.tflcm-author-kicker,
.tflcm-weblink,
.tflcm-ag-cat {
	color: var(--ap-accent, #9b1c1c);
}
.tflcm-ag-title a:hover {
	color: var(--ap-accent, #9b1c1c);
}
@media (min-width: 960px) {
	.tflcm-author-grid {
		grid-template-columns: repeat(var(--ap-cols, 3), 1fr);
	}
}

/* v1.5.0: authors directory restyle — scoped so the theme default is untouched when off. */
.tflcm-ad-scope .authors-grid {
	display: grid;
	grid-template-columns: repeat(var(--ad-perrow, 4), 1fr);
	gap: 18px;
}
.tflcm-ad-scope .author-directory-card {
	background: var(--ad-bg, #ffffff);
	border: 1px solid #111;
	border-radius: 8px;
	padding: 18px 12px;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	text-align: center;
	text-decoration: none;
	min-width: 0;
}
.tflcm-ad-scope .author-directory-card.no-cardborder {
	border: none;
}
.tflcm-ad-scope .author-directory-card .avatar {
	display: block;
	width: var(--ad-photo, 96px);
	height: var(--ad-photo, 96px);
	border-radius: 50%;
	overflow: hidden;
	border: 1px solid #111;
	box-sizing: border-box;
	flex: 0 0 auto;
}
.tflcm-ad-scope .author-directory-card .avatar.no-photoborder {
	border: none;
}
.tflcm-ad-scope .author-directory-card .avatar img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.tflcm-ad-initials {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #9b1c1c;
	color: #fff;
	font-weight: 700;
	font-size: calc(var(--ad-photo, 96px) * 0.36);
}
.tflcm-ad-scope .author-directory-card strong {
	font-size: var(--ad-name, 16px);
	color: #161616;
	display: block;
}
.tflcm-ad-scope .author-directory-card small {
	color: #666666;
	font-size: 13px;
}
@media (max-width: 640px) {
	.tflcm-ad-scope .authors-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}

/* v1.5.0: admin live-preview boxes. */
.tflcm-livebox {
	border: 1px dashed #c3c4c7;
	border-radius: 6px;
	padding: 14px;
	margin-bottom: 14px;
	background: #fafafa;
}
.tflcm-livebox .tflcm-abox {
	margin: 0;
}
.tflcm-livebox .tflcm-author-page {
	padding: 0;
}
.tflcm-livebox .tflcm-author-hero {
	margin-bottom: 0;
}