/*
 * T1 Advanced Heading.
 * Line settings are set by Elementor as custom properties on .t1-advanced-heading
 * and inherited by the heading line and the highlight lines.
 */
.t1-advanced-heading {
	--t1-line-color: currentColor;
	--t1-line-thickness: 3px;
	--t1-line-gap: 8px;
	--t1-line-offset-x: 0px;
	--t1-line-offset-y: 0px;
	text-align: var(--t1-align, start);
}

.t1-advanced-heading__row {
	display: flex;
	align-items: center;
	justify-content: var(--t1-align, start);
}

.t1-advanced-heading__content {
	min-width: 0;
}

.t1-advanced-heading__title {
	margin: 0;
}

.t1-advanced-heading__title a {
	color: inherit;
	text-decoration: none;
}

/* Highlighted fragments: inline so long fragments wrap across lines. */
/* Lets a highlight colour show on top of a gradient heading. */
.t1-advanced-heading__highlight {
	-webkit-text-fill-color: currentColor;
}

.t1-advanced-heading__highlight,
.t1-advanced-heading__highlight-line,
.t1-advanced-heading__highlight-text {
	display: inline;
	-webkit-box-decoration-break: clone;
	box-decoration-break: clone;
}

/* Decorations */
.t1-advanced-heading__decoration {
	--t1-decoration-gap: 12px;
	flex: 0 0 auto;
}

.t1-advanced-heading__decoration-inner,
.t1-advanced-heading__decoration-inner > a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.t1-advanced-heading__decoration img {
	display: block;
	height: auto;
}

.t1-advanced-heading__before {
	margin-inline-end: var(--t1-decoration-gap);
}

.t1-advanced-heading__after {
	margin-inline-start: var(--t1-decoration-gap);
}

.t1-advanced-heading__top {
	margin-bottom: var(--t1-decoration-gap);
}

.t1-advanced-heading__bottom {
	margin-top: var(--t1-decoration-gap);
}

/* Line under the entire heading */
.t1-advanced-heading__line {
	display: block;
	width: var(--t1-line-width, 100%);
	max-width: var(--t1-line-max-width, 100%);
	height: var(--t1-line-thickness);
	margin-top: var(--t1-line-gap);
	margin-inline-start: var(--t1-line-margin-start, 0);
	margin-inline-end: var(--t1-line-margin-end, auto);
	background: var(--t1-line-color);
	border-radius: var(--t1-line-radius, 0);
	opacity: var(--t1-line-opacity, 1);
	transform: translate(var(--t1-line-offset-x), var(--t1-line-offset-y));
}

.t1-advanced-heading__line--pill {
	border-radius: var(--t1-line-radius, 999px);
}

.t1-advanced-heading__line--dotted,
.t1-advanced-heading__line--dashed,
.t1-advanced-heading__line--double {
	height: 0;
	background: none;
	border-top: var(--t1-line-thickness) solid var(--t1-line-color);
	border-radius: 0;
}

.t1-advanced-heading__line--dotted {
	border-top-style: dotted;
}

.t1-advanced-heading__line--dashed {
	border-top-style: dashed;
}

.t1-advanced-heading__line--double {
	border-top-style: double;
}

.t1-advanced-heading__line--wavy {
	height: calc(var(--t1-line-thickness) * 2);
	background:
		radial-gradient(circle at 50% 100%, transparent 35%, var(--t1-line-color) 36% 50%, transparent 51%) 0 0 / calc(var(--t1-line-thickness) * 4) 100% repeat-x;
	border-radius: 0;
}

/* Line under highlighted fragments (solid / rounded bar / gradient) */
.t1-advanced-heading__highlight-line {
	--t1-hl-line-color: color-mix(in srgb, var(--t1-line-color) calc(var(--t1-line-opacity, 1) * 100%), transparent);
	padding-bottom: max(0px, calc(var(--t1-line-gap) + var(--t1-line-thickness)));
	background-color: transparent;
	background-image: linear-gradient(var(--t1-hl-line-color), var(--t1-hl-line-color));
	background-repeat: no-repeat;
	background-size: min(var(--t1-line-width, 100%), var(--t1-line-max-width, 100%)) var(--t1-line-thickness);
	background-position: var(--t1-line-offset-x) calc(100% + var(--t1-line-offset-y) + min(0px, calc(var(--t1-line-gap) + var(--t1-line-thickness))));
}

/* Patterned lines under highlighted fragments use native text decoration. */
.t1-advanced-heading__highlight-line--dotted,
.t1-advanced-heading__highlight-line--dashed,
.t1-advanced-heading__highlight-line--double,
.t1-advanced-heading__highlight-line--wavy {
	padding-bottom: 0;
	background-image: none;
	text-decoration-line: underline;
	text-decoration-color: var(--t1-hl-line-color);
	text-decoration-thickness: var(--t1-line-thickness);
	text-underline-offset: var(--t1-line-gap);
	text-decoration-skip-ink: none;
}

.t1-advanced-heading__highlight-line--dotted {
	text-decoration-style: dotted;
}

.t1-advanced-heading__highlight-line--dashed {
	text-decoration-style: dashed;
}

.t1-advanced-heading__highlight-line--double {
	text-decoration-style: double;
}

.t1-advanced-heading__highlight-line--wavy {
	text-decoration-style: wavy;
}