/* ── ITC Image Box ───────────────────────────────────────────────────────── */

.itc-imgbox-wrap {
	display: block;
	line-height: 0;
}
.itc-imgbox-wrap--left   { text-align: left; }
.itc-imgbox-wrap--center { text-align: center; }
.itc-imgbox-wrap--right  { text-align: right; }

.itc-imgbox {
	box-sizing: border-box;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--itcib-size, 40px);
	height: var(--itcib-size, 40px);
	padding: var(--itcib-pad, 0);
	border-radius: var(--itcib-radius, 0);
	background-color: var(--itcib-bg, transparent);
	overflow: hidden;
	vertical-align: middle;
	line-height: 0;
	transition:
		background-color var(--itcib-dur, 250ms) ease,
		border-color var(--itcib-dur, 250ms) ease;
}

/* ── Border / no border ──────────────────────────────────────────────────── */

.itc-imgbox--border {
	border: var(--itcib-bw, 1px) solid var(--itcib-bc, currentColor);
}
.itc-imgbox--borderless {
	border: 0;
}

/* ── Image (high specificity to beat Salient/theme img rules) ────────────── */

.itc-imgbox-wrap .itc-imgbox .itc-imgbox__img {
	display: block;
	width: 100% !important;
	height: 100% !important;
	max-width: 100% !important;
	margin: 0 !important;
	padding: 0;
	border: 0;
	box-shadow: none;
	object-fit: var(--itcib-fit, contain);
}

/* Cover + round/rounded: clip the image to the same shape */
.itc-imgbox--fit-cover .itc-imgbox__img {
	border-radius: inherit;
}

/* ── Hover colors ────────────────────────────────────────────────────────── */

.itc-imgbox:hover {
	background-color: var(--itcib-bg-h, var(--itcib-bg, transparent));
}
.itc-imgbox--border:hover {
	border-color: var(--itcib-bc-h, var(--itcib-bc, currentColor));
}

@media ( prefers-reduced-motion: reduce ) {
	.itc-imgbox {
		transition: none !important;
	}
}