@import url('jmix.css');
@import url('environment-theme.css');
@import url('view/main-view.css');
@import url('view/main-view-top-menu.css');
@import url('view/login-view.css');
@import url('view/etf-processor-view.css');
@import url('view/calc-unit-view.css');
@import url('view/etf-calendar-assigner-view.css');
@import url('view/process-monitoring.css');
@import url('view/home-dashboard-view.css');
@import url('view/corporate-actions-view.css');
@import url('view/diff-dash-view.css');
@import url('view/planning-poker-view.css');
@import url('view/hurdle-rate-index-wizard-dialog.css');

/*
 * Auto dark mode: follows the OS/browser preference (Vaadin/Lumo don't do this on their own).
 * Values are Lumo's own dark preset (vaadin-lumo-styles/color.js, normally gated behind a
 * theme="dark" attribute) - just re-scoped to the media query instead. Primary/accent colours are
 * deliberately left alone here so environment-theme.css's per-env accent keeps winning.
 */
@media (prefers-color-scheme: dark) {
    html {
        --lumo-base-color: hsl(214, 35%, 21%);

        --lumo-tint-5pct: hsla(214, 65%, 85%, 0.06);
        --lumo-tint-10pct: hsla(214, 60%, 80%, 0.14);
        --lumo-tint-20pct: hsla(214, 64%, 82%, 0.23);
        --lumo-tint-30pct: hsla(214, 69%, 84%, 0.32);
        --lumo-tint-40pct: hsla(214, 73%, 86%, 0.41);
        --lumo-tint-50pct: hsla(214, 78%, 88%, 0.5);
        --lumo-tint-60pct: hsla(214, 82%, 90%, 0.58);
        --lumo-tint-70pct: hsla(214, 87%, 92%, 0.69);
        --lumo-tint-80pct: hsla(214, 91%, 94%, 0.8);
        --lumo-tint-90pct: hsla(214, 96%, 96%, 0.9);
        --lumo-tint: hsl(214, 100%, 98%);

        --lumo-shade-5pct: hsla(214, 0%, 0%, 0.07);
        --lumo-shade-10pct: hsla(214, 4%, 2%, 0.15);
        --lumo-shade-20pct: hsla(214, 8%, 4%, 0.23);
        --lumo-shade-30pct: hsla(214, 12%, 6%, 0.32);
        --lumo-shade-40pct: hsla(214, 16%, 8%, 0.41);
        --lumo-shade-50pct: hsla(214, 20%, 10%, 0.5);
        --lumo-shade-60pct: hsla(214, 24%, 12%, 0.6);
        --lumo-shade-70pct: hsla(214, 28%, 13%, 0.7);
        --lumo-shade-80pct: hsla(214, 32%, 13%, 0.8);
        --lumo-shade-90pct: hsla(214, 33%, 13%, 0.9);
        --lumo-shade: hsl(214, 33%, 13%);

        --lumo-contrast-5pct: var(--lumo-tint-5pct);
        --lumo-contrast-10pct: var(--lumo-tint-10pct);
        --lumo-contrast-20pct: var(--lumo-tint-20pct);
        --lumo-contrast-30pct: var(--lumo-tint-30pct);
        --lumo-contrast-40pct: var(--lumo-tint-40pct);
        --lumo-contrast-50pct: var(--lumo-tint-50pct);
        --lumo-contrast-60pct: var(--lumo-tint-60pct);
        --lumo-contrast-70pct: var(--lumo-tint-70pct);
        --lumo-contrast-80pct: var(--lumo-tint-80pct);
        --lumo-contrast-90pct: var(--lumo-tint-90pct);
        --lumo-contrast: var(--lumo-tint);

        --lumo-header-text-color: var(--lumo-contrast);
        --lumo-body-text-color: var(--lumo-contrast-90pct);
        --lumo-secondary-text-color: var(--lumo-contrast-70pct);
        --lumo-tertiary-text-color: var(--lumo-contrast-50pct);
        --lumo-disabled-text-color: var(--lumo-contrast-30pct);

        --lumo-error-color: hsl(3, 79%, 49%);
        --lumo-error-color-50pct: hsla(3, 75%, 62%, 0.5);
        --lumo-error-color-10pct: hsla(3, 75%, 62%, 0.14);
        --lumo-error-text-color: hsl(3, 100%, 80%);

        --lumo-success-color: hsl(145, 72%, 30%);
        --lumo-success-color-50pct: hsla(145, 92%, 51%, 0.5);
        --lumo-success-color-10pct: hsla(145, 92%, 51%, 0.1);
        --lumo-success-text-color: hsl(145, 85%, 46%);

        --lumo-warning-color: hsl(43, 100%, 48%);
        --lumo-warning-color-10pct: hsla(40, 100%, 50%, 0.2);
        --lumo-warning-text-color: hsl(45, 100%, 60%);
        --lumo-warning-contrast-color: var(--lumo-shade-90pct);

        color-scheme: dark;
    }
}

/*
 * Section-divider label emphasis. Referenced via classNames="bold" by template-tester-view,
 * filetemplate-creator-view and api-log-view - previously undefined anywhere in the theme.
 */
.bold {
    font-weight: bold;
}

/*
 * Status cell fill for partNameGenerator-styled grid cells (Process Monitoring status grids:
 * ETF/Family/Client status reports, File Download report). The .status-* CLASS rules in
 * view/process-monitoring.css cannot reach a grid cell <td> inside vaadin-grid's shadow DOM;
 * Vaadin 24's supported cell-styling mechanism is Column part names, targeted via ::part().
 * Same colours as the .status-* classes.
 */
vaadin-grid::part(status-red) {
    background-color: red;
    color: white;
}

vaadin-grid::part(status-blue) {
    background-color: blue;
    color: white;
}

vaadin-grid::part(status-green) {
    background-color: green;
    color: white;
}

vaadin-grid::part(status-black) {
    background-color: black;
    color: white;
}

vaadin-grid::part(status-grey) {
    background-color: grey;
    color: white;
}