/* Ventanas de 7 Lecciones (solo se carga en las páginas donde aparecen).
   Van por encima del botón flotante de WhatsApp del tema (z-index 1000). */

/* ---------- Ventana central con la pregunta «Sí / No» ---------- */
.tp-ventana { position: fixed; inset: 0; z-index: 1010; display: flex; align-items: center; justify-content: center; padding: 16px; }
.tp-ventana[hidden], .tp-ventana__paso[hidden], .tp-deslizante[hidden] { display: none; }
.tp-ventana__fondo { position: absolute; inset: 0; background: rgba(11, 16, 32, 0.72); }
.tp-ventana__caja {
	position: relative; width: min(440px, 100%); max-height: calc(100vh - 32px); overflow-y: auto;
	background: #fff; border-radius: 18px; padding: 32px 28px 28px; box-shadow: 0 24px 60px rgba(0, 0, 0, 0.35);
}
.tp-ventana__paso { display: flex; flex-direction: column; gap: 14px; }
.tp-ventana h2 { margin: 0; padding-right: 32px; font-size: 26px; line-height: 1.15; font-weight: 800; letter-spacing: -0.02em; color: var(--tp-tinta); }
.tp-ventana p { margin: 0; font-size: 16px; line-height: 1.55; color: var(--tp-gris); }
.tp-ventana .tp-ventana__fuerte { color: var(--tp-tinta); }
.tp-ventana .tp-ventana__nota { font-size: 14px; }
.tp-ventana__opciones { margin-top: 6px; display: flex; flex-direction: column; gap: 10px; }
.tp-ventana__opciones span { text-align: center; font-size: 14px; color: var(--tp-gris); }
.tp-ventana__si { font: inherit; font-size: 16px; font-weight: 800; color: var(--tp-tinta); background: var(--tp-ambar); border: 0; border-radius: 10px; padding: 15px 18px; cursor: pointer; }
.tp-ventana__si:hover { background: #E08E06; }
.tp-ventana__no { font: inherit; font-size: 15px; font-weight: 600; color: var(--tp-gris); background: #fff; border: 1px solid var(--tp-borde-fuerte); border-radius: 10px; padding: 13px 18px; cursor: pointer; }
.tp-ventana__no:hover { border-color: var(--tp-gris); }
.tp-ventana__cerrar {
	position: absolute; top: 12px; right: 12px; width: 36px; height: 36px; border-radius: 999px; border: 0; cursor: pointer;
	background: var(--tp-superficie); color: var(--tp-gris); display: flex; align-items: center; justify-content: center; z-index: 1;
}
.tp-ventana.esta-visible .tp-ventana__caja { animation: tp-acercar 0.25s ease-out; }
@keyframes tp-acercar { from { transform: scale(0.92); opacity: 0; } to { transform: none; opacity: 1; } }

/* ---------- Deslizante (abajo a la izquierda; en móvil, hoja desde abajo) ---------- */
.tp-deslizante { position: fixed; left: 24px; bottom: 24px; z-index: 1005; }
.tp-deslizante__fondo { display: none; }
.tp-deslizante__caja {
	position: relative; width: 380px; max-height: calc(100vh - 48px); overflow-y: auto;
	background: var(--tp-noche); color: #fff; border-radius: 18px; padding: 22px 20px 20px;
	display: flex; flex-direction: column; gap: 12px; box-shadow: 0 18px 48px rgba(0, 0, 0, 0.35);
}
.tp-deslizante .tp-ventana__cerrar { background: rgba(255, 255, 255, 0.12); color: #fff; }
.tp-deslizante__cabeza { display: flex; gap: 14px; align-items: center; padding-right: 32px; }
.tp-deslizante__cabeza img { width: 76px; height: auto; flex: none; display: block; }
.tp-deslizante__cabeza p { margin: 0; display: flex; flex-direction: column; }
.tp-deslizante__cabeza span { font-size: 14px; font-weight: 700; color: var(--tp-cian); }
.tp-deslizante__cabeza strong { font-family: var(--tp-titulos); font-size: 24px; line-height: 1.1; font-weight: 800; color: #fff; }
.tp-deslizante ul { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 6px; }
.tp-deslizante li { display: flex; gap: 8px; align-items: flex-start; font-size: 14px; line-height: 1.45; color: var(--tp-tinte); }
.tp-deslizante li .tp-icono { color: var(--tp-cian); margin-top: 1px; }
.tp-deslizante__texto { margin: 0; font-size: 14px; line-height: 1.5; color: var(--tp-pie-texto); }
.tp-deslizante.esta-visible .tp-deslizante__caja { animation: tp-entrar-izq 0.35s ease-out; }
@keyframes tp-entrar-izq { from { transform: translateX(-110%); } to { transform: none; } }

@media (max-width: 759px) {
	.tp-deslizante { inset: 0; display: flex; align-items: flex-end; }
	.tp-deslizante__fondo { display: block; position: absolute; inset: 0; background: rgba(11, 16, 32, 0.45); }
	.tp-deslizante__caja { width: 100%; max-height: 88vh; border-radius: 20px 20px 0 0; padding-bottom: calc(20px + env(safe-area-inset-bottom)); }
	.tp-deslizante__cabeza img { width: 64px; }
	.tp-deslizante__cabeza strong { font-size: 22px; }
	.tp-deslizante.esta-visible .tp-deslizante__caja { animation-name: tp-subir; }
	@keyframes tp-subir { from { transform: translateY(100%); } to { transform: none; } }
}

@media (prefers-reduced-motion: reduce) {
	.tp-ventana.esta-visible .tp-ventana__caja, .tp-deslizante.esta-visible .tp-deslizante__caja { animation: none; }
}