@charset "utf-8";
/* ==========================================================================
   Componentes interactivos propios (sustituyen a FPSS, Widgetkit y FlippingBook).
   Mobile-first; JavaScript solo mejora (sin JS todo el contenido es visible).
   ========================================================================== */

/* ---------- Slideshow de portada ---------- */
.slideshow { position: relative; margin: 0 auto; max-width: 930px; }
.slideshow-slides { position: relative; aspect-ratio: 930 / 351; overflow: hidden; background: #444; }
.slideshow-slides > li { position: absolute; inset: 0; opacity: 0; visibility: hidden; transition: opacity 1s ease, visibility 0s linear 1s; }
.slideshow-slides > li.is-active { opacity: 1; visibility: visible; transition: opacity 1s ease; }
.slideshow-slides img { display: block; width: 100%; height: 100%; object-fit: cover; }
.slideshow-nav { position: absolute; right: 8px; bottom: 10px; display: flex; gap: 4px; }
.slideshow-nav button {
	width: 22px; height: 22px; padding: 0;
	border: 0; border-radius: 3px;
	background: rgba(0, 0, 0, .55); color: #fff;
	font: bold 14px/22px sans-serif; cursor: pointer;
}
.slideshow-nav button:hover, .slideshow-nav button:focus-visible { background: #000; }
@media (prefers-reduced-motion: reduce) {
	.slideshow-slides > li, .slideshow-slides > li.is-active { transition: none; }
}

/* ---------- Muro de galería (antes Widgetkit gallery "wall" + spotlight) ---------- */
.wk-gallery-wall { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; }
.wk-gallery-wall > a { position: relative; display: block; overflow: hidden; }
.wk-gallery-wall.clearfix::before, .wk-gallery-wall.clearfix::after { display: none; }   /* no ocupar celdas de la rejilla */
.wk-gallery-wall img { display: block; width: 100%; height: auto; }
.wk-gallery-wall .overlay {
	position: absolute; left: 0; right: 0; bottom: 0;
	padding: 10px;
	background: rgba(0, 0, 0, .5); color: #fff;
	font-weight: normal;
	transform: translateY(100%);
	transition: transform .2s ease-out;
}
.wk-gallery-wall > a:hover .overlay, .wk-gallery-wall > a:focus-visible .overlay { transform: none; }
.wk-gallery-wall.margin { gap: 15px; margin-bottom: 15px; }
.wk-gallery-wall.round > *, .wk-gallery-wall.round > * > img { border-radius: 10px; overflow: hidden; }
.clearfix::before, .clearfix::after { content: ""; display: table; }
.clearfix::after { clear: both; }
@media (min-width: 48em) {
	.wk-gallery-wall { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (min-width: 60em) {
	.wk-gallery-wall { display: block; }
	.wk-gallery-wall.clearfix::before, .wk-gallery-wall.clearfix::after { display: table; }
	.wk-gallery-wall > a { float: left; }
	.wk-gallery-wall img { width: auto; }
	.wk-gallery-wall.margin { margin: 0 -15px -15px 0; }
	.wk-gallery-wall.margin > * { margin: 0 15px 15px 0; }
}

/* ---------- Lightbox ---------- */
.lightbox {
	width: 100%; max-width: 100vw; height: 100%; max-height: 100vh;
	margin: 0; padding: 0; border: 0;
	background: rgba(0, 0, 0, .85); color: #fff;
}
.lightbox::backdrop { background: rgba(0, 0, 0, .6); }
.lightbox figure { display: flex; flex-direction: column; align-items: center; justify-content: center; height: 100%; margin: 0; padding: 48px 12px 12px; }
.lightbox img { max-width: 100%; max-height: calc(100vh - 110px); object-fit: contain; background: #fff; }
.lightbox figcaption { margin-top: 8px; text-align: center; }
.lightbox button {
	position: absolute; width: 44px; height: 44px;
	border: 0; border-radius: 50%;
	background: rgba(255, 255, 255, .15); color: #fff;
	font: bold 22px/44px sans-serif; cursor: pointer;
}
.lightbox button:hover, .lightbox button:focus-visible { background: rgba(255, 255, 255, .35); }
.lightbox .lb-close { top: 8px; right: 8px; }
.lightbox .lb-prev { left: 8px; top: 50%; }
.lightbox .lb-next { right: 8px; top: 50%; }

/* ---------- Pestañas (TV: antes Widgetkit slideshow "tabs bar") ---------- */
.wk-slideshow-tabsbar .nav { display: flex; flex-wrap: wrap; margin: 0; padding: 0; list-style: none; border: 1px solid #ddd; border-bottom: 0; border-radius: 5px 5px 0 0; background: #fafafa; }
.wk-slideshow-tabsbar .nav li { border-right: 1px solid #ddd; }
.wk-slideshow-tabsbar .nav button, .wk-slideshow-tabsbar .nav span {
	display: block; padding: 7px 17px 5px 15px;
	border: 0; background: none; font: inherit; color: #444; cursor: pointer;
}
.wk-slideshow-tabsbar .nav li:hover, .wk-slideshow-tabsbar .nav li.active { background: #fff; }
.wk-slideshow-tabsbar .nav li.active button { font-weight: bold; }
.wk-slideshow-tabsbar .slides-container { border: 1px solid #ddd; background: #fff; }
.wk-slideshow-tabsbar .slides { margin: 0; padding: 0; list-style: none; }
.wk-slideshow-tabsbar .slides > li > article { padding: 15px; }
.js .wk-slideshow-tabsbar .slides > li[hidden] { display: none; }

/* ---------- Visor de libro (antes FlippingBook) ---------- */
.book-viewer { text-align: center; padding: 20px 0 0; background: #fff; }
.book-viewer .book-page img { width: 400px; max-width: 100%; height: auto; }
.book-viewer .book-nav { margin: 10px 0; text-align: center; line-height: 2; }
.book-viewer .book-nav a, .book-viewer .book-nav span { display: inline-block; min-width: 1.6em; padding: 0 2px; }
.book-viewer .book-nav [aria-current] { color: #E0525C; }

/* ---------- Contenido heredado de VirtueMart / Zoo en pantallas pequeñas ---------- */
@media (max-width: 59.99em) {
	#yoo-zoo .item div.pos-sidebar, #yoo-zoo .items ul.pos-infobar { float: none; width: auto; margin-left: 0; }
	.zoo-item.list-h > ul > li { float: none; width: auto !important; margin-bottom: 15px; background: none; }
	#yoo-zoo .width20, #yoo-zoo .width25, #yoo-zoo .width33, #yoo-zoo .width50 { float: none; width: auto; }
	.browse-view .row .product, .width30, .width40, .width60, .width70 { float: none !important; width: auto !important; }
	.contentpaneopen h1 { width: auto; }
}
