/* Infoblokk Controller - Frontend */

.ibc-block{
	position: fixed;
	z-index: var(--ibc-z, 99999);
	pointer-events: none;

	/* Offset logika:
	   Horizontal + = jobbra, - = balra
	   Vertical   + = felfelé, - = lefelé
	   => translateY = -offsetY
	*/
	transform: translate(
		calc(var(--ibc-base-tx, 0px) + var(--ibc-offset-x, 0px)),
		calc(var(--ibc-base-ty, 0px) + (-1 * var(--ibc-offset-y, 0px)))
	);
}

.ibc-inner{
	position: relative;

	/* JS állítja: --ibc-rw = var(--ibc-wd|wt|wm) */
	width: var(--ibc-rw, var(--ibc-wd, 440px));

	min-width: var(--ibc-minw, 0px);
	max-width: var(--ibc-maxw, 99999px);

	transform: scale(var(--ibc-scale, 1));
	transform-origin: var(--ibc-origin, top left);
	transition: transform var(--ibc-shrink-duration, 300ms) ease;
	will-change: transform;
	pointer-events: auto;
}

.ibc-link{
	display: block;
	background: var(--ibc-bg, transparent);
	line-height: 0;
}

.ibc-link img{
	width: 100%;
	height: auto;
	display: block;
}

/* Close button */
.ibc-close{
	position: absolute;
	top: 0;
	right: 0;
	left: auto;

	z-index: calc(var(--ibc-z, 99999) + 1);
	cursor: pointer;
	border: none;

	padding: 2px 8px;
	font-size: 18px;
	line-height: 1.2;
	font-weight: 800;

	color: var(--ibc-close-color, #000);
	background: transparent;
	box-shadow: none;
	pointer-events: auto;

	/* X offset logika:
	   Horizontal + = jobbra, - = balra
	   Vertical   + = felfelé, - = lefelé
	*/
	transform: translate(
		var(--ibc-close-ox, 0px),
		calc(-1 * var(--ibc-close-oy, 0px))
	) scale(var(--ibc-close-scale, 1));

	transform-origin: top right;
}

.ibc-close:focus{
	outline: 2px solid currentColor;
	outline-offset: 2px;
}

.ibc-close-circle .ibc-close{
	background: #fff;
	border-radius: 999px;
	box-shadow: 0 0 3px rgba(0,0,0,1);
}

.ibc-close-plain .ibc-close{
	background: transparent;
	border-radius: 0;
	text-shadow: 0 0 3px rgba(0,0,0,0.35);
}

.ibc-close-tl .ibc-close{
	left: 0;
	right: auto;
	transform-origin: top left;
}

/* Hidden */
.ibc-hidden{ display:none !important; }

/* 8 positions */
.ibc-pos-top_left{
	top: 0;
	left: 0;
	--ibc-origin: top left;
}
.ibc-pos-top_center{
	top: 0;
	left: 50%;
	--ibc-base-tx: -50%;
	--ibc-origin: top center;
}
.ibc-pos-top_right{
	top: 0;
	right: 0;
	--ibc-origin: top right;
}
.ibc-pos-middle_left{
	top: 50%;
	left: 0;
	--ibc-base-ty: -50%;
	--ibc-origin: center left;
}
.ibc-pos-middle_right{
	top: 50%;
	right: 0;
	--ibc-base-ty: -50%;
	--ibc-origin: center right;
}
.ibc-pos-bottom_left{
	bottom: 0;
	left: 0;
	--ibc-origin: bottom left;
}
.ibc-pos-bottom_center{
	bottom: 0;
	left: 50%;
	--ibc-base-tx: -50%;
	--ibc-origin: bottom center;
}
.ibc-pos-bottom_right{
	bottom: 0;
	right: 0;
	--ibc-origin: bottom right;
}
