/**
 * Course Instructor Pattern Styles
 *
 * Speaker / instructor card displayed on individual CE course pages.
 */

/* ========================================
   Card Container
======================================== */

.course-instructor {
	overflow: hidden;
	box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
	transition: border-color 0.25s ease, box-shadow 0.25s ease, transform 0.25s ease;
	will-change: transform;
	max-width: 1100px;
	margin-left: auto !important;
	margin-right: auto !important;
}

.course-instructor:hover {
	border-color: #c4b5fd !important;
	box-shadow: 0 12px 28px rgba(76, 29, 149, 0.12), 0 4px 10px rgba(15, 23, 42, 0.06);
	transform: translateY(-2px);
}

.course-instructor .course-instructor__columns {
	gap: 0 !important;
	margin-bottom: 0;
}

/* ========================================
   Media (left) column
======================================== */

.course-instructor__media-col {
	background-color: #d6efe5;
	position: relative;
	align-self: stretch;
	padding: 0 !important;
}

.course-instructor__media {
	position: relative;
	height: 100%;
	min-height: 100%;
}

.course-instructor__photo {
	margin: 0 !important;
	height: 100%;
}

.course-instructor__photo img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center top;
}

/* IFMCP Certified badge */
.course-instructor__badge {
	position: absolute;
	left: 16px;
	bottom: 16px;
	gap: 6px !important;
	padding: 6px 14px;
	background-color: #f5b945;
	color: #1f2937;
	border-radius: 999px;
	box-shadow: 0 2px 6px rgba(15, 23, 42, 0.12);
}

.course-instructor__badge-icon {
	margin: 0 !important;
	display: flex;
	align-items: center;
}

.course-instructor__badge-icon img {
	display: block;
}

.course-instructor__badge p {
	color: #1f2937;
}

/* ========================================
   Content (right) column
======================================== */

.course-instructor__content-col {
	padding: 40px;
}

.course-instructor__name {
	color: #0f172a;
}

.course-instructor__bio {
	color: #1f2937;
}

/* ========================================
   Tag pills
======================================== */

.course-instructor__tags {
	row-gap: 10px !important;
}

.course-instructor__tag {
	background-color: #f1f5f9;
	color: #334155;
}

/* ========================================
   Divider & meta row
======================================== */

.course-instructor__divider {
	border: none;
	height: 1px;
	opacity: 1;
}

.course-instructor__meta {
	row-gap: 12px !important;
}

.course-instructor__meta-item {
	gap: 8px !important;
}

.course-instructor__meta-item p {
	color: #475569;
}

.course-instructor__meta-icon {
	margin: 0 !important;
	display: flex;
	align-items: center;
}

.course-instructor__meta-icon img {
	display: block;
}

/* ========================================
   Responsive Styles
======================================== */

@media (max-width: 781px) {
	.course-instructor__content-col {
		padding: 32px !important;
	}

	.course-instructor__name {
		font-size: 30px !important;
	}
}

@media (max-width: 600px) {
	.course-instructor .course-instructor__columns {
		flex-direction: column;
	}

	.course-instructor__media-col,
	.course-instructor__content-col {
		flex-basis: 100% !important;
		width: 100% !important;
	}

	.course-instructor__photo img {
		max-height: 360px;
	}

	.course-instructor__content-col {
		padding: 28px !important;
	}

	.course-instructor__name {
		font-size: 26px !important;
	}
}