/* mijn.host linked group — clickable via stretch-link overlay, not a wrapping <a>. */

.wp-block-mijnhost-linked-group {
	position: relative;
	display: flex;
	align-items: center;
	box-sizing: border-box;
	max-width: 100%;
	/* Content-sized by default (footer flex rows, compact icon buttons). */
	width: fit-content;
	text-decoration: none;
}

/*
 * In flow/constrained layouts, fill the parent so nested flex justification
 * (center/left/right) and text-align actually have room to work.
 */
.is-layout-constrained > .wp-block-mijnhost-linked-group,
.is-layout-flow > .wp-block-mijnhost-linked-group {
	width: 100%;
}

.mijnhost-linked-group__inner {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	gap: inherit;
	color: inherit;
	width: 100%;
	min-width: 0;
}

.is-layout-constrained > .wp-block-mijnhost-linked-group > .mijnhost-linked-group__inner > *,
.is-layout-flow > .wp-block-mijnhost-linked-group > .mijnhost-linked-group__inner > * {
	width: 100%;
	max-width: 100%;
}

/*
 * Force wrapper text color onto Font Awesome SVG icons / nested text.
 * FA plugin styles often set their own color and ignore inheritance.
 */
.wp-block-mijnhost-linked-group .mijnhost-linked-group__inner,
.wp-block-mijnhost-linked-group .mijnhost-linked-group__inner .wp-block-group,
.wp-block-mijnhost-linked-group .mijnhost-linked-group__inner p,
.wp-block-mijnhost-linked-group .mijnhost-linked-group__inner .wp-block-font-awesome-icon,
.wp-block-mijnhost-linked-group .mijnhost-linked-group__inner .svg-inline--fa {
	color: inherit !important;
}

.wp-block-mijnhost-linked-group .mijnhost-linked-group__inner .svg-inline--fa path {
	fill: currentColor !important;
}

/* Optional hover text color (set via --mijnhost-linked-group-hover-color). */
.wp-block-mijnhost-linked-group.has-hover-color:hover,
.wp-block-mijnhost-linked-group.has-hover-color:focus-within {
	color: var(--mijnhost-linked-group-hover-color) !important;
}

/* Full-area link on top of the group. */
.mijnhost-linked-group__link {
	position: absolute;
	inset: 0;
	z-index: 2;
	border-radius: inherit;
	text-indent: -9999px;
	overflow: hidden;
}

/* Keep any intentional inner links / buttons clickable above the stretch link. */
.mijnhost-linked-group__inner a,
.mijnhost-linked-group__inner button {
	position: relative;
	z-index: 3;
}

.mijnhost-linked-group__link-popover {
	min-width: 280px;
	padding: 8px;
}
