/* Business Card Widget Styles */
.bc-11565-card {
	display: flex;
	flex-wrap: wrap;
	/* align-items is now handled by control */
	justify-content: space-between;
	padding: 20px;
	border: 1px solid #e1e1e1;
	border-radius: 8px;
	background-color: #ffffff;
	gap: 20px;
}

/* Position Modifiers - Force priority */
.bc-11565-pos-right {
	flex-direction: row !important;
}

.bc-11565-pos-left {
	flex-direction: row-reverse !important;
}

.bc-11565-pos-top {
	flex-direction: column-reverse !important;
	text-align: center;
}

.bc-11565-pos-bottom {
	flex-direction: column !important;
	text-align: center;
}

/* Adjustments for Top/Bottom layouts */
.bc-11565-pos-top .bc-11565-content,
.bc-11565-pos-bottom .bc-11565-content {
	align-items: center;
	width: 100%;
}

.bc-11565-pos-top .bc-11565-info,
.bc-11565-pos-bottom .bc-11565-info {
	align-items: center;
}

/* Standard Content Styles */
.bc-11565-content {
	flex: 1;
	display: flex;
	flex-direction: column;
	gap: 10px;
	min-width: 200px; 
}

.bc-11565-role {
	font-size: 0.9em;
	text-transform: uppercase;
	letter-spacing: 0.5px;
	color: #666;
	font-weight: 600;
}

.bc-11565-name {
	margin: 0;
	font-size: 1.5em;
	font-weight: 700;
	color: #333;
}

.bc-11565-info {
	display: flex;
	flex-direction: column;
	gap: 5px;
	font-size: 0.95em;
	color: #555;
}

.bc-11565-info a {
	text-decoration: none;
	color: inherit;
	transition: color 0.3s ease;
}

.bc-11565-info a:hover {
	color: #000;
	text-decoration: underline;
}

.bc-11565-image {
	flex-shrink: 0;
}

/* Default image styles - no border radius enforced */
.bc-11565-image img {
	display: block;
	width: 120px; /* Default width */
	height: 120px; /* Default height */
	object-fit: cover;
}

/* Shape modifiers handled via prefix_class on wrapper */
.bc-11565-shape-circle .bc-11565-image img {
	border-radius: 50% !important;
}

.bc-11565-shape-square .bc-11565-image img {
	border-radius: 0 !important;
}

/* Mobile Responsiveness - Force stack on small screens */
@media (max-width: 767px) {
	.bc-11565-card {
		/* Force vertical stacking on mobile regardless of setting, but respect order */
		flex-direction: column-reverse !important; 
		text-align: center;
	}
	
	/* Exception: If user specifically chose bottom image, keep it bottom */
	.bc-11565-pos-bottom {
		flex-direction: column !important;
	}

	.bc-11565-content {
		align-items: center;
		width: 100%;
	}
	
	.bc-11565-info {
		align-items: center !important;
	}
}
