@import '../variables';
@import '../mixins';
@import '../include-media';

.sugar-calendar-block__popover__display_selector {
	@include popover;
	min-width: 96px;

	&__container {
		@include popover-container;

		align-items: flex-start;
		align-self: stretch;
		display: flex;
		flex-direction: column;

		&__body {
			padding: 6px 0;
			width: 100%;
		}

		&__body__option {
			align-items: center;
			align-self: stretch;
			color: $text-color-primary;
			cursor: pointer;
			font-size: 13px;
			font-style: normal;
			font-weight: 400;
			display: flex;
			gap: 10px;
			line-height: normal;
			padding: 6px 15px;

			&:hover {
				background: $border-hover-color;
			}
		}
	}
}
