.termijn-declaratie-werkband {
    flex: 0 0 auto;
    border-bottom: 1px solid #9ea5a1;
    background: #fff;
}

.termijn-declaratie-werkband > header {
    display: flex;
    min-height: 38px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 6px 12px;
    border-bottom: 1px solid #d2d2d2;
    background: #f3f6f4;
}

.termijn-declaratie-werkband > header strong,
.termijn-declaratie-werkband > header small { display: block; }
.termijn-declaratie-werkband > header small,
.termijn-declaratie-werkband > header output { color: #616161; font-size: 10px; }
.termijn-declaratie-werklijst { display: grid; }

.termijn-declaratie-werkrij {
    display: grid;
    min-height: 48px;
    grid-template-columns: minmax(220px, 1fr) 120px 132px 132px 72px;
    align-items: center;
    gap: 10px;
    border-bottom: 1px solid #e1e1e1;
    padding: 6px 12px;
    font-variant-numeric: tabular-nums;
}

.termijn-declaratie-werkrij:last-child { border-bottom: 0; }
.termijn-declaratie-werkrij > div { min-width: 0; }
.termijn-declaratie-werkrij > div strong,
.termijn-declaratie-werkrij > div small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.termijn-declaratie-werkrij > div small { color: #616161; font-size: 10px; }
.termijn-declaratie-werkrij > span,
.termijn-declaratie-werkrij > strong { text-align: right; }
.termijn-declaratie-acties { display: flex; align-items: center; justify-content: flex-end; gap: 8px; }

@media (max-width: 700px) {
    .termijn-declaratie-werkrij {
        grid-template-columns: minmax(0, 1fr) auto;
        gap: 4px 10px;
        padding-inline: 10px;
    }
    .termijn-declaratie-werkrij > div { grid-column: 1 / -1; }
    .termijn-declaratie-werkrij > .termijn-declaratie-acties { justify-content: flex-start; }
    .termijn-declaratie-werkrij > span,
    .termijn-declaratie-werkrij > strong { text-align: left; }
    .termijn-declaratie-werkrij > .termijn-kleine-actie { grid-column: 2; grid-row: 2 / 4; }
}
