@use "~admin-stylesheets/colors";

.nab-preview {
	overflow: hidden;
	padding: 0;
	pointer-events: none;
	position: relative;
	text-decoration: none;

	&__image {
		overflow: hidden;

		&--loading {
			display: none;
		}

		&--ready {
			background: colors.$nab-background-light-grey;
			height: 1000%;
			overflow: hidden;
			position: relative;
			transform-origin: top left;
			transform: scale(0.1);
			width: 1000%;
		}
	}

	&__textual-feedback {
		align-items: center;
		background: colors.$nab-background-light-grey;
		color: colors.$nab-text-light-grey;
		display: flex;
		flex-direction: row;
		font-size: 1.5em;
		height: 100%;
		justify-content: center;
		width: 100%;
	}

	.nab-loading-animation {
		max-width: 50%;

		path {
			stroke-width: 0.5px;
			stroke: colors.$nab-text-light-grey;
		}

		&__text {
			font-size: 0.6em;
			margin: 0;
			padding: 0;
		}
	}
}