/* Widgets - Popup */
////
/// @group Widgets-Popup
/// Widgets - Popup

///
[data-popup] {
	// Service Studio Preview
	& {
		-servicestudio-top: 0;
	}
}

///
[data-popup-backdrop] {
	z-index: var(--osui-popup-layer);
}

///
.popup {
	&-backdrop {
		background-color: get-background-color('overlay');
	}

	&-dialog {
		border: 0;
		border-radius: var(--border-radius-soft);
		box-shadow: var(--shadow-xl);
		margin: var(--space-m);
		max-height: calc(100% - var(--space-xl));
		max-width: 500px;
		overflow: visible;
		padding: var(--space-m);
		width: 100%;

		// Service Studio Preview
		& {
			-servicestudio-margin: auto;
			-servicestudio-overflow: hidden;
		}
	}
}

///
.layout-native {
	.popup {
		&-backdrop,
		&-dialog {
			padding: var(--space-base);
		}
	}
}

// OS HighContrast Enabled -------------------------------------------------------
///
.os-high-contrast {
	.popup-dialog {
		border: var(--border-size-s) solid get-border-color('neutral-0');
		border-radius: var(--border-radius-soft);
	}
}