.financieel-rasterkader { width: 100%; min-width: 0; }

.financieel-tabel {
    width: 100%;
    table-layout: fixed;
    border-collapse: separate;
    border-spacing: 0;
}

.financieel-tabel.project { min-width: 920px; }
.financieel-tabel.project th:nth-child(1) { width: 88px; }
.financieel-tabel.project th:nth-child(2) { width: 112px; }
.financieel-tabel.project th:nth-child(4) { width: 190px; }
.financieel-tabel.project th:nth-child(5),
.financieel-tabel.project th:nth-child(6) { width: 150px; }

.financieel-tabel.uitvoering { min-width: 1080px; }
.financieel-tabel.uitvoering th:nth-child(1) { width: 118px; }
.financieel-tabel.uitvoering th:nth-child(2) { width: 125px; }
.financieel-tabel.uitvoering th:nth-child(4) { width: 160px; }
.financieel-tabel.uitvoering th:nth-child(5) { width: 140px; }
.financieel-tabel.uitvoering th:nth-child(6) { width: 210px; }
.financieel-tabel.uitvoering th:nth-child(7) { width: 150px; }

.financieel-tabel thead th {
    position: sticky;
    top: 58px;
    z-index: 5;
    height: 42px;
    padding: 7px 9px;
    border-right: 1px solid #8a8886;
    border-bottom: 1px solid #605e5c;
    background: #f3f3f3;
    text-align: left;
    vertical-align: bottom;
    font-size: 11px;
    font-weight: 600;
}

.financieel-tabel th:first-child,
.financieel-tabel td:first-child {
    border-left: 1px solid #8a8886;
}

.financieel-tabel td {
    min-width: 0;
    height: 50px;
    padding: 7px 9px;
    border-right: 1px solid #a6a6a6;
    border-bottom: 1px solid #c8c8c8;
    background: #fff;
    vertical-align: middle;
    overflow-wrap: anywhere;
}

.financieel-tabel tbody tr {
    content-visibility: auto;
    contain-intrinsic-size: 50px;
}

.financieel-tabel tbody tr:not(.financieel-groepsrij):hover td { background: #f3f9f6; }
.financieel-tabel tbody tr:focus { outline: none; }
.financieel-tabel tbody tr:focus td {
    background: #e6f2ec;
    box-shadow: inset 0 2px #0f6f45, inset 0 -2px #0f6f45;
}

.financieel-tabel tbody tr:focus td:first-child {
    box-shadow: inset 2px 0 #0f6f45, inset 0 2px #0f6f45,
        inset 0 -2px #0f6f45;
}

.financieel-tabel tbody tr:focus td:last-child {
    box-shadow: inset -2px 0 #0f6f45, inset 0 2px #0f6f45,
        inset 0 -2px #0f6f45;
}

.financieel-tabel td > strong,
.financieel-tabel td > small { display: block; }
.financieel-tabel td > small,
.financieel-tabel td small { color: #616161; }

.financieel-soort {
    display: inline-block;
    color: #0e5b2f;
    font-size: 11px;
    font-weight: 700;
}

.financieel-getal {
    text-align: right;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.financieel-totaal { font-weight: 700; }
.financieel-tabel .financieel-rubriek td { background: #edf4f1; }
.financieel-tabel .financieel-staartpost td { background: #f7faf8; }

.financieel-tabel .financieel-groepsrij {
    content-visibility: visible;
    contain-intrinsic-size: auto;
}

.financieel-tabel .financieel-groepsrij th {
    height: 34px;
    padding: 6px 9px;
    border-right: 1px solid #8a8886;
    border-bottom: 1px solid #7bb98f;
    border-left: 3px solid #0f6f45;
    background: #e7f1ec;
    text-align: left;
    font-size: 12px;
}

.financieel-groepsrij th > strong { color: #0e5b2f; }
.financieel-groepsrij th > span {
    margin-left: 8px;
    color: #505050;
    font-size: 10px;
    font-weight: 400;
}

.financieel-opbouw {
    margin: 0;
    display: grid;
    gap: 2px;
}

.financieel-opbouw > div {
    display: flex;
    justify-content: space-between;
    gap: 8px;
}

.financieel-opbouw dt {
    color: #616161;
    font-size: 10px;
}

.financieel-opbouw dd {
    margin: 0;
    font-size: 11px;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

@media (max-width: 1180px) and (min-width: 901px) {
    .financieel-rasterkader { overflow-x: auto; }
}
