.abp-bio-box {
display: flex;
flex-direction: row;
gap: 20px;
align-items: flex-start;
padding: 24px;
margin: 40px 0 0;
background: #fff;
border: 1px solid #e8e8e8;
border-radius: 8px;
box-sizing: border-box;
text-align: left;
}
.abp-bio-box .abp-avatar {
flex-shrink: 0;
width: 72px;
height: 72px;
min-width: 72px;
overflow: hidden;
display: flex;
align-items: center;
justify-content: center;
background: #e6f1fb;
margin: 0;
padding: 0;
}
.abp-bio-box .abp-avatar--circle  { border-radius: 50%; }
.abp-bio-box .abp-avatar--rounded { border-radius: 10px; }
.abp-bio-box .abp-avatar--square  { border-radius: 0; }
.abp-bio-box .abp-avatar img {
width: 72px;
height: 72px;
object-fit: cover;
display: block;
margin: 0;
padding: 0;
border: none;
border-radius: inherit;
}
.abp-bio-box .abp-avatar__initials {
font-size: 24px;
font-weight: 600;
color: #185fa5;
line-height: 1;
text-align: center;
}
.abp-bio-box .abp-bio-content {
flex: 1;
min-width: 0;
text-align: left;
}
.abp-bio-box .abp-bio-header {
display: flex;
align-items: center;
flex-wrap: wrap;
gap: 10px;
margin: 0 0 10px;
padding: 0;
text-align: left;
}
.abp-bio-box .abp-bio-about {
font-size: 17px;
font-weight: 600;
color: #888;
white-space: nowrap;
margin: 0;
padding: 0;
line-height: 1.3;
}
.abp-bio-box .abp-bio-divider {
display: inline-block;
width: 1px;
height: 18px;
background: #ccc;
flex-shrink: 0;
margin: 0;
padding: 0;
}
.abp-bio-box .abp-bio-name {
font-size: 17px;
font-weight: 600;
color: #1e1e1e;
margin: 0;
padding: 0;
line-height: 1.3;
}
.abp-bio-box .abp-bio-social {
display: flex;
gap: 6px;
margin-left: auto;
align-items: center;
}
.abp-bio-box .abp-social-icon {
display: flex;
align-items: center;
justify-content: center;
width: 30px;
height: 30px;
border-radius: 6px;
border: 1px solid #e0e0e0;
background: #f9f9f9;
color: #555;
text-decoration: none;
flex-shrink: 0;
box-sizing: border-box;
}
.abp-bio-box .abp-social-icon:hover {
border-color: #2271b1;
background: #f0f6fc;
color: #2271b1;
}
.abp-bio-box .abp-social-icon svg {
display: block;
width: 16px;
height: 16px;
}
.abp-bio-box .abp-bio-desc {
font-size: 14px;
line-height: 1.7;
color: #555;
margin: 0;
padding: 0;
text-align: left;
}
@media (max-width: 600px) {
.abp-bio-box {
flex-direction: column;
gap: 14px;
}
.abp-bio-box .abp-bio-social {
margin-left: 0;
}
}