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

@mixin override-color($theme) {
	$-theme: map.get($theme, theme);
	$color-config: mat.get-color-config($theme);
	$warn-palette: map.get($color-config, "warn");

	.mf-itinerary {
		&.has-disturbance {
			&::after {
				// Icon are available from m-ui
				background-image: url("/assets/icons/ic_perturb_" + $-theme + ".svg");
			}

			&.disturbance-4 {
				&::after {
					// Icon are available from m-ui
					background-image: url("/assets/icons/ic_hors_service_" + $-theme + ".svg");
				}
			}
		}
	}

	.nsv-avg-label {
		span:not(.normal) {
			color: map.get($warn-palette, default);
		}
	}
}

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

	m-icons{
		overflow: unset;
	}

	.mf-itinerary {
		&.has-disturbance {
			&::after {
				top: -6px;
				right: -6px;
			}
		}
	}


	.mf-itinerary {
		&.has-disturbance {
			position: relative;

			&::after {
				content: "";
				position: absolute;
				width: 16px;
				height: 16px;
				background-size: contain;
				z-index: 1;
			}

			&.disturbance-position-outer::after {
				top: math.div(global.$spacing, -2);
				right: math.div(global.$spacing, -2);
			}
		}

		.disturbance-4 {
			m-logo-lines {
				opacity: 0.54;
			}
		}
	}
}