@import '../utils/variables';
@import '../utils/mixins';

#comet-editorNavBar {
	position: absolute;
	bottom: 10px;
	right: 10px;

	> ul {

		li > button { width: 100%; }

		> #comet-editorNavUpdate > button {
			margin-left: 5px;
			@include border_radius( 5px 0 0 5px );
		}

		> #comet-editorNavOpts > button {
			border-left: 1px solid #167DFA;
			@include border_radius( 0 5px 5px 0 );
		}

		> li {
			display: inline-block;
			vertical-align: middle;
			position: relative;

			> button {
				color: white;
				background: $daAccent;
				height: 30px;
				width: auto;
				border-radius: 5px;
				padding: 0 10px;

				&:hover { background: #167DFA; }
			}
		}

	}

	li{
		> ul {
			position: absolute;
			margin: 0;
			padding: 5px 0;
			bottom: 100%;
			right: 9999em;
			background: white;
			width: 100px;
			@include border_radius( 5px 5px 0 5px );
			@include box_shadow( 0 -3px 3px 0 rgba( 0, 0, 0, .1 ) );

			> li {
				padding: 0;
				margin: 0;
				display: block;
				color: $daAccent;

				> button {
					color: $daAccent;
					margin: 0;
					padding: 5px 0;
				}
			}
		}

		&:hover > ul { right: 0; }

	}

	#comet-editorNavBar .comet-editorNavMenuHasChildren:hover > button {
		background: white;
		color: $daAccent;
		@include border_radius( 0 0 5px 5px );
		@include box_shadow( 0 3px 3px 0 rgba( 0, 0, 0, .1 ) );
	}

}