@use '@lucca-front/scss/src/components/calloutFeedbackList/exports' as calloutFeedbackList;
@use '@lucca-front/icons/src/icon/exports' as icon;

@mixin S {
	font: var(--pr-t-font-body-S);
	padding: var(--pr-t-spacings-75);

	.calloutPopover-icon {
		@include icon.S;
	}
}

@mixin XS {
	font: var(--pr-t-font-body-XS);
	padding-block: var(--pr-t-spacings-25);
	padding-inline: var(--pr-t-spacings-50);
	gap: var(--pr-t-spacings-50);
	border-radius: var(--pr-t-border-radius-small);

	.calloutPopover-icon {
		@include icon.XS;
	}
}

@mixin overlayS {
	--components-calloutPopover-width: 20rem;

	.calloutPopover-overlay-icon {
		@include icon.S;
	}

	.calloutPopover-overlay-head-title {
		font: var(--pr-t-font-body-S);
		font-weight: var(--pr-t-font-fontWeight-semibold);
	}

	.calloutFeedbackList {
		@include calloutFeedbackList.S;
	}
}

@mixin overlayIconless {
	.calloutPopover-overlay-icon {
		display: none;
	}
}