/*
    Dark mode - EXPERIMENTAL

    Since this is a late add-on, CSS hacks are allowed here to resemble a dark mode.
    As of yet, there is no official ConDoor dark mode.
*/

body.dark-mode {
    /**/
    color: #ccc;
    /* Make all (layout) tables dark, */
    & table {
        background: #333;
    }
    /* then undo the exceptions. */
    & #bannerWrapper table,
    .Calculation table {
        background: unset;
    }
    /* Lighten labels in forms. */
    & .standard-label,
    & .standard-text,
    & label {
        color: #ccc;
    }

    & :where(input:not([type=image]), select, textarea):not(.Calculation *) {
        background: #666;
        border-color: #aaa;
        color: #fff;
    }
    /* Target outer divs under a bunch of tabs. */
    & td[bgcolor="white"] > div {
        background: #333;
    }
    /* Darken lines in forms to blend with the background. */
    & [class*=" cnd-border"],
    & [class^="cnd-border"],
    & [class*=" cnd-dash"],
    & [class^="cnd-dash"],
    & [class*=" cnd-dots"],
    & [class^="cnd-dots"] {
        border-color: #555;
    }
    /* Make icon-style buttons white. */
    & img[src*="../images/Branding/icons"],
    & input[src*="../images/Branding/icons"] {
        filter: invert(1);
    }

    &.auth-int,
    &.auth-ext {
        background: oklch(42% 0 0);
    }

    &:has(.tab-activeIndustrial) .Calculation {
        background: oklch(from var(--cnd-green) 42% 0.015 h);
    }
}