@import "variables.less";
@import "mixins.less";

#wpadminbar {

	#wp-admin-bar-laps {

		.ab-sub-wrapper {
			min-width: 90%;
			width: 90%;
			position: fixed;
			left: 5%;
		}

		.ab-submenu {
			padding: 0;
		}
	}

	#wp-admin-bar-laps_output {

		padding: 0 10px;

		&:hover {
			background-color: transparent;
		}

		.ab-empty-item {
			display: none;
		}
	}

	.laps-timeline {
		overflow: hidden;
		height: 20px;
		margin: 6px 0;
		background-color: @timeline-bg;
		border-radius: 4px;
		.box-shadow(inset 0 1px 2px rgba(0,0,0,.1));
	}

	.laps-timeline .event {
		float: left;
		width: 0%;
		height: 20px;
		font-size: @font-size-small;
		color: #fff;
		text-align: center;
		background-color: @event-info-color;
		.box-shadow(inset 0 -1px 0 rgba(0, 0, 0, .15));
		.transition(width .6s ease);
		position: absolute; // disable stacking at start
		border-left: 1px solid @timeline-bg;
	}

	.laps-timeline .event-theme {
		background-color: @event-theme-color;
	}

	.laps-timeline .event-plugin {
		background-color: @event-plugin-color;
	}

	.laps-timeline .event-core {
		background-color: @event-core-color;
	}

	.laps-timeline .event-query {
		background-color: @event-info-color;
	}

	.laps-timeline .event-http {
		background-color: @event-warning-color;
	}

	@import "tooltip.less";

	.tooltip.in {
		.opacity(1);
	}

	.tooltip-inner {
		line-height: 20px;
		text-align: left;
	}
}