@import 'mediawiki.skin.variables.less';
@import 'mediawiki.mixins.less';

@font-size-description: 12px;
@line-height-description: 1.2;

.ext-templatedata-search {
	// Max width to match .oo-ui-actionFieldLayout.oo-ui-fieldLayout-align-top
	max-width: 50em;

	.ext-templatedata-search-description,
	.ext-templatedata-search-redirectedfrom {
		color: @color-subtle;
		display: block;
		font-size: @font-size-description;
		line-height: @line-height-description;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	.ext-templatedata-search-description {
		@max-lines: 2;
		display: -webkit-box;
		max-height: @max-lines * unit( @line-height-description, em );
		-webkit-line-clamp: @max-lines;
		-webkit-box-orient: vertical;
	}

	.ext-templatedata-search-redirectedfrom {
		display: block;
		font-style: italic;
		white-space: nowrap;
	}

	.ext-templatedata-TemplateMenuItem {
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;

		.oo-ui-buttonElement-button {
			padding: 0;
		}
	}

	.oo-ui-comboBoxInputWidget .oo-ui-iconElement-icon {
		// HACK: This should be fixed in OOUI; the icon is behind
		// the input rather than in front
		z-index: 1;
	}

	// Remove border and background from favorite buttons within the search results. T390018.
	.oo-ui-textInputWidget.oo-ui-widget-enabled:hover .oo-ui-menuSelectWidget .oo-ui-inputWidget-input {
		border-color: transparent;
		background: none;
	}

	.oo-ui-indexLayout-stackLayout > .oo-ui-panelLayout {
		padding: 0;
	}

	.ext-templatedata-TemplateList-tabIcon {
		margin-bottom: @spacing-35;
	}

	.ext-templatedata-TemplateList-empty {
		color: @color-subtle;
	}

	.ext-templatedata-TemplateMenuItem-removed {
		opacity: 0.5;
		text-decoration: line-through;
	}
}