/* Popup.css */
.moon-popup {
	position: absolute;
	bottom: 0;
	width: 100%;
	padding: @moon-popup-padding;
	box-sizing: border-box;
	overflow: hidden;
	-webkit-transform: translateY(100%) translateZ(0);
	transform: translateY(100%) translateZ(0);
	-webkit-transition: -webkit-transform 0.0001s ease;
	transition: transform 0.0001s ease;

	&.animate {
		-webkit-transition: -webkit-transform 0.4s ease;
		transition: transform 0.4s ease;
	}

	&.showing {
		-webkit-transform: translateY(0) translateZ(0);
		transform: translateY(0) translateZ(0);
	}

	&.reserve-close {
		padding-right: @moon-spotlight-outset + @moon-icon-button-small-size + @moon-spotlight-outset;
	}
}

.moon-popup-close {
	right: @moon-spotlight-outset;
	top: @moon-spotlight-outset;

	&.moon-icon {
		position: absolute;
	}

	&.moon-icon-button {
		margin: 0;
	}
}

.enyo-locale-right-to-left {
	.moon-popup {
		&.reserve-close {
			padding-right: @moon-spotlight-outset * 4;
			padding-left: @moon-icon-button-small-size + @moon-spotlight-outset;
		}
	}

	.moon-popup-close {
		right: auto;
		left: @moon-spotlight-outset;
	}
}
