iframe{
	border-radius: .5rem;
}
.ldbc-progress {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	width: auto;
	flex: 0 0 auto;
	padding-right: 0;
}

.ldbc-progress__value {
	font-size: 14px;
	font-weight: 600;
	line-height: 1;
	white-space: nowrap;
}

.ldbc-progress__bar {
	position: relative;
	width: 180px;
	max-width: 100%;
	height: 8px;
	background: rgba(255, 255, 255, 0.15);
	border-radius: 999px;
	overflow: hidden;
}

.ldbc-progress__fill {
	display: block;
	height: 100%;
	background: #d49a63;
	border-radius: inherit;
}

:root{
	--iframe-border-radius: .5rem;
}

.ldbc-next-button {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: .5em 1em;
	background: #fff;
	color: #111827;
	text-decoration: none;
	border-radius: var(--iframe-border-radius);
	font-size: 18px;
	font-weight: 700;
	line-height: 1;
	transition: transform .2s ease, box-shadow .2s ease, opacity .2s ease;
	box-shadow: 0 6px 20px rgba(0, 0, 0, 0.16);
}

.ldbc-next-button:hover {
	transform: translateY(-1px);
	opacity: 0.97;
}

.ldbc-next-button__label {
	white-space: nowrap;
}

.ldbc-next-button__title {
	display: none;
}

.ldbc-next-button__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 14px;
	height: 14px;
	flex: 0 0 14px;
}

.ldbc-next-button__icon svg {
	width: 14px;
	height: 14px;
	display: block;
	stroke: currentColor;
	fill: none;
}

.ldbc-topbar__right .brxe-shortcode {
	width: auto !important;
	max-width: none !important;
	flex: 0 0 auto !important;
}

.ldbc-sidebar {
	display: flex;
	flex-direction: column;
	gap: 14px;
}

.ldbc-section {
	background: linear-gradient(180deg, rgba(255,255,255,0.04), rgba(255,255,255,0.02));
	border: 1px solid rgba(255,255,255,0.06);
	border-radius: var(--iframe-border-radius);
	overflow: hidden;
}

.ldbc-section__toggle {
	width: 100%;
	display: flex;
	align-items: center;
	gap: 12px;
	background: transparent;
	border: 0;
	color: #fff;
	padding: 16px 14px;
	text-align: left;
	cursor: pointer;
}

.ldbc-section__dot {
	width: 14px;
	height: 14px;
	border-radius: 50%;
	background: #d5dbe4;
	flex: 0 0 14px;
}

.ldbc-section__title {
	flex: 1 1 auto;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.3;
	color: #fff;
}

.ldbc-section__icon {
	position: relative;
	width: 14px;
	height: 14px;
	flex: 0 0 14px;
}

.ldbc-section__icon::before,
.ldbc-section__icon::after {
	content: "";
	position: absolute;
	background: #fff;
	border-radius: 1px;
	transition: transform .25s ease, opacity .25s ease;
}

.ldbc-section__icon::before {
	width: 12px;
	height: 2px;
	top: 6px;
	left: 1px;
}

.ldbc-section__icon::after {
	width: 2px;
	height: 12px;
	top: 1px;
	left: 6px;
}

.ldbc-section.is-open .ldbc-section__icon::after {
	transform: scaleY(0);
}

.ldbc-section__content {
	padding: 0 10px 12px;
	overflow: hidden;
	height: 0;
	transition: height 0.3s ease;
}

.ldbc-lesson {
	display: grid;
	grid-template-columns: 22px minmax(0, 1fr) auto;
	gap: 12px;
	align-items: start;
	padding: 12px 10px;
	border-radius: var(--iframe-border-radius);
}

.ldbc-section.is-open .ldbc-lesson.is-current {
	background: rgba(0, 0, 0, 0.25);
}

.ldbc-lesson__rail {
	position: relative;
	width: 24px;
	height: 24px;
	min-width: 24px;
	min-height: 24px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-right: 15px;
	background-color: #222222;
	border-radius: 50%;
	z-index: 3;
	flex-shrink: 0;

}

/* 4. MARCADOR INTERNO DE LA LECCIÓN (EL QUE TIENE COLOR) */
.ldbc-lesson__marker {
    width: 12px;
    height: 12px;
    min-width: 12px;
    min-height: 12px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.ldbc-lesson__marker.is-completed,
.ldbc-lesson__marker.is-current {
	background: #c6945a;
}

.ldbc-lesson__line {
	position: absolute;
	top: 16px;
	bottom: -12px;
	width: 3px;
	background: #cfd5dc;
	border-radius: 999px;
}

.ldbc-lesson.is-completed .ldbc-lesson__line,
.ldbc-lesson.is-current .ldbc-lesson__line {
	background: #c6945a;
}

.ldbc-lesson__body {
	min-width: 0;
}

.ldbc-lesson__link {
	text-decoration: none;
}

.ldbc-lesson__name {
	display: block;
	font-size: 14px;
	font-weight: 600;
	line-height: 1.35;
	color: #fff;
	word-break: break-word;
}

.ldbc-lesson.is-current .ldbc-lesson__name {
	color: #f4ba32;
}

.ldbc-lesson__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 4px;
	font-size: 13px;
	line-height: 1.35;
}

.ldbc-lesson__duration {
	color: #f3f6fb;
	font-weight: 600;
}

.ldbc-lesson__state {
	display: inline-flex;
	align-items: center;
	gap: 4px;
}

.ldbc-lesson__state.is-current {
	color: #d39a64;
	font-weight: 700;
}

.ldbc-lesson__state.is-completed {
	color: #22c55e;
	font-weight: 700;
}

.ldbc-lesson__state.is-pending {
	color: #c8d2de;
}

.ldbc-lesson__state-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 14px;
	height: 14px;
	color: #22c55e;
	flex: 0 0 14px;
}

.ldbc-lesson__state-icon svg {
	width: 14px;
	height: 14px;
	fill: currentColor;
}

.ldbc-lesson__actions {
	padding-top: 2px;
}

.ldbc-lesson__download {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border-radius: 8px;
	background: #fff;
	color: #08131d;
	text-decoration: none;
	transition: transform .2s ease, opacity .2s ease;
}

.ldbc-lesson__download:hover {
	transform: translateY(-1px);
	opacity: 0.92;
}

.ldbc-lesson__download svg {
	width: 18px;
	height: 18px;
	fill: currentColor;
}


.ldbc-prev-button {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 14px;
	background: rgba(255,255,255,0.08);
	color: #fff;
	text-decoration: none;
	border-radius: 999px;
	font-weight: 700;
	line-height: 1;
	transition: transform .2s ease, opacity .2s ease, background .2s ease;
}

.ldbc-prev-button:hover {
	transform: translateY(-1px);
	background: rgba(255,255,255,0.12);
	opacity: 0.97;
}

.ldbc-prev-button__icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 14px;
	height: 14px;
	flex: 0 0 14px;
}

.ldbc-prev-button__icon svg {
	width: 14px;
	height: 14px;
	display: block;
	stroke: currentColor;
	fill: none;
}

.ldbc-complete-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.ldbc-complete-button.is-completed {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 10px 14px;
	background: rgba(34,197,94,0.12);
	color: #22c55e;
	border: 1px solid rgba(34,197,94,0.28);
	border-radius: 999px;
	font-weight: 700;
	line-height: 1;
}

.ldbc-complete-button .learndash_mark_complete_button,
.ldbc-complete-button input[type="submit"],
.ldbc-complete-button button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 10px 14px;
	border-radius: 999px;
	font-weight: 700;
	line-height: 1;
	border: 0;
	cursor: pointer;
}


.ldbc-icon-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	border-radius: var(--iframe-border-radius);
	background: rgba(255,255,255,0.08);
	color: #fff;
	text-decoration: none;
	border: 0;
	cursor: pointer;
	transition: transform .2s ease, background .2s ease, opacity .2s ease;
}

.ldbc-icon-button:hover {
	transform: translateY(-1px);
	background: rgba(255,255,255,0.12);
	opacity: 0.97;
}

.ldbc-icon-button svg {
	width: 18px;
	height: 18px;
	display: block;
	stroke: currentColor;
	fill: none;
}

@media (max-width: 767px) {
	.ldbc-lesson {
		grid-template-columns: 22px minmax(0, 1fr);
	}

	.ldbc-lesson__actions {
		grid-column: 2;
		padding-top: 0;
	}
}

/* ==========================================================================
   ESTILOS PARA LA BARRA LATERAL (TIMELINE Y LECCIONES)
   ========================================================================== */

/* 1. CONTENEDOR DE LA SECCIÓN (MÓDULO) Y SU PUNTO/CHECK */
.ldbc-section__content {
    position: relative;
    padding-left: 10px;
    margin-left: 15px;
}

.ldbc-section__dot {
    width: 24px;
    height: 24px;
    min-width: 24px;
    min-height: 24px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 10px;
    background-color: #f1f5f9;
    flex-shrink: 0;
}

.ldbc-section.is-completed .ldbc-section__dot {
    background-color: #f97316; /* Naranja cuando el módulo está completo */
    color: white;
}

/* Evitar que los iconos SVG se estiren */
.ldbc-section__dot svg,
.ldbc-lesson__marker svg {
    width: 14px;
    height: 14px;
    display: block;
    flex-shrink: 0;
}

/* 2. CONTENEDOR DE LA LECCIÓN (HOVER Y FONDO ACTIVO) */
.ldbc-lesson {
    position: relative;
    display: flex;
    align-items: flex-start;
    padding: 10px 15px;     /* Espacio interno para que el fondo se vea bien */
    margin-left: -15px;     /* Para alinear con el contenedor padre */
    margin-right: -15px;
    border-radius: 8px;     /* Bordes redondeados */
    background-color: transparent; /* Transparente por defecto */
    transition: background-color 0.2s ease;
    z-index: 2;
}

/* Fondo oscuro SOLO al pasar el mouse o si es la lección actual */
.ldbc-lesson:hover,
.ldbc-lesson.is-current {
    background-color: #27272a; /* Gris oscuro, igual a tu demo */
}

/* 3. LÍNEA CONECTORA (SE DIBUJA DESDE CADA LECCIÓN HACIA ABAJO) */
.ldbc-lesson::after {
    content: '';
    position: absolute;
    top: 25px;      /* Empieza debajo del centro del punto actual */
    bottom: -15px;  /* Baja hasta conectar con la siguiente lección */
    left: 26px;     /* Alineado con el centro del punto */
    width: 2px;
    background-color: #4b5563; /* Color de la línea gris oscuro */
    z-index: 1;
}

/* ¡LA MAGIA! Ocultar la línea en la ÚLTIMA lección del módulo para que no sobre */
.ldbc-lesson:last-child::after {
    display: none;
}

/* 4. RIEL (FONDO DEL PUNTO) Y PUNTO MARCADOR DE CADA LECCIÓN */
.ldbc-lesson__rail {
    position: relative;
    width: 24px;
    height: 24px;
    min-width: 24px;
    min-height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-right: 15px;
    background-color: #18181b; /* IMPORTANTE: Debe ser igual al color de fondo principal de tu sidebar */
    border-radius: 50%;
    z-index: 3;
    flex-shrink: 0;
    transition: background-color 0.2s ease;
}

/* Para que el riel cambie de color cuando la lección tiene fondo hover/activo y no se vea una mancha */
.ldbc-lesson:hover .ldbc-lesson__rail,
.ldbc-lesson.is-current .ldbc-lesson__rail {
    background-color: #27272a; /* Mismo color que el hover de .ldbc-lesson */
}

/* El punto de color en sí */
.ldbc-lesson__marker {
    width: 12px;
    height: 12px;
    min-width: 12px;
    min-height: 12px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

/* Estados del marcador (Pendiente, Completado, Viendo ahora) */
.ldbc-lesson__marker.is-pending {
    background-color: transparent;
    border: 2px solid #cbd5e1;
}

.ldbc-lesson__marker.is-completed {
    background-color: #10b981;
    border: none;
    width: 20px;
    height: 20px;
    min-width: 20px;
    min-height: 20px;
}

.ldbc-lesson__marker.is-current {
    background-color: #fff;
    border: 3px solid #f97316;
    box-shadow: 0 0 0 3px rgba(249, 115, 22, 0.2);
}


/* ==========================================================================
   LIMPIEZA DEL CONTENIDO NATIVO DE LEARNDASH
   ========================================================================== */

/* 1. Ocultar la barra superior redundante (Breadcrumbs, Título y Etiqueta Completado) */
.learndash-wrapper .ld-breadcrumbs,
.learndash-wrapper .ld-item-details {
    display: none !important;
}

/* 2. Ocultar los botones de navegación nativos de abajo (Marcar completado / Siguiente) */
.learndash-wrapper .ld-content-actions {
    display: none !important;
}

/* Ocultar el banner azul de "Great Job!" (Éxito de AJAX) */
.learndash-wrapper .ld-alert-success {
    display: none !important;
}

/* ==========================================================================
   ESTILOS PARA PANTALLA DE ACCESO RESTRINGIDO (PROGRESIÓN LINEAL)
   ========================================================================== */

/* 1. Ocultar el icono de alerta nativo de LearnDash (para poner el nuestro) */
.learndash-wrapper .ld-alert-warning .ld-icon {
    display: none !important;
}

/* 2. Contenedor principal: Lo centramos y le damos fondo oscuro */
.learndash-wrapper .ld-alert-warning {
    background-color: #1a1a1a !important; /* Fondo gris oscuro */
    border: 1px solid #333 !important;
    border-radius: 12px !important;
    padding: 50px 30px !important;
    text-align: center !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 40px auto !important;
    max-width: 600px !important;
}

/* 3. El Icono de Candado (Inyectado por CSS) */
.learndash-wrapper .ld-alert-warning::before {
    content: '';
    display: block;
    width: 64px;
    height: 64px;
    margin-bottom: 25px;
    background-color: #f4ba32 !important; /* Tu color naranja */
    
    /* Imagen del candado SVG */
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='11' width='18' height='11' rx='2' ry='2'%3E%3C/rect%3E%3Cpath d='M7 11V7a5 5 0 0 1 10 0v4'%3E%3C/path%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='11' width='18' height='11' rx='2' ry='2'%3E%3C/rect%3E%3Cpath d='M7 11V7a5 5 0 0 1 10 0v4'%3E%3C/path%3E%3C/svg%3E");
    
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
}

/* 4. Texto del mensaje ("Por favor, vuelve atrás...") */
.learndash-wrapper .ld-alert-warning .ld-alert-messages,
.learndash-wrapper .ld-alert-warning p {
    font-size: 1.15rem !important;
    line-height: 1.6 !important;
    margin-bottom: 25px !important;
    color: #e2e8f0 !important;
    width: 100% !important;
}

/* 5. Botón nativo de LearnDash ("Volver a...") */
.learndash-wrapper .ld-alert-warning .ld-button {
    background-color: #f4ba32 !important; /* Naranja */
    color: #ffffff !important;
    padding: 12px 30px !important;
    border-radius: 8px !important;
    font-weight: 600 !important;
    font-size: 0.95rem !important;
    text-transform: uppercase !important;
    border: none !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    transition: background-color 0.2s ease !important;
    text-decoration: none !important;
    margin-top: 10px !important;
}

.learndash-wrapper .ld-alert-warning .ld-button:hover {
    background-color: #D6A637 !important; /* Naranja más oscuro */
}


/* Definición de la onda expansiva */
@keyframes ldbc-radar-pulse {
    0% {
        transform: scale(1);
        opacity: 0.7;
    }
    100% {
        transform: scale(4); /* Tamaño final de la onda */
        opacity: 0;
    }
}

/* El marcador cuando está emitiendo */
.ldbc-lesson__marker.is-emitting {
    position: relative;
    z-index: 2;
}

/* Las dos ondas concéntricas */
.ldbc-lesson__marker.is-emitting::before,
.ldbc-lesson__marker.is-emitting::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    /* Color naranja suave para la onda */
    background-color: rgba(255, 152, 0, 0.5); 
    z-index: -1;
    pointer-events: none;
}

/* Primera onda */
.ldbc-lesson__marker.is-emitting::before {
    animation: ldbc-radar-pulse 2s infinite ease-out;
}

/* Segunda onda con retraso de 1 segundo */
.ldbc-lesson__marker.is-emitting::after {
    animation: ldbc-radar-pulse 2s infinite ease-out;
    animation-delay: 1s;
}



/* 1. Quitamos el margen a todas las variaciones de la clase que me pasaste */
.wp-block-embed,
.wp-block-embed-youtube,
.wp-block-embed.is-type-video,
figure.wp-block-embed {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

/* 2. Reset total para la etiqueta figure cuando es un embed de WP */
figure.wp-block-embed {
    margin-block-start: 0 !important;
    margin-block-end: 0 !important;
    margin-inline-start: 0 !important;
    margin-inline-end: 0 !important;
    line-height: 0; /* Evita espacios fantasma debajo del video */
}

/* 3. Aseguramos que el contenedor de pestañas de LD no empuje hacia abajo */
.learndash-wrapper .ld-tabs {
    margin-top: 0 !important;
}

/* 4. Alineación del área de Focus Mode */
.ld-focus .ld-focus-main .ld-focus-content {
    padding-top: 0 !important;
}


/* Estilos base para el botón inteligente */
.ldbc-btn {
    display: inline-block;
    padding: 12px 25px;
    border-radius: 8px;
    text-align: center;
    font-weight: 700;
    text-decoration: none;
    transition: all 0.3s ease;
    width: 100%; /* Para que ocupe todo el ancho de la card */
    box-sizing: border-box;
}

/* Botón de COMPRA (Llamativo) */
.ldbc-btn-buy { background-color: #ffcc00; color: #000; }

/* Botón de EMPEZAR (Fresco / Acción) */
.ldbc-btn-start { background-color: #000; color: #fff; }

/* Botón de Inscripción Gratis */
.ldbc-btn-free { background-color: #f39c12; color: white; }

/* Botón de Continuar (Alumno) */
.ldbc-btn-continue { background-color: #2ecc71; color: white; }

/* Botón de Repasar (Completado) */
.ldbc-btn-review { background-color: #9b59b6; color: white; }

.ldbc-btn:hover {
    opacity: 0.9;
    transform: translateY(-2px);
}


/* Botón Repasar Curso (Completado) */
.ldbc-btn-review {
    background-color: #f8f9fa !important; /* Fondo gris muy claro */
    color: #555 !important;              /* Texto gris oscuro */
    border: 2px solid #ddd !important;   /* Borde definido */
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.ldbc-btn-review:hover {
    background-color: #e2e6ea !important;
    border-color: #ccc !important;
}







.ldbc-alert-box {
    display: flex;
    align-items: center;
    background-color: #e3f2fd; 
    border-radius: 8px;
    padding: 12px 16px;
    margin-bottom: 20px;
    border: 1px solid #bbdefb;
}

.ldbc-alert-icon {
    background-color: #2196f3; 
    color: #ffffff;
    width: 26px;
    height: 26px;
    border-radius: 4px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: 12px;
    flex-shrink: 0;
}

.ldbc-alert-text {
    color: #1565c0; 
    font-size: 12px;
    font-weight: 500;
}