/**
 * Professional Biography Page Styles
 * Clean, professional layout optimized for both screen and print
 */

/* =====================
   Base Styles
   ===================== */
.professional-biography-page {
	font-family: 'Georgia', 'Times New Roman', serif;
	line-height: 1.7;
	color: #212529;
}

.professional-biography-page h1,
.professional-biography-page h2,
.professional-biography-page h3,
.professional-biography-page h4 {
	font-family: 'Roboto', 'Helvetica', sans-serif;
}

/* =====================
   Header Section
   ===================== */
.professional-biography-page .bio-header {
	background: linear-gradient(135deg, #2563eb 0%, #1e40af 100%);
}

.professional-biography-page .bio-header h1 {
	color: #fff !important;
}

.professional-biography-page .bio-headshot {
	width: 180px;
	height: 180px;
	border-radius: 50%;
	border: 5px solid rgba(255,255,255,0.3);
	box-shadow: 0 10px 30px rgba(0,0,0,0.3);
}

.professional-biography-page .credentials-line {
	font-size: 1.1rem;
	opacity: 0.95;
	font-weight: 500;
}

/* =====================
   Content Sections
   ===================== */
.professional-biography-page .bio-summary,
.professional-biography-page .bio-services,
.professional-biography-page .bio-education,
.professional-biography-page .bio-experience,
.professional-biography-page .bio-skills {
	font-size: 1rem;
}

.professional-biography-page .service-detail,
.professional-biography-page .education-item,
.professional-biography-page .experience-item {
	padding: 1.5rem;
	background: #fff;
	border-left: 4px solid #2563eb;
	border-radius: 8px;
	box-shadow: 0 2px 8px rgba(0,0,0,0.05);
	transition: all 0.3s ease;
}

.professional-biography-page .service-detail:hover,
.professional-biography-page .education-item:hover,
.professional-biography-page .experience-item:hover {
	transform: translateX(8px);
	box-shadow: 0 4px 16px rgba(0,0,0,0.1);
}

.professional-biography-page .service-detail h3,
.professional-biography-page .education-item h3,
.professional-biography-page .experience-item h3 {
	margin-bottom: 0.75rem;
}

.professional-biography-page .service-detail p,
.professional-biography-page .education-item p,
.professional-biography-page .experience-item p {
	margin-bottom: 0.5rem;
}

.professional-biography-page .text-primary {
	color: #2563eb !important;
}

.professional-biography-page a {
	color: #2563eb;
	text-decoration: underline;
	transition: color 0.2s ease;
}

.professional-biography-page a:hover {
	color: #1e40af;
}

/* =====================
   Experience Summary
   ===================== */
.professional-biography-page .experience-summary {
	border: 2px solid #2563eb;
}

/* =====================
   Skills Section
   ===================== */
.professional-biography-page .bio-skills ul li {
	padding: 0.5rem 0;
	border-bottom: 1px solid #e9ecef;
}

.professional-biography-page .bio-skills ul li:last-child {
	border-bottom: none;
}

/* =====================
   Contact Section
   ===================== */
.professional-biography-page .bio-contact {
	background: linear-gradient(135deg, #2563eb 0%, #1e40af 100%);
}

.professional-biography-page .bio-contact a.text-white {
	text-decoration: underline;
	transition: opacity 0.2s ease;
}

.professional-biography-page .bio-contact a.text-white:hover {
	opacity: 0.85;
}

/* =====================
   Logo Containers
   ===================== */
.professional-biography-page .bio-logo {
	width: 80px;
	height: 80px;
	border-radius: 50%;
	background: #f8f9fa;
	border: 3px solid #e9ecef;
	padding: 15px;
	margin-bottom: 1rem;
	margin-right: 1.5rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	float: left;
	transition: all 0.3s ease;
}

.professional-biography-page .bio-logo img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.professional-biography-page .education-item:hover .bio-logo,
.professional-biography-page .experience-item:hover .bio-logo,
.professional-biography-page .youtube-education:hover .bio-logo {
	border-color: #2563eb;
	background: #fff;
}

/* Clearfix for floated logos */
.professional-biography-page .education-item::after,
.professional-biography-page .experience-item::after,
.professional-biography-page .youtube-education::after {
	content: "";
	display: table;
	clear: both;
}

/* Ensure bullet lists align consistently */
.professional-biography-page .experience-item ul,
.professional-biography-page .education-item ul {
	clear: left;
	margin-left: 95px;
	padding-left: 20px;
	list-style-type: disc;
}

/* Ensure description paragraphs align consistently in Education section */
/* Only target description paragraphs (not the mb-1 subtitle/date lines) */
.professional-biography-page .education-item p:not(.mb-1),
.professional-biography-page .youtube-education p:not(.mb-1) {
	clear: left;
	margin-left: 95px;
}

/* =====================
   Print Styles
   ===================== */
@media print {
	/* Hide navigation and footer */
	.site-header,
	.site-footer,
	.bio-contact .btn,
	.professional-biography-page .bio-contact button {
		display: none !important;
	}

	/* Reset colors for print */
	.professional-biography-page .bio-header,
	.professional-biography-page .bio-contact {
		background: #fff !important;
		color: #000 !important;
	}

	.professional-biography-page .bio-header h1,
	.professional-biography-page .bio-header p,
	.professional-biography-page .bio-header .credentials-line {
		color: #000 !important;
	}

	/* Adjust spacing */
	.professional-biography-page section {
		page-break-inside: avoid;
		padding: 1rem 0 !important;
	}

	.professional-biography-page .service-detail,
	.professional-biography-page .education-item,
	.professional-biography-page .experience-item {
		page-break-inside: avoid;
		box-shadow: none !important;
		border: 1px solid #ddd !important;
		padding: 1rem !important;
		margin-bottom: 0.5rem !important;
	}

	/* Headshot for print */
	.professional-biography-page .bio-headshot {
		width: 120px;
		height: 120px;
		border: 2px solid #000 !important;
	}

	/* Font sizes for print */
	.professional-biography-page {
		font-size: 11pt;
		line-height: 1.4;
	}

	.professional-biography-page h1 {
		font-size: 20pt !important;
	}

	.professional-biography-page h2 {
		font-size: 16pt !important;
	}

	.professional-biography-page h3 {
		font-size: 13pt !important;
	}

	.professional-biography-page .lead {
		font-size: 12pt;
	}

	/* Links for print */
	.professional-biography-page a {
		color: #000 !important;
		text-decoration: none !important;
	}

	.professional-biography-page a[href^="http"]::after {
		content: " (" attr(href) ")";
		font-size: 9pt;
		color: #666;
	}

	/* Remove backgrounds */
	.professional-biography-page .bg-light {
		background: #fff !important;
	}

	/* Ensure black text everywhere */
	.professional-biography-page * {
		color: #000 !important;
	}

	/* Icons */
	.professional-biography-page i {
		font-size: 0.85em;
	}
}

/* =====================
   Responsive Design
   ===================== */
@media (max-width: 991px) {
	.professional-biography-page .bio-headshot {
		width: 150px;
		height: 150px;
		margin: 2rem auto 0;
		display: block;
	}

	.professional-biography-page .bio-header .col-lg-4 {
		margin-top: 2rem;
	}
}

@media (max-width: 767px) {
	.professional-biography-page .bio-header h1 {
		font-size: 2rem;
	}

	.professional-biography-page .credentials-line {
		font-size: 0.95rem;
	}

	.professional-biography-page .service-detail,
	.professional-biography-page .education-item,
	.professional-biography-page .experience-item {
		padding: 1rem;
	}

	.professional-biography-page .bio-contact a.text-white {
		display: block;
		margin: 0.5rem 0;
	}

	.professional-biography-page .bio-contact .mx-3 {
		display: none;
	}
}

/* =====================
   Expandable Sections (Future Enhancement)
   ===================== */
.professional-biography-page .expandable-section {
	cursor: pointer;
	transition: all 0.3s ease;
}

.professional-biography-page .expandable-section:hover {
	background-color: rgba(37,99,235,0.05);
}

.professional-biography-page .expandable-content {
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.5s ease;
}

.professional-biography-page .expandable-section.expanded .expandable-content {
	max-height: 1000px;
}

.professional-biography-page .expand-icon {
	transition: transform 0.3s ease;
}

.professional-biography-page .expandable-section.expanded .expand-icon {
	transform: rotate(180deg);
}