/*
------------------------------------------------
Owner Activity Page
------------------------------------------------
*/

.tl-owner-activity-page {
	width: 100%;
}


/*
------------------------------------------------
Owner Activity Header
------------------------------------------------
*/

.tl-owner-activity-page > h2 {
	margin: 0;
	padding: 24px 20px 8px;

	font-size: 1em;
	line-height: 1.2;
}


.tl-owner-activity-page > p {
	margin: 0;
	padding: 0 20px 20px;
}


/*
------------------------------------------------
Owner Activity List
------------------------------------------------
*/

.tl-owner-activity-list {
	display: flex;
	flex-direction: column;
}


/*
------------------------------------------------
Owner Activity Item
------------------------------------------------
*/

.tl-owner-activity-item {
	margin: 0;
}


.tl-owner-activity-item:nth-child(odd) {
	background: #f3f3f3;
}


.tl-owner-activity-item:nth-child(even) {
	background: #ffffff;
}


.tl-owner-activity-link {
	display: flex;
	flex-direction: column;
	gap: 12px;

	width: 100%;
	padding: 20px;

	box-sizing: border-box;

	color: inherit;
	text-decoration: none;
}


/*
------------------------------------------------
Owner Activity Main
------------------------------------------------
*/

.tl-owner-activity-main {
	flex: 1 1 auto;
	min-width: 0;
}


/*
------------------------------------------------
Owner Response
------------------------------------------------
*/

.tl-owner-response-selected {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
}


.tl-owner-response-owner {
	font-size: 1em;
	line-height: 1.35;
}


/*
------------------------------------------------
Owner Activity Context
------------------------------------------------
*/

.tl-owner-activity-context {
	margin-top: 6px;

	font-size: 1em;
	line-height: 1.35;
}


.tl-owner-activity-separator {
	display: inline;
}


/*
------------------------------------------------
Owner Activity Date
------------------------------------------------
*/

.tl-owner-activity-date {
	display: flex;
	flex-direction: column;
	gap: 2px;

	flex: 0 0 auto;

	font-size: 1em;
	line-height: 1.35;
}


/*
------------------------------------------------
Owner Activity Interaction
------------------------------------------------
*/

.tl-owner-activity-link:hover,
.tl-owner-activity-link:focus-visible {
	background: rgba(0, 0, 0, 0.035);
}


.tl-owner-activity-link:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: -2px;
}


/*
------------------------------------------------
Owner Activity Pagination
------------------------------------------------
*/

.tl-owner-activity-pagination {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;

	padding: 20px;
}


/*
------------------------------------------------
Desktop
------------------------------------------------
*/

@media (min-width: 768px) {

	.tl-owner-activity-page > h2 {
		padding: 28px 30px 8px;
	}


	.tl-owner-activity-page > p {
		padding: 0 30px 24px;
	}


	.tl-owner-activity-link {
		flex-direction: row;
		align-items: flex-start;
		justify-content: space-between;
		gap: 40px;

		padding: 22px 30px;
	}


	.tl-owner-activity-main {
		flex: 1 1 auto;
	}


	.tl-owner-activity-date {
		align-items: flex-end;

		padding-top: 2px;

		text-align: right;
		white-space: nowrap;
	}


	.tl-owner-activity-pagination {
		padding: 24px 30px;
	}

}