@import '../echo.variables';
@import '../echo.variables.monobook';

/* We have to include the #pt-notifications selector due to monobook */
.mw-echo-notifications-badge {
	#pt-notifications-notice &,
	#pt-notifications-alert & {
		width: 16px;
		height: 16px;
		top: -3px;

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

		&:after {
			top: 5px;
		}
	}

	&.oo-ui-flaggedElement-unseen,
	&.mw-echo-unseen-notifications {
		#pt-notifications-alert &:after {
			background-color: @badge-counter-background-unseen-alert;
			color: #000;
		}

		#pt-notifications-notice &:after {
			background-color: @badge-counter-background-unseen-message;
			color: #000;
		}
	}
}

#p-personal #pt-notifications-alert,
#p-personal #pt-notifications-notice {
	display: inline-block;
}