/*
 * Shelter Realty native author box.
 * Used for WordPress blog-post author boxes.
 */

.shelter-author-box {
	display: block;
	width: 100%;
	margin: 30px 0 0;
	padding: 20px;
	border: 1px solid #eeeeee;
	background: #ffffff;
	box-sizing: border-box;
	clear: both;
}


/*
 * Desktop row:
 * avatar + author name/description
 */
.shelter-author-box__main {
	display: flex;
	align-items: flex-start;
	width: 100%;
	gap: 20px;
}


.shelter-author-box__avatar {
	flex: 0 0 100px;
	width: 100px;
}


.shelter-author-box__avatar-image {
	display: block;
	width: 100px;
	height: 100px;
	max-width: 100%;
	object-fit: cover;
	border: 0;
	border-radius: 0;
}


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


.shelter-author-box__name {
	margin: 0 0 8px;
	font-size: 18px;
	font-weight: 600;
	line-height: 25px;
}


.shelter-author-box__name a {
	color: inherit;
	text-decoration: none !important;
}


.shelter-author-box__name a:hover,
.shelter-author-box__name a:focus-visible {
	color: var(--shelter-accent, #e98d26);
}


.shelter-author-box__bio,
.shelter-author-box__bio p {
	font-size: 14px !important;
	line-height: 21px !important;
}


.shelter-author-box__bio p {
	margin: 0 0 12px;
}


.shelter-author-box__bio p:last-child {
	margin-bottom: 0;
}


/*
 * Author website.
 * Always sits below avatar + description and spans the full box.
 */
.shelter-author-box__website {
	display: block;
	width: 100%;
	margin: 15px 0 0;
	padding: 0;
	box-sizing: border-box;
	font-size: 14px;
	line-height: 21px;
}


.shelter-author-box__website a {
	color: inherit;
	text-decoration: none !important;
}


.shelter-author-box__website a:hover,
.shelter-author-box__website a:focus-visible {
	color: var(--shelter-accent, #e98d26);
}


/*
 * Mobile:
 *
 * Image
 * Name
 * Description
 * Website
 *
 * Each becomes its own full-width block.
 */
@media (max-width: 480px) {

	.shelter-author-box {
		display: block;
		width: 100%;
		padding: 20px;
		text-align: center;
	}


	.shelter-author-box__main {
		display: block;
		width: 100%;
	}


	.shelter-author-box__avatar {
		display: block;
		width: 100%;
		margin: 0 0 12px;
	}


	.shelter-author-box__avatar-image {
		display: block;
		width: 100px;
		height: 100px;
		margin: 0 auto;
	}


	.shelter-author-box__content {
		display: block;
		width: 100%;
		min-width: 0;
	}


	.shelter-author-box__name {
		display: block;
		width: 100%;
		margin: 0 0 8px;
	}


	.shelter-author-box__bio {
		display: block;
		width: 100%;
	}


	.shelter-author-box__bio p {
		width: 100%;
	}


	.shelter-author-box__website {
		display: block;
		width: 100%;
		margin: 15px 0 0;
	}

}