.menu {
	@extend %user-select-none;

	display: none;
	cursor: default;

	header {
		font-weight: bold;
		display: block;
		color: $title-bg;
		font-family: $sans-serif;
	}

	&.flags {
		line-height: 1.75rem;
		min-width: 10rem;
	}

    &.share {
      min-width: 200px;

      input[type="text"] {
        @include calc("width", "100% - 0.375em*6");
        float: left;
      }

      #savePrompt > p {
        @include calc("margin-bottom", "-0.375em");
      }

      header:not(:first-child) {
        @include calc("padding-top", "0.375em*4");
      }

      .public-wrap {
        padding-top: .5rem;
      }

      .share-wrap {
        width: 100%;
      }

      .icon {
        @include calc("padding-top", "0.375em*2");
        @include calc("padding-left", "100% - 0.375em*3");
        @include calc("width", "100% - 0.375em*6");
        cursor: pointer;
      }
    }

	&.save, &.share {
		label {
			display: inline-block;
			margin-top: 0.25em;
		}

		input[type="button"] {
			width: 40%;
			background: $theme-color;
			margin-top: 0.5em;
			font-weight: bold;
			font-family: $sans-serif;
			float: right;
			cursor: pointer;

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

	  	input[type="checkbox"] {
	 	 width: 13px;
	     height: 13px;
	     padding: 0;
	     margin:0;
	     vertical-align: bottom;
	     position: relative;
	     top: -1px;
		}

		.update-button {
		  position: absolute;
		}

		.error-default {
			overflow: hidden;
			float: left;
			padding-top: 0rem;

			height: 0;
			@include vendor-prefix(transition, height $default-transition-duration);
		}

		.error-show {
			@extend .view-show-visible;
			height: 5.65rem;
			padding-top: 0.45rem;
		}

		.sub-header {
			font-size: .75rem;
			color: $grey;
		}
	}

	&.share {
		.success {
			position: absolute;
			top: pxToRem(42px);
		}

		.information-default {
			@extend .view-show;

			overflow: hidden;

			height: 0;
			@include vendor-prefix(transition, height $default-transition-duration);
		}

		.information-show {
			@extend .view-show-visible;
			height: 3rem + $pad;
		}

		#copyTxt {
			@extend input;
			margin-bottom: 0;
			display: inline-block;
		}
	}

	&.save {
		.error-input {
			border-color: $error-color;
			border-width: 1px;
		}

		.error-text {
			color: $error-color;
		}
	}
}
