[data-theme="light"] .callout {
	border-left-color: var(--callout-color-light);
}

[data-theme="light"] .callout-title {
	color: var(--callout-color-light);
}

.callout {
	border-left-color: var(--callout-color-dark);
}

.callout-title {
	color: var(--callout-color-dark);
}

.callout {
	width: 100%;
	padding: 0.5rem 1rem;
	border-left-width: 0.25em;
	border-left-style: solid;
	margin-bottom: 1rem;
}

.callout-title {
	display: flex;
	align-items: flex-start;
	gap: 8px;

	line-height: 1;
	font-weight: 500;
}

.callout-icon svg {
	overflow: visible !important;
	display: inline-block;

	vertical-align: text-bottom;

	fill: currentColor;
}

.callout-content > :first-child {
	margin-top: 1rem;
}

.callout-content > :last-child {
	margin-bottom: 0;
}

.callout-collapsible .callout-title {
	cursor: pointer;
}

.callout-collapsible .callout-fold {
	display: flex;
	align-items: center;
	padding-inline-end: 8px;
}

.callout-collapsible > .callout-title .callout-fold svg {
	transform: rotate(-90deg);
	transition: transform 100ms ease-in-out;
}

.callout-collapsible[open] > .callout-title .callout-fold svg {
	transform: none;
}

.callout-fold {
	margin-left: -2px;
}
