/*--------------------------------------------------------------
# Author picture (author box on posts + Authors page)
# The initials are the placeholder; the profile picture, when
# there is one, covers them.
--------------------------------------------------------------*/

.tw-author-avatar {
	position: relative;
	display: block;
	flex: 0 0 auto;
	width: var(--tw-avatar-size, 120px);
	height: var(--tw-avatar-size, 120px);
	border: 3px solid var(--tw-gold);
	border-radius: 50%;
	overflow: hidden;
	background: var(--tw-dark-blue);
	box-sizing: border-box;
}

.tw-author-avatar__initials {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--tw-gold);
	font-size: calc(var(--tw-avatar-size, 120px) * 0.34);
	font-weight: 600;
	letter-spacing: 0.04em;
	line-height: 1;
	user-select: none;
}

.tw-author-avatar__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

/* Author box on posts: picture left, text right */
.author-box--has-avatar {
	display: flex;
	align-items: flex-start;
	gap: 35px;
}

.author-box__body {
	flex: 1 1 auto;
	min-width: 0;
}

/* Authors page cards: picture above the name */
.authors-card .tw-author-avatar {
	margin-bottom: 20px;
}

@media (max-width: 600px) {
	.author-box--has-avatar {
		flex-direction: column;
		gap: 20px;
	}
}

@media (forced-colors: active) {
	.tw-author-avatar {
		border-color: CanvasText;
	}
}