@use '@lucca-front/icons/src/icon/exports' as icons;
@use '@lucca-front/scss/src/commons/utils/color';
@use '@lucca-front/scss/src/commons/utils/a11y';
@use '@lucca-front/scss/src/components/button/exports' as button;

@mixin S {
	--components-callout-padding: var(--pr-t-spacings-75) var(--pr-t-spacings-100);
	--components-callout-gap: var(--pr-t-spacings-100);
	--components-callout-font: var(--pr-t-font-body-S);
	--components-callout-kill-size: 1.25rem;

	.callout-icon {
		@include icons.S;
	}

	.callout-content-description-actions {
		.button {
			@include button.XS;
		}
	}

	// Deprecated
	--components-callout-fontSize: var(--pr-t-font-body-S-fontSize);
	--components-callout-lineHeight: var(--pr-t-font-body-S-lineHeight);
}

@mixin tiny {
	--components-callout-gap: var(--pr-t-spacings-75);
	--components-callout-display: inline-flex;
	--components-callout-padding: var(--pr-t-spacings-100);
}

@mixin AI {
	--components-callout-boxShadow: var(--pr-t-elevation-shadow-button);
	--components-callout-backgroundColor: var(--pr-t-elevation-surface-raised);

	@include color.borderGradient(135deg, var(--palettes-brand-400), var(--palettes-AI-500));

	.callout-icon {
		.lucca-icon {
			@include icons.AI;
		}
	}
}

@mixin actions {
	.button {
		@include color.palette('neutral');
		@include button.S;

		&.mod-outlined,
		&.mod-ghost {
			&:focus-visible {
				@include a11y.focusVisible($offset: 3px, $color: var(--palettes-product-700));
			}
		}

		&.mod-onlyIcon {
			@include button.onlyIconS;
		}
	}
}

@mixin actionsInline {
	--components-callout-content-description-display: flex;
	--components-callout-content-description-action-marginBlockStart: 0;
	--components-callout-content-description-action-paddingBlock: 0;

	.button {
		@include button.XS;

		&.mod-onlyIcon {
			@include button.onlyIconXS;
		}
	}
}

@mixin actionsInlineS {
	--components-callout-content-description-action-marginBlockStart: calc(var(--pr-t-spacings-25) * -1);
	--components-callout-content-description-action-marginBlockEnd: calc(var(--pr-t-spacings-25) * -1);
}