[data-scope='toast'][data-part='root'] {
	@apply w-[400px] rounded-md border border-gray-200 p-6 shadow-md [overflow-wrap:anywhere] translate-x-(--x) translate-y-(--y) scale-(--scale) z-(--z-index) h-(--height) opacity-(--opacity) will-change-[translate,_opacity,_scale];
	transition:
		translate 400ms,
		scale 400ms,
		opacity 400ms;
	transition-timing-function: cubic-bezier(0.21, 1.02, 0.73, 1);
}

[data-scope='toast'][data-part='root'][data-state='closed'] {
	transition:
		translate 400ms,
		scale 400ms,
		opacity 200ms;
	transition-timing-function: cubic-bezier(0.06, 0.71, 0.55, 1);
}

[data-scope='toast'][data-part='root'][data-type='info'] {
	@apply bg-blue-50 hover:bg-blue-100 border-blue-200 text-blue-700 hover:text-blue-700 dark:bg-blue-950 dark:hover:bg-blue-900 dark:border-blue-800 dark:text-blue-300;
}

[data-scope='toast'][data-part='root'][data-type='success'] {
	@apply bg-green-50 hover:bg-green-100 border-green-200 text-green-700 hover:text-green-700 dark:bg-green-950 dark:hover:bg-green-900 dark:border-green-800 dark:text-green-300;
}

[data-scope='toast'][data-part='root'][data-type='warning'] {
	@apply bg-orange-50 hover:bg-orange-100 border-orange-200 text-orange-700 hover:text-orange-700 dark:bg-orange-950 dark:hover:bg-orange-900 dark:border-orange-800 dark:text-orange-300;
}

[data-scope='toast'][data-part='root'][data-type='error'] {
	@apply bg-red-50 hover:bg-red-100 border-red-200 text-red-700 hover:text-red-700 dark:bg-red-950 dark:hover:bg-red-900 dark:border-red-800 dark:text-red-300;
}

[data-scope='toast'][data-part='root'][data-type='loading'] {
	@apply bg-gray-50 hover:bg-gray-100 border-gray-200 text-gray-700 hover:text-gray-700 dark:bg-gray-950 dark:hover:bg-gray-900 dark:border-gray-800 dark:text-gray-300;
}

/* Toast content layout */
[data-scope='toast'][data-part='content'] {
	@apply flex items-start gap-2 flex-1;
}

[data-scope='toast'][data-part='icon'] {
	@apply flex-shrink-0;
	@apply flex items-center justify-center;
	@apply mt-1;
}

[data-scope='toast'][data-part='root'][data-type='loading'] [data-part='icon'] svg {
	animation: spin 1s linear infinite;
}

[data-scope='toast'][data-part='text'] {
	@apply flex-1;
	min-width: 0;
}

[data-scope='toast'][data-part='title'] {
	@apply text-sm font-medium leading-none font-bold;
	@apply leading-none;
	@apply mt-0;
}

[data-scope='toast'][data-part='description'] {
	@apply text-sm opacity-90;
	@apply leading-normal;
	@apply mt-1;
}

[data-scope='toast'][data-part='close-trigger'] {
	@apply flex items-center justify-center absolute top-3 right-3 w-6 h-6 rounded-md bg-transparent border-none cursor-pointer opacity-70 transition-opacity ease-in-out duration-200;
}

[data-scope='toast'][data-part='close-trigger']:hover {
	@apply opacity-100;
}

/* Ghost elements for screen readers */
[data-scope='toast'][data-part='ghost-before'],
[data-scope='toast'][data-part='ghost-after'] {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* ========================== */
/* Controls */
/* ========================== */

[data-scope='toast'][data-part='trigger-group'] {
	@apply flex gap-2 mx-auto;
}

[data-scope='toast'][data-part='trigger'] {
	@apply h-9 w-24 text-xs px-3 has-[>svg]:px-2.5 inline-flex items-center justify-center gap-2 whitespace-nowrap rounded-md font-medium transition-all [&_svg]:size-4 shrink-0 [&_svg]:shrink-0 outline-none focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px] border shadow-xs;
}

[data-scope='toast'][data-part='trigger'][data-type='info'] {
	@apply bg-blue-50 hover:bg-blue-100 border-blue-200 text-blue-700 hover:text-blue-700 dark:bg-blue-950 dark:hover:bg-blue-900 dark:border-blue-800 dark:text-blue-300;
}

[data-scope='toast'][data-part='trigger'][data-type='success'] {
	@apply bg-green-50 hover:bg-green-100 border-green-200 text-green-700 hover:text-green-700 dark:bg-green-950 dark:hover:bg-green-900 dark:border-green-800 dark:text-green-300;
}

[data-scope='toast'][data-part='trigger'][data-type='warning'] {
	@apply bg-orange-50 hover:bg-orange-100 border-orange-200 text-orange-700 hover:text-orange-700 dark:bg-orange-950 dark:hover:bg-orange-900 dark:border-orange-800 dark:text-orange-300;
}

[data-scope='toast'][data-part='trigger'][data-type='error'] {
	@apply bg-red-50 hover:bg-red-100 border-red-200 text-red-700 hover:text-red-700 dark:bg-red-950 dark:hover:bg-red-900 dark:border-red-800 dark:text-red-300;
}

[data-scope='toast'][data-part='trigger'][data-type='loading'] {
	@apply bg-gray-50 hover:bg-gray-100 border-gray-200 text-gray-700 hover:text-gray-700 dark:bg-gray-950 dark:hover:bg-gray-900 dark:border-gray-800 dark:text-gray-300;
}
