.ztp-viewer{
	/* Estos valores se pueden cambiar desde "ZT Presentaciones -> Ajustes de color" */
	--ztp-principal:#EF640A;
	--ztp-principal-oscuro:#c9540a;
	--ztp-acento:#CCFE04;
	--ztp-fondo:#0e1116;
	--ztp-barra:#181c22;
	--ztp-drawer:#12161c;
	--ztp-texto:#ffffff;
	--ztp-radio:12px;

	max-width:1000px;margin:1.75rem auto;
	display:flex;flex-direction:column;
	background:var(--ztp-fondo);border-radius:var(--ztp-radio);overflow:hidden;
	box-shadow:0 8px 30px rgba(0,0,0,.18);font-family:inherit;position:relative;color:var(--ztp-texto);
}
.ztp-viewer *{box-sizing:border-box;}

/* Neutralizar estilos de botones del tema (Astra) dentro del visor:
   quita relleno, alto fijo, transformaciones y el brillo/foco azul */
.ztp-viewer button{
	font-family:inherit;line-height:1;text-transform:none;letter-spacing:normal;
	min-height:0;box-shadow:none !important;-webkit-appearance:none;appearance:none;
}
.ztp-viewer button:focus{outline:none;box-shadow:none !important;}
.ztp-viewer button:focus-visible{outline:2px solid var(--ztp-acento);outline-offset:2px;}

/* Barra superior */
.ztp-bar{display:flex;align-items:center;gap:.5rem;background:var(--ztp-barra);color:var(--ztp-texto);padding:.55rem .7rem;}
.ztp-menu-btn{flex:0 0 auto;display:inline-flex;align-items:center;gap:.4rem;background:var(--ztp-principal);color:#fff;border:0;border-radius:999px;padding:.42rem .85rem;font:inherit;font-size:.85rem;font-weight:700;cursor:pointer;}
.ztp-menu-btn:focus,.ztp-menu-btn:active{background:var(--ztp-principal-oscuro) !important;}
.ztp-menu-btn:hover{background:var(--ztp-principal-oscuro);}
.ztp-menu-btn svg{width:16px;height:16px;display:block;flex:0 0 auto;}
.ztp-title{flex:1 1 auto;min-width:0;font-weight:700;font-size:.95rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ztp-count{flex:0 0 auto;font-size:.85rem;font-weight:700;opacity:.85;font-variant-numeric:tabular-nums;padding:0 .2rem;}
.ztp-cur{color:var(--ztp-acento);opacity:1;}
.ztp-bar-right{flex:0 0 auto;display:flex;align-items:center;gap:.35rem;}
.ztp-bar-right button{background:rgba(255,255,255,.12);color:#fff;border:0;border-radius:8px;height:2rem;min-width:2rem;padding:0;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;transition:background .15s;}
.ztp-bar-right button:focus,.ztp-bar-right button:active{background:rgba(255,255,255,.12) !important;}
.ztp-bar-right button:hover{background:rgba(255,255,255,.24) !important;}
.ztp-bar-right button:disabled{opacity:.35;cursor:default;}
.ztp-bar-right svg{width:18px;height:18px;display:block;}
.ztp-fs{gap:.4rem;padding:0 .7rem !important;font:inherit;font-size:.82rem;font-weight:700;white-space:nowrap;}
.ztp-fs:hover{background:var(--ztp-principal) !important;}

/* Escenario / diapositiva */
.ztp-stage{position:relative;height:min(76vh,660px);display:flex;align-items:center;justify-content:center;background:var(--ztp-fondo);overflow:hidden;touch-action:pan-y;}
.ztp-canvas{display:block;max-width:100%;max-height:100%;box-shadow:0 2px 16px rgba(0,0,0,.4);background:#fff;}
.ztp-loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.75);font-size:.9rem;background:var(--ztp-fondo);}

/* Flechas grandes laterales */
.ztp-nav{position:absolute;top:50%;transform:translateY(-50%);width:2.6rem;height:2.6rem;padding:0;border-radius:50%;border:0;background:rgba(0,0,0,.45);color:#fff;cursor:pointer;display:grid;place-items:center;transition:background .15s,opacity .25s;z-index:2;}
.ztp-nav svg{width:22px;height:22px;}
.ztp-nav:focus,.ztp-nav:active{background:rgba(0,0,0,.45) !important;}
.ztp-nav:hover{background:var(--ztp-principal) !important;}
.ztp-nav:disabled{opacity:0;pointer-events:none;}
.ztp-nav-prev{left:.6rem;}
.ztp-nav-next{right:.6rem;}

/* Índice lateral (drawer) más estrecho */
.ztp-drawer{position:absolute;top:0;left:0;bottom:0;width:min(240px,80%);background:var(--ztp-drawer);color:var(--ztp-texto);transform:translateX(-100%);transition:transform .28s ease;z-index:5;display:flex;flex-direction:column;box-shadow:2px 0 22px rgba(0,0,0,.35);}
.ztp-drawer.is-open{transform:translateX(0);}
.ztp-drawer-head{display:flex;align-items:center;justify-content:space-between;padding:.75rem .9rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;font-size:.85rem;background:var(--ztp-principal);color:#fff;}
.ztp-drawer-close{flex:0 0 auto;background:rgba(0,0,0,.18);border:0;color:#fff;width:1.9rem;height:1.9rem;padding:0;border-radius:8px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;}
.ztp-drawer-close:focus,.ztp-drawer-close:active{background:rgba(0,0,0,.18) !important;}
.ztp-drawer-close:hover{background:var(--ztp-principal-oscuro) !important;}
.ztp-drawer-close svg{width:16px;height:16px;display:block;}

/* Lista de miniaturas: diapositiva COMPLETA, a lo alto, con barra de scroll visible */
.ztp-thumbs{flex:1 1 auto;min-height:0;overflow-y:scroll;padding:.65rem;display:flex;flex-direction:column;gap:.65rem;
	scrollbar-width:thin;scrollbar-color:var(--ztp-principal) rgba(255,255,255,.10);}
.ztp-thumbs::-webkit-scrollbar{width:10px;}
.ztp-thumbs::-webkit-scrollbar-track{background:rgba(255,255,255,.10);border-radius:8px;}
.ztp-thumbs::-webkit-scrollbar-thumb{background:var(--ztp-principal);border-radius:8px;border:2px solid transparent;background-clip:padding-box;}
.ztp-thumb{position:relative;flex:0 0 auto;display:block;width:100%;background:#000;border:3px solid transparent;border-radius:8px;padding:0;margin:0;cursor:pointer;overflow:hidden;line-height:0;transition:border-color .15s;}
.ztp-thumb:focus{outline:none;}
.ztp-thumb:focus-visible{outline:2px solid var(--ztp-acento);outline-offset:2px;}
.ztp-thumb-canvas{position:relative;display:block;width:100%;height:0;padding-top:56.25%;background:#fff;overflow:hidden;line-height:0;}
.ztp-thumb-canvas canvas{position:absolute;top:0;left:0;width:100% !important;height:100% !important;display:block !important;max-width:none !important;max-height:none !important;}
.ztp-thumb-num{position:absolute;top:7px;left:7px;z-index:2;background:rgba(0,0,0,.72);color:#fff;font-size:.75rem;font-weight:800;line-height:1;padding:3px 7px;border-radius:999px;}
.ztp-thumb:hover{border-color:rgba(255,255,255,.28);}
.ztp-thumb.is-active{border-color:var(--ztp-acento);}
.ztp-thumb.is-active .ztp-thumb-num{background:var(--ztp-acento);color:#141414;}

.ztp-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.45);opacity:0;pointer-events:none;transition:opacity .25s;z-index:4;}
.ztp-viewer.ztp-drawer-abierto .ztp-backdrop{opacity:1;pointer-events:auto;}

/* PANTALLA COMPLETA (fija por CSS: cubre todo, también en iOS) */
.ztp-viewer.zt-fs{position:fixed;inset:0;z-index:99999;max-width:none;margin:0;border-radius:0;height:100vh;height:100dvh;}
.ztp-viewer.zt-fs .ztp-stage{height:auto;flex:1 1 auto;}
.ztp-viewer.zt-fs .ztp-drawer{width:min(280px,82%);}

/* En pantalla completa la barra flota sobre la diapositiva (translúcida) y se auto-oculta */
.ztp-viewer.zt-fs .ztp-bar{
	position:absolute;top:0;left:0;right:0;z-index:6;
	background:linear-gradient(to bottom, rgba(0,0,0,.62), rgba(0,0,0,0));
	padding:.55rem .7rem 1.4rem;
	transition:opacity .25s ease, transform .25s ease;
}
.ztp-viewer.zt-fs.ztp-controles-ocultos .ztp-bar{opacity:0;transform:translateY(-100%);pointer-events:none;}
.ztp-viewer.zt-fs.ztp-controles-ocultos .ztp-nav{opacity:0;pointer-events:none;}

/* Responsive móvil */
@media(max-width:600px){
	.ztp-viewer{margin:1.1rem auto;border-radius:10px;}
	.ztp-stage{height:min(62vh,520px);}
	.ztp-title{font-size:.85rem;}
	.ztp-menu-btn{padding:.42rem;font-size:.78rem;}
	.ztp-menu-btn .ztp-menu-txt{display:none;}
	.ztp-fs{padding:0 !important;min-width:2rem;}
	.ztp-fs .ztp-fs-txt{display:none;}
	.ztp-nav{width:2.2rem;height:2.2rem;}
	.ztp-nav svg{width:19px;height:19px;}
	.ztp-bar-right button{height:1.9rem;min-width:1.9rem;}
	.ztp-drawer{width:min(220px,84%);}
}