/* 5. Hide wordpress branding */
.site-info, .site-info a {
	color: #ffffff !important;
	font-size: 0 !important;
	opacity: 0;
}

/* 13. Container for the image */
.video-thumb {
	position: relative;
	display: inline-block;
}

/* 14. Creating the rainbow play button overlay */
.video-thumb::after {
	content: '▶';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	background: linear-gradient(135deg, #4AEADC 0%, #9778D1 20%, #CF2ABA 40%, #EE2C82 60%, #FB6962 80%, #FEF84C 100%);
	color: white;
	font-size: 24px;
	padding: 10px 25px;
	border-radius: 28px;
	pointer-events: none;
	opacity: .7;
	transition: all .3s ease;
	box-shadow: 0 4px 10px rgba(0,0,0,0.2);
}

/* 15. Hover effect */
.video-thumb:hover::after {
	filter: brightness(1.1);
	opacity: 1;
/* Fully visible on hover */
	transform: translate(-50%, -50%) scale(1.1);
}

/* 15. Enrol notice for unenrolled tutees */
.enrol-notice {
	position: fixed !important;
	bottom: 0 !important;
	left: 0 !important;
	z-index: 9999;
}

/* 16. Hide comments from pages */
.page-id-10095 #comments, .page-id-1540 #comments, .page-id-1533 #comments, .page-id-1530 #comments {
	display: none;
}


/* 18. Target only the specific details block with our custom class */
.centered-details summary {
	display: flex;
	justify-content: center;
	align-items: center;
	text-align: center;
	gap: 15px;
/* Space between the arrow, text, and images */
	cursor: pointer;
}

/* 19. Ensure inline images inside this specific summary behave */
.centered-details summary img {
	display: inline-block;
	margin: 0;
/* Removes default margins that might throw off centering */
}

/* 20. Hide wordpress action bar */
#actionbar {
	display: none !important;
}


/* 13. Container for the image */
.lock-thumb {
	position: relative;
	display: inline-block;
}

/* 14. Creating the rainbow play button overlay */
.lock-thumb::after {
	content: '🔒';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	background: white;
	font-size: 24px;
	padding: 10px 25px;
	border-radius: 28px;
	pointer-events: none;
	opacity: .7;
	transition: all .3s ease;
	box-shadow: 0 4px 10px rgba(0,0,0,0.2);
}

/* 15. Hover effect */
.lock-thumb:hover::after {
	filter: brightness(1.1);
	opacity: 1;
/* Fully visible on hover */
	transform: translate(-50%, -50%) scale(1.1);
}

/* 13. Container for the image */
.link-thumb {
	position: relative;
	display: inline-block;
}

/* 14. Creating the rainbow play button overlay */
.link-thumb::after {
	content: '🔗';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	background: white;
	font-size: 24px;
	padding: 10px 25px;
	border-radius: 28px;
	pointer-events: none;
	opacity: .7;
	transition: all .3s ease;
	box-shadow: 0 4px 10px rgba(0,0,0,0.2);
}

/* 15. Hover effect */
.link-thumb:hover::after {
	filter: brightness(1.1);
	opacity: 1;
/* Fully visible on hover */
	transform: translate(-50%, -50%) scale(1.1);
}

/* Hide the WordPress.com Toolbar for logged-in users */
#wpadminbar {
	display: none !important;
}

/* Remove the top margin/padding usually added to the page to make room for the bar */
html {
	margin-top: 0 !important;
}

* html body {
	margin-top: 0 !important;
}