.card-profile-ad-container
{
	display: flex;
	flex-flow: column nowrap;
	gap: 3px;

	.card-profile-ad-sponsored
	{
		font-size: calc((12 / 16) * var(--base-fontsize));
		text-align: right;
	}
	.card-profile-ad-block
	{
		background: var(--card-overlay);
		border-radius: var(--card-border-radius);
		display: flex;
		flex-flow: column nowrap;
		gap: var(--card-gap);
		padding: var(--card-gap);
		
		.card-profile-ad
		{
			border-radius: inherit;
			display: flex;
			flex-flow: row nowrap;
			gap: calc(var(--card-gap) / 2);
			position: relative;
			text-align: center;
			
			a.link
			{
				border-radius: inherit;
				inset: 0;
				position: absolute;
				z-index: 1;
			}
			picture
			{
				background: var(--card-overlay);
				align-items: center;
				aspect-ratio: 1 / 1;
				border-radius: 100%;
				display: flex;
				height: 45px;
				justify-content: center;
				overflow: hidden;
				width: 45px;
				
				img
				{
					height: 100%;
					object-fit: cover;
					width: 100%;
				}
				i
				{
					color: var(--card-text);
					font-size: calc((20 / 12) * var(--base-fontsize));
					opacity: 0.5;
				}
			}
			.contents
			{
				flex: 1;
				gap: 0 !important;
				line-height: 1.35;
				
				strong
				{
					font-weight: var(--font-weight-semi);
				}
				hr
				{
					background: var(--card-text);
					border: none;
					height: 1px;
					opacity: 0.05;
				}
			}
		}
	}
	.card-profile-full-ad
	{
		--scale-portrait: 100;
		--scale-landscape: 100;
		
		background: var(--card-overlay);
		aspect-ratio: 2 / 1;
		overflow: hidden;
		position: relative;
		
		& > *
		{
			display: block;
			inset: 0;
			position: absolute;
			
			picture > *
			{
				height: 100%;
				object-fit: contain;
				object-position: center center;
				vertical-align: top;
				width: 100%;
			}
			&.background picture > *
			{
				object-fit: cover;
			}
		}
		.contents
		{
			align-items: center;
			display: flex;
			flex-flow: column nowrap;
			gap: 0;
			justify-content: center;
			z-index: 1;

			picture
			{
				scale: calc(var(--scale-portrait) / 100);
			}
		}
		.link
		{
			z-index: 2;
		}
		.ad-tooltip
		{
			display: none;
		}
	}
}
@media (min-width: 768px) and (orientation: landscape)
{
	.card-profile-ad-container
	{
		.card-profile-ad-block
		{
			/* display: grid;
			grid-template-columns: repeat(2, 1fr); */
			
			& > h3
			{
				grid-column: 1 / span 2;
			}
		}
		.card-profile-full-ad
		{
			aspect-ratio: 4 / 1;
			
			.contents
			{
				picture
				{
					scale: calc(var(--scale-landscape) / 100);
				}
			}
		}
	}
}