.bht-challenges {
width: 100%;
min-width: 0;
}
.bht-challenge-grid {
display: grid;
grid-template-columns: repeat(1, minmax(0, 1fr));
gap: 14px;
margin-top: 14px;
}
.bht-challenge {
display: flex;
flex-direction: column;
gap: 12px;
}
.bht-challenge.is-completed {
border-color: var(--bht-primary);
background: var(--bht-primary-soft);
}
.bht-challenge.is-paused {
border-style: dashed;
}
.bht-challenge__head {
display: grid;
grid-template-columns: auto 1fr auto;
align-items: start;
gap: 12px;
}
.bht-challenge__icon {
display: grid;
place-items: center;
width: 48px;
height: 48px;
border-radius: 14px;
background: var(--bht-accent-soft);
font-size: 1.6rem;
}
.bht-challenge__name {
font-size: 1.05rem;
overflow-wrap: anywhere;
}
.bht-challenge__desc {
color: var(--bht-muted);
font-size: 0.92rem;
}
.bht-challenge__day {
font-size: 1.15rem;
font-weight: 800;
color: var(--bht-primary-dark);
}
.bht-challenge__stats {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 8px;
text-align: center;
}
.bht-challenge__stats > div {
padding: 8px 4px;
border-radius: var(--bht-radius-sm);
background: #f6f8f7;
}
.bht-challenge.is-completed .bht-challenge__stats > div {
background: #fff;
}
.bht-challenge__stats dt {
font-size: 0.7rem;
font-weight: 700;
text-transform: uppercase;
letter-spacing: 0.03em;
color: var(--bht-muted);
}
.bht-challenge__stats dd {
font-size: 0.95rem;
font-weight: 800;
}
.bht-challenge__actions {
display: flex;
flex-wrap: wrap;
gap: 8px;
margin-top: auto;
}