@import "@automattic/onboarding/styles/mixins";
@import "@automattic/typography/styles/variables";
@import "@wordpress/base-styles/breakpoints";
@import "@wordpress/base-styles/colors";
@import "@wordpress/base-styles/colors.native";

.transfer-to-other-user__select {
	margin-top: 20px;
	width: 100%;
	@include breakpoint-deprecated( ">480px" ) {
		width: 300px;
	}
}
.transfer-to-other-user__confirmation-dialog {
	width: 90%;

	@include breakpoint-deprecated( ">480px" ) {
		max-width: 500px;
	}
}

.transfer-to-other-user__notice {
	color: var(--color-neutral-40);
	margin: 16px 0;

	.gridicon {
		float: left;
	}
}
.transfer-to-other-user__notice-copy {
	font-size: $font-body-small;
	margin-left: 24px;
}

body.transfer-to-other-user.theme-default.color-scheme {
	--color-surface-backdrop: var(--studio-white);
}

body.transfer-to-other-user {
	.transfer-to-other-user__container {
		.transfer-to-other-user__main {
			margin: 16px;
		}
		@include break-xlarge {
			@include grid-row( 1, 1 );
			@include grid-column( 1, 12 );
			@include display-grid;
			@include grid-template-columns( 12, 24px, 1fr );
			grid-gap: 24px;
			.transfer-to-other-user__main {
				@include grid-column( 1, 8 );
				margin: 0;
			}
		}
	}
}
