@use "@db-ui/foundations/build/styles/variables";
@use "../../styles/internal/popover-component";
@use "../../styles/internal/component";

.db-popover {
	position: relative;

	&:is([data-e2e-hover="true"], :hover, :focus-within) {
		> article:not([data-open="false"]) {
			@extend %show-popover;
		}
	}

	> article {
		@extend %popover-center;
		@extend %default-popover;

		@include component.get-data-spacing();

		&[data-open="true"] {
			@extend %show-popover;
		}
	}
}
