/**
 * Inhaltsverzeichnis
 * 	1. Section
 * 		1.1 Heading
 * 	2. Meta Wrapper
 * 		2.1 Card Specific
 * 		2.2 Wrapper
 * 		2.3 Term Rows
 * 	3. Titles
 * 	4. Links
 * 
 */


/* ================================================== */
/* 1. Section */
/* -------------------------------------------------- */
/* #=#=#=#=#=# 1.1 Heading #=#=#=#=#=# */
.cvh--terms-ctn :is(.cvh--heading-ctn, [class*="-heading-ctn "], [class$="-heading-ctn"]) {
	margin-bottom: var(--cvh-space-xs);
}


/* ================================================== */
/* 2. Meta Wrapper */
/* -------------------------------------------------- */
/* #=#=#=#=#=# 2.1 Card Specific #=#=#=#=#=# */
	/* #==== Posts ====# */
:where(.cvh--card-ctn[data-card-template="classic"]) .cvh--term-meta-wrap {
	--head-offset: (100cqw / var(--card-head-ratio-x, 16) * var(--card-head-ratio-y, 9));
	--backdrop-opacity: 0.75;
	position: absolute;
	top: calc(var(--head-offset) - var(--element-height));
	inset-inline: 0px;
	z-index: 20;

	height: var(--element-height, max-content);
	margin-bottom: 0 !important;
}

@supports not (top: calc(100cqw / 16 * 9)) {
	:where(.cvh--card-ctn[data-card-template="classic"]) .cvh--term-meta-wrap {
		top: 0px;
	}
}


/* #=#=#=#=#=# 2.2 Wrapper #=#=#=#=#=# */
	/* #==== Idle ====# */

	/* ~~~ Main Wrapper ~~~ */
.cvh--term-meta-wrap[data-term-rows="1"] {
	--term-rows: 1;
}

.cvh--term-meta-wrap[data-term-rows="2"] {
	--term-rows: 2;
}

.cvh--term-meta-wrap[data-term-titles="true"] {
	--term-title-height: calc(var(--text-s) * var(--cvh-line-height-s) + 5px);
}

.cvh--term-meta-wrap {
	--term-line-height: calc((var(--text-s) * var(--cvh-line-height-m)) + (2 * var(--link-padding-y)));
	--element-height: calc((2 * 5px) + ((var(--term-title-height, 0px) + var(--term-line-height)) * var(--term-rows) + (var(--cvh-space-xs) * (var(--term-rows) - 1))));
}

:where(.cvh--card-ctn[data-card-template="classic"]) .cvh--term-meta-wrap {
	--link-padding-y: 2.5px;
	--link-padding-x: 10px;
}

.cvh--term-meta-wrap:where(:not(.cvh--card-ctn[data-card-template="classic"] .cvh--term-meta-wrap)) {
	--link-padding-y: 5px;
	--link-padding-x: var(--cvh-space-xs);
}

:where(.cvh--card-ctn[data-card-template="classic"]) .cvh--term-meta-wrap::before {
	display: block;
	content: '\0A';
	position: absolute;
	inset: 0;
	z-index: -5;
	background-color: var(--card-background, var(--cvh-color-shade-white));
	opacity: var(--backdrop-opacity);
}

	/* ~~~ Inner Container ~~~ */
:where(.cvh--card-ctn[data-card-template="classic"]) .cvh--term-meta-inner {
	position: relative;
	isolation: isolate;
	padding-inline: var(--cvh-space-xs);
	margin-block: 5px;
	height: 100%;
	overflow-y: hidden;
	overflow-y: clip;
}

:where(:root[dom_loaded]) :where(.cvh--card-ctn[data-card-template="classic"]) :is(
	.cvh--term-meta-wrap,
	.cvh--term-meta-inner
),
:where(:root[dom_loaded]) :where(.cvh--card-ctn[data-card-template="classic"]) .cvh--term-meta-wrap::before {
	transition: var(--cvh-transition-normal);
}


	/* #==== Effects ====# */
	/* ~~~ Hover ~~~ */
:where(.cvh--card-ctn[data-card-template="classic"]) .cvh--term-meta-wrap:is(:hover, :focus-within) {
	--backdrop-opacity: 0.95;
	top: 0px;
	height: 100%;
}

:where(.cvh--card-ctn[data-card-template="classic"]) .cvh--term-meta-wrap:is(:hover, :focus-within) .cvh--term-meta-inner {
	padding: var(--card-spacing);
	overflow-y: auto;
}


/* #=#=#=#=#=# 2.3 Term Rows #=#=#=#=#=# */
:where(.cvh--card-ctn[data-card-template="classic"]) .cvh--term-row > .cvh--terms {
	max-height: calc(var(--text-s) * var(--cvh-line-height-m) + (2 * var(--link-padding-y)));
	overflow-y: hidden;
}

:where(.cvh--card-ctn[data-card-template="classic"]) .cvh--term-meta-wrap:is(:hover, :focus-within) .cvh--term-row > .cvh--terms {
	max-height: revert;
	overflow: revert;
}


/* ================================================== */
/* 3. Titles */
/* -------------------------------------------------- */
.cvh--term-title-ctn {
	margin-bottom: 5px;
}

.cvh--term-title {
	font-family: var(--cvh-font-display);
	font-size: var(--text-s);
	font-weight: 400;
	line-height: var(--cvh-line-height-s);
	color: var(--cvh-color-text-dynamic);

	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
}

.cvh--term-title::after {
	display: inline-block;
	content: ':';
	margin-left: 2px;
}


/* ================================================== */
/* 4. Links */
/* -------------------------------------------------- */
.cvh--term-link {
	display: block;
	font-size: var(--text-s);
	color: var(--cvh-color-text-light) !important;
	padding: var(--link-padding-y) var(--link-padding-x);
}

:not(a, button).cvh--term-link {
	background-color: var(--shade-medium);
	border-radius: var(--cvh-border-radius-s);
}

:is(a, button).cvh--term-link {
	background-color: var(--cvh-color-button-bg-dynamic);
	transition-property: background-color;
}

:is(a, button).cvh--term-link:is(:hover, :focus-visible) {
	background-color: var(--cvh-color-button-bg-hover);
}