@use "sass:map";
@use "@angular/material" as mat;
@use "../global/index" as global;
@use "../themes/index" as themes;

$spacing: global.$spacing !default;

@mixin override-color($theme) {
	$color-config: mat.get-color-config($theme);

	.mat-mdc-dialog-container .mdc-dialog__content {
		color: map.get(map.get($color-config, "foreground"), text);
	}

	@if map.get($theme, theme) == "dark" {
		&.dark-theme {
			.cdk-overlay-pane {
				.mat-mdc-dialog-container .mdc-dialog__surface {
					background: themes.dark-color-overlay(0);
					border: 1px solid map.get(map.get($color-config, foreground), divider);

					.mdc-icon-button[mat-dialog-close] {
						color: map.get(map.get($color-config, "foreground"), text);
					}
				}
			}

			.cdk-overlay-backdrop {
				background: rgba(black, 0.7);
			}
		}
	}
}

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

	.cdk-overlay-pane {
		.mat-mdc-dialog-actions {
			&.align-right {
				justify-content: flex-end;
			}
		}
	}
}