/* Widget «Formulario de cita». Colores y tipografías editables en Elementor. */

.cr-form { width: 100%; }
.cr-form__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.cr-form__field { display: flex; flex-direction: column; gap: 8px; margin: 0; }
.cr-form__field--full { grid-column: 1 / -1; }
.cr-form__label { font-size: 12px; font-weight: 500; letter-spacing: .14em; text-transform: uppercase; color: #866b55; }
.cr-form__label span { color: #b2967d; }

.cr-form .cr-form__input {
	width: 100%; padding: 14px 0; border: 0; border-bottom: 1px solid #b2967d; border-radius: 0;
	background: transparent; color: #554839; font: inherit; font-size: 16px; font-weight: 300;
	transition: border-color .3s;
	-webkit-appearance: none; appearance: none;
}
.cr-form select.cr-form__input {
	padding-right: 28px; cursor: pointer;
	background-image: linear-gradient(45deg, transparent 50%, #554839 50%), linear-gradient(135deg, #554839 50%, transparent 50%);
	background-position: calc(100% - 12px) 50%, calc(100% - 7px) 50%;
	background-size: 5px 5px, 5px 5px; background-repeat: no-repeat;
}
.cr-form textarea.cr-form__input { resize: vertical; min-height: 110px; }
.cr-form .cr-form__input:focus { outline: none; border-bottom-color: #554839; }
.cr-form .cr-form__input:focus-visible { box-shadow: 0 2px 0 0 #554839; }
.cr-form .cr-form__input[aria-invalid="true"] { border-bottom-color: #a14a3b; }

.cr-form__check { flex-direction: row; align-items: flex-start; gap: 12px; font-size: 14px; }
.cr-form__check input { width: 18px; height: 18px; margin: 2px 0 0; accent-color: #554839; flex: none; }
.cr-form__check a { color: inherit; }

.cr-form__footer { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 28px; margin-top: 36px; }
.cr-form button.cr-form__submit {
	padding: 18px 40px; border: 0; border-radius: 999px; cursor: pointer;
	background: #554839; color: #fafafa;
	font-family: "Poppins", sans-serif; font-size: 12px; font-weight: 500; letter-spacing: .16em; text-transform: uppercase;
	transition: background-color .4s, opacity .3s;
}
.cr-form button.cr-form__submit:hover,
.cr-form button.cr-form__submit:focus-visible { background: #866b55; }
.cr-form.is-sending button.cr-form__submit { opacity: .6; pointer-events: none; }

.cr-form__status { margin: 0; font-size: 15px; }
.cr-form__status.is-error { color: #a14a3b; }
.cr-form.is-sent .cr-form__grid,
.cr-form.is-sent .cr-form__submit { display: none; }
.cr-form.is-sent .cr-form__status { font-family: "Playfair Display", serif; font-size: 22px; font-style: italic; }

.cr-form__legal { margin: 28px 0 0; font-size: 12px; line-height: 1.7; opacity: .75; }

.cr-form__trap { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

@media (max-width: 767px) {
	.cr-form__grid { grid-template-columns: 1fr; }
	.cr-form button.cr-form__submit { width: 100%; }
}