/**
 * @license Copyright 2022 Lahuen Health SPA. All Rights Reserved.
 */
 .c-form-section:not(:last-child) {
	margin-bottom: 1rem;
}

.c-form-subsection:not(:first-child) {
	margin-top: 1rem;
}

.c-form-section__header {
	padding: 1rem 2rem;
	background-color: var(--primary-f-normal);
	border-radius: 0.5rem;
	margin-bottom: 0.5rem;
	display: flex;
	align-items: baseline;
}

.c-form-section__title {
	font: 600 1.5rem / normal 'Lato', sans-serif;
	color: var(--primary-c-normal);
}

.c-form-section__subtitle {
	color: var(--gray-c);
	margin-left: 0.5rem;
	font: 400 1.1rem 'Open Sans', sans-serif;
}

.c-form-section__body {
	background-color: #fff;
	border-radius: 0.5rem;
	padding: 1rem 2rem;
}

.c-form-section__body .c-pair {
	display: flex;
	flex-wrap: wrap;
	padding-bottom: 1rem;
	height: fit-content;
	break-inside: avoid-column;
}

.c-form-section__body .c-pair:last-child {
	padding-bottom: 0;
}

.c-form-section__body .c-pair .c-pair__label {
	font: 600 1.2rem / normal 'Lato', sans-serif;
	color: var(--primary-d-normal);
	margin-bottom: 0.2rem;
}

.c-form-section__body .c-textfield {
	border-radius: 0.4rem;
	border: 0.1rem solid var(--primary-e-normal);
	padding: 0 1rem;
	width: 100%;
	height: 2.3rem;
	font: 1.2rem / normal 'Open Sans', sans-serif;
}

.c-form-section__body .c-pair .c-form-section__value {
	font: 400 1.2rem / normal 'Open Sans', sans-serif;
	color: var(--gray-a);
	display: flex;
	width: -webkit-fill-available;
}

.c-form-section__body .c-pair .c-form-section__value::placeholder {
	color: var(--gray-e);
}

.c-form-section__body .c-pair .c-form-section__value:focus,
.c-form-section__body .c-select:focus,
.c-form-section__body .c-textfield:focus {
	border-color: #ff8533;
	transition: border-color 0.3s ease;
}

.c-form-subsection__title {
	font: 600 1.5rem / normal 'Lato', sans-serif;
	color: var(--primary-c-normal);
	border-bottom: 0.1rem solid var(--primary-f-normal);
	grid-column: 1/3;
	margin-bottom: 1rem;
}

.c-form-section__body .c-pair__group {
	display: flex;
	flex-direction: column;
	gap: 0.5rem 0;
	width: -webkit-fill-available;
}

.c-form-section__body .c-pair.c-pair--inverted {
	display: flex;
	flex-direction: row;
	margin-right: 2rem;
	align-items: center;
	padding-bottom: 0;
}

.c-form-section__body .c-pair.c-pair--inverted .c-pair__label {
	font: 400 1.2rem / normal 'Open Sans', sans-serif;
	color: var(--gray-a);
	margin-left: 0.25rem;
}

.c-form-section input[type='radio'] {
	appearance: none;
	height: 1.8rem;
	width: 1.8rem;
	border: 0.1rem solid var(--primary-e-normal);
	border-radius: 100%;
	background: #fff no-repeat center;
}

.c-form-section input[type='radio']:checked {
	background-image: url('/assets/skins/lahuen/base/images/icon_dot.svg');
	background-size: 1.1rem;
}

.c-form-section input[type='radio']:focus {
	border-color: #ff8533;
	transition: border-color 0.3s ease;
}

/* Calendario */
.c-form-section input[type='date']::-webkit-inner-spin-button,
.c-form-section input[type='date']::-webkit-calendar-picker-indicator,
.c-form-section input[type='datetime-local']::-webkit-inner-spin-button,
.c-form-section input[type='datetime-local']::-webkit-calendar-picker-indicator {
	opacity: 0;
	cursor: pointer;
	position: absolute;
	left: 0;
	width: 100%;
	height: 100%;
}

.c-form-section input[type='date'],
.c-form-section input[type='datetime-local'] {
	position: relative;
	border-radius: 0.4rem;
	border: 0.1rem solid var(--primary-e-normal);
	padding: 0.2rem 1rem;
	background: #fff url('/assets/skins/lahuen/base/images/icon_calendar.svg') no-repeat right 1rem center/1.5rem;
	cursor: pointer;
	font: 400 1.2rem/1.5rem 'Open Sans', sans-serif;
	width: 20rem;
	padding-right: 1rem;
	outline: none;
}

.c-form-section .c-datetimepicker__action {
	display: none;
}

.c-form-section input[type='date']:focus,
.c-form-section input[type='datetime-local']:focus {
	border-color: #ff8533;
	transition: border-color 0.3s ease;
}

/* Checkbox */
.c-form-section__body .c-pair .c-form-section__value.c-check {
	appearance: none;
	background: #fff url('data:image/svg+xml,<svg xmlns="http://www.c3.org/2000/svg"/>') no-repeat center/1.2rem;
	border: 0.1rem solid var(--primary-e-normal);
	border-radius: 0.2rem;
	cursor: pointer;
	height: 1.8rem;
	margin-right: 0.5rem;
	width: 1.8rem;
}

.c-form-section__body .c-pair .c-form-section__value.c-check:checked {
	background-image: url('/assets/skins/lahuen/base/images/icon_check_2.svg');
}

.c-form-section__body .c-pair .c-form-section__value.c-check:focus {
	border-color: #ff8533;
	transition: border-color 0.3s ease;
}

/* Selector */
.c-form-section .c-select {
	appearance: none;
	border-radius: 0.4rem;
	border: 0.1rem solid var(--primary-e-normal);
	background: #fff url(/assets/skins/lahuen/base/images/icon_select.svg) no-repeat right 1rem center/1rem;
	padding: 0 2.5rem 0 1rem;
	font: 400 1.2rem / normal 'Open Sans', sans-serif;
	height: 2.3rem;
	text-overflow: ellipsis;
}

.c-form-section .c-select:disabled {
	opacity: 1;
	border: none;
	background: none;
	color: var(--gray-s);
	padding: 0;
	height: auto;
}

/* Selector Typeahead */
.c-form-section .c-typeahead {
	border-radius: 0.4rem;
	border: 0.1rem solid var(--primary-e-normal);
	background: url('/assets/skins/lahuen/base/images/icon_select.svg') no-repeat right 1rem center/1rem;
	position: relative;
	width: 100%;
	height: 2.3rem;
	padding: 0 2.5rem 0 1rem;
	display: flex;
	align-items: center;
	font: 400 1.2rem / normal 'Open Sans', sans-serif;
}

.c-form-section .c-typeahead:focus-within {
	border-color: #ff8533;
	transition: border-color 0.3s ease;
}

.c-form-section .c-typeahead-selector {
	font: 1.2rem / normal 'Open Sans', sans-serif;
	color: #333;
	list-style: none;
	padding: 0;
	margin: 0 0 1rem;
	position: absolute;
	background-color: #fff;
	width: 100%;
	max-height: 11rem;
	overflow: auto;
}

.c-form-section .c-typeahead-selector__item {
	padding: 0.5rem 1rem;
	cursor: pointer;
}

.c-form-section .c-typeahead-selector__item:hover {
	background-color: #e6e6eb;
	transition: background-color 0.3s ease;
}

.c-form-section .c-typeahead__viewer {
	color: var(--gray-a);
	font: 400 1.2rem/1.5rem 'Open Sans', sans-serif;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.c-form-section .c-typeahead__action-clear {
	-webkit-mask: url('data:image/svg+xml,<svg fill="%23fff" viewBox="2.52 2.52 80 80" xmlns="http://www.w3.org/2000/svg"><path d="M77.126,63.411L53.715,39.998l23.408-23.409c3.788-3.788,3.791-9.925,0.003-13.712 c-3.786-3.787-9.926-3.788-13.714,0L40.001,26.288L16.589,2.875c-3.787-3.787-9.927-3.788-13.714,0 c-3.787,3.787-3.786,9.927,0.001,13.714l23.412,23.413L2.877,63.411c-3.787,3.788-3.788,9.929-0.001,13.715 c3.789,3.789,9.926,3.784,13.713-0.002L40,53.713l23.412,23.412c3.787,3.788,7.927,3.786,13.713,0 C80.912,73.338,80.914,67.197,77.126,63.411z"/></svg>')
		center/.8rem no-repeat;
	background-color: #bbbcc9;
	position: absolute;
	top: 1.5rem;
	right: 1.5rem;
	display: flex;
	height: 1.2rem;
	width: 1.2rem;
	cursor: pointer;
}

.c-form-section .c-typeahead__action-clear.c-action--tertiary .c-action__label.c-label {
	display: none;
}

.c-form-section .c-label.c-typeahead__placeholder {
	color: var(--gray-a);
}

.c-form-section .c-typeahead .c-typeahead__search {
	position: absolute;
	top: 2.4rem;
	left: 0;
	width: 100%;
	background-color: #fff;
	box-shadow: 0 0.2rem 0.5rem rgb(0 0 0 / 15%);
	z-index: 10;
}

.c-form-section__body .c-typeahead__search .c-textfield {
	margin: 1rem;
	width: -webkit-fill-available;
}

/* Text area */
.c-form-section .c-textvalue--multiline {
	white-space: pre-line;
}

.c-form-section .c-textarea-template__input {
	width: 100%;
	height: 8rem;
	appearance: none;
	border-radius: 0.4rem;
	border: 0.1rem solid var(--primary-e-normal);
	padding: 0.5rem 1rem;
	resize: none;
	font: 400 1.2rem / normal 'Open Sans', sans-serif;
}

.c-form-section .c-textarea-template__input:focus {
	border-color: #ff8533;
	transition: border-color 0.3s ease;
}

.c-form-section .c-textarea-template__input::placeholder {
	color: var(--gray-e);
}

/* Spinner sección*/
.c-form-section {
	position: relative;
}

.c-worklist-modal-panel__body .c-form-section .c-spinner {
	position: absolute;
	width: 100%;
	background-color: rgba(255, 255, 255, 0.75);
	display: flex;
	flex-direction: row;
	justify-content: center;
	top: 4.2rem;
	height: calc(100% - 4.2rem);
	border-radius: 0.5rem;
	padding-right: 8rem;
}

.c-worklist-modal-panel__body .c-form-section .c-spinner::before {
	transform: scale(0.5);
}

/* Mensajes de error */
.c-form-section .c-pair__invalid-message {
	color: #e54848;
	flex-basis: 100%;
	font: 400 1.1rem / normal 'Open Sans', sans-serif;
	margin-top: 0.2rem;
	min-height: 1.6rem;
}

/* Botón terciario  */
.c-form-section .c-action--tertiary {
	background-color: var(--primary-f-normal);
	color: var(--primary-d-normal);
	border-radius: 0.3rem;
}

.c-form-section .c-action--tertiary .c-action__label {
	display: flex;
	align-items: center;
	font: 600 1.2rem/1.2rem 'Open Sans', sans-serif;
}

.c-form-section .c-action--tertiary:hover {
	background-color: var(--primary-a-bright);
	color: var(--primary-a-normal);
	transition: background-color 0.3s ease;
}

/* Checkbox */
.c-form-section .c-check {
	appearance: none;
	background: #fff url('data:image/svg+xml,<svg xmlns="http://www.c3.org/2000/svg"/>') no-repeat center/1.2rem;
	border: 0.1rem solid var(--primary-e-normal);
	border-radius: 0.2rem;
	cursor: pointer;
	height: 1.5rem;
	margin-right: 0.5rem;
	width: 1.5rem;
}

.c-form-section .c-check.c-check--checked {
	background: url('/assets/skins/lahuen/base/images/icon_check_2.svg') no-repeat center/1rem;
}

.c-form-section .c-check:focus {
	border-color: #ff8533;
	transition: border-color 0.3s ease;
}