/* --- Company field --- */
.company-field-container {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

legend {
	color: var(--white);
	margin-bottom: 4px;
	border-bottom: 0px;
}

.company-field-container label {
	background-color: var(--white);
	color: var(--neutral-900-legacy);
	padding: 24px;
	border-radius: 5px;
	position: relative;
	cursor: pointer;
}
.company-field-container label::after {
	position: absolute;
	top: 0;
	right: 0;
	content: '';
	display: block;
	width: 0;
	height: 0;
	border-left: 180px solid transparent;
	border-top: 100px solid var(--fadedBlue);
	border-top-right-radius: 5px;
}

.company-field-container input[type='radio'] {
	position: absolute;
	top: 16px;
	right: 16px;
	z-index: 1;
	transform: scale(1.5);
}

.company-field-container img {
	margin-bottom: 20px;
}

.company-field-container h3 {
	margin-bottom: 8px;
	font-size: 20px;
}

.company-field-container p {
	margin-bottom: 0;
}

/* --- Company Subfields --- */
.interested-in-container .selectize-input,
.company-subfields-container .selectize-input {
	border: none;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	min-height: 48px;
}

/* targets the selected options */
.interested-in-container .selectize-input div[data-value],
.company-subfields-container .selectize-input div[data-value] {
	margin: 0px;
	padding: 4px;
	color: var(--white) !important;
	background-color: var(--neutral-900-legacy) !important;
	background-image: none !important;
	border: none;
}

/* targets the remove buttons */
.interested-in-container .selectize-input div[data-value] .remove,
.company-subfields-container .selectize-input div[data-value] .remove {
	font-size: 16px;
	padding-block: 4px;
}

.interested-in-container .selectize-control.plugin-remove_button [data-value],
.company-subfields-container .selectize-control.plugin-remove_button [data-value] {
	font-size: 14px;
	padding-block: 4px;
	padding-inline: 8px;
}

/* --- Phone number --- */
.phone-number-container {
	display: flex;
}

.phone-number-container .selectize-control.single .selectize-input:after {
	border-color: #bac0cd transparent transparent transparent;
}

.phone-number-container .selectize-input {
	height: 46px;
	width: 120px;
	border-radius: 5px 0 0 5px;
	border: none;
	border-right: 1px solid #bac0cd;
}

.phone-number-container .selectize-input #id_country-selectized {
	font-size: 16px;
}

/* targets the div which contains the flag and the country name */
.phone-number-container .selectize-input > div[data-value] {
	font-size: 16px;
	color: var(--black);
	font-family: 'Gilroy';
	font-weight: 500;
}

.phone-number-container .selectize-input .fflag {
	margin-right: 8px;
}

/* targets the span which contains the country name */
.phone-number-container .selectize-input > div[data-value] span {
	vertical-align: middle;
}

.phone-number-container input[name='phone'] {
	height: 46px;
	border-radius: 0 5px 5px 0;
	flex: 1;
}

/* --- Company info container --- */
.company-info-container {
	display: flex;
	flex-direction: column;
	gap: 24px;
}

.company-name-container input {
	width: 100%;
}

.company-info-container > div {
	flex: 1;
}

.company-info-container label {
	display: block;
}

/* --- Submit button --- */
button[type='submit'] {
	margin-left: auto;
	margin-top: 24px;
	padding: 16px 30px;
	font-size: 16px;
}

@media screen and (min-width: 600px) {
	.company-field-container {
		flex-direction: row;
	}
}

@media screen and (min-width: 768px) {
	.password-container button {
		top: 32px;
	}

	.interested-in-container .selectize-input,
	.company-subfields-container .selectize-input {
		min-height: 60px;
	}

	.phone-number-container .selectize-input {
		height: 60px;
		width: 140px;
		padding-block: 18px !important;
	}

	.phone-number-container .selectize-input > div[data-value] {
		font-size: 20px;
	}

	.phone-number-container input[name='phone'] {
		height: 60px;
	}

	.company-info-container {
		flex-direction: row;
	}
}
