/* Produktinformation-Tooltip – v1.00.1 */

.product-info-trigger {
	position: relative;
	overflow: visible;
}

.product-info-trigger .elementor-button {
	cursor: help;
}

/* Ohne Mini-Beschreibung: ausgegraut, ohne Interaktion */
.product-info-trigger.pi-empty .elementor-button {
	opacity: .3;
	cursor: default;
	pointer-events: none;
}

.pi-tip {
	position: absolute;
	z-index: 50;
	left: var(--pi-left, auto);
	right: var(--pi-right, -0.5rem);
	bottom: calc(100% + 0.25rem);
	width: 17.5rem;
	max-width: calc(100vw - 1.5rem);
	padding-bottom: 12px;
	font-size: 0.9375rem;
	font-weight: 400;
	line-height: 1.5;
	color: #1b1c1c;
	text-align: left;
	opacity: 0;
	visibility: hidden;
	transform: translateY(0.375rem);
	transition: opacity .2s ease, transform .2s ease, visibility .2s;
	pointer-events: none;
}

/* Milchglas-Fläche; Form (Box + Pfeil) kommt per JS als SVG-Maske */
.pi-glass {
	position: absolute;
	inset: 0;
	background: rgba(255, 255, 255, .78);
	-webkit-backdrop-filter: blur(14px) saturate(160%);
	backdrop-filter: blur(14px) saturate(160%);
}

.pi-tip.pi-ready .pi-glass {
	-webkit-mask: var(--pi-shape) no-repeat 0 0 / 100% 100%;
	mask: var(--pi-shape) no-repeat 0 0 / 100% 100%;
}

/* Schatten nur außerhalb der Form (Innenfläche ausgestanzt) */
.pi-shadow {
	display: none;
	position: absolute;
	inset: -40px;
	filter: drop-shadow(0 1px 1px rgba(0, 0, 0, .05)) drop-shadow(0 6px 10px rgba(0, 0, 0, .08)) drop-shadow(0 16px 24px rgba(0, 0, 0, .10));
}

.pi-tip.pi-ready .pi-shadow {
	display: block;
	-webkit-mask: var(--pi-hole) no-repeat 0 0 / 100% 100%;
	mask: var(--pi-hole) no-repeat 0 0 / 100% 100%;
}

.pi-shadow::before {
	content: "";
	position: absolute;
	inset: 40px;
	background: #000;
	-webkit-mask: var(--pi-shape) no-repeat 0 0 / 100% 100%;
	mask: var(--pi-shape) no-repeat 0 0 / 100% 100%;
}

/* Fallback, solange JS die Form noch nicht berechnet hat */
.pi-tip:not(.pi-ready) .pi-glass {
	bottom: 12px;
	border-radius: 1.25rem;
	box-shadow: 0 12px 44px -16px rgba(0, 0, 0, .22);
}

.pi-body {
	position: relative;
	padding: 1rem 1.125rem;
}

.product-info-trigger .pi-tip .pi-title {
	display: block;
	margin-bottom: 0.3125rem;
	font-size: 1.125rem;
	font-weight: 700;
}

/* Selektor bewusst stärker, Theme setzt sonst margin-bottom am <p> */
.product-info-trigger .pi-tip .pi-text p {
	margin: 0;
}

.product-info-trigger .pi-tip .pi-text p + p {
	margin-top: 0.5rem;
}

/* Einblenden: Hover (nur echte Maus), Tastaturfokus, Tap */
@media (hover: hover) {
	.product-info-trigger:hover .pi-tip {
		opacity: 1;
		visibility: visible;
		transform: none;
	}
}

.product-info-trigger:has(.elementor-button:focus-visible) .pi-tip,
.pi-tip.pi-open {
	opacity: 1;
	visibility: visible;
	transform: none;
}

/* Aktives Produkt über die Nachbarkarten heben */
.e-loop-item:has(.pi-tip.pi-open),
.e-loop-item:has(.elementor-button:focus-visible) {
	position: relative;
	z-index: 20 !important;
}

@media (hover: hover) {
	.e-loop-item:has(.product-info-trigger:hover) {
		position: relative;
		z-index: 20 !important;
	}
}

/* Smartphone: Icon neben 1. Zeile des Produktnamens, Box kompakter */
@media (max-width: 767px) {
	.e-con:has(> .product-info-trigger) {
		align-items: flex-start;
	}

	.e-con:has(> .product-info-trigger) > .elementor-widget-woocommerce-product-title {
		width: calc(100% - 2rem) !important;
		max-width: calc(100% - 2rem) !important;
	}

	.product-info-trigger {
		width: auto !important;
		margin-left: auto !important;
	}

	.product-info-trigger .elementor-button-icon {
		display: inline-flex !important;
	}

	.pi-tip {
		width: 15rem;
	}
}