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

.last-modified-bar {
	display: block;
	border-bottom: @border-subtle;
	background-color: var( --background-color-interactive );
	color: var( --color-subtle );
	padding-top: @icon-padding-medium;
	padding-bottom: @icon-padding-medium;
	font-size: @font-size-minerva-small;
	transition-property: background-color, color;
	transition-duration: @transition-duration-medium;

	// .last-modified-bar is itself a link.
	&:visited,
	a,
	a:visited,
	.last-modified-text-accent {
		// Note: This can be progressively enhanced in skins.minerva.scripts to provide 'recently edited' state.
		color: var( --color-subtle );
	}

	.minerva-icon {
		background-color: var( --color-subtle );
	}
}

.last-modified-bar__content {
	align-items: center;
	.flex-display();
}

.last-modified-bar__text {
	@end-padding: @width-icon-gutter + @width-icon-gutter + @size-icon;
	padding-right: @end-padding;
	padding-left: @icon-padding-medium;
	line-height: @line-height-content;
	vertical-align: middle;
	flex-grow: 1;
	.text-overflow( @visible: false );
}

@media ( max-width: @width-breakpoint-tablet ) {
	.last-modified-bar__text {
		padding-right: 1em;
	}
}