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

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

	.mco-destination-wrapper {
		.mat-mdc-list-base.mat-mdc-list-base .mdc-list-item--activated .mdc-list-item__primary-text {
			color: mat.get-color-from-palette($foreground, text) !important;
		}

		&.mat-button-disabled {
			color: mat.get-color-from-palette($foreground, disabled-button) !important;
		}
	}

	.mco-destination-wrapper .margin--right---small {
		&:not(.isDisabled) {
			color: mat.get-color-from-palette($primary-palette) !important;
		}
	}
}

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

	.mco-destination-wrapper {
		padding: 0px global.$spacing 0px 0px !important;
		a {
			display: flex !important;

			.column {
				display: flex !important;
				flex-direction: column;
				justify-content: center;
				min-width: global.$spacing * 15.5;
				p {
					margin: 0 !important;
				}
			}

			.mat-mdc-list-item-meta {
				display: flex !important;
				align-items: center;
				text-transform: uppercase;
			}
		}

		&.non-clickable {
			pointer-events: none;
		}
	}
}