/**
 * @license Copyright 2022 Lahuen Health SPA. All Rights Reserved.
 */
/* Medicamentos */
#medicamentoApp {
	height: 100%;
}

.indicacion__medicamentos .recuadro-contenido-blanco2 {
	bottom: 3.5rem;
}

/* Agregar medicamento */
.receta__elegir-medicamento {
	display: flex;
	align-items: center;
	margin-bottom: 0.5rem;
}

.receta__elegir-medicamento.titulo {
	font: 600 1.4rem 'Lato', sans-serif;
	color: var(--primary-c-normal);
	margin-right: 1rem;
}

/* Medicamentos agregados */
#f-medicamento {
	counter-reset: form;
	display: flex;
	flex-direction: column;
	font-family: 'Open sans', sans-serif;
	height: calc(100% - 4rem);
	overflow: auto;
}

#f-medicamento > .w-form__fieldset {
	border-top: 0.1rem solid #000;
	display: flex;
	margin-bottom: 1rem;
	position: relative;
}

/* Cabecera de formulario */
#f-medicamento > .w-form__fieldset > .w-form__fieldset-header {
	font: 600 1.3rem 'Lato', sans-serif;
	text-transform: none;
	display: flex;
	width: 10rem;
}

#f-medicamento > .w-form__fieldset > .w-form__fieldset-header::before {
	align-items: center;
	background-color: #000;
	color: #fff;
	content: counter(form);
	counter-increment: form;
	display: flex;
	height: 1.8rem;
	justify-content: center;
	width: 1.8rem;
	font-family: 'Lato', sans-serif;
}

#f-medicamento > .w-form__fieldset > .w-form__fieldset-header > .w-form__fieldset-title {
	align-items: center;
	display: flex;
	height: 1.8rem;
	margin-left: 0.5rem;
}

#f-medicamento .w-form__field-label {
	font: 600 1.2rem 'Lato', sans-serif;
	padding-left: 0.1rem;
	cursor: default;
	color: var(--primary-d-normal);
}

#f-medicamento > .w-form__fieldset.activo > .w-form__fieldset-header {
	color: var(--primary-d-normal);
	background-color: var(--primary-d-bright);
}

#f-medicamento > .w-form__fieldset.activo > .w-form__fieldset-header::before {
	background-color: var(--primary-d-normal);
}

#f-medicamento > .w-form__fieldset.activo {
	border-top-color: var(--primary-d-normal);
}

#f-medicamento > .w-form__fieldset.nuevo > .w-form__fieldset-header {
	color: var(--secondary-c-normal);
	background-color: var(--secondary-c-bright);
}

#f-medicamento > .w-form__fieldset.nuevo > .w-form__fieldset-header::before {
	background-color: var(--secondary-c-normal);
}

#f-medicamento > .w-form__fieldset.nuevo {
	border-top-color: var(--secondary-c-normal);
}

#f-medicamento .estado {
	left: 2.2rem;
	position: absolute;
	top: 1.7rem;
}

#f-medicamento .estado span {
	font: 600 1.2rem 'Lato', sans-serif;
	text-transform: capitalize;
	color: var(--gray-c);
}

/* Estructura formulario */
#f-medicamento > .w-form__fieldset > .w-form__fieldset-body {
	display: flex;
	flex-wrap: wrap;
	width: -webkit-fill-available;
	margin-left: 0.5rem;
}

.w-form__field.w-form__field--fieldgroup.cabecera {
	width: -webkit-fill-available;
	margin-bottom: 0.5rem;
	margin-top: 0.2rem;
}

/* Cabecera de medicamento */
#f-medicamento .cabecera .w-form__field-label {
	color: var(--gray-a);
	font-weight: 400;
}

#f-medicamento .cabecera .w-form__field-group {
	display: flex;
	width: 100%;
}

#f-medicamento .cabecera .folio .w-form__field-value {
	width: 5rem;
	margin: 0 1rem 0 0.25rem;
}

#f-medicamento .cabecera .folio .w-form__field-value[disabled] {
	background: transparent;
	border: none;
}

#f-medicamento .w-form__field--disabled > span {
	padding: 0;
}

#f-medicamento .cabecera .clinico .w-form__field-value,
#f-medicamento .cabecera .fecha-vencimiento .w-form__field-value {
	background-color: transparent;
	border: none;
}

#f-medicamento .cabecera .acciones {
	align-items: stretch;
	margin-left: auto;
}

#f-medicamento .cabecera .acciones button {
	background-color: var(--primary-f-light);
	color: var(--primary-c-normal);
	border: none;
	padding: 0.2rem 1rem;
	border-radius: 0.3rem;
	cursor: pointer;
	transition: background-color ease 0.2s;
	margin-top: 0.2rem;
	font: 400 1.1rem 'Lato', sans-serif;
}

#f-medicamento .cabecera .acciones button:hover {
	background: var(--primary-a-bright);
	color: var(--primary-a-normal);
	transition: background-color 0.3s ease;
}

#f-medicamento .w-form__field.cabecera .acciones button:not(:last-child) {
	margin-right: 0.5rem;
}

/* Campos a ingresar */
#f-medicamento input[type='datetime-local'],
#f-medicamento input[type='text'] {
	margin: 0;
	padding: 0.3rem 0.5rem;
	border: 0.1rem solid #ddd;
	border-radius: 0.3rem;
	min-height: 1.3rem;
	font-family: 'Open Sans', sans-serif;
	outline: none;
	font-size: 1.2rem;
}

#f-medicamento input[type='datetime-local']:focus,
#f-medicamento input[type='text']:focus,
#f-medicamento select:focus {
	outline: none;
	border-color: var(--primary-b-light);
	transition: border-color 0.3s ease;
}

#f-medicamento input[type='datetime-local']:disabled,
#f-medicamento input[type='text']:disabled,
#f-medicamento select:disabled {
	border: none;
	background: none;
	padding: 0 0.1rem;
	appearance: none;
	opacity: 1;
	color: var(--gray-b);
}

#f-medicamento .dosis select:disabled {
	width: 4rem;
}

#f-medicamento .via select:disabled {
	width: 7rem;
}

.fecha-vencimiento .w-form__field-value {
	width: 18rem;
}

.w-form__field.w-form__field--text.w-form__field--disabled.fecha-vencimiento {
	gap: 0.25rem;
}

#f-medicamento .w-form__field.clinico {
	display: flex;
	gap: 0.5rem;
	flex: 1;
}

.clinico .w-form__field-value {
	flex: 1;
}

#f-medicamento .w-form__field {
	align-items: baseline;
	display: flex;
}

#f-medicamento .w-form__field.observaciones {
	flex-direction: column;
	align-items: flex-start;
	margin-left: 0.5rem;
}

#f-medicamento .w-form__field--hidden {
	display: none;
}

#f-medicamento .w-form__field--invalid {
	background-color: var(--system-error-bright);
}

#f-medicamento :not(.cabecera) > .w-form__field-group {
	display: flex;
}

#f-medicamento :not(.cabecera) > .w-form__field-group > .w-form__field:not(:last-child),
#f-medicamento .w-form__field-group > input:not(:last-child) {
	margin-right: 0.5rem;
}

#f-medicamento :not(.cabecera) > .w-form__field-group > .w-form__field.acciones {
	display: flex;
	justify-content: flex-end;
}

#f-medicamento .cuerpo .w-form__field,
#f-medicamento .principios-activos .w-form__field,
#f-medicamento .electrolitos .w-form__field,
#f-medicamento .adicionales .w-form__field {
	flex-direction: column;
	align-items: baseline;
}

#f-medicamento .validez-tratamiento input[type='text']:disabled {
	padding: 0;
	border: none;
	background: none;
	width: 3.2rem;
}

.dosis .w-form__field-value:first-child,
.dosis .w-form__field-value:first-child:disabled {
	width: 5rem;
}

.w-form__field-value.w-form__field-value.um {
	width: 8rem;
}

.solvente .w-form__field-value,
.farmaco .frecuencia .w-form__field-value {
	width: -webkit-fill-available;
}

.frecuencia .w-form__field-value {
	width: 6rem;
}

#f-medicamento .validez-tratamiento .w-form__field-value.pristine,
#f-medicamento .validez-tratamiento .w-form__field-value.dirty {
	max-width: 3.5rem;
	margin-right: 0.2rem;
}

.principio-activo .w-typeahead__value {
	width: 28rem;
}

.electrolitos .w-form__field-group {
	margin-bottom: 0.5rem;
}

.electrolito .w-form__field-value {
	width: 28rem;
}

.farmaco .principio-activo .w-typeahead__value {
	width: 32rem;
}

.insumo .w-typeahead__value,
.asistencia-tecnica .w-typeahead__value {
	width: 40rem;
}

.w-form__field--custom.acciones .dato-agregar {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 7.5rem;
	height: 2rem;
	border: none;
	padding: 0;
	margin: 0;
	border-radius: 0.3rem;
	cursor: pointer;
}

.bic .w-form__field--custom.acciones .dato-agregar {
    width: 10rem;
}

.w-form__field--custom.acciones .dato-agregar:hover {
	background-color: var(--primary-a-bright);
	color: var(--primary-a-normal);
	transition: all ease 0.3s;
}

.w-form__field--custom.acciones .dato-agregar.agregar-principio-activo:before,
.w-form__field--custom.acciones .dato-agregar.agregar-electrolito:before {
	-webkit-mask: url('/assets/skins/lahuen/base/images/icon_add.svg') no-repeat center;
	-webkit-mask-size: contain;
	background-color: var(--primary-c-normal);
	content: '';
	height: 1.6rem;
	width: 1.6rem;
}

.w-form__field--custom.acciones .dato-agregar.borrar-electrolito:before,
.w-form__field--custom.acciones .dato-agregar.borrar-principio-activo:before {
	-webkit-mask: url('/assets/skins/lahuen/base/images/icon_delete.svg') no-repeat center;
	-webkit-mask-size: contain;
	background-color: var(--primary-c-normal);
	content: '';
	height: 1.4rem;
	width: 1.6rem;
}

.w-form__field--custom.acciones .dato-agregar.agregar-principio-activo:hover:before,
.w-form__field--custom.acciones .dato-agregar.agregar-electrolito:hover:before,
.w-form__field--custom.acciones .dato-agregar.borrar-electrolito:hover:before,
.w-form__field--custom.acciones .dato-agregar.borrar-principio-activo:hover:before {
	background-color: var(--primary-a-normal);
	transition: all ease 0.3s;
}

#f-medicamento .w-form__fieldset-body > .w-form__field.w-form__field--custom.acciones {
	align-items: flex-end;
	margin-left: 0.2rem;
}

.w-form__field.w-form__field--select.w-form__field--required.via .w-form__field-value {
	width: 9.5rem;
}

/* Checkbox */
#f-medicamento input[type='checkbox'] {
	-webkit-appearance: none;
	background: #fff url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg"/>') center/10px no-repeat;
	border: 2px solid #04405b;
	border-radius: 3px;
	height: 14px;
	margin: 0;
	outline: none;
	width: 14px;
}

#f-medicamento input[type='checkbox']:checked {
	background-image: url('data:image/svg+xml,<svg fill="%2304405b" viewBox="0 0 1792 1792" xmlns="http://www.w3.org/2000/svg"><path d="M1671 566q0 40-28 68l-724 724-136 136q-28 28-68 28t-68-28l-136-136-362-362q-28-28-28-68t28-68l136-136q28-28 68-28t68 28l294 295 656-657q28-28 68-28t68 28l136 136q28 28 28 68z"/></svg>');
}

/* Estado borrador. */
#f-medicamento > .w-form__fieldset.borrador {
	border-top-color: var(--system-warning-normal);
}

#f-medicamento > .w-form__fieldset.borrador > .w-form__fieldset-header {
	color: var(--system-warning-normal);
	background-color: var(--system-warning-bright);
}

#f-medicamento > .w-form__fieldset.borrador > .w-form__fieldset-header::before {
	background-color: var(--system-warning-normal);
}

/* Estado suspendido. */
#f-medicamento > .w-form__fieldset.suspendido {
	border-top-color: #999;
}

#f-medicamento > .w-form__fieldset.suspendido > .w-form__fieldset-header {
	color: #999;
	background-color: #eee;
}

#f-medicamento > .w-form__fieldset.suspendido > .w-form__fieldset-header::before {
	background-color: #999;
}

#f-medicamento > .w-form__fieldset.suspendido :not(.cabecera) > .w-form__field-group .w-form__field-label {
	background-color: #eee;
}

.indicacion__medicamentos .alerta-quimio b.tipo-tratamiento {
	color: #e16644;
}

.indicacion__medicamentos .alerta-quimio {
	padding: 0.3rem 0 0.6rem 0;
	font-family: 'Open Sans';
	font-size: 0.9rem;
	color: #666;
}

#f-medicamento .w-form__field--fieldgroup.authorization {
	grid-column: 1/4;
	font-size: 1.1rem;
	color: var(--gray-c);
	margin-top: 0.5rem;
}

#f-medicamento .w-form__field--fieldgroup.authorization .authorization-status {
	color: var(--gray-b);
	text-align: center;
	border-radius: 0.3rem;
	font-size: 1.1rem;
	padding: 0 0.5rem;
	margin-right: 0.4rem;
}

#f-medicamento .w-form__field--fieldgroup.authorization .authorized .authorization-status {
	background-color: #e2efe1;
}

#f-medicamento .w-form__field--fieldgroup.authorization .pending .authorization-status {
	background-color: #fdedd9;
}

#f-medicamento .w-form__field--fieldgroup.authorization .required {
	color: #333;
	text-align: center;
	border-radius: 0.3rem;
	font-size: 0.8rem;
	padding: 0.1rem 0.5rem;
	margin-right: 0.4rem;
	background-color: #fdedd9;
	display: flex;
	align-items: center;
}

#f-medicamento .w-form__field--fieldgroup.authorization .required::before {
	margin-right: 0.4rem;
	width: 1.3rem;
	height: 1.3rem;
	background: url('../../images/emphasis_warning.svg') center/1rem no-repeat;
	content: '';
}

/* Mensaje footer */
.pop-up--indicaciones.footer .disclaimer {
	margin-left: 18rem;
	color: var(--gray-a);
	margin-right: auto;
	background-color: var(--system-warning-bright);
	border-radius: 0.5rem;
	padding: 0.3rem 1rem 0.3rem 3rem;
	font: 400 1.2rem 'Open Sans', sans-serif;
	display: flex;
	background: var(--system-warning-bright) url('/assets/skins/lahuen/base/images/emphasis_warning.svg') no-repeat left
		0.75rem center/1.4rem;
}
