@use "sass:map";
@use "sass:math";
@use "@angular/material" as mat;
@use "@metromobilite/m-ui/theme/global";


@mixin override-color($theme) {
}

@mixin override-theme($theme) {
	$color-config: mat.get-color-config($theme);
	@if $color-config != null {
		@include override-color($theme);
	}

	.realtime-data {
		position: relative;
		display: block;

		.mat-progress-bar {
			position: absolute;
			width: 100%;
			z-index: 3;
		}

		.time-wrapper {
			display: flex;
			align-items: center;
			text-align: center;

			> span > span {
				width: 42px;
			}

			@media screen and (min-width: 321px) {
				> span {
					padding: 0 global.$spacing;
				}
			}
		}

		.time-value-wrapper {
			position: relative;
			font-weight: bold;
			line-height: global.$header-fz-big;

			.hourLine {
				font-size: math.div(global.$header-fz-big, 1.5);
			}

			+ span {
				font-size: math.div(global.$header-fz-big, 2);
				line-height: math.div(global.$header-fz-big, 2);
				font-weight: normal;
			}
		}

		.time-spacing {
			padding: 0 math.div(global.$spacing, 2);
			position: relative;
			margin-left: 14px;

			font-size: global.$header-fz-big - 0.8rem;

			+ span {
				font-size: global.$header-fz-big - 1rem;
			}

			.real-time {
				top: 7px;
				left: -4px;
			}
		}

		.real-time {
			top: 5px;
			left: 1px;
		}

		mf-realtime-icon {
			width: 12px;
			height: 12px;
			position: absolute;
			top: -5px;
			left: 12px;
			transform: translate(-50%, -50%) rotate(45deg);
		}

		.mat-list-item {
			min-width: 0;
			position: relative;

			.small-icon {
				height: global.$default-fz;
				width: global.$default-fz;
				line-height: global.$default-fz;
				font-size: global.$default-fz;
				margin-right: global.$spacing;
			}
		}

		.item-name {
			font-size: global.$default-fz;
			line-height: normal;
		}

		mf-logo-ligne {
			position: relative;
			z-index: 0;
		}

		ul {
			margin: 0;
			padding: 0;

			&.grouped {
				padding: 0 global.$spacing * 2;

				li {
					padding: math.div(global.$spacing, 2) 0;
				}
			}

			li {
				list-style: none;
			}
		}

		p {
			margin: 0;
			padding: 0;
		}
	}
}