/*
 * SPDX-License-Identifier: BSD-2-Clause
 * SPDX-FileCopyrightText: 2025 Arjen Hiemstra <ahiemstra@heimr.nl>
 */

/*
 * Application-structural elements like windows, drawers, etc.
 */

:root {
    --window-active-background-color: custom-color("kcolorscheme", "active", "window", "background", "normal");
    --window-active-text-color: custom-color("kcolorscheme", "active", "window", "foreground", "text");
    --window-active-border-color: custom-color("kcolorscheme", "active", "window", "decoration", "frame");

    --window-inactive-background-color: custom-color("kcolorscheme", "inactive", "window", "background", "normal");
    --window-inactive-text-color: custom-color("kcolorscheme", "inactive", "window", "foreground", "text");
    --window-inactive-border-color: custom-color("kcolorscheme", "inactive", "window", "decoration", "frame");

    --header-active-background-color: custom-color("kcolorscheme", "active", "header", "background", "normal");
    --header-active-text-color: custom-color("kcolorscheme", "active", "header", "foreground", "text");
    --header-active-border-color: custom-color("kcolorscheme", "active", "header", "decoration", "frame");

    --header-inactive-background-color: custom-color("kcolorscheme", "inactive", "header", "background", "normal");
    --header-inactive-text-color: custom-color("kcolorscheme", "inactive", "header", "foreground", "text");
    --header-inactive-border-color: custom-color("kcolorscheme", "inactive", "header", "decoration", "frame");
}

applicationwindow
{
    background-color: var(--window-active-background-color);
    color: var(--window-active-text-color);

    &.inactive {
        background-color: var(--window-inactive-background-color);
        color: var(--window-inactive-text-color);
    }
}

page
{
    background-color: var(--window-background-color);
    color: var(--window-text-color);

    .inactive & {
        background-color: var(--window-inactive-background-color);
        color: var(--window-inactive-text-color);
    }
}

toolbar
{
    padding: var(--small-spacing);
    padding-top: var(--medium-spacing);
    padding-bottom: var(--large-spacing);
    color: var(--window-active-text-color);
    background-color: var(--window-active-background-color);

    &.header {
        border-bottom: 1px solid var(--header-active-border-color);
        background-color: var(--header-active-background-color);
    }

    &.footer {
        border-top: 1px solid var(--window-active-border-color);
    }

    .inactive & {
        background-color: var(--window-inactive-background-color);
        border-color: var(--window-inactive-border-color);

        &.header {
            background-color: var(--header-inactive-background-color);
            border-color: var(--header-inactive-border-color);
        }
    }
}

drawer
{
    color: var(--view-text-color);
    background-color: var(--view-background-color);

    &.modal {
        color: var(--window-text-color);
        background-color: var(--window-active-background-color);

        .inactive & {
            background-color: var(--window-inactive-background-color);
        }
    }
}

scrollview {
    &.vertical-scroll {
        padding-right: var(--scrollbar-size);
    }

    &.horizontal-scroll {
        padding-bottom: var(--scrollbar-size);
    }

    &.framed-background
    {
        background-color: var(--view-background-color);
        border: 1px solid var(--view-border-color);
        border-radius: var(--corner-radius);
    }
}

splitview {
    & handle {
        width: 1px;
        height: 1px;
        background-color: var(--window-border-color);
    }

    &.horizontal handle {
        margin-left: 6px;
        margin-right: 6px;
    }

    &.vertical handle {
        margin-top: 6px;
        margin-bottom: 6px;
    }
}

pageindicator {
    spacing: var(--small-spacing);
}

pageindicatordelegate {
    background-color: var(--indicator-color);
    width: 8px;
    height: 8px;
    border-radius: 4px;

    &:pressed {
        background-color: var(--indicator-press-color);
    }

    &.current {
        background-color: var(--indicator-current-color);
    }
}

frame,
groupbox
{
    padding: var(--small-spacing);
    border: 1px solid var(--window-border-color);
    border-radius: var(--corner-radius);
}

groupbox {
    background-color: var(--window-background-color);
    color: var(--window-text-color);

    & > header {
        color: var(--window-text-color);
    }
}
