/* ==========================================================================
   PRICE & AUTONOMY LAYOUT (DESKTOP)
   ========================================================================== */
.yadea-price-autonomy-container {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	width: 100%;
	margin-bottom: 20px;
	gap: 15px;
}
.yadea-price-col {
	flex: 1 1 auto;
}
.yadea-autonomy-col {
	flex: 0 0 auto;
	text-align: right;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
}
/**
 * Ficha de Producto Individual (Single Product) — Estilos BEM
 *
 * Diseño 60/40 (Galería / Información), con sidebar sticky a la derecha,
 * y un layout de Landing Page abajo.
 *
 * @author  Pablo Gamaliel Solis Arista
 * @url     https://gamalielsolis.com
 * @project Yadea México (yadea.mx)
 */

/* ==========================================================================
   CONTENEDOR PRINCIPAL: .yadea-single
   ========================================================================== */
.yadea-single {
	font-family: var(--yadea-font-primary);
	color: var(--yadea-dark);
}

/* ==========================================================================
   FIRST FOLD: Layout 3 Columnas (Grid)
   ========================================================================== */
.yadea-single__first-fold {
	display: grid;
	grid-template-columns: 120px 1fr 40%;
	/* Removed min-height to allow natural content wrapping, avoiding excessive top/bottom gaps on ultrawide/tall screens */ /* Altura aprox viewport menos header */
	border-bottom: 1px solid var(--yadea-border);
}

/* Columna Izquierda 1: Sidebar de productos */
.yadea-single__sidebar-col {
	background-color: var(--yadea-white);
	border-right: 1px solid var(--yadea-border);
	padding: 1rem 0;
	overflow-y: auto;
	max-height: calc(100vh - 80px);
}
.yadea-single__sidebar-col::-webkit-scrollbar { width: 4px; }
.yadea-single__sidebar-col::-webkit-scrollbar-thumb { background: #ddd; }

.yadea-single__sidebar-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
}

.yadea-single__sidebar-item {
	border-bottom: 1px solid var(--yadea-border);
}

.yadea-single__sidebar-link {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 1rem;
	text-decoration: none;
	color: var(--yadea-gray-text);
	transition: background-color var(--yadea-transition), color var(--yadea-transition);
}

.yadea-single__sidebar-link:hover {
	background-color: var(--yadea-gray-light);
	color: var(--yadea-orange);
}

.yadea-single__sidebar-img-wrapper {
	width: 100%;
	aspect-ratio: 1;
	background-color: var(--yadea-gray-light);
	margin-bottom: 0.5rem;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0.5rem;
}

.yadea-single__sidebar-img-wrapper img {
	width: 100%;
	height: auto;
	object-fit: contain;
	mix-blend-mode: multiply;
	filter: contrast(1.1);
}

.yadea-single__sidebar-title {
	font-family: var(--yadea-font-primary);
	font-size: 0.75rem;
	font-weight: 600;
	text-align: center;
	text-transform: uppercase;
}

/* Columna Central: Galería */
.yadea-single__gallery-col {
	background-color: var(--yadea-gray-light);
	padding: 1.5rem 3rem;
	display: flex;
	align-items: center;
	justify-content: center;
}

/* Ajustes de Imagen Limpia (Large/Full) */
.yadea-single__main-img {
	width: 100%;
	max-height: 70vh;
	object-fit: contain;
	display: block;
	margin: 0 auto;
	mix-blend-mode: multiply;
}

/* Columna Derecha: Resumen (Sticky) */
.yadea-single__summary-col {
	background-color: var(--yadea-white);
	padding: 3rem 2rem;
	border-left: 1px solid var(--yadea-border);
}

/* Contenedor sticky para que la info acompañe al hacer scroll en la galería */
.yadea-single__summary-inner {
	position: sticky;
	top: 100px; /* Margen superior bajo el header sticky */
}

/* Tipografía y Textos */
.yadea-single__title {
	font-size: clamp(2.5rem, 4vw, 3.5rem);
	font-weight: 900;
	text-transform: uppercase;
	margin: 0 0 1.5rem;
	line-height: 1.1;
	letter-spacing: -0.05em;
	color: var(--yadea-dark);
}

/* Secciones de opciones (Colores) */
.yadea-single__colors {
	margin-bottom: 2.5rem;
	padding-bottom: 2rem;
	border-bottom: 1px solid var(--yadea-border);
}

.yadea-single__options-title {
	font-size: 1.1rem;
	font-weight: 700;
	margin: 0 0 1rem;
	color: var(--yadea-dark);
}

.yadea-single__colors-mock {
	display: flex;
	align-items: center;
	gap: 1rem;
}

.yadea-color-dot {
	width: 32px;
	height: 32px;
	border-radius: 50%;
	display: block;
	cursor: pointer;
	box-shadow: 0 2px 4px rgba(0,0,0,0.1);
	transition: transform 0.2s ease;
}

.yadea-color-dot:hover {
	transform: scale(1.1);
}

.yadea-color-label {
	font-size: 0.9rem;
	color: var(--yadea-gray-text);
	margin-left: 1rem;
}

/* Bloque de Precio */
.yadea-single__price-box {
	margin-bottom: 0.5rem;
}

.yadea-single__price-label {
	font-size: 1rem;
	color: var(--yadea-gray-text);
	margin: 0 0 0.5rem;
}


.yadea-single__price {
	font-size: 2.5rem;
	font-weight: 800;
	color: var(--yadea-orange);
	line-height: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}


.yadea-single__price .woocommerce-Price-amount {
	color: var(--yadea-orange) !important;
	font-weight: 900;
}


.yadea-single__price del {
	font-size: 1.25rem;
	color: #a0a0a0;
	font-weight: 500;
	display: block;
	margin-right: 0 !important;
    margin-bottom: 5px;
	text-decoration: line-through !important;
	opacity: 0.7;
}

.yadea-single__price del .woocommerce-Price-amount {
	color: #a0a0a0 !important;
	font-weight: 500 !important;
}

.yadea-single__price ins {
	text-decoration: none !important;
	background: transparent !important;
}

.yadea-single__tax-note {
	font-size: 0.85rem;
	color: var(--yadea-gray-text);
	font-style: italic;
	margin: 0.5rem 0 0;
}

/* Call to Action (Reservar en Tienda / Comprar nativo) */
.yadea-single__btn-buy,
.single_add_to_cart_button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	padding: 1.25rem 2rem;
	background-color: var(--yadea-orange);
	color: var(--yadea-white);
	border: none;
	border-radius: 4px;
	text-decoration: none;
	font-family: var(--yadea-font-primary);
	font-size: 1.2rem;
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	cursor: pointer;
	transition: background-color var(--yadea-transition), transform var(--yadea-transition);
}

.yadea-single__btn-buy:hover,
.single_add_to_cart_button:hover {
	background-color: var(--yadea-orange-hover, #e65500);
	transform: translateY(-2px);
	color: var(--yadea-white);
}

/* Ocultar el input de cantidad (Opcional, para estilo catálogo 1 pieza) */
.woocommerce div.product form.cart div.quantity {
	display: none !important;
}


/* ==========================================================================
   SECOND FOLD: Landing Page
   ========================================================================== */
.yadea-landing {
	background-color: var(--yadea-white);
}

.yadea-section {
	padding: 5rem 0;
	border-bottom: 1px solid var(--yadea-border);
}

.yadea-landing__container {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 2rem;
}

.yadea-landing__heading {
	font-size: 2.25rem;
	font-weight: 800;
	text-align: center;
	margin: 0 0 3rem;
}

.yadea-landing__heading::after {
	content: '';
	display: block;
	width: 60px;
	height: 3px;
	background-color: var(--yadea-orange);
	margin: 0.75rem auto 0;
}

/* Espaciadores vacíos listos para contenido en bloque */
.yadea-landing__features-grid,
.yadea-landing__performance-content,
.yadea-landing__specs-table-wrapper {
	min-height: 200px;
	background-color: var(--yadea-gray-light);
	border: 1px dashed #ccc;
	display: flex;
	align-items: center;
	justify-content: center;
}
.yadea-landing__features-grid::before,
.yadea-landing__performance-content::before,
.yadea-landing__specs-table-wrapper::before {
	content: 'Área de inyección de contenido (ACF / Gutenberg)';
	color: #999;
	font-size: 0.9rem;
}

/* Grids Dinámicos de Landing (Custom Templates) */
.yadea-landing__grid {
	display: grid;
	gap: 2rem;
	align-items: center;
}

.yadea-landing__grid--2col { grid-template-columns: 1fr 1fr; }
.yadea-landing__grid--3col { grid-template-columns: repeat(3, 1fr); }
.yadea-landing__grid--4col { grid-template-columns: repeat(4, 1fr); }

.yadea-landing__content h3 {
	font-size: 1.5rem;
	margin-bottom: 1rem;
	color: var(--yadea-orange);
}

.yadea-landing__content p, .yadea-landing__content ul {
	margin-bottom: 1.5rem;
	color: var(--yadea-gray-text);
	line-height: 1.6;
}

.yadea-landing__image img {
	width: 100%;
	height: auto;
	border-radius: 8px;
}

.yadea-section--dark {
	background-color: var(--yadea-dark);
	color: var(--yadea-white);
}

.yadea-section--gray {
	background-color: var(--yadea-gray-light);
}

.yadea-heading--white {
	color: var(--yadea-white);
}

.yadea-landing__performance-stats {
	display: flex;
	justify-content: center;
	gap: 4rem;
	margin-bottom: 3rem;
	flex-wrap: wrap;
}

.yadea-landing__stat {
	text-align: center;
}

.yadea-landing__stat-value {
	display: block;
	font-size: 3rem;
	font-weight: 900;
	color: var(--yadea-orange);
	margin-bottom: 0.5rem;
}

.yadea-landing__stat-label {
	font-size: 1rem;
	color: #ccc;
}

.yadea-landing__card {
	text-align: center;
}

.yadea-landing__card img {
	width: 100%;
	max-width: 300px;
	height: auto;
	margin-bottom: 1.5rem;
	border-radius: 8px;
}

.yadea-landing__card h3 {
	font-size: 1.25rem;
	margin-bottom: 1rem;
}

.yadea-landing__feature-mini {
	text-align: center;
	padding: 2rem;
	background-color: var(--yadea-white);
	border-radius: 8px;
	box-shadow: 0 4px 6px rgba(0,0,0,0.05);
}

.yadea-landing__icon {
	font-size: 3rem;
	display: block;
	margin-bottom: 1rem;
}

/* ==========================================================================
   RESPONSIVE BREAKPOINTS
   ========================================================================== */
@media screen and (max-width: 1024px) {
	.yadea-single__first-fold {
		grid-template-columns: 100px 1fr 40%;
	}
	.yadea-single__gallery-col,
	.yadea-single__summary-col {
		padding: 2rem;
	}
	.yadea-landing__grid--4col {
		grid-template-columns: repeat(2, 1fr);
	}
}

@media screen and (max-width: 768px) {
/* Responsive Layout for Price/Autonomy Container */
	.yadea-price-autonomy-container {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		width: 100%;
		gap: 15px;
	}
	.yadea-price-col, .yadea-autonomy-col {
		width: 100%;
		text-align: center;
		align-items: center;
		display: flex;
		flex-direction: column;
	}
	/* Ensure variations table aligns cleanly inside center */
	.yadea-autonomy-col .variations {
		margin: 0 auto;
	}
	.yadea-autonomy-col .label {
		text-align: center !important;
		width: 100%;
	}
	.yadea-autonomy-col .value {
		display: flex;
		flex-direction: column;
		align-items: center; /* Center the wrapper of the radio buttons */
		width: 100%;
	}
	/* If the plugin generates a ul or div for the radios, center it */
	.yadea-autonomy-col .value > ul, 
	.yadea-autonomy-col .value > div,
	.yadea-autonomy-col .value > table {
		display: inline-flex !important;
		flex-direction: column;
		align-items: flex-start; /* Keep radios left-aligned relative to each other */
		margin: 0 auto !important; /* Center the block itself */
		padding: 0 !important;
	}
	.yadea-autonomy-col .value li {
		margin: 5px 0 !important;
	}
	.yadea-price-col .yadea-single__price {
		align-items: flex-start !important;
		word-break: break-word;
	}

	.yadea-single__first-fold {
		/* En celular apilamos: Sidebar oculto (o horizontal), luego galería, luego info */
		display: flex;
		flex-direction: column;
	}
	
	.yadea-single__sidebar-col {
		display: none; /* Ocultamos el catálogo rápido en celular por espacio */
	}

	.yadea-single__summary-col {
		border-left: none;
		border-top: 1px solid var(--yadea-border);
	}

	.yadea-single__summary-inner {
		position: static;
	}
	
	.yadea-section {
		padding: 3rem 0;
	}

	.yadea-landing__grid--2col,
	.yadea-landing__grid--3col,
	.yadea-landing__grid--4col {
		grid-template-columns: 1fr;
	}

	.yadea-landing__performance-stats {
		gap: 2rem;
	}

	/* ==========================================================================
	   COMPACT MOBILE SINGLE SCREEN VIEW
	   ========================================================================== */
	.yadea-btn-back { display: none !important; }
	.woocommerce-breadcrumb { display: none !important; }
	.yadea-single__tax-note { display: none !important; }
	.yadea-single__price-label { display: none !important; }
	.yadea-single__short-desc { display: none !important; }
	
	.yadea-single__gallery-col {
		padding: 0 !important;
		margin-top: 10px;
	}
	.yadea-single__main-img {
		max-height: 25vh !important;
		margin-bottom: 0 !important;
	}
	
	.yadea-single__summary-col {
		padding: 10px 15px !important;
		border-top: none !important;
	}
	
	.yadea-single__title {
		font-size: 1.8rem !important;
		margin-bottom: 5px !important;
		text-align: center;
	}
	
	.yadea-single__price-box {
		margin-bottom: 5px !important;
		margin-top: 15px !important;
	}
	.yadea-single__price .amount { font-size: 1.7rem !important; }
	.yadea-single__price span[style*="font-size:1.1rem"] {
		font-size: 0.85rem !important;
		margin-bottom: 2px !important;
	}
	
	/* Variations spacing */
	.variations_form { margin-top: 5px !important; }
	.variations { margin-bottom: 5px !important; }
	.variations th.label, .variations td.label { 
		padding-bottom: 5px !important; 
		margin-bottom: 0 !important;
	}
	.variations .label { margin-bottom: 5px !important; }
	
	.woo-variation-swatches { margin-bottom: 5px !important; }
	
	.woocommerce-variation-add-to-cart {
		margin-top: 10px !important;
	}
	.btn-sticky-cta {
		padding: 12px 20px !important;
		font-size: 1rem !important;
	}

}

/* Fin del archivo */

.yadea-landing__icon svg {
	color: var(--yadea-orange);
	display: block;
	margin: 0 auto;
}

/* ==========================================================================
   BREADCRUMBS — Migas de pan estilizadas
   ========================================================================== */
.yadea-breadcrumbs-bar {
    background-color: #f8f9fa !important;
    border-bottom: 1px solid #eee;
    width: 100%;
}
.woocommerce-breadcrumb {
    max-width: 1440px;
    margin: 0 auto;
    padding: 18px 5% !important;
    font-size: 0.85rem !important;
    color: #888 !important;
    font-family: inherit;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    opacity: 0.9;
}
.woocommerce-breadcrumb a {
    color: #111 !important;
    text-decoration: none !important;
    font-weight: 600;
    transition: color 0.2s ease;
}
.woocommerce-breadcrumb a:hover {
    color: #ff5000 !important;
}

/* ==========================================================================
   SIDEBAR — Filtro de imágenes para eliminar fondo blanco
   ========================================================================== */
.yadea-single__sidebar-img-wrapper,
.yadea-single__sidebar-img-wrapper *,
.sidebar-prod-item,
.sidebar-prod-item * {
	background: transparent !important;
	background-color: transparent !important;
}

.yadea-sidebar-upsells img,
.yadea-upsells img,
.yadea-single__sidebar-img-wrapper img {
	mix-blend-mode: multiply !important;
	filter: contrast(1.05) !important;
	width: 100%;
	height: auto;
	object-fit: contain;
}

.is-active-sidebar {
	border: 2px solid #ff5000;
	background-color: rgba(255,80,0,0.05);
	pointer-events: none;
}

/* ==========================================================================
   BOTÓN VOLVER AL CATÁLOGO
   ========================================================================== */
.yadea-btn-back {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	font-family: var(--yadea-font-primary);
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--yadea-gray-text);
	text-decoration: none;
	margin-bottom: 1.5rem;
	transition: color 0.3s ease;
}

.yadea-btn-back:hover {
	color: var(--yadea-orange);
}

/* ==========================================================================
   DESCRIPCIÓN CORTA DEBAJO DEL TÍTULO
   ========================================================================== */
.yadea-single__short-desc {
	font-size: 1rem;
	line-height: 1.7;
	color: var(--yadea-gray-text);
	margin-bottom: 1.5rem;
	padding-bottom: 1rem;
	border-bottom: 1px solid var(--yadea-border);
}

/* ==========================================================================
   SWATCHES DE COLOR — Ocultar select nativo, mostrar círculos
   ========================================================================== */
/* Restauración y Estilizado del Formulario Nativo de Variaciones */
.variations_form { margin-top: 10px; }
.variations_form .label { font-size: 0.9rem; font-weight: 700; text-transform: uppercase; letter-spacing: 1px; color: #111; margin-bottom: 8px; display: block; }
/* ==========================================================================
   SWATCHES DE VARIACIONES (CÍRCULOS DE COLOR)
   ========================================================================== */
.woo-variation-swatches .variable-items-wrapper .variable-item.color-variable-item {
    width: 32px !important;
    height: 32px !important;
    border-radius: 50% !important;
    border: 2px solid #e0e0e0 !important; /* Borde sutil para que colores como el blanco destaquen */
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
    transition: all 0.2s ease;
}
.woo-variation-swatches .variable-items-wrapper .variable-item.color-variable-item.selected {
    border-color: #ff5000 !important;
    transform: scale(1.1);
}

.yadea-color-dot {
	width: 30px;
	height: 30px;
	border-radius: 50%;
	display: inline-block;
	cursor: pointer;
	box-shadow: 0 2px 4px rgba(0,0,0,0.1);
	transition: transform 0.2s ease, box-shadow 0.2s ease;
	border: 2px solid transparent;
}

.yadea-color-dot:hover {
	transform: scale(1.15);
}

.yadea-color-dot.active {
	border-color: var(--yadea-orange);
	box-shadow: 0 0 0 3px rgba(255, 80, 0, 0.3);
}

/* ==========================================================================
   GALERÍA — Flechas de navegación
   ========================================================================== */
.yadea-gallery-nav {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	background: rgba(0,0,0,0.4);
	color: #fff;
	border: none;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	font-size: 1.2rem;
	cursor: pointer;
	z-index: 10;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background 0.3s ease;
}

.yadea-gallery-nav:hover {
	background: rgba(0,0,0,0.7);
}

.yadea-gallery-nav--prev {
	left: 1rem;
}

.yadea-gallery-nav--next {
	right: 1rem;
}

.yadea-single__gallery-col {
	position: relative;
}

/* ==========================================================================
   LANDING DESCRIPTION FALLBACK
   ========================================================================== */
.yadea-landing__description-content {
	max-width: 900px;
	margin: 0 auto;
	font-size: 1.05rem;
	line-height: 1.8;
	color: var(--yadea-gray-text);
}

.yadea-landing__description-content p {
	margin-bottom: 1.5rem;
}

/* ==========================================================================
   BREADCRUMBS — Migas de pan estilizadas
   ========================================================================== */
.woocommerce-breadcrumb {
	padding: 20px 5%;
	font-size: 0.9rem;
	color: #666;
	background-color: #f5f5f5;
	border-bottom: 1px solid #eaeaea;
	font-family: var(--yadea-font-primary);
}

.woocommerce-breadcrumb a {
	color: #333;
	text-decoration: none;
	transition: color 0.3s ease;
}

.woocommerce-breadcrumb a:hover {
	color: var(--yadea-orange);
}

/* ==========================================================================
   SIDEBAR — Filtro de imágenes para eliminar fondo blanco
   ========================================================================== */
.yadea-single__sidebar-img-wrapper img {
	mix-blend-mode: multiply;
	filter: contrast(1.1);
}

/* ==========================================================================
   BOTÓN VOLVER AL CATÁLOGO
   ========================================================================== */
.yadea-btn-back {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	font-family: var(--yadea-font-primary);
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--yadea-gray-text);
	text-decoration: none;
	margin-bottom: 1.5rem;
	transition: color 0.3s ease;
}

.yadea-btn-back:hover {
	color: var(--yadea-orange);
}

/* ==========================================================================
   DESCRIPCIÓN CORTA DEBAJO DEL TÍTULO
   ========================================================================== */
.yadea-single__short-desc {
	font-size: 1rem;
	line-height: 1.7;
	color: var(--yadea-gray-text);
	margin-bottom: 1.5rem;
	padding-bottom: 1rem;
	border-bottom: 1px solid var(--yadea-border);
}

/* ==========================================================================
   SWATCHES DE COLOR — Ocultar select nativo, mostrar círculos
   ========================================================================== */
.variations select {
	display: none;
}

.yadea-color-dot {
	width: 30px;
	height: 30px;
	border-radius: 50%;
	display: inline-block;
	cursor: pointer;
	box-shadow: 0 2px 4px rgba(0,0,0,0.1);
	transition: transform 0.2s ease, box-shadow 0.2s ease;
	border: 2px solid transparent;
}

.yadea-color-dot:hover {
	transform: scale(1.15);
}

.yadea-color-dot.active {
	border-color: var(--yadea-orange);
	box-shadow: 0 0 0 3px rgba(255, 80, 0, 0.3);
}

/* ==========================================================================
   GALERÍA — Flechas de navegación
   ========================================================================== */
.yadea-gallery-nav {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	background: rgba(0,0,0,0.4);
	color: #fff;
	border: none;
	width: 44px;
	height: 44px;
	border-radius: 50%;
	font-size: 1.2rem;
	cursor: pointer;
	z-index: 10;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: background 0.3s ease;
}

.yadea-gallery-nav:hover {
	background: rgba(0,0,0,0.7);
}

.yadea-gallery-nav--prev {
	left: 1rem;
}

.yadea-gallery-nav--next {
	right: 1rem;
}

.yadea-single__gallery-col {
	position: relative;
}

/* ==========================================================================
   LANDING DESCRIPTION FALLBACK
   ========================================================================== */
.yadea-landing__description-content {
	max-width: 900px;
	margin: 0 auto;
	font-size: 1.05rem;
	line-height: 1.8;
	color: var(--yadea-gray-text);
}

.yadea-landing__description-content p {
	margin-bottom: 1.5rem;
}

/* ==========================================================================
   FLECHAS DE NAVEGACIÓN DE GALERÍA (NATIVA)
   ========================================================================== */
.woocommerce-product-gallery .flex-direction-nav a { 
	display: flex !important; 
	align-items: center; 
	justify-content: center; 
	background: #fff; 
	color: #111; 
	width: 40px; 
	height: 40px; 
	border-radius: 50%; 
	box-shadow: 0 4px 10px rgba(0,0,0,0.15); 
	text-decoration: none; 
	font-size: 1.2rem; 
}

/* ==========================================================================
   BREADCRUMBS — Ultra-Minimalista
   ========================================================================== */
.yadea-breadcrumbs-bar {
    background-color: #ffffff !important;
    border-bottom: 1px solid #f0f0f0;
    width: 100%;
}
.woocommerce-breadcrumb {
    max-width: none;
    margin: 0;
    padding: 12px 3rem 12px calc(120px + 3rem) !important;
    font-size: 0.75rem !important;
    color: #999 !important;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 1px;
}
.woocommerce-breadcrumb a {
    color: #666 !important;
    text-decoration: none !important;
    transition: color 0.2s ease;
}
.woocommerce-breadcrumb a:hover {
    color: #ff5000 !important;
}

/* ==========================================================================
   STICKY BAR PREMIUM
   ========================================================================== */
.yadea-sticky-bar {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(10px);
    border-top: 1px solid #e5e5e5;
    z-index: 99999;
    transform: translateY(100%);
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    padding: 10px 0;
    box-shadow: 0 -4px 15px rgba(0,0,0,0.05);
}
.yadea-sticky-bar.is-visible { transform: translateY(0); }
.sticky-bar-flex { display: flex; justify-content: space-between; align-items: center; }
.sticky-cat { font-size: 0.7rem; color: #ff5000; text-transform: uppercase; font-weight: 700; display: block; }
.sticky-title { font-size: 1.1rem; margin: 0; font-weight: 700; color: #111; }
.sticky-bar-actions { display: flex; gap: 15px; align-items: center; }
.btn-scroll-top, .btn-scroll-top:visited { font-size: 0.85rem; color: #666; text-decoration: none; font-weight: 500; }
.btn-scroll-top:hover, .btn-scroll-top:hover:visited { color: #111; }
.btn-sticky-cta, .btn-sticky-cta:visited { background: #ff5000; color: #fff; padding: 10px 22px; border-radius: 4px; text-decoration: none; font-size: 0.9rem; font-weight: 700; transition: background 0.2s; }
.btn-sticky-cta:hover, .btn-sticky-cta:hover:visited { background: #e04500; color: #fff; }

/* ==========================================================================
   BOTÓN LIMPIAR VARIACIONES (.reset_variations)
   ========================================================================== */
.reset_variations {
    display: inline-block;
    margin-top: 15px;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: #888 !important;
    text-decoration: none !important;
    border-bottom: 1px dashed #ccc;
    padding-bottom: 2px;
    transition: all 0.3s ease;
}
.reset_variations:hover {
    color: #ff5000 !important;
    border-bottom-color: #ff5000;
}

/* ==========================================================================
   SHORT DESCRIPTION (WOOCOMMERCE)
   ========================================================================== */
.yadea-single__short-desc,
.yadea-single__short-desc p {
    text-align: justify !important;
}

/* ==========================================================================
   AJUSTES GLOBALES PARA MÓVIL
   ========================================================================== */
@media (max-width: 576px) {
    /* Corregir el padding loco de los breadcrumbs que los empujaba a la derecha */
    .woocommerce-breadcrumb {
        padding: 12px 20px !important;
        text-align: center;
    }

    /* Reducir el tamaño gigantesco del título del producto y centrarlo */
    .yadea-single__title {
        font-size: 2.2rem !important;
        text-align: center !important;
        word-break: normal !important;
        overflow-wrap: break-word !important;
        line-height: 1.2 !important;
        hyphens: none !important;
    }

    /* Centrar también la etiqueta "Volver al catálogo" */
    .yadea-btn-back {
        display: block;
        text-align: center;
        margin-bottom: 1rem;
    }

    /* Centrar precio y botón de compra */
    .yadea-single__price-box,
    .yadea-single__cta-box,
    .yadea-single__price-label,
    .yadea-single__tax-note,
    .price {
        text-align: center !important;
        justify-content: center !important;
    }

    /* Ajustar tamaño de fuente del precio para que no desborde */
    
    .yadea-single__price del .woocommerce-Price-amount {
        font-size: 1.25rem !important;
    }
    
    .yadea-single__price ins .woocommerce-Price-amount, .yadea-single__price > .woocommerce-Price-amount { font-size: 1.7rem !important; }
    
    .yadea-single__price {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 0.5rem;
    }
    
.yadea-single__price del {
	font-size: 1.25rem;
	color: #a0a0a0;
	font-weight: 500;
	display: block;
	margin-right: 0 !important;
    margin-bottom: 5px;
	text-decoration: line-through !important;
	opacity: 0.7;
}



    /* Ajustar el formulario de variaciones (selector de color) para centrarse */
    form.cart.variations_form {
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;
    }
    
    .variations {
        margin: 0 auto !important;
        width: 100%;
    }
    
    .variations th.label,
    .variations td.label {
        text-align: center !important;
        display: block !important;
        width: 100% !important;
        padding-bottom: 10px !important;
    }
    
    .variations td.value {
        display: flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
    }

    /* Evitar que "Limpiar" flote a la derecha de los colores, centrarlo abajo */
    .reset_variations {
        margin-top: 10px !important;
        display: block !important;
        text-align: center;
    }

    .woocommerce-variation-add-to-cart {
        display: flex;
        flex-direction: column;
        align-items: center;
        width: 100%;
        margin-top: 15px !important;
    }

    /* Reducir el tamaño inflado del botón de Solicitar Cotización */
    .yadea-single__btn-buy,
    .single_add_to_cart_button {
        padding: 0.9rem 1.5rem !important;
        font-size: 1rem !important;
    }
}


/* Ocultar la cruz roja de WooCommerce/Variation Swatches en atributos */
.woo-variation-swatches .variable-items-wrapper .variable-item::before,
.woo-variation-swatches .variable-items-wrapper .variable-item::after {
    display: none !important;
}
.woo-variation-swatches .variable-items-wrapper .variable-item.disabled {
    opacity: 0.4 !important;
    cursor: not-allowed !important;
}

/* ==========================================================================
   AJUSTES PARA LAPTOPS Y PANTALLAS MEDIANAS (1366x768 etc.)
   Objetivo: Hacer la columna derecha más compacta y asegurar que la moto 
   se vea completa en el primer pantallazo sin hacer scroll.
   ========================================================================== */
@media screen and (min-width: 769px) and (max-width: 1440px) {
    /* Compactar la columna derecha completa */
    .yadea-single__summary-col {
        padding: 1.5rem !important; /* Original era 3rem 2rem */
    }
    
    /* Achicar el título y sus márgenes */
    .yadea-single__title {
        font-size: 2rem !important;
        margin-bottom: 0.5rem !important;
    }
    
    /* Reducir el enorme hueco debajo de la descripción */
    .yadea-single__short-desc {
        margin-bottom: 1rem !important;
        padding-bottom: 1rem !important;
        font-size: 0.9rem !important;
        line-height: 1.5 !important;
    }
    
    /* Acercar el Precio a la descripción y a las variaciones */
    .yadea-single__price-box {
        margin-bottom: 0.5rem !important;
    }
    
    .yadea-single__price {
        font-size: 1.7rem !important;
    }
    
    /* Integrar el 72V 50Ah/80Ah (Variaciones) visualmente al área de precio */
    .variations_form {
        margin-top: 5px !important; /* Original 20px */
    }
    
    /* Reducir los espacios internos de las variaciones */
    .variations th.label, .variations td.label {
        padding-bottom: 2px !important;
        margin-bottom: 2px !important;
    }
    .woo-variation-swatches {
        margin-bottom: 5px !important;
    }
    
    /* Reducir el alto máximo de la imagen para garantizar que se vean las ruedas */
    .yadea-single__main-img {
        max-height: 60vh !important; /* Original era 70vh */
        margin-top: auto;
        margin-bottom: auto;
    }
    
    /* Achicar un poco el botón para ahorrar espacio */
    .btn-sticky-cta {
        padding: 12px 25px !important;
    }
}


/* ==========================================
   YADEA - GALERÍA ANTIPARPADEO GLOBAL
   ========================================== */

.yadea-single__gallery-col {
    position: relative;
    overflow: hidden;
    background-color: #f5f5f5;
}

.yadea-gallery-stage {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    height: 60vh !important;
    max-height: 650px !important;
    overflow: hidden !important;
    isolation: isolate;
}

.yadea-gallery-stage .yadea-gallery-layer {
    position: absolute !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100% !important;
    max-height: none !important;
    object-fit: contain !important;
    object-position: center !important;
    margin: 0 !important;
    display: block !important;
    opacity: 0 !important;
    visibility: hidden !important;
    transition: none !important;
    animation: none !important;
    mix-blend-mode: normal !important;
    filter: none !important;
    pointer-events: none !important;
}

.yadea-gallery-stage .yadea-gallery-layer.is-active {
    opacity: 1 !important;
    visibility: visible !important;
}

/* Tablet y laptop */
@media (min-width: 769px) and (max-width: 1440px) {
    .yadea-gallery-stage {
        height: 60vh !important;
        max-height: 600px !important;
    }
}

/* Móvil */
@media (max-width: 768px) {
    .yadea-gallery-stage {
        height: 30vh !important;
        max-height: 300px !important;
    }
}



/* ================================================================
   GT80 (producto 1650): igualar el verde del selector de color
   de WooCommerce con el verde de la sección "Elige tu modelo".
   Solo afecta al atributo de color verde de este producto.
   ================================================================ */
#product-1650 .woo-variation-swatches .variable-items-wrapper .color-variable-item[data-value="verde"],
#product-1650 .woo-variation-swatches .variable-items-wrapper .color-variable-item[data-value="Verde"],
#product-1650 .woo-variation-swatches .variable-items-wrapper .color-variable-item[title="Verde"],
#product-1650 .woo-variation-swatches .variable-items-wrapper .color-variable-item[aria-label="Verde"] {
    background-color: #98a37d !important;
}

#product-1650 .woo-variation-swatches .variable-items-wrapper .color-variable-item[data-value="verde"] .variable-item-contents,
#product-1650 .woo-variation-swatches .variable-items-wrapper .color-variable-item[data-value="Verde"] .variable-item-contents,
#product-1650 .woo-variation-swatches .variable-items-wrapper .color-variable-item[title="Verde"] .variable-item-contents,
#product-1650 .woo-variation-swatches .variable-items-wrapper .color-variable-item[aria-label="Verde"] .variable-item-contents,
#product-1650 .woo-variation-swatches .variable-items-wrapper .color-variable-item[data-value="verde"] .variable-item-span-color,
#product-1650 .woo-variation-swatches .variable-items-wrapper .color-variable-item[data-value="Verde"] .variable-item-span-color,
#product-1650 .woo-variation-swatches .variable-items-wrapper .color-variable-item[title="Verde"] .variable-item-span-color,
#product-1650 .woo-variation-swatches .variable-items-wrapper .color-variable-item[aria-label="Verde"] .variable-item-span-color {
    background-color: #98a37d !important;
}


/* GT80: tono verde salvia uniforme en el swatch de WooCommerce.
   Se aplica al círculo interior que Woo Variation Swatches suele colorear
   con estilos inline. No modifica otros productos ni los otros colores. */
body.single-product.postid-1650 .variable-items-wrapper .color-variable-item[data-value="verde"],
body.single-product.postid-1650 .variable-items-wrapper .color-variable-item[title="Verde"],
#product-1650 .variable-items-wrapper .color-variable-item[data-value="verde"],
#product-1650 .variable-items-wrapper .color-variable-item[title="Verde"] {
    background: #98A37D !important;
}
body.single-product.postid-1650 .variable-items-wrapper .color-variable-item[data-value="verde"] .variable-item-span-color,
body.single-product.postid-1650 .variable-items-wrapper .color-variable-item[title="Verde"] .variable-item-span-color,
#product-1650 .variable-items-wrapper .color-variable-item[data-value="verde"] .variable-item-span-color,
#product-1650 .variable-items-wrapper .color-variable-item[title="Verde"] .variable-item-span-color {
    background: #98A37D !important;
    background-color: #98A37D !important;
}