/* Shared table presentation for Actuals, Forecast and Ergebnis & Liquidität. */
.economic-matrix{
    --table-label-background:#f8f1df;
    /* The shared !important header rule reads this table-specific override. */
    --table-header-background:var(--table-label-background);
    --table-result-background:#fff;
    border-collapse:separate;
    border-spacing:0;
    min-width:max-content;
    font-size:.78rem;
    line-height:1.35;
}
.economic-matrix th,.economic-matrix td{
    border-right:1px solid var(--color-line);
    border-bottom:var(--row-line-width,1px) solid var(--row-line-color,var(--color-line));
    height:32px;
    min-width:72px;
    padding:.3rem .4rem;
    text-align:right;
    white-space:nowrap;
}
.economic-matrix .label-column{
    left:0;
    min-width:200px;
    position:sticky;
    text-align:left;
    z-index:2;
}
.economic-matrix th button{
    background:transparent;
    border:0;
    color:inherit;
    cursor:pointer;
    font:inherit;
    font-weight:var(--button-weight,inherit);
    width:100%;
}

/* Month headers share the label background; quarters and years have their own colors. */
.economic-matrix thead th{
    background:var(--table-label-background);
    color:var(--color-midnight);
    position:sticky;
    top:0;
    z-index:3;
}
.economic-matrix thead .month{background:var(--table-label-background)}
.economic-matrix thead .day{--table-header-background:#fff;background:var(--table-header-background)}
.economic-matrix thead .quarter{--table-header-background:var(--color-table-hover);background:var(--table-header-background);font-weight:800}
.economic-matrix thead .year{--table-header-background:#faf9f6;background:var(--table-header-background);font-weight:900}
.economic-matrix thead .label-column{background:var(--table-label-background);z-index:4}
.economic-matrix thead th button{display:flex;justify-content:space-between}
.economic-matrix thead small{display:block;font-size:inherit;font-weight:500;margin-top:.15rem}
.economic-matrix thead th i{
    background:var(--color-review);
    border-radius:999px;
    color:var(--color-on-review);
    display:block;
    font-size:inherit;
    font-style:normal;
    margin-top:.15rem;
    padding:.15rem;
}
.economic-matrix .period-toggle{display:flex;justify-content:space-between;gap:.5rem;font-weight:inherit;text-align:right}
.economic-matrix .period-toggle:disabled{opacity:1;cursor:default}

/* Result rows use the same white data cells as the other rows. */
.economic-matrix tbody th,.economic-matrix tbody td{background:var(--row-background,#fff)}
.economic-matrix tbody .db1-total,.economic-matrix tbody .db2-total,.economic-matrix tbody .result-total{
    --row-background:var(--table-result-background);
}
.economic-matrix tbody .label-column{background:var(--table-label-background);padding-left:1.7rem}

/* Override cell backgrounds, including scoped Forecast styles and sticky labels. */
@media(hover:hover){
    table.economic-matrix > tbody > tr:not(.animated-detail-row):hover > :is(th,td),
    table.economic-matrix > tbody > tr.animated-detail-row.is-open:hover > :is(th,td){
        background:var(--color-table-hover);
    }
}

/* Aggregate periods take precedence over normal row weights; labels are independent. */
.economic-matrix tbody td{font-weight:var(--period-weight,var(--row-weight,400))}
.economic-matrix tbody td.quarter{--period-weight:800}
.economic-matrix tbody td.year{--period-weight:900}
.economic-matrix tbody th{font-weight:var(--label-weight,700)}
.economic-matrix .total-row{--row-weight:900;--label-weight:900}
.economic-matrix .plain-value-row{--row-weight:400;--label-weight:900}
.economic-matrix .plain-value-row>td.quarter{--row-weight:800}
.economic-matrix .tax-row{--row-weight:400;--label-weight:900;color:var(--color-midnight)}
.economic-matrix .tax-row>td.quarter{--row-weight:800}
.economic-matrix .hours-row,.economic-matrix .ratio-row{--row-weight:800;--label-weight:800;color:var(--color-midnight)}
.economic-matrix .ratio-row>td.month{--row-weight:400}
.economic-matrix .ratio-row>td.year{--row-weight:900}
.economic-matrix .db1-total,.economic-matrix .db2-total{--row-weight:400;--label-weight:900;--button-weight:800}
.economic-matrix .db1-total>td.quarter,.economic-matrix .db2-total>td.quarter{--row-weight:800}
.economic-matrix tbody .product-group{font-weight:400}
.economic-matrix .liability-row{--row-weight:500;--label-weight:400}

.economic-matrix .net-total,.economic-matrix .ratio-row{
    --row-line-width:3px;
    --row-line-color:var(--color-midnight);
}
.economic-matrix .liability-toggle{background:transparent;border:0;color:inherit;text-align:left;cursor:pointer;padding:0;position:relative}
.economic-matrix td.runway-alert,.economic-matrix td.break-even-gap{color:#8b1520;font-weight:900}

.economic-matrix .row-toggle-icon{position:absolute;left:-1.3rem;width:1.3rem;text-align:left}

/* Keep real table columns aligned while detail rows slide open and closed. */
table.economic-matrix tr.animated-detail-row > :is(th,td){
    height:0;
    padding:0;
    border-bottom-width:0;
    transition:border-bottom-width 180ms ease;
}
table.economic-matrix tr.animated-detail-row.is-open > :is(th,td){border-bottom-width:1px}
.economic-matrix .detail-reveal{
    display:grid;
    grid-template-rows:0fr;
    opacity:0;
    transition:grid-template-rows 180ms ease,opacity 150ms ease;
}
.economic-matrix .is-open .detail-reveal{grid-template-rows:1fr;opacity:1}
.economic-matrix .detail-reveal > div{min-height:0;overflow:hidden}
.economic-matrix .detail-content{
    box-sizing:border-box;
    min-height:32px;
    padding:.3rem .4rem;
    display:flex;
    align-items:center;
    justify-content:flex-end;
}
.economic-matrix .label-column .detail-content{justify-content:flex-start;padding-left:1.7rem}
@media(prefers-reduced-motion:reduce){
    table.economic-matrix tr.animated-detail-row > :is(th,td),
    .economic-matrix .detail-reveal{transition:none}
}

/* Session-only narrowing of the sticky label column in the three matrices. */
table.economic-matrix[data-label-resize-table] .label-column{
    box-sizing:border-box;
    width:var(--economic-label-width)!important;
    min-width:var(--economic-label-width)!important;
    max-width:var(--economic-label-width)!important;
    overflow:hidden;
    white-space:nowrap;
}
table.economic-matrix[data-label-resize-table] col[data-timeline-key="label"]{width:var(--economic-label-width)!important}
table.economic-matrix[data-label-resize-table] .label-column :is(.timeline-cell,.detail-reveal,.detail-content,button,span){max-width:100%;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:clip}
table.economic-matrix[data-label-resize-table] .label-column .row-toggle-icon{overflow:visible}
/* The icon sits in the label's left padding, outside the button itself.
   Clip long text at the enclosing cell, not at this button's content box. */
table.economic-matrix[data-label-resize-table] .label-column .liability-toggle{overflow:visible}
.economic-matrix .economic-label-resize{position:absolute;top:0;bottom:0;right:0;width:10px;z-index:6;cursor:pointer;touch-action:none;user-select:none}
.economic-matrix .economic-label-resize:focus-visible{outline:2px solid var(--color-midnight);outline-offset:-2px}
.economic-matrix:has(.economic-label-resize:hover) .label-column,
.economic-matrix:has(.economic-label-resize:focus-visible) .label-column,
.economic-matrix.label-resizing .label-column{border-right-color:var(--color-midnight);box-shadow:inset -2px 0 var(--color-midnight)}
.economic-matrix.label-resizing{user-select:none;cursor:pointer}

/* Layout zoom keeps scroll extents and sticky headers aligned with the table. */
table.economic-matrix[data-label-resize-table]{zoom:var(--economic-table-zoom,1)}
.actual-toolbar .economic-table-zoom{display:flex;align-items:center;align-self:center;gap:.35rem;margin-left:auto;flex:0 0 auto;white-space:nowrap}
.economic-table-zoom button{display:grid;place-items:center;min-width:28px;height:30px;padding:0 .35rem;border:1px solid var(--color-line);border-radius:6px;background:var(--color-paper,#fff);color:var(--color-midnight);font:inherit;font-size:.85rem;cursor:pointer}
.economic-table-zoom button:hover:not(:disabled){background:var(--color-table-hover)}
.economic-table-zoom button:disabled{opacity:.45;cursor:default}
.economic-table-zoom input[type="range"]{width:96px;min-width:0;padding:0;accent-color:var(--color-midnight);cursor:pointer}
.economic-table-zoom .economic-zoom-value{min-width:54px;font-size:.75rem;font-variant-numeric:tabular-nums}
.economic-table-zoom :is(button,input):focus-visible{outline:2px solid var(--color-midnight);outline-offset:2px}
