@import '../../minerva.less/minerva.variables';

/* stylelint-disable no-descending-specificity */

@menuLinkLineHeight: 24px;

// .menu
#mw-mf-page-left {
	.secondary-action {
		border: 0;
		// T170362 - reset font size
		font-size: 16px;
		position: absolute;
		right: 0;
		top: 0;
		bottom: 0;
		padding-right: 0;
		border-left: 1px solid @grayMediumLight;
	}

	.primary-action {
		// 1px for the logout icon border-left
		margin-right: @iconSize + @iconGutterWidth * 2;
	}

	ul {
		&:first-child {
			li:first-child {
				border-top: 0;
			}
		}

		li {
			background-color: @skinContentBgColor;
			position: relative; // ensure the logout link in beta can be position absolute
			border-top: 1px solid @colorGray14;
			// offset the border for the icon by 1px
			margin-top: -1px;
			font-size: 0.875em;

			&:first-child {
				border-top: 0;
			}

			a {
				color: @colorGray5;
				display: block;
				padding: @menuLinkLineHeight / 2 10px @menuLinkLineHeight / 2 15px;
				// Overflowing text is ellipsized.
				max-width: 100%;
				text-overflow: ellipsis;
				white-space: nowrap;
				overflow: hidden;

				&:hover {
					box-shadow: inset 4px 0 0 0 @colorProgressive;
					text-decoration: none;
				}

				&:visited,
				&:active {
					color: @colorGray5;
				}

				&.mw-ui-icon {
					font-weight: bold;
					line-height: 1.857; // equals `26px` at `font-size: 14px` above

					&:before {
						font-size: 16px;
					}
				}
			}
		}
	}
}