/* The bridge from the Sedis tokens to the Kendo/Telerik theme (SED-1166). Kendo MVC widgets and Telerik
   Blazor components read these; every value points at a --sedis-* property that bootstrap-custom.scss
   emits from _tokens.scss, so Bootstrap and Kendo cannot drift apart. Write no colour literal here.

   Kendo derives hover/active/on-colours itself with oklch() relative-colour maths. Its derivation lightens
   or darkens on its own scale and gives grid text a blue cast (oklch hue 248), so the states Sedis has an
   opinion on are set explicitly to the same steps Bootstrap uses. */
:root {
    --kendo-color-primary: var(--sedis-teal);
    --kendo-color-primary-hover: var(--sedis-teal-hover);
    --kendo-color-primary-active: var(--sedis-teal-active);
    --kendo-color-on-primary: var(--sedis-ink);
    --kendo-color-primary-subtle: var(--sedis-teal-subtle);
    --kendo-color-primary-subtle-hover: var(--sedis-teal-subtle);
    --kendo-color-primary-subtle-active: var(--sedis-teal-subtle-active);
    --kendo-color-primary-on-subtle: var(--sedis-teal-text-hover);
    --kendo-color-primary-on-surface: var(--sedis-teal-text);

    --kendo-color-on-app-surface: var(--sedis-ink);
    --kendo-color-base: var(--sedis-base);
    --kendo-color-on-base: var(--sedis-ink);
    --kendo-color-subtle: var(--sedis-muted);

    --kendo-color-error: var(--sedis-danger);
    --kendo-color-warning: var(--sedis-warning);
    --kendo-color-on-warning: var(--sedis-ink);
    --kendo-color-warning-on-surface: var(--sedis-warning-text);
    --kendo-color-success: var(--sedis-success-text);
    --kendo-color-info: var(--sedis-info);

    --kendo-border-radius-md: var(--sedis-radius);

    /* Chart series: the logo's colours, in the order the charts have always used. */
    --kendo-color-series-a: var(--sedis-teal);
    --kendo-color-series-b: var(--sedis-cyan);
    --kendo-color-series-c: var(--sedis-green);
    --kendo-color-series-d: var(--sedis-pink);
    --kendo-color-series-e: var(--sedis-magenta);
    --kendo-color-series-f: var(--sedis-series-f);
    --kendo-font-family: Inter;
    /* The type scale (SED-1166 A3): grids, fields and buttons at the dense 12 px step, nothing under 11 px. */
    --kendo-font-size: var(--sedis-text-dense);
    --kendo-font-size-xs: var(--sedis-label-size);
    --kendo-font-size-sm: var(--sedis-label-size);
    --kendo-font-size-md: var(--sedis-text-dense);
    --kendo-font-size-lg: var(--sedis-text-lead);
    --kendo-font-size-xl: var(--sedis-text-h2);
}

/* Kendo DataViz charts*/
.k-tooltip {
    text-align: left;
}

/* TabStrip corner-radius alignment with Bootstrap cards.
   Kendo's bootstrap-main.css uses --kendo-border-radius-sm (4px) on the
   TabStrip's items + content surfaces, which reads visually square next
   to Bootstrap cards (--bs-border-radius = 8px) on the same page (e.g.
   Comp/Analyses/Blazor). We round only the content panel's bottom corners
   to match the card scale, leaving the tab headers themselves square — a
   tab is a tab, not a pill, and squared headers anchor visually to the
   rest of the page chrome. Driven by --bs-border-radius so a brand-radius
   change carries through. */
.k-tabstrip-top > .k-tabstrip-content,
.k-tabstrip-top > .k-content {
    border-bottom-left-radius: var(--bs-border-radius);
    border-bottom-right-radius: var(--bs-border-radius);
}

/* Chart overlay must not outrank a Bootstrap modal.

   Kendo's bootstrap-main.css ships `.k-chart-overlay { z-index: 10000 }`. That is
   two orders of magnitude above Bootstrap's modal (1055), so the near-white panel
   the chart draws in its EMPTY state paints straight over any modal opened on top
   of it — the dialog's backdrop dims the rest of the page while the chart's own
   rectangle stays bright, and the overlay swallows clicks there too
   (elementFromPoint at the chart's centre returned .k-chart-overlay, outside the
   modal). Found in the SED-991 close-out pass with the bolagssegment dialog open
   over an empty Indexserier chart, but nothing about it is specific to that page:
   it is reachable wherever a Bootstrap modal can open over a Telerik chart that
   has no data.

   1 rather than 0: the overlay still has to cover the chart's own plot area, which
   is what it is for. Its parent .k-chart is position: relative, so a single step is
   all the elevation it ever needed — the 10000 buys nothing and costs this. */
.k-chart-overlay {
    z-index: 1;
}