/* ==========================================================================
   Detec WP CRM Connector — Front-end form styles
   ========================================================================== */

.detec-crm-connector-form-wrap {
	max-width: 560px;
}

/* Notices ----------------------------------------------------------------- */

.detec-crm-connector-notice {
	padding: .75em 1em;
	margin-bottom: 1.25em;
	border-left: 4px solid transparent;
	border-radius: 3px;
	font-size: .95em;
}

.detec-crm-connector-notice--success {
	background: #edfaed;
	border-color: #2e7d32;
	color: #1b5e20;
}

.detec-crm-connector-notice--error {
	background: #fdecea;
	border-color: #c62828;
	color: #7f0000;
}

/* Form fields ------------------------------------------------------------- */

.detec-crm-connector-form__field {
	display: flex;
	flex-direction: column;
	gap: .35em;
	margin-bottom: 1.25em;
}

.detec-crm-connector-form__label {
	font-weight: 600;
	font-size: .95em;
}

.detec-crm-connector-form__required {
	color: #c62828;
	margin-left: .15em;
}

/* Inputs, selects, textareas ---------------------------------------------- */

.detec-crm-connector-form__input {
	width: 100%;
	padding: .55em .75em;
	font-size: 1em;
	font-family: inherit;
	border: 1px solid #bbb;
	border-radius: 4px;
	box-sizing: border-box;
	background: #fff;
	transition: border-color .15s ease, box-shadow .15s ease;
}

.detec-crm-connector-form__input:focus {
	outline: none;
	border-color: #2271b1;
	box-shadow: 0 0 0 2px rgba(34, 113, 177, .25);
}

.detec-crm-connector-form__input--short {
	max-width: 120px;
}

.detec-crm-connector-form__textarea {
	resize: vertical;
	min-height: 90px;
	line-height: 1.5;
}

/* Radio group ------------------------------------------------------------- */

.detec-crm-connector-form__radio-group {
	display: flex;
	flex-direction: column;
	gap: .5em;
}

.detec-crm-connector-form__radio-label {
	display: flex;
	align-items: center;
	gap: .5em;
	font-weight: normal;
	cursor: pointer;
}

.detec-crm-connector-form__radio-label input[type="radio"] {
	width: 1.1em;
	height: 1.1em;
	accent-color: #2271b1;
	flex-shrink: 0;
	cursor: pointer;
}

/* Actions ----------------------------------------------------------------- */

.detec-crm-connector-form__actions {
	margin-top: .5em;
}

.detec-crm-connector-form__submit {
	display: inline-block;
	padding: .6em 1.4em;
	font-size: 1em;
	font-weight: 600;
	color: #fff;
	background: #2271b1;
	border: none;
	border-radius: 4px;
	cursor: pointer;
	transition: background .15s ease;
}

.detec-crm-connector-form__submit:hover,
.detec-crm-connector-form__submit:focus {
	background: #135e96;
	outline: 2px solid #135e96;
	outline-offset: 2px;
}

.detec-crm-connector-form__submit:active {
	background: #0e4f82;
}
