.wc-details{
display:flex;
align-items:center;
gap:var(--gd2);
flex-wrap:wrap;
flex:1;
}
.wc-detail{
display:inline-flex;
align-items:center;
gap:4px;
height:32px;
padding:0 10px;
font-family:var(--ff2);
font-size:12px;
font-weight:700;
white-space:nowrap;
background-color:var(--bg2);
border:var(--bw1) solid var(--bc1);
border-radius:calc(var(--br0) - 2px);
box-sizing:border-box;
}
.wc-detail-icon{
width:12px;
height:12px;
fill:var(--tx3);
flex-shrink:0;
}
.wc-detail-value{
color:var(--tx2);
}
.wc-detail-label{
color:var(--tx3);
}
.wc-stats-bar{
display:flex;
align-items:center;
gap:var(--gd2);
flex-wrap:wrap;
}
.wc-stat{
display:inline-flex;
align-items:center;
gap:6px;
height:var(--face);
padding:0 14px;
background-color:var(--bg2);
border:var(--bw1) solid var(--bc1);
border-radius:var(--br0);
box-sizing:border-box;
}
.wc-stat-value{
font-family:var(--ff3);
font-size:16px;
font-weight:700;
color:var(--cl1);
line-height:1;
}
.wc-stat-label{
font-family:var(--ff2);
font-size:11px;
font-weight:700;
text-transform:uppercase;
letter-spacing:1px;
color:var(--tx3);
line-height:1;
}
@media(max-width:600px){
.wc-details{
gap:var(--gd4) var(--gd2);
}
.wc-detail{
min-width:0;
}
.wc-stats-bar{
gap:4px;
}
.wc-stat{
flex:1 1 calc(33.33% - 4px);
justify-content:center;
padding:0 8px;
min-width:0;
}
}