/*!
 * ReviewTap, formulario de pedido.
 * Depende de los tokens de app.css.
 */

.rt-order { min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; }

/* --------------------------------------------------------------- cabecera */

.rt-order__bar {
	display: flex;
	align-items: center;
	gap: clamp(1rem, 3vw, 2rem);
	padding: 1rem var(--rt-gutter);
	border-bottom: 1px solid var(--rt-line);
	background: hsl(0 0% 100% / .9);
	backdrop-filter: blur(12px);
	position: sticky;
	top: 0;
	z-index: 5;
}
.rt-order__brand img { height: 30px; width: auto; }

.rt-order__progress {
	flex: 1;
	height: 5px;
	border-radius: var(--rt-r-full);
	background: var(--rt-surface-2);
	overflow: hidden;
}
.rt-order__progress span {
	display: block;
	height: 100%;
	width: 20%;
	border-radius: var(--rt-r-full);
	background: linear-gradient(90deg, var(--rt-gold), var(--rt-gold-deep));
	transition: width .35s cubic-bezier(.2, 1, .3, 1);
}
.rt-order__count { font-size: .82rem; font-weight: 600; color: var(--rt-muted); flex: none; }

/* ------------------------------------------------------------------ pasos */

.rt-order__screen {
	flex: 1;
	width: 100%;
	max-width: 34rem;
	margin-inline: auto;
	padding: clamp(1.75rem, 5vw, 3rem) var(--rt-gutter) clamp(3rem, 8vw, 5rem);
}

.rt-step { display: none; }
.rt-step.is-on { display: block; animation: rt-stepin .3s ease both; }

/* Solo opacidad, nada de transform: una animacion de transform con fill both
   deja el paso como marco de referencia y cualquier position:fixed de dentro
   (el selector de pais) se ancla a el en vez de a la pantalla. */
@keyframes rt-stepin { from { opacity: 0; } }

.rt-step__kicker {
	margin: 0 0 .5rem;
	font-size: .78rem;
	font-weight: 650;
	letter-spacing: .09em;
	text-transform: uppercase;
	color: var(--rt-gold-deep);
}
.rt-step h1 { font-size: clamp(1.6rem, 4vw, 2.1rem); margin-bottom: .65rem; }
.rt-step__lede { font-size: 1rem; color: var(--rt-muted); margin-bottom: 1.75rem; }
.rt-step__q { margin: 1.75rem 0 .75rem; font-weight: 650; color: var(--rt-ink); }

.rt-step__actions { display: flex; gap: .6rem; margin-top: 2rem; }
.rt-step__actions .rt-btn { flex: 1; }
.rt-step__actions--center { justify-content: center; }
.rt-step__actions .rt-btn--ghost { flex: 0 0 auto; }

.rt-order__label { display: block; margin-bottom: .4rem; font-size: .875rem; font-weight: 600; color: var(--rt-ink); }
.rt-order__input {
	width: 100%;
	padding: .85rem 1rem;
	border: 1px solid var(--rt-line);
	border-radius: var(--rt-r);
	background: var(--rt-bg);
	font-size: 1rem;
	font-family: inherit;
	transition: border-color .16s ease, box-shadow .16s ease;
}
.rt-order__input:focus {
	border-color: var(--rt-gold-deep);
	box-shadow: 0 0 0 3px var(--rt-gold-soft);
	outline: none;
}
.rt-order__fields { display: grid; gap: 1rem; }
.rt-order__legal { margin-top: 1.25rem; font-size: .82rem; color: var(--rt-faint); }
.rt-order__legal a { color: var(--rt-muted); }
.rt-order__error {
	margin-top: 1rem;
	padding: .75rem 1rem;
	border-radius: var(--rt-r);
	background: var(--rt-bad-soft);
	color: var(--rt-bad);
	font-size: .9rem;
}

/* -------------------------------------------------- buscador de negocios */

.rt-search { position: relative; }
.rt-search__list {
	position: absolute;
	inset: calc(100% + .35rem) 0 auto;
	z-index: 10;
	margin: 0;
	padding: .3rem;
	list-style: none;
	border: 1px solid var(--rt-line);
	border-radius: var(--rt-r);
	background: var(--rt-bg);
	box-shadow: var(--rt-sh-lg);
	max-height: 17rem;
	overflow-y: auto;
}
.rt-search__list li { margin: 0; }
.rt-search__list button {
	display: block;
	width: 100%;
	padding: .65rem .75rem;
	border: 0;
	border-radius: var(--rt-r-sm);
	background: none;
	text-align: left;
	cursor: pointer;
	font: inherit;
}
.rt-search__list button:hover,
.rt-search__list button:focus-visible { background: var(--rt-surface); }
.rt-search__list strong { display: block; font-size: .95rem; color: var(--rt-ink); }
.rt-search__list span { display: block; font-size: .82rem; color: var(--rt-faint); }
.rt-search__empty { padding: .75rem; font-size: .9rem; color: var(--rt-faint); }

/* Negocios elegidos */
.rt-picked { display: grid; gap: .5rem; margin-top: .85rem; }
.rt-picked__item {
	display: flex;
	align-items: flex-start;
	gap: .65rem;
	padding: .8rem .95rem;
	border: 1px solid var(--rt-good-line);
	border-radius: var(--rt-r);
	background: var(--rt-good-soft);
}
.rt-picked__item .rt-icon { width: 1.1rem; height: 1.1rem; flex: none; margin-top: .15em; color: var(--rt-good); stroke-width: 2.6; }
.rt-picked__item strong { display: block; font-size: .95rem; color: var(--rt-ink); }
.rt-picked__item em { display: block; font-style: normal; font-size: .82rem; color: var(--rt-muted); }
.rt-picked__drop {
	margin-left: auto;
	border: 0;
	background: none;
	color: var(--rt-muted);
	cursor: pointer;
	font-size: 1.1rem;
	line-height: 1;
	padding: .1rem .3rem;
}
.rt-picked__drop:hover { color: var(--rt-bad); }

.rt-more { margin-top: 1.5rem; }
.rt-linkbtn {
	border: 0;
	padding: 0;
	background: none;
	font: inherit;
	font-weight: 600;
	color: var(--rt-ink);
	cursor: pointer;
	text-decoration: underline;
	text-decoration-color: var(--rt-gold);
	text-decoration-thickness: 2px;
}

/* ------------------------------------------------------ eleccion de tags */

.rt-picker { display: grid; gap: .75rem; }
.rt-pick {
	display: grid;
	grid-template-columns: 64px 1fr auto;
	align-items: center;
	gap: .9rem;
	padding: .9rem;
	border: 1px solid var(--rt-line);
	border-radius: var(--rt-r-lg);
	background: var(--rt-bg);
	transition: border-color .18s ease;
}
.rt-pick.is-chosen { border-color: var(--rt-ink); box-shadow: var(--rt-sh); }
.rt-pick img { width: 64px; height: auto; }
.rt-pick__body strong { display: block; font-size: 1rem; color: var(--rt-ink); }
.rt-pick__price { font-size: .85rem; font-weight: 600; color: var(--rt-gold-deep); }
.rt-pick__body p { margin: .3rem 0 0; font-size: .82rem; color: var(--rt-muted); }

.rt-qty { display: flex; align-items: center; gap: .15rem; }
.rt-qty button {
	width: 2rem; height: 2rem;
	border: 1px solid var(--rt-line);
	border-radius: 50%;
	background: var(--rt-bg);
	font-size: 1.05rem;
	line-height: 1;
	cursor: pointer;
	color: var(--rt-ink);
}
.rt-qty button:hover { border-color: var(--rt-ink); }
.rt-qty output { min-width: 2rem; text-align: center; font-weight: 700; font-variant-numeric: tabular-nums; }

.rt-bulk {
	margin-top: 1rem;
	padding: .85rem 1rem;
	border: 1px dashed var(--rt-gold-line);
	border-radius: var(--rt-r);
	background: var(--rt-gold-soft);
	font-size: .9rem;
}
.rt-bulk strong { color: var(--rt-ink); }
.rt-bulk span { color: var(--rt-ink-2); }
.rt-bulk.is-hit { border-style: solid; }

.rt-total {
	margin-top: 1rem;
	padding: 1rem 1.15rem;
	border: 1px solid var(--rt-line);
	border-radius: var(--rt-r);
	background: var(--rt-surface);
}
.rt-total__row { display: flex; justify-content: space-between; gap: 1rem; font-size: .92rem; color: var(--rt-muted); }
.rt-total__row + .rt-total__row { margin-top: .4rem; }
.rt-total__row--off { color: var(--rt-good); font-weight: 600; }
.rt-total__row--sum {
	margin-top: .75rem;
	padding-top: .75rem;
	border-top: 1px solid var(--rt-line);
	font-size: 1.05rem;
	font-weight: 700;
	color: var(--rt-ink);
}

/* ------------------------------------------------------------- entrega */

.rt-choice { display: grid; gap: .5rem; }
.rt-choice__opt {
	display: flex;
	align-items: flex-start;
	gap: .7rem;
	padding: .9rem 1rem;
	border: 1px solid var(--rt-line);
	border-radius: var(--rt-r);
	cursor: pointer;
	transition: border-color .16s ease, background-color .16s ease;
}
.rt-choice__opt:has(:checked) { border-color: var(--rt-ink); background: var(--rt-surface); }
.rt-choice__opt input { margin-top: .25rem; accent-color: var(--rt-ink); }
.rt-choice__opt strong { display: block; font-size: .95rem; color: var(--rt-ink); }
.rt-choice__opt em { display: block; font-style: normal; font-size: .82rem; color: var(--rt-muted); }
.rt-otheraddress { margin-top: .9rem; }

/* -------------------------------------------------------- smart routing */

.rt-explain { display: grid; gap: .6rem; }
.rt-explain__row {
	display: flex;
	align-items: flex-start;
	gap: .8rem;
	padding: .9rem 1rem;
	border: 1px solid var(--rt-line);
	border-radius: var(--rt-r);
}
.rt-explain__row p { margin: 0; font-size: .92rem; color: var(--rt-muted); }
.rt-explain__row strong { color: var(--rt-ink); }
.rt-explain__tag {
	flex: none;
	padding: .2rem .6rem;
	border-radius: var(--rt-r-full);
	font-size: .72rem;
	font-weight: 700;
}
.rt-explain__row--good { border-color: var(--rt-good-line); background: var(--rt-good-soft); }
.rt-explain__row--good .rt-explain__tag { background: var(--rt-good); color: #fff; }
.rt-explain__row--bad { border-color: var(--rt-bad-line); background: var(--rt-bad-soft); }
.rt-explain__row--bad .rt-explain__tag { background: var(--rt-bad); color: #fff; }

.rt-app {
	display: flex;
	gap: .85rem;
	margin-top: 1.25rem;
	padding: 1rem 1.15rem;
	border: 1px solid var(--rt-line);
	border-radius: var(--rt-r);
	background: var(--rt-surface);
}
.rt-app .rt-icon { width: 1.4rem; height: 1.4rem; flex: none; color: var(--rt-gold-deep); }
.rt-app strong { display: block; color: var(--rt-ink); }
.rt-app p { margin: .2rem 0 0; font-size: .9rem; color: var(--rt-muted); }

/* ------------------------------------------------------------- resumen */

.rt-summary {
	margin-bottom: 1.75rem;
	border: 1px solid var(--rt-line);
	border-radius: var(--rt-r-lg);
	overflow: hidden;
}
.rt-summary__block { padding: 1rem 1.15rem; }
.rt-summary__block + .rt-summary__block { border-top: 1px solid var(--rt-line-soft); }
.rt-summary__label { font-size: .75rem; font-weight: 650; letter-spacing: .08em; text-transform: uppercase; color: var(--rt-faint); }
.rt-summary__block p { margin: .3rem 0 0; font-size: .95rem; color: var(--rt-ink); }
.rt-summary__block p span { color: var(--rt-muted); }
.rt-summary__pay { background: var(--rt-surface); }

.rt-step--done { text-align: center; padding-top: 2rem; }
.rt-step--done .rt-thanks__mark { margin-inline: auto; }



/* Lineas del resumen con la foto del producto */
.rt-sumlines { display: grid; gap: .6rem; margin-top: .5rem; }
.rt-sumline { display: flex; align-items: center; gap: .7rem; }
.rt-sumline img {
	width: 40px; height: 40px;
	object-fit: contain;
	flex: none;
	border: 1px solid var(--rt-line-soft);
	border-radius: var(--rt-r-sm);
	background: var(--rt-surface);
	padding: 3px;
}
.rt-sumline__txt { display: flex; align-items: baseline; justify-content: space-between; gap: .75rem; flex: 1; }
.rt-sumline__txt strong { font-size: .95rem; color: var(--rt-ink); }
.rt-sumline__txt em { font-style: normal; font-size: .9rem; color: var(--rt-muted); }
.rt-sumoff { margin: .65rem 0 0; font-size: .85rem; font-weight: 600; color: var(--rt-good); }
.rt-sumoff em { font-style: normal; }

.rt-order__opt { font-weight: 500; color: var(--rt-faint); }

/* Dos campos por fila cuando cabe: localidad y codigo postal */
.rt-order__row { display: grid; grid-template-columns: 1.4fr 1fr; gap: 1rem; }
@media (max-width: 460px) { .rt-order__row { grid-template-columns: minmax(0, 1fr); } }
.rt-order__note { margin: .25rem 0 0; font-size: .82rem; color: var(--rt-faint); }

/* Bloque de "otra sede": va debajo de los negocios ya elegidos */
.rt-more { margin-top: 1.25rem; }
.rt-more__q { margin: 0 0 .6rem; font-size: .95rem; font-weight: 600; color: var(--rt-ink); }
.rt-picked + .rt-search { margin-top: .85rem; }

/* Miniatura de la ficha de Google, cuando esta activada */
.rt-search__list button { display: flex; align-items: center; gap: .65rem; }
.rt-search__thumb {
	width: 40px; height: 40px;
	flex: none;
	object-fit: cover;
	border-radius: var(--rt-r-sm);
	background: var(--rt-surface-2);
}
.rt-search__txt { min-width: 0; }
.rt-search__txt strong,
.rt-search__txt span { display: block; }

/* Color del producto dentro del selector de cantidad */

/* ===================================================== todo centrado ===== */

/*
 * El formulario pasa a un solo eje. Lo unico que se queda alineado a la
 * izquierda es el texto que se escribe dentro de los campos: escribir una
 * direccion centrada, viendo saltar el cursor con cada letra, es incomodo.
 */

.rt-step { text-align: center; }

.rt-step__lede { margin-inline: auto; }
.rt-step__q { text-align: center; }

/* Campos: la caja va centrada, el texto de dentro no */
.rt-order__label { text-align: center; }
.rt-order__input { text-align: left; }
.rt-order__note,
.rt-order__legal { text-align: center; }

/* Buscador */
.rt-search__list button { text-align: left; }
.rt-search__empty { text-align: center; }

/* Negocios elegidos */
.rt-picked__item { align-items: center; text-align: left; }
.rt-more { text-align: center; }

/* Producto */
.rt-pick {
	grid-template-columns: minmax(0, 1fr);
	justify-items: center;
	text-align: center;
	gap: .65rem;
}
.rt-pick__body p { margin-inline: auto; max-width: 34ch; }
.rt-pick__colours { justify-content: center; }
.rt-qty { justify-content: center; }

.rt-bulk { text-align: center; }
.rt-total__row { text-align: left; }

/* Entrega */
.rt-choice__opt { align-items: center; text-align: left; }
.rt-otheraddress .rt-order__fields { text-align: center; }

/* Smart routing */
.rt-explain__row { align-items: center; text-align: left; }
.rt-app { text-align: left; align-items: center; }

/* Resumen */
.rt-summary__block { text-align: center; }
.rt-sumline { justify-content: center; }
.rt-sumline__txt { flex: 0 1 auto; gap: 1rem; }

/* Acciones */
.rt-step__actions { justify-content: center; }

/* Girando mientras Google responde */
.rt-search { position: relative; }
.rt-search.is-loading::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 1rem;
	width: 1.05rem;
	height: 1.05rem;
	margin-top: -.525rem;
	border: 2px solid var(--rt-line);
	border-top-color: var(--rt-gold-deep);
	border-radius: 50%;
	animation: rt-spin .6s linear infinite;
	pointer-events: none;
}
@keyframes rt-spin { to { transform: rotate(360deg); } }
.rt-search.is-loading .rt-order__input { padding-right: 2.75rem; }

@media (prefers-reduced-motion: reduce) {
	.rt-search.is-loading::after { animation-duration: 2s; }
}

/* ============================ una tarjeta por variante ================== */

/* En escritorio caben las cuatro en dos columnas */
.rt-picker { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 560px) { .rt-picker { grid-template-columns: minmax(0, 1fr); } }

.rt-pick { padding: 1.1rem .9rem; }
.rt-pick__img { width: 88px; height: auto; margin-inline: auto; }

.rt-pick__colour {
	display: inline-flex;
	align-items: center;
	gap: .35rem;
	font-size: .82rem;
	color: var(--rt-muted);
}
.rt-pick__colour i {
	width: .85rem;
	height: .85rem;
	border-radius: 50%;
	border: 1px solid var(--rt-line);
	background: var(--rt-swatch);
}

.rt-pick__body { display: grid; gap: .2rem; justify-items: center; }
.rt-pick__price { font-size: .9rem; }

.rt-picker__note {
	margin: .85rem 0 0;
	padding: .7rem 1rem;
	border-radius: var(--rt-r);
	background: var(--rt-bad-soft);
	color: var(--rt-bad);
	font-size: .88rem;
	font-weight: 600;
}

/* ------------------------------------------- resumen y datos, lado a lado */
/* En el movil todo va en columna. En escritorio el resumen se queda a la
   izquierda y los datos a la derecha: asi el ultimo paso cabe de una vez y el
   desplegable de paises tiene sitio para abrirse. */

.rt-checkout { display: grid; gap: 1.5rem; }

@media (min-width: 920px) {
	/* El ultimo paso necesita mas ancho que el resto: son dos columnas */
	.rt-order__screen:has( [data-rt-step="review"].is-on ) { max-width: 60rem; }

	.rt-checkout {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
		gap: 2.25rem;
		align-items: start;
		text-align: left;
	}
	.rt-checkout .rt-summary { margin-top: 0; }
	.rt-checkout .rt-order__legal { text-align: left; }
	.rt-checkout__side { position: sticky; top: 5.5rem; }
	.rt-checkout + .rt-step__actions { max-width: 34rem; margin-inline: auto; }
}

/* ------------------------------------------------- selector de pais propio */
/* Nada de <select>: en el movil el nativo abre la rueda del sistema y no deja
   buscar. En el movil esto ocupa la pantalla entera, en escritorio es un
   desplegable que se abre hacia donde haya hueco. */

.rt-tel { position: relative; }
.rt-tel__row { display: flex; gap: .5rem; align-items: stretch; }

.rt-tel__btn {
	display: flex;
	align-items: center;
	gap: .45rem;
	flex: none;
	padding: .85rem .75rem .85rem .85rem;
	border: 1px solid var(--rt-line);
	border-radius: var(--rt-r);
	background: var(--rt-bg);
	font: inherit;
	font-size: 1rem;
	line-height: 1.5;
	color: var(--rt-ink);
	cursor: pointer;
	transition: border-color .16s ease, box-shadow .16s ease;
}
.rt-tel__btn:hover { border-color: var(--rt-gold-line); }
.rt-tel__btn:focus-visible,
.rt-tel__btn[aria-expanded="true"] {
	border-color: var(--rt-gold-deep);
	box-shadow: 0 0 0 3px var(--rt-gold-soft);
	outline: none;
}
.rt-tel__flag { font-size: 1.3rem; line-height: 1; }
.rt-tel__dial { font-weight: 650; font-variant-numeric: tabular-nums; }
.rt-tel__btn .rt-icon {
	width: 1rem;
	height: 1rem;
	color: var(--rt-faint);
	transition: transform .18s ease;
}
.rt-tel__btn[aria-expanded="true"] .rt-icon { transform: rotate(180deg); }
.rt-tel__input { flex: 1 1 auto; min-width: 0; }

/* ---- movil: pantalla completa, sin nada que se corte ---- */

.rt-tel__sheet {
	position: fixed;
	inset: 0;
	z-index: 60;
	display: flex;
	background: var(--rt-bg);
	animation: rt-telin .2s ease;
}
.rt-tel__sheet[hidden] { display: none; }

.rt-tel__panel {
	display: flex;
	flex-direction: column;
	width: 100%;
	height: 100%;
	text-align: left;
	background: var(--rt-bg);
	overflow: hidden;
}

.rt-tel__top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: .75rem;
	padding: 1rem 1rem .25rem;
	padding-top: max(1rem, env(safe-area-inset-top));
}
.rt-tel__title { margin: 0; font-size: 1.1rem; font-weight: 700; color: var(--rt-ink); }
.rt-tel__close {
	flex: none;
	display: grid;
	place-items: center;
	width: 2.25rem;
	height: 2.25rem;
	border: 0;
	border-radius: 50%;
	background: var(--rt-surface-2);
	color: var(--rt-ink);
	cursor: pointer;
}
.rt-tel__close .rt-icon { width: 1.1rem; height: 1.1rem; }

.rt-tel__head {
	display: flex;
	align-items: center;
	gap: .6rem;
	margin: .75rem 1rem 0;
	padding: .8rem .9rem;
	border: 1px solid var(--rt-line);
	border-radius: var(--rt-r);
	background: var(--rt-surface);
}
.rt-tel__head:focus-within {
	border-color: var(--rt-gold-deep);
	background: var(--rt-bg);
	box-shadow: 0 0 0 3px var(--rt-gold-soft);
}
.rt-tel__magnifier { width: 1.15rem; height: 1.15rem; flex: none; color: var(--rt-faint); }
.rt-tel__search {
	flex: 1 1 auto;
	min-width: 0;
	border: 0;
	background: none;
	font: inherit;
	font-size: 1rem;
	color: var(--rt-ink);
	outline: none;
}

.rt-tel__list {
	list-style: none;
	margin: .5rem 0 0;
	padding: 0 0 env(safe-area-inset-bottom);
	overflow-y: auto;
	overscroll-behavior: contain;
	-webkit-overflow-scrolling: touch;
	flex: 1 1 auto;
}
.rt-tel__opt {
	display: flex;
	align-items: center;
	gap: .85rem;
	width: 100%;
	padding: .85rem 1rem;
	border: 0;
	background: none;
	font: inherit;
	font-size: 1rem;
	color: var(--rt-ink);
	text-align: left;
	cursor: pointer;
}
.rt-tel__opt:hover,
.rt-tel__opt.is-cursor { background: var(--rt-surface); }
.rt-tel__opt.is-on { background: var(--rt-gold-soft); font-weight: 650; }
.rt-tel__opt.is-on::after {
	content: "";
	flex: none;
	width: .55rem;
	height: .55rem;
	border-radius: 50%;
	background: var(--rt-gold-deep);
}
.rt-tel__optflag { font-size: 1.4rem; line-height: 1; flex: none; width: 1.7rem; text-align: center; }
.rt-tel__optname { flex: 1 1 auto; }
.rt-tel__optdial { flex: none; color: var(--rt-muted); font-variant-numeric: tabular-nums; }

.rt-tel__empty { margin: 0; padding: 2rem 1rem; text-align: center; color: var(--rt-muted); }

@keyframes rt-telin { from { opacity: 0; transform: translateY(10px); } }

/* ---- escritorio: desplegable pegado al campo ---- */

@media (min-width: 641px) {
	.rt-tel__sheet {
		position: absolute;
		inset: auto auto auto 0;
		top: calc(100% + .4rem);
		z-index: 40;
		display: block;
		width: min(22rem, 100%);
		height: auto;
		background: none;
		animation: none;
	}
	.rt-tel__sheet.is-up { top: auto; bottom: calc(100% + .4rem); }
	.rt-tel__panel {
		height: auto;
		max-height: var(--rt-telmax, 20rem);
		border: 1px solid var(--rt-line);
		border-radius: var(--rt-r);
		box-shadow: 0 18px 44px hsl(24 9% 7% / .16);
	}
	.rt-tel__top { display: none; }
	.rt-tel__head { margin: .5rem .5rem 0; }
	.rt-tel__opt { padding: .6rem .9rem; font-size: .95rem; }
}

@media (prefers-reduced-motion: reduce) {
	.rt-tel__sheet { animation: none; }
}

.rt-lock { overflow: hidden; }

/* Respaldo cuando el sistema no tiene banderas: el codigo del pais en una chapa */
.rt-tel--noflags .rt-tel__flag,
.rt-tel--noflags .rt-tel__optflag {
	width: 2rem;
	padding: .1rem 0;
	border: 1px solid var(--rt-line);
	border-radius: .35rem;
	font-size: .68rem;
	font-weight: 700;
	letter-spacing: .05em;
	line-height: 1.4;
	text-align: center;
	color: var(--rt-muted);
}

/* ------------------------------------------------- direccion con Google Maps */
/* Escrita a mano se equivocan y el mensajero se pierde. Elegida del mapa viene
   con coordenadas, y el reparto sale con destino exacto. */

.rt-addr { text-align: left; }
.rt-addr .rt-search { position: relative; display: flex; align-items: center; }
.rt-addr .rt-search[hidden] { display: none; }
.rt-addr .rt-search__icon {
	position: absolute;
	left: .95rem;
	width: 1.15rem;
	height: 1.15rem;
	color: var(--rt-faint);
	pointer-events: none;
}
.rt-addr .rt-order__input { padding-left: 2.7rem; }
.rt-addr .rt-search.is-bad .rt-order__input { border-color: var(--rt-bad); }
.rt-addr .rt-search.is-busy::after {
	content: "";
	position: absolute;
	right: 1rem;
	width: 1.05rem;
	height: 1.05rem;
	border: 2px solid var(--rt-line);
	border-top-color: var(--rt-gold-deep);
	border-radius: 50%;
	animation: rt-spin .6s linear infinite;
}
@keyframes rt-spin { to { transform: rotate(360deg); } }

.rt-addr__list { display: grid; gap: .3rem; margin-top: .5rem; }
.rt-addr__hit {
	width: 100%;
	padding: .7rem .9rem;
	border: 1px solid var(--rt-line);
	border-radius: var(--rt-r);
	background: var(--rt-bg);
	font: inherit;
	font-size: .95rem;
	color: var(--rt-ink);
	text-align: left;
	cursor: pointer;
}
.rt-addr__hit:hover { border-color: var(--rt-gold-line); background: var(--rt-gold-soft); }
.rt-addr__none { margin: .6rem 0 0; font-size: .88rem; color: var(--rt-muted); text-align: center; }

.rt-addr__picked {
	display: flex;
	align-items: center;
	gap: .6rem;
	padding: .85rem 1rem;
	border: 1px solid var(--rt-good-line);
	border-radius: var(--rt-r);
	background: var(--rt-good-soft);
	font-size: .95rem;
	font-weight: 600;
	color: var(--rt-ink);
}
.rt-addr__picked[hidden] { display: none; }
.rt-addr__tick { width: 1.15rem; height: 1.15rem; flex: none; color: var(--rt-good); stroke-width: 2.6; }
.rt-addr__picked span { flex: 1 1 auto; }
.rt-addr__change {
	flex: none;
	border: 0;
	background: none;
	padding: 0;
	font: inherit;
	font-size: .85rem;
	font-weight: 650;
	color: var(--rt-gold-deep);
	text-decoration: underline;
	cursor: pointer;
}

.rt-otheraddress [data-rt-addrextra][hidden] { display: none; }
.rt-otheraddress .rt-order__fields { margin-top: 1rem; }

/* Base e IVA, separados: los precios del sitio van sin IVA */
.rt-summary__line {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 1rem;
	margin: .2rem 0 0;
	font-size: .92rem;
	color: var(--rt-muted);
}
.rt-summary__line strong { color: var(--rt-ink); font-variant-numeric: tabular-nums; }
.rt-pick__price em { font-style: normal; color: var(--rt-faint); font-size: .85em; }

/* Los datos del cliente, dentro del ultimo paso del formulario */
.rt-details { margin-top: 2rem; padding-top: 1.75rem; border-top: 1px solid var(--rt-line); }
.rt-details .rt-order__fields { margin-top: 1rem; }