/* =====================================================================
 * Tarifas Eléctrica de Cádiz — Frontend
 * Todo scopeado bajo .edc-tarifas / .edc-recommender (BEM).
 *
 * El widget vive dentro de temas de terceros que suelen pintar fondos,
 * sombras y colores en :hover / :focus / :active de botones y enlaces.
 * Por eso los elementos interactivos fijan su fondo y color en todos los
 * estados (con !important acotado al scope del plugin) para que el tema
 * anfitrión nunca asome.
 * ===================================================================== */

.edc-tarifas,
.edc-recommender {
	--edc-text: #363636;
	--edc-muted: #6b6b6b;
	--edc-border: #ececec;
	--edc-card-bg: #ffffff;
	--edc-radius: 22px;
	--edc-radius-sm: 14px;
	--edc-color: #363636;
	--edc-accent: #363636;

	font-family: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	color: var(--edc-text);
	font-size: 18px;
	font-weight: 500;
	line-height: 1.5;
	box-sizing: border-box;
}

.edc-tarifas *,
.edc-tarifas *::before,
.edc-tarifas *::after,
.edc-recommender *,
.edc-recommender *::before,
.edc-recommender *::after {
	box-sizing: inherit;
}

/* Neutraliza el estilismo del tema en los interactivos del plugin. */
.edc-tarifas button,
.edc-tarifas a,
.edc-recommender button,
.edc-recommender a {
	background-image: none;
	box-shadow: none;
	text-transform: none;
	letter-spacing: normal;
	text-shadow: none;
}

.edc-svg {
	width: 1em;
	height: 1em;
	display: inline-block;
	vertical-align: middle;
}

.edc-tarifas .screen-reader-text,
.edc-recommender .screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* --------------------------------------------------------------------- *
 * Rejilla de cards
 * --------------------------------------------------------------------- */

.edc-tarifas__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
	align-items: start;
}

@media (min-width: 768px) and (max-width: 1023px) {
	.edc-tarifas__grid {
		grid-template-columns: repeat(2, 1fr);
	}

	/* Una card impar sobrante no queda descolgada: se centra bajo las dos. */
	.edc-tarifas:not([data-carousel="1"]) .edc-tarifas__grid > .edc-tarifas__card:last-child:nth-child(odd) {
		grid-column: 1 / -1;
		justify-self: center;
		width: 100%;
		max-width: calc(50% - 12px);
	}
}

@media (max-width: 767px) {
	.edc-tarifas__grid {
		grid-template-columns: 1fr;
	}
}

/* --------------------------------------------------------------------- *
 * Carrusel responsive (opcional, controlado desde el widget)
 * --------------------------------------------------------------------- */

.edc-tarifas__dots {
	display: none;
	justify-content: center;
	gap: 9px;
	margin-top: 20px;
}

.edc-tarifas__dot {
	width: 9px;
	height: 9px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: color-mix(in srgb, var(--edc-color) 28%, #fff) !important;
	background-image: none !important;
	box-shadow: none;
	cursor: pointer;
	transition: transform 0.2s ease, background-color 0.2s ease;
}

.edc-tarifas__dot.is-active {
	background: var(--edc-color) !important;
	transform: scale(1.35);
}

.edc-tarifas__dot:focus-visible {
	outline: 2px solid var(--edc-color);
	outline-offset: 3px;
}

@media (max-width: 1023px) {
	.edc-tarifas[data-carousel="1"] .edc-tarifas__grid {
		display: flex;
		grid-template-columns: none;
		flex-wrap: nowrap;
		position: relative;
		gap: 16px;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
		padding: 4px 2px 10px;
		margin-inline: -2px;
	}

	.edc-tarifas[data-carousel="1"] .edc-tarifas__grid::-webkit-scrollbar {
		display: none;
	}

	.edc-tarifas[data-carousel="1"] .edc-tarifas__card {
		flex: 0 0 48%;
		scroll-snap-align: center;
	}

	.edc-tarifas[data-carousel="1"] .edc-tarifas__dots {
		display: flex;
	}
}

@media (max-width: 767px) {
	.edc-tarifas[data-carousel="1"] .edc-tarifas__card {
		flex: 0 0 86%;
	}
}

@media (prefers-reduced-motion: reduce) {
	.edc-tarifas[data-carousel="1"] .edc-tarifas__grid {
		scroll-behavior: auto;
	}

	.edc-tarifas__dot {
		transition: none;
	}
}

/* --------------------------------------------------------------------- *
 * Card
 * --------------------------------------------------------------------- */

.edc-tarifas__card {
	display: flex;
	flex-direction: column;
	background: var(--edc-card-bg);
	border: 1px solid var(--edc-border);
	border-radius: var(--edc-radius);
	overflow: hidden;
	box-shadow: 0 12px 30px rgba(0, 0, 0, 0.05);
	padding-bottom: 30px !important;
}

/* Bloque superior (claim → "Saber más"): su altura se iguala entre columnas
 * para que el CTA y "Saber más" queden siempre alineados. El detalle vive
 * por debajo, fuera de este bloque, y al abrirse no desplaza los botones. */
.edc-tarifas__top {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
}

/* La imagen va a sangre; el resto del contenido lleva su margen lateral.
 * Se fuerza con especificidad e !important para que el tema anfitrión no
 * anule el padding (algunos temas resetean el padding de los div). */
.edc-tarifas__card .edc-tarifas__top,
.edc-tarifas__card .edc-tarifas__detail {
	padding-left: 26px !important;
	padding-right: 26px !important;
}

.edc-tarifas__card .edc-tarifas__top {
	padding-top: 26px !important;
}

.edc-tarifas__price-block {
	display: flex;
	flex-direction: column;
}

.edc-tarifas__media {
	position: relative;
	width: 100%;
	aspect-ratio: 400 / 230;
	background: color-mix(in srgb, var(--edc-color) 12%, #fff);
}

.edc-tarifas__img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.edc-tarifas__img--placeholder {
	background: linear-gradient(135deg, color-mix(in srgb, var(--edc-color) 18%, #fff), color-mix(in srgb, var(--edc-accent) 10%, #fff));
}

.edc-tarifas__badge {
	position: absolute;
	top: 14px;
	right: 14px;
	z-index: 2;
	background: #fff;
	color: var(--edc-color);
	font-size: 13px;
	font-weight: 600;
	padding: 6px 14px;
	border-radius: 999px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}

/* Nombre superpuesto sobre la imagen, en el color de la tarifa. */
.edc-tarifas__name {
	position: absolute;
	inset: 0;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0;
	padding: 16px 20px;
	text-align: center;
	color: var(--edc-color);
	font-size: clamp(26px, 2.4vw, 34px);
	font-weight: 700;
	line-height: 1.1;
	text-shadow: 0 1px 2px rgba(255, 255, 255, 0.65), 0 2px 16px rgba(255, 255, 255, 0.55);
}

.edc-tarifas__claim {
	margin: 0 0 18px;
	font-size: 16px;
	color: var(--edc-muted);
}

/* Precio */

.edc-tarifas__price {
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: 8px;
	margin-bottom: 18px;
}

.edc-tarifas__price-prefix {
	font-size: 18px;
	font-weight: 500;
	color: var(--edc-color);
}

.edc-tarifas__price-old {
	font-size: 18px;
	color: var(--edc-muted);
	text-decoration: line-through;
}

.edc-tarifas__price-main {
	font-size: clamp(26px, 2.4vw, 34px);
	font-weight: 700;
	color: var(--edc-color);
}

.edc-tarifas__price-unit {
	font-size: 18px;
	color: var(--edc-color);
}

.edc-tarifas__price-caption {
	margin: -12px 0 14px;
	font-size: 13px !important;
	font-weight: 600;
	line-height: 1.3;
	color: var(--edc-color);
}

/* Ventajas */

.edc-tarifas__advantages {
	list-style: none;
	margin: 0 0 22px;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 12px;
	flex: 1 0 auto;
}

.edc-tarifas__advantage {
	display: flex;
	align-items: flex-start;
	gap: 12px;
}

.edc-tarifas__check {
	flex: 0 0 auto;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	background: var(--edc-color);
	color: #fff;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin-top: 1px;
}

.edc-tarifas__check .edc-svg {
	width: 15px;
	height: 15px;
}

.edc-tarifas__advantage-text {
	font-size: 16px;
	line-height: 1.35;
}

/* CTA */

.edc-tarifas__actions {
	margin-bottom: 14px;
}

.edc-tarifas__cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 52px;
	padding: 12px 24px;
	border-radius: 999px;
	border: 1.5px solid var(--edc-color);
	background: color-mix(in srgb, var(--edc-color) 8%, #fff) !important;
	background-image: none !important;
	color: var(--edc-color) !important;
	box-shadow: none;
	font-family: inherit;
	font-size: 16px;
	font-weight: 600;
	text-decoration: none;
	cursor: pointer;
	transition: background-color 0.15s ease, color 0.15s ease;
}

.edc-tarifas__cta:hover,
.edc-tarifas__cta:focus-visible,
.edc-tarifas__cta:active {
	background: var(--edc-color) !important;
	color: #fff !important;
	outline: none;
}

/* Evita que el fondo del tema aparezca al mantener el foco tras el clic. */
.edc-tarifas__cta:focus:not(:focus-visible) {
	background: color-mix(in srgb, var(--edc-color) 8%, #fff) !important;
	color: var(--edc-color) !important;
}

.edc-tarifas__cta:focus-visible {
	outline: 2px solid var(--edc-color);
	outline-offset: 3px;
}

.edc-tarifas__cta[disabled] {
	opacity: 0.5;
	cursor: not-allowed;
}

/* Saber más */

.edc-tarifas__more {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	align-self: center;
	background: transparent !important;
	background-image: none !important;
	border: 0;
	box-shadow: none;
	padding: 6px 4px;
	color: var(--edc-color) !important;
	font-family: inherit;
	font-size: 16px;
	font-weight: 600;
	cursor: pointer;
}

.edc-tarifas__more:hover,
.edc-tarifas__more:focus,
.edc-tarifas__more:active {
	background: transparent !important;
	color: var(--edc-color) !important;
}

.edc-tarifas__more .edc-svg {
	transition: transform 0.28s ease;
}

.edc-tarifas__more.is-open .edc-svg {
	transform: rotate(180deg);
}

.edc-tarifas__more:focus-visible {
	outline: 2px solid var(--edc-color);
	outline-offset: 3px;
	border-radius: 6px;
}

/* Acordeón de detalle: animación sutil con grid (0fr -> 1fr). */
.edc-tarifas__detail {
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows 0.34s cubic-bezier(0.25, 0.1, 0.25, 1);
}

.edc-tarifas__detail.is-open {
	grid-template-rows: 1fr;
}

.edc-tarifas__detail-inner {
	overflow: hidden;
	min-height: 0;
	visibility: hidden;
	opacity: 0;
	transition: opacity 0.28s ease, visibility 0.34s ease;
}

.edc-tarifas__detail.is-open .edc-tarifas__detail-inner {
	visibility: visible;
	opacity: 1;
}

.edc-tarifas__detail-sep {
	margin-top: 18px;
	border-top: 1px solid var(--edc-border);
	padding-top: 18px;
	display: flex;
	flex-direction: column;
}

.edc-tarifas__detail-list {
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.edc-tarifas__detail-item {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.edc-tarifas__detail-item dt {
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--edc-muted);
	font-weight: 600;
}

.edc-tarifas__detail-item dd {
	margin: 0;
	font-size: 16px;
}

.edc-tarifas__detail-period {
	display: inline-block;
	margin-right: 14px;
}

.edc-tarifas__detail-note {
	color: var(--edc-muted);
	font-style: normal;
	font-size: 14px;
}

.edc-tarifas__detail-others {
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.edc-tarifas__detail-message {
	font-style: italic;
	color: var(--edc-color);
}

/* Asterisco de la nota del precio (principal y detalle). */
.edc-tarifas__price-star,
.edc-tarifas__detail-star {
	color: var(--edc-color);
	font-weight: 700;
	line-height: 0;
}

.edc-tarifas__price-star {
	font-size: 16px;
	margin-left: 3px;
	vertical-align: super;
	line-height: 1;
}

.edc-tarifas__detail-star {
	font-size: 11px;
	margin-left: 1px;
	vertical-align: super;
}

/* Aclaración legal bajo el precio de la energía. */
.edc-tarifas__detail-legal {
	margin: 4px 0 0;
	font-size: 12px;
	font-style: normal;
	line-height: 1.4;
	color: var(--edc-muted);
}

/* Condiciones generales de contratación (enlace al PDF).
 * margin-top:auto lo empuja al fondo del detalle: como todas las cards igualan
 * la altura de su detalle, los enlaces quedan alineados a la misma altura. */
.edc-tarifas__terms {
	margin-top: auto;
	padding-top: 16px;
	text-align: left;
	border-top: 1px solid var(--edc-border);
}

.edc-tarifas__terms-link,
.edc-tarifas__terms-link:link,
.edc-tarifas__terms-link:visited {
	display: inline-flex;
	align-items: center;
	justify-content: flex-start;
	gap: 9px;
	margin-left: 0 !important;
	text-indent: 0;
	color: var(--edc-color) !important;
	background: transparent !important;
	background-image: none !important;
	box-shadow: none;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.35;
	text-decoration: none !important;
	transition: opacity 0.15s ease;
}

.edc-tarifas__terms-link:hover,
.edc-tarifas__terms-link:focus-visible {
	color: var(--edc-color) !important;
	opacity: 0.72;
}

.edc-tarifas__terms-link:focus-visible {
	outline: 2px solid var(--edc-color);
	outline-offset: 3px;
	border-radius: 4px;
}

.edc-tarifas__terms-label {
	text-decoration: underline;
	text-underline-offset: 2px;
}

.edc-tarifas__terms-icon {
	flex: 0 0 auto;
	display: inline-flex;
}

.edc-tarifas__terms-icon svg {
	width: 18px;
	height: 18px;
	display: block;
}

/* --------------------------------------------------------------------- *
 * Selector Con IVA / Sin IVA
 * --------------------------------------------------------------------- */

.edc-tarifas__iva {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	margin-top: 28px;
	font-size: 16px;
	color: var(--edc-muted);
}

.edc-switch {
	position: relative;
	display: inline-flex;
	align-items: center;
	cursor: pointer;
}

.edc-switch__input {
	position: absolute;
	opacity: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	cursor: pointer;
}

.edc-switch__track {
	width: 52px;
	height: 28px;
	border-radius: 999px;
	background: #d7d7d7;
	position: relative;
	transition: background-color 0.15s ease;
	display: inline-block;
}

.edc-switch__thumb {
	position: absolute;
	top: 3px;
	left: 3px;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background: #fff;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
	transition: transform 0.15s ease;
}

.edc-switch__input:checked + .edc-switch__track {
	background: #A90A2E;
}

.edc-switch__input:checked + .edc-switch__track .edc-switch__thumb {
	transform: translateX(24px);
}

.edc-switch__input:focus-visible + .edc-switch__track {
	outline: 2px solid var(--edc-text);
	outline-offset: 2px;
}

.edc-tarifas--con-iva .edc-tarifas__iva-label[data-side="con"],
.edc-tarifas--sin-iva .edc-tarifas__iva-label[data-side="sin"] {
	color: var(--edc-text);
	font-weight: 600;
}

@media (prefers-reduced-motion: reduce) {
	.edc-tarifas__more .edc-svg,
	.edc-tarifas__detail,
	.edc-tarifas__detail-inner,
	.edc-switch__track,
	.edc-switch__thumb,
	.edc-tarifas__cta {
		transition: none;
	}
}

/* =====================================================================
 * Recomendador
 * ===================================================================== */

.edc-recommender__inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 14px;
}

.edc-recommender__intro {
	margin: 0;
	font-size: 18px;
	font-weight: 600;
	color: var(--edc-text);
}

.edc-recommender__trigger {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	background: #363636 !important;
	background-image: none !important;
	color: #fff !important;
	border: 0;
	box-shadow: none;
	border-radius: 999px;
	padding: 15px 30px;
	font-family: "Montserrat", sans-serif;
	font-size: 16px;
	font-weight: 500;
	cursor: pointer;
	transition: background-color 0.15s ease;
}

.edc-recommender__trigger:hover,
.edc-recommender__trigger:focus-visible,
.edc-recommender__trigger:active {
	background: #1f1f1f !important;
	color: #fff !important;
}

.edc-recommender__trigger:focus:not(:focus-visible) {
	background: #363636 !important;
}

.edc-recommender__trigger:focus-visible {
	outline: 2px solid #363636;
	outline-offset: 3px;
}

/* --------------------------- Overlay + modal ------------------------- */

.edc-recommender__overlay {
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 16px;
	background: rgba(35, 35, 35, 0.55);
}

.edc-recommender__overlay[hidden] {
	display: none;
}

.edc-recommender__modal {
	position: relative;
	width: 100%;
	max-width: 760px;
	max-height: 90vh;
	overflow-y: auto;
	background: #fff;
	border-radius: 28px;
	padding: 48px 48px 40px;
	box-shadow: 0 30px 80px rgba(0, 0, 0, 0.3);
	font-family: "Montserrat", sans-serif;
	color: var(--edc-text);
}

.edc-recommender__close {
	position: absolute;
	top: 20px;
	right: 20px;
	width: 42px;
	height: 42px;
	border: 0;
	box-shadow: none;
	border-radius: 50%;
	background: #f2f2f2 !important;
	background-image: none !important;
	color: #363636 !important;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	transition: background-color 0.15s ease;
}

.edc-recommender__close:hover,
.edc-recommender__close:focus-visible,
.edc-recommender__close:active {
	background: #e4e4e4 !important;
	color: #363636 !important;
}

.edc-recommender__close:focus:not(:focus-visible) {
	background: #f2f2f2 !important;
}

.edc-recommender__close:focus-visible {
	outline: 2px solid #363636;
	outline-offset: 2px;
}

/* Pasos */

.edc-recommender__steps {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	margin: 8px 0 26px;
}

.edc-recommender__step {
	width: 34px;
	height: 34px;
	border-radius: 50%;
	border: 2px solid #d7d7d7;
	color: #b5b5b5;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 14px;
	font-weight: 600;
	flex: 0 0 auto;
	background: #fff;
}

.edc-recommender__step.is-active {
	background: #363636;
	border-color: #363636;
	color: #fff;
}

.edc-recommender__step.is-done {
	border-color: #363636;
	color: #363636;
}

.edc-recommender__steps-line {
	width: 42px;
	height: 2px;
	background: #e0e0e0;
}

/* Pregunta y opciones */

.edc-recommender__question {
	margin: 0 0 24px;
	font-size: clamp(24px, 3vw, 32px);
	font-weight: 700;
	line-height: 1.15;
	text-align: center;
}

.edc-recommender__options {
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.edc-recommender__option {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	width: 100%;
	max-width: 100%;
	text-align: left;
	white-space: normal;
	background: #fafafa !important;
	background-image: none !important;
	color: var(--edc-text) !important;
	border: 1.5px solid #e6e6e6;
	box-shadow: none;
	border-radius: var(--edc-radius-sm);
	padding: 20px 22px;
	font-family: inherit;
	font-size: 17px;
	line-height: 1.35;
	cursor: pointer;
	transition: border-color 0.15s ease, background-color 0.15s ease;
}

.edc-recommender__option:hover {
	background: #f2f2f2 !important;
	color: var(--edc-text) !important;
	border-color: #bdbdbd;
}

.edc-recommender__option:active {
	background: #f2f2f2 !important;
	color: var(--edc-text) !important;
}

.edc-recommender__option:focus:not(:focus-visible) {
	background: #fafafa !important;
}

.edc-recommender__option:focus-visible {
	outline: 2px solid #363636;
	outline-offset: 2px;
}

.edc-recommender__option.is-selected {
	border-color: #363636;
	background: #fff !important;
	color: var(--edc-text) !important;
}

.edc-recommender__option.is-selected:hover {
	background: #fff !important;
}

.edc-recommender__option-text {
	flex: 1 1 auto;
	min-width: 0;
	overflow-wrap: break-word;
	word-break: break-word;
}

.edc-recommender__radio {
	flex: 0 0 auto;
	width: 24px;
	height: 24px;
	border-radius: 50%;
	border: 2px solid #cfcfcf;
	background: #fff;
	position: relative;
	transition: border-color 0.15s ease;
}

.edc-recommender__option.is-selected .edc-recommender__radio {
	border-color: #363636;
}

.edc-recommender__option.is-selected .edc-recommender__radio::after {
	content: "";
	position: absolute;
	inset: 4px;
	border-radius: 50%;
	background: #363636;
}

/* Navegación */

.edc-recommender__nav {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: 30px;
}

.edc-recommender__nav[hidden] {
	display: none;
}

.edc-recommender__prev {
	background: transparent !important;
	background-image: none !important;
	border: 0;
	box-shadow: none;
	color: #6b6b6b !important;
	font-family: inherit;
	font-size: 16px;
	font-weight: 500;
	cursor: pointer;
	padding: 10px 6px;
	transition: color 0.15s ease;
}

.edc-recommender__prev:hover,
.edc-recommender__prev:focus-visible,
.edc-recommender__prev:active {
	background: transparent !important;
	color: #363636 !important;
}

.edc-recommender__prev:focus-visible {
	outline: 2px solid #363636;
	outline-offset: 2px;
	border-radius: 6px;
}

.edc-recommender__next {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	background: #363636 !important;
	background-image: none !important;
	color: #fff !important;
	border: 0;
	box-shadow: none;
	border-radius: 999px;
	padding: 14px 26px;
	font-family: inherit;
	font-size: 16px;
	font-weight: 500;
	cursor: pointer;
	margin-left: auto;
	transition: background-color 0.15s ease;
}

.edc-recommender__next:hover,
.edc-recommender__next:focus-visible,
.edc-recommender__next:active {
	background: #1f1f1f !important;
	color: #fff !important;
}

.edc-recommender__next:focus:not(:focus-visible) {
	background: #363636 !important;
}

.edc-recommender__next:focus-visible {
	outline: 2px solid #363636;
	outline-offset: 3px;
}

.edc-recommender__next:disabled {
	opacity: 0.45;
	cursor: not-allowed;
}

/* Resultado */

.edc-recommender__result {
	text-align: center;
}

.edc-recommender__result[hidden] {
	display: none;
}

.edc-recommender__result-heading {
	margin: 0 0 22px;
	font-size: clamp(22px, 2.6vw, 28px);
	font-weight: 700;
}

.edc-recommender__result-media {
	position: relative;
	width: 100%;
	max-width: 420px;
	margin: 0 auto 22px;
	aspect-ratio: 400 / 230;
	border-radius: 24px;
	overflow: hidden;
	background: color-mix(in srgb, var(--edc-color) 12%, #fff);
	display: flex;
	align-items: center;
	justify-content: center;
}

.edc-recommender__result-media img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 24px;
}

/* Nombre de la tarifa en el color de la propia tarifa (igual que el CTA). */
.edc-recommender__result-name {
	position: relative;
	z-index: 1;
	color: var(--edc-color, #363636);
	font-size: clamp(26px, 3vw, 34px);
	font-weight: 700;
	text-shadow: 0 1px 2px rgba(255, 255, 255, 0.65), 0 2px 16px rgba(255, 255, 255, 0.55);
	padding: 0 16px;
}

.edc-recommender__result-desc {
	margin: 0 auto 18px;
	max-width: 460px;
	font-size: 17px;
	color: #4a4a4a;
}

.edc-recommender__result-note {
	margin: 0 auto 22px;
	max-width: 460px;
	font-size: 14px;
	color: #8a8a8a;
}

.edc-recommender__cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 54px;
	padding: 14px 40px;
	border-radius: 999px;
	border: 0;
	background: var(--edc-color, #363636) !important;
	background-image: none !important;
	color: #fff !important;
	box-shadow: none;
	font-family: inherit;
	font-size: 17px;
	font-weight: 600;
	text-decoration: none;
	cursor: pointer;
	transition: filter 0.15s ease;
}

.edc-recommender__cta:hover,
.edc-recommender__cta:focus-visible,
.edc-recommender__cta:active {
	background: var(--edc-color, #363636) !important;
	color: #fff !important;
	filter: brightness(0.92);
}

.edc-recommender__cta:focus-visible {
	outline: 2px solid var(--edc-color, #363636);
	outline-offset: 3px;
}

.edc-recommender__cta[aria-disabled="true"] {
	opacity: 0.5;
	cursor: not-allowed;
	filter: none;
}

.edc-recommender__restart {
	display: block;
	margin: 16px auto 0;
	background: transparent !important;
	background-image: none !important;
	border: 0;
	box-shadow: none;
	color: #6b6b6b !important;
	font-family: inherit;
	font-size: 15px;
	font-weight: 500;
	cursor: pointer;
	text-decoration: underline;
	transition: color 0.15s ease;
}

.edc-recommender__restart:hover,
.edc-recommender__restart:focus-visible,
.edc-recommender__restart:active {
	background: transparent !important;
	color: #363636 !important;
}

.edc-recommender__restart:focus-visible {
	outline: 2px solid #363636;
	outline-offset: 2px;
	border-radius: 6px;
}

.edc-recommender__live {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

@media (max-width: 767px) {
	.edc-recommender__modal {
		width: calc(100% - 32px);
		padding: 40px 22px 30px;
		border-radius: 22px;
	}

	.edc-recommender__steps-line {
		width: 24px;
	}

	.edc-recommender__option {
		padding: 16px 18px;
		font-size: 16px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.edc-recommender__trigger,
	.edc-recommender__next,
	.edc-recommender__prev,
	.edc-recommender__option,
	.edc-recommender__radio,
	.edc-recommender__cta,
	.edc-recommender__restart,
	.edc-recommender__close {
		transition: none;
	}
}