@import (reference) '../../styles/variables.less';
@import (reference) '../../styles/mixins.less';

.lucid-DateSelect {
	display: flex;
	align-items: center;
	font-size: @size-font;

	&-InfiniteSlidePanel {
		flex: 1;
		height: 100%;
	}

	.lucid-DateSelect-chevron {
		user-select: none;
	}

	.lucid-DateSelect-slide {
		position: relative;
		display: flex;
		align-items: stretch;

		.lucid-DateSelect-show-divider& {
			&::after {
				position: absolute;
				top: 0;
				right: 0;
				content: '';
				width: 1px;
				height: 100%;
				background-color: @color-gray-10;
			}

			&.lucid-InfiniteSlidePanel-Slide-in-frame {
				&::after {
					right: -1px;
				}
			}
		}

		.lucid-DateSelect-slide-content {
			margin: @size-XS;
			flex: 1;
			display: flex;
			align-items: stretch;

			.lucid-DateSelect-CalendarMonth {
				flex: 1;
				font-size: 100%;
			}
		}
	}
}