.afe-rastreador {
	box-sizing: border-box;
	container-type: inline-size;
	color: #fff;
	background: var( --afe-rojo-10, #6c050a );
	font-family: var( --afe-fuente, Montserrat, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif );
	font-weight: 500;
	padding: 28px 20px 40px;
	--afe-rt-circulo: clamp( 56px, 16cqw, 120px );
	--afe-rt-paso-gap: calc( var( --afe-rt-circulo ) * 0.7 );
	--afe-rt-barra: max( 4px, calc( var( --afe-rt-circulo ) * 0.058 ) );
}
.afe-rastreador h2.afe-rastreador__titulo {
	margin: 0 0 clamp( 16px, 2cqw, 32px );
	text-align: center;
	font-family: var( --afe-fuente, Montserrat, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif );
	font-weight: 600;
	font-size: clamp( 24px, 2.6cqw + 10px, 42px );
	line-height: 1.43;
	color: #fff;
}
.afe-rastreador__buscador {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	row-gap: 16px;
	column-gap: clamp( 12px, 6cqw, 94px );
	margin: 0 0 clamp( 24px, 3cqw, 48px );
}
.afe-rastreador input.afe-rastreador__input {
	box-sizing: border-box;
	flex: 1 1 320px;
	max-width: 586px;
	height: 64px;
	padding: 0 16px;
	background: transparent;
	border: 2px solid #fff;
	border-radius: 20px;
	color: #fff;
	font-family: inherit;
	font-weight: 600;
	font-size: clamp( 15px, 1cqw + 10px, 24px );
	line-height: 1;
}

.afe-rastreador input.afe-rastreador__input::placeholder {
	color: rgba( 255, 255, 255, 0.65 );
	opacity: 1;
}

.afe-rastreador input.afe-rastreador__input:focus {
	outline: 2px solid var( --afe-ambar-7, #f6a505 );
	outline-offset: 2px;
}
.afe-rastreador button.afe-rastreador__btn {
	box-sizing: border-box;
	flex: 0 0 auto;
	min-width: clamp( 150px, 16cqw, 235px );
	height: 64px;
	padding: 0 clamp( 20px, 3cqw, 48px );
	background: var( --afe-rojo-12, #350205 );
	border: 0;
	border-radius: 10px;
	color: #fff;
	font-family: inherit;
	font-weight: 500;
	font-size: clamp( 17px, 1.2cqw + 11px, 28px );
	cursor: pointer;
}

.afe-rastreador button.afe-rastreador__btn:hover:not( :disabled ) {
	background: var( --afe-rojo-11, #500308 );
}

.afe-rastreador button.afe-rastreador__btn:disabled {
	opacity: 0.6;
	cursor: default;
}

.afe-rastreador button.afe-rastreador__btn:focus-visible {
	outline: 2px solid var( --afe-ambar-7, #f6a505 );
	outline-offset: 2px;
}
.afe-rastreador__columnas {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	justify-content: center;
	gap: clamp( 24px, 4cqw, 64px );
}
.afe-rt-pasos {
	position: relative;
	flex: 1 1 340px;
	max-width: 582px;
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: var( --afe-rt-paso-gap, 84px );
}
.afe-rt-pasos::before {
	content: "";
	position: absolute;
	top: calc( var( --afe-rt-circulo ) / 2 );
	bottom: calc( var( --afe-rt-circulo ) / 2 );
	left: calc( var( --afe-rt-circulo ) / 2 - var( --afe-rt-barra ) / 2 );
	width: var( --afe-rt-barra );
	background: var( --afe-ambar-8, #d58f04 );
	border-radius: var( --afe-rt-barra );
}
.afe-rt-pasos--unico::before {
	display: none;
}

.afe-rt-paso {
	position: relative;
	display: flex;
	align-items: center;
	gap: clamp( 12px, 2.6cqw, 40px );
	min-height: var( --afe-rt-circulo );
}

.afe-rt-paso__circulo {
	position: relative;
	flex-shrink: 0;
	width: var( --afe-rt-circulo );
	height: var( --afe-rt-circulo );
	border-radius: 50%;
	background: var( --afe-ambar-3, #fce4b7 );
}
.afe-rt-paso--alcanzado .afe-rt-paso__circulo {
	background: var( --afe-ambar-8, #d58f04 );
}
.afe-rt-paso__glifo {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	display: block;
}

.afe-rt-paso__glifo--suelto {
	inset: 25%;
	width: 50%;
	height: 50%;
	object-fit: contain;
}

.afe-rt-paso__texto {
	display: grid;
	gap: clamp( 4px, 0.7cqw, 10px );
	min-width: 0;
}

.afe-rt-paso__estado {
	margin: 0;
	font-family: var( --afe-fuente-titulo, Montserrat, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif );
	font-weight: 700;
	font-size: clamp( 19px, 1.5cqw + 11px, 32px );
	line-height: 1.2;
	color: #fff;
}
.afe-rt-paso--alcanzado .afe-rt-paso__estado {
	font-size: clamp( 18px, 1.3cqw + 10px, 28px );
}

.afe-rt-paso__fecha,
.afe-rt-paso__nota {
	margin: 0;
	font-weight: 500;
	font-size: clamp( 14px, 0.9cqw + 9px, 22px );
	line-height: 1.25;
	color: #fff;
}
.afe-rt-resumen {
	box-sizing: border-box;
	flex: 1 1 320px;
	max-width: 490px;
	background: #fff;
	border-radius: 20px;
	padding: 14px 30px 30px;
	color: var( --afe-color-texto, #040404 );
}

.afe-rt-resumen__titulo {
	margin: 0 0 20px;
	text-align: center;
	font-family: var( --afe-fuente, Montserrat, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif );
	font-weight: 700;
	font-size: clamp( 18px, 0.8cqw + 14px, 24px );
	line-height: 1.67;
	color: var( --afe-rojo-10, #6c050a );
}
.afe-rt-resumen__lista {
	margin: 0;
	display: grid;
	gap: 14px;
}

.afe-rt-resumen__fila {
	display: flex;
	align-items: center;
	gap: clamp( 12px, 1.6cqw, 24px );
	font-size: clamp( 14px, 0.4cqw + 12px, 18px );
	line-height: 1.35;
}

.afe-rt-resumen__icono {
	flex-shrink: 0;
	width: 28px;
	height: 28px;
}

.afe-rt-resumen__fila dt {
	font-weight: 600;
}

.afe-rt-resumen__fila dd {
	margin: 0;
	font-weight: 400;
	min-width: 0;
}
.afe-modal-overlay--rastreador {
	background: rgba( 217, 217, 217, 0.9 );
}

.afe-modal--rastreador {
	box-sizing: border-box;
	border-radius: 20px;
	text-align: center;
	padding: 40px 24px 48px;
	max-width: 1000px;
	display: flex;
	flex-direction: column;
}
.afe-modal--rastreador::before {
	content: "";
	order: 1;
	width: 170px;
	height: 176px;
	margin: 0 auto 18px;
	background-image: url( "../img/pago-fallido.png" );
	background-repeat: no-repeat;
	background-size: 340px 339px;
	background-position: -86px -75px;
}

.afe-modal--rastreador .afe-modal__titulo {
	order: 2;
}

.afe-modal--rastreador .afe-modal__cuerpo {
	order: 3;
}
.afe-modal--rastreador .afe-modal__icono {
	display: none;
}

.afe-modal--rastreador .afe-modal__titulo {
	margin: 0;
	font-family: var( --afe-fuente-titulo, Montserrat, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif );
	font-weight: 700;
	font-size: clamp( 22px, 1.6vw + 14px, 34px );
	line-height: 1.2;
	color: var( --afe-color-texto, #040404 );
}
.afe-modal--rastreador .afe-modal__cerrar {
	width: 60px;
	height: 60px;
	font-size: 0;
	top: 8px;
	right: 12px;
	background: url( "../img/cerrar.png" ) center / 44px 44px no-repeat;
}

.afe-modal--rastreador .afe-modal__cuerpo {
	text-align: center;
	margin-bottom: 0;
	margin-top: 18px;
}

.afe-rt-modal__texto {
	margin: 0;
	font-size: clamp( 15px, 0.7vw + 12px, 22px );
	line-height: 1.55;
	color: var( --afe-color-texto, #040404 );
}
.afe-rt-modal__acciones {
	display: grid;
	gap: 20px;
	justify-items: center;
	margin-top: 32px;
}

.afe-rt-modal__btn {
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: center;
	width: min( 432px, 100% );
	min-height: 54px;
	padding: 16px 24px;
	border: 1px solid transparent;
	border-radius: 14px;
	font-size: clamp( 16px, 0.6vw + 13px, 22px );
	line-height: 1.2;
	text-align: center;
	text-decoration: none;
	cursor: pointer;
}
.afe-rt-modal__btn--primario {
	background: var( --afe-ambar-7, #f6a505 );
	color: #fff;
	font-weight: 600;
}

.afe-rt-modal__btn--primario:hover {
	background: var( --afe-ambar-8, #d58f04 );
	color: #fff;
}
.afe-rt-modal__btn--secundario {
	background: transparent;
	border-color: var( --afe-ambar-8, #d58f04 );
	color: var( --afe-rojo-12, #350205 );
	font-family: var( --afe-fuente-titulo, Montserrat, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif );
	font-weight: 400;
}

.afe-rt-modal__btn--secundario:hover {
	background: var( --afe-ambar-1, #fef9f2 );
	color: var( --afe-rojo-12, #350205 );
}
.afe-modal--rastreador a.afe-rt-modal__btn {
	font-size: clamp( 16px, 0.6vw + 13px, 22px );
	line-height: 1.2;
	text-decoration: none;
	font-family: var( --afe-fuente-titulo, Montserrat, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif );
}

.afe-modal--rastreador a.afe-rt-modal__btn--primario {
	font-weight: 600;
	color: #fff;
}
.afe-modal--rastreador a.afe-rt-modal__btn--secundario {
	font-weight: 400;
	color: var( --afe-rojo-12, #350205 );
}

.afe-rt-modal__btn:focus-visible {
	outline: 2px solid var( --afe-color-borde-fuerte, #936303 );
	outline-offset: 2px;
}

@media ( max-width: 480px ) {
	.afe-modal--rastreador {
		padding: 24px 18px 28px;
	}

	.afe-modal--rastreador .afe-modal__cerrar {
		width: 40px;
		height: 40px;
		top: 10px;
		right: 10px;
		background-size: 28px 28px;
	}

	.afe-modal--rastreador::before {
		width: 124px;
		height: 128px;
		background-size: 248px 247px;
		background-position: -63px -55px;
	}
}
.afe-rastreador__aviso {
	max-width: 586px;
	margin: 0 auto;
	background: #fff;
	border-radius: 20px;
	padding: 20px 24px;
	text-align: center;
	font-size: clamp( 15px, 0.5cqw + 13px, 18px );
	color: var( --afe-color-texto, #040404 );
}
.afe-rastreador--completo {
	max-width: none;
	margin-left: 0;
	margin-right: 0;
}
.afe-rastreador.afe-rastreador--buscador {
	width: 100%;
	max-width: 627px;
	margin-left: auto;
	margin-right: auto;
	padding: 16px 20px 48px;
	border-radius: 30px;
	box-shadow: 0 6px 6px rgba( 0, 0, 0, 0.2 );
	contain-intrinsic-inline-size: 587px;
}
.afe-rastreador--buscador h2.afe-rastreador__titulo {
	margin: 0 0 clamp( 20px, 8.18cqw, 48px );
	font-weight: 400;
	font-size: clamp( 20px, 5.79cqw, 34px );
	line-height: 1.76;
}
.afe-rastreador--buscador form.afe-rastreador__buscador {
	flex-direction: column;
	flex-wrap: nowrap;
	align-items: stretch;
	gap: clamp( 20px, 9.2cqw, 54px );
	width: 100%;
	max-width: clamp( 240px, 76.7cqw, 450px );
	margin: 0 auto;
}
.afe-rastreador--buscador input.afe-rastreador__input {
	flex: 0 0 auto;
	width: 100%;
	max-width: none;
	height: clamp( 52px, 11.58cqw, 68px );
	font-weight: 400;
	font-size: clamp( 16px, 4.09cqw, 24px );
}
.afe-rastreador--buscador input.afe-rastreador__input::placeholder {
	color: #fff;
}
.afe-rastreador--buscador button.afe-rastreador__btn {
	width: 100%;
	min-width: 0;
	height: clamp( 52px, 10.9cqw, 64px );
	background: var( --afe-rojo-8, #be0912 );
	font-weight: 700;
	font-size: clamp( 18px, 4.77cqw, 28px );
}

.afe-rastreador--buscador button.afe-rastreador__btn:hover:not( :disabled ) {
	background: var( --afe-rojo-9, #87060d );
}
.afe-rastreador.afe-rastreador--buscador.afe-rastreador--largo {
	max-width: 1115px;
	padding: 16px 20px 35px;
	contain-intrinsic-inline-size: 1075px;
}

.afe-rastreador--largo h2.afe-rastreador__titulo {
	margin: 0 0 clamp( 16px, 2.42cqw, 26px );
	font-size: clamp( 20px, 3.16cqw, 34px );
}

.afe-rastreador--largo form.afe-rastreador__buscador {
	flex-direction: row;
	align-items: center;
	justify-content: center;
	gap: clamp( 16px, 8.74cqw, 94px );
	max-width: clamp( 240px, 85.1cqw, 915px );
}

.afe-rastreador--largo input.afe-rastreador__input {
	flex: 1 1 auto;
	width: auto;
	min-width: 0;
	max-width: 586px;
	height: clamp( 52px, 6.33cqw, 68px );
	font-size: clamp( 16px, 2.23cqw, 24px );
}

.afe-rastreador--largo button.afe-rastreador__btn {
	flex: 0 0 auto;
	width: clamp( 140px, 21.86cqw, 235px );
	height: clamp( 52px, 5.95cqw, 64px );
	font-weight: 500;
	font-size: clamp( 18px, 2.6cqw, 28px );
}
@container ( max-width: 600px ) {
	.afe-rastreador--largo form.afe-rastreador__buscador {
		flex-direction: column;
		align-items: stretch;
		gap: 20px;
	}

	.afe-rastreador--largo input.afe-rastreador__input,
	.afe-rastreador--largo button.afe-rastreador__btn {
		flex: 0 0 auto;
		width: 100%;
		max-width: none;
	}
}
.afe-rastreador-aviso-editor {
	margin: 0 0 1em;
	padding: 10px 14px;
	border: 1px dashed currentColor;
	border-radius: 8px;
	font-size: 14px;
	line-height: 1.4;
	color: var( --afe-color-texto, #040404 );
}

@container ( max-width: 900px ) {
	.afe-rt-pasos,
	.afe-rt-resumen {
		flex-basis: 100%;
		max-width: 100%;
	}
}

