/* Hide certain elements when either profile or content page is being viewed */
.ipsCoverPhoto--profile:not(.ipsCoverPhoto--minimal) ~ .ipsCoverPhotoMeta [data-action="goToProfile"],
.ipsCoverPhoto--minimal ~ .ipsCoverPhotoMeta [data-action="browseContent"],
.ipsCoverPhoto--minimal #ipsMenu_elprofile_edit{
	display: none !important;
}

/* Profile columns */
.ipsProfileContainer{
	container: ipsProfile / inline-size;
}
.ipsProfile{
	display: grid;
	gap: 1em;
}

.ipsProfile__sticky-inner{
	display: grid;
	gap: 1em;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr));
}

@container (min-width: 768px){
	.ipsProfile{
		grid-template-columns: min(360px, 35%) 1fr;
	}

		.ipsProfile__aside{
			display: grid;
		}

		/* Make sidebar sticky, unless it contains <details> elements (since their dynamic height results in a poor UI) */
		.ipsProfile__sticky-outer{
			min-height: min(100%, calc(100vh - (var(--i-sp_block) * 2) - var(--i-sticky-offset)));
			min-height: min(100%, calc(100svh - (var(--i-sp_block) * 2) - var(--i-sticky-offset)));
			position: sticky;
			bottom: var(--i-sp_block);
			align-self: end;
		}
		.ipsProfile__sticky-inner{
			position: sticky;
			top: calc(var(--i-sticky-offset) + var(--i-sp_block));
		}
}

.ipsProfile__aside .ipsSideMenu{
	padding: 1em;
}

/* Profile reputation, solutions, followers, etc */
.ipsProfile__aside .ipsData:not(.ipsData--profileVisitors){
	--i-data--padding: 1.4em;
	--i-data--title: 1.05em;
}
	.ipsProfile__aside .ipsData:not(.ipsData--profileVisitors) .ipsData__title{
		font-weight: 600;
	}
	.ipsProfile__aside .ipsData:not(.ipsData--profileVisitors) .ipsData__desc{
		margin: 0;
		display: block;
	}

/* Stat icons */
.ipsData--profileMeta .ipsData__icon{
	opacity: .3;
	flex-basis: 1em;
	align-self: center;
	font-size: 16px;
}

/* Show long dates in "About" widget */
.ipsProfile__aside .ipsTime__long{
	display: revert;
}
.ipsProfile__aside .ipsTime__short{
	display: none;
}

.ipsProfileWidget{
	padding: 3em 1.5em;
	border-bottom: 1px solid var(--i-background_3);
	display: block; /* Used for links */
}

/* ACHIEVEMENTS */
.cProfileAchievements > a:hover {
	background: var(--i-background_2);
}

/* REP SCORES */
.cProfileRepScore {
	background: var(--i-background_5);
	color: var(--i-base-contrast_6);
	border-radius: 6px;
	text-align: center;
	display: grid;
	font-weight: 600;
}

.cProfileRepScore--badge{
	font-size: 1.5em;
}

	.cProfileRepScore--positive,
	.cProfileRepScore--solutions {
		background: var(--i-background_positive);
		color: var(--i-color_positive-soft);
	}

	.cProfileRepScore--negative {
		background: var(--i-background_negative);
		color: var(--i-color_negative-soft);
	}

.cProfileRepScore__points {
	font-size: 2em;
}

/* Subscriptions */
.cProfileSubscription {
	display: grid;
    overflow: hidden;
	border-radius: min(var(--i-design-radius), 7px);
	background-color: var(--i-background_dark);
	color: #fff;
	text-align: center;
	font-weight: 600;
}

	.cProfileSubscription > *{
		grid-area: 1/-1;
	}

	.cProfileSubscription img{
		width: 100%;
	}

	.cProfileSubscription__gradient{
	    background-image: linear-gradient(to bottom, rgba(0,0,0,0) 50%, rgba(0,0,0,0.8));
	}

	.cProfileSubscription__text {
		padding: 2em 1em;
		align-self: end;
	}

	.cProfileSubscription--with-image .cProfileSubscription__text{
		padding-top: 5em;
		text-shadow: rgba(0,0,0,0.2) 0px 1px 1px;
	}

/* Rank Progress */
.cRankHistory {
	position: relative;
	z-index: 1;
	display: grid;
	gap: 20px;
}

	.cRankHistory::before {
		content: '';
		width: 2px;
		background: var(--i-color_soft);
		position: absolute;
		top: 10px;
		bottom: 10px;
		inset-inline-start: 19px;
		z-index: -1;
		opacity: .4;
	}

	.cRankHistory__item {
		position: relative;
		display: flex;
		align-items: center;
		gap: var(--i-sp_2);
	}

		.cRankHistory__icon {
			background: var(--i-background_1);
			padding: 3px 0;
			flex: 0 0 auto;
		}

		.cRankHistory__icon img{
			width: 40px;
			aspect-ratio: 1;
			object-fit: cover;
		}

	.cRankHistory__itemBadge--unearned {
		filter: opacity(15%) grayscale(1);
	}

.ipsTabs--profile{
	border-top-left-radius: inherit;
	border-top-right-radius: inherit;
}

/* Cater for sticky tabs when scrollIntoView is run */
.ipsTabs__panels--profile{
	scroll-margin-top: 4.5em;
}