// .user-registration,
// .user-registration-page,
// .ur-multi-device-form-preview {
.user-registration-account,
[class*="user-registration-membership_page_"],
.ur-multi-device-form-preview {
	select {
		min-height: 38px;
		width: 100%;
		min-width: auto !important;
		max-width: unset;
		padding: 0 $spacing_12px;
		-webkit-appearance: none;
		-moz-appearance: none;
		background: transparent;
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23737373' viewBox='0 0 24 24'%3E%3Cpath d='M19.561 7.403a1.468 1.468 0 0 1 2.02 0 1.339 1.339 0 0 1 0 1.944l-8.57 8.25a1.468 1.468 0 0 1-2.021 0l-8.572-8.25a1.339 1.339 0 0 1 0-1.944 1.468 1.468 0 0 1 2.02 0L12 14.68l7.561-7.278Z'/%3E%3C/svg%3E");
		background-repeat: no-repeat;
		background-position: right 12px center;
		background-size: 14px 14px;
		cursor: pointer;
		color: $grey-400;
		margin: 0;
		border: $border_width solid $border_color;
		border-radius: $border_radius_4;
		background-color: $white;

		@media screen and (max-width: 782px) {
			font-size: 14px;
		}

		&:hover {
			color: $grey-400;
			border-color: #e1e1e1;
		}

		&:focus {
			outline: none;
			box-shadow: none;
			border-color: $primary_color;
		}

		&#bulk-action-selector-top,
		&#bulk-action-selector-bottom {
			width: 220px;
		}
	}

	.select2 {
		&-container {
			width: 100% !important;

			&--open,
			&--focus {
				.select2-selection {
					border-color: $primary_color !important;
				}
			}

			&--default {
				.select2-selection {
					&--single,
					&--multiple {
						min-height: 38px;
						padding: 0;
						border: $border_width solid $border-color;

						&:has(.select2-selection__arrow) {
							.select2-selection__rendered {
								padding-right: $spacing_32px;
							}
						}

						.select2-selection__rendered {
							padding: 0 $spacing_12px;
							display: block;
							font-size: 14px;
							line-height: 36px;

							.select2-selection__clear {
								font-size: 16px;
								top: -1px;
							}
						}

						.select2-selection__arrow {
							top: 50%;
							right: 6px;
							transform: translateY(-50%);
							height: unset;
							position: absolute;
							width: 20px;

							b {
								all: unset;
								background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23737373' viewBox='0 0 24 24'%3E%3Cpath d='M19.561 7.403a1.468 1.468 0 0 1 2.02 0 1.339 1.339 0 0 1 0 1.944l-8.57 8.25a1.468 1.468 0 0 1-2.021 0l-8.572-8.25a1.339 1.339 0 0 1 0-1.944 1.468 1.468 0 0 1 2.02 0L12 14.68l7.561-7.278Z'/%3E%3C/svg%3E");
								background-repeat: no-repeat;
								background-position: center;
								background-size: 100%;
								width: 14px;
								height: 14px;
								display: block;
							}
						}
					}

					&--multiple {
						min-height: 38px;

						.select2-selection__choice {
							display: flex;
							align-items: center;
							gap: $spacing_4px;
							padding: 0 $spacing_8px;
							// margin: 3px 3px 3px 0;
							margin: 4px 13px 4px -8px;
							max-height: 30px;
							background: #f4f4f4;
							border-color: $border-color;
							font-size: 14px;
							line-height: 28px;
							color: #383838;

							// &:nth-child(1) {
							//     margin-left: -9px;
							// }

							&__remove {
								color: #999;
								cursor: pointer;
								display: inline-block;
								font-weight: 700;
								margin-right: 2px;
								line-height: 16px;
							}
						}

						.select2-search {
							margin-bottom: 0;

							&__field {
								margin: 0;
								width: 100% !important;
							}
						}
					}
				}
			}

			&--disabled {
				.select2-selection {
					opacity: 0.6;
					pointer-events: none;
					background: #f6f7f7;
				}
			}

			.select2-dropdown {
				position: relative;
				padding-top: $spacing_4px;

				> .button {
					&.ur-select-all-countries-button {
						float: right;
						margin-left: $spacing_4px;
						margin-right: $spacing_4px;
					}

					&.ur-unselect-all-countries-button {
						margin-left: auto;
					}
				}
			}
		}
	}

	> .select2-container {
		width: auto !important;
	}
}

body.user-registration {
	.select2 {
		&-container {
			&:has(.urcr-editor-select2-dropdown) {
				max-width: 200px;
			}

			.select2-dropdown {
				&.urcr-editor-select2-dropdown {
					width: 100% !important;
					border: 1px solid #e1e1e1;
					border-radius: 4px;
					padding: 0;
					font-family:
						-apple-system, BlinkMacSystemFont, "Inter", "Segoe UI",
						Roboto, Oxygen-Sans, Ubuntu, Cantarell,
						"Helvetica Neue", sans-serif;

					.ur-select2-title {
						padding: 0;
						width: 100%;
						border-radius: 4px 4px 0 0;
						overflow: hidden;

						> p {
							padding: 6px 12px;
						}
					}

					.select2-search {
						width: 100% !important;
						box-sizing: border-box;
						padding: 10px 8px;

						.search-icon {
							top: 20px !important;
							left: 17px !important;
						}

						&__field {
							height: 36px;
							min-height: 36px;
							padding-right: 12px !important;
							border-color: #e1e1e1;

							&:focus {
								border-color: #475bb2;
							}
						}
					}

					.select2-results {
						padding: 0 8px 8px;

						&__options {
							border-top: 0 !important;
						}

						&__option {
							font-family: inherit;
							border-radius: 4px;
							padding: 8px 12px;
							font-size: 13px;
							line-height: 19px;

							&:focus {
								outline: none;
								box-shadow: none;
								border: 0;
							}

							&:hover,
							&--highlighted {
								background: #f8f8fa !important;
								color: $primary_color !important;
							}
						}
					}
				}
			}
		}
	}
}