﻿/* ============================================================
   W6 / wiso – "Edel" Scrollbars für DHTMLX 8.3.8
   Ziel-Elemente: .wiso_data-wrap, .wiso_grid-body
   Themes:
   - [data-wiso-theme="light"]
   - [data-wiso-theme="contrast-light"]
   - [data-wiso-theme="dark"]
   - [data-wiso-theme="contrast-dark"]
   Unterstützt: Chromium/Edge/Chrome + Firefox
   ============================================================ */


/* ============================================================
   LIGHT
   ============================================================ */
[data-wiso-theme="light"] .wiso_data-wrap,
[data-wiso-theme="light"] .wiso_grid-body {
    scrollbar-width: thin;
    scrollbar-color: #b7c0cf #f3f5f9; /* thumb | track */
}

    [data-wiso-theme="light"] .wiso_data-wrap::-webkit-scrollbar,
    [data-wiso-theme="light"] .wiso_grid-body::-webkit-scrollbar {
        width: 10px;
        height: 10px;
    }

    [data-wiso-theme="light"] .wiso_data-wrap::-webkit-scrollbar-track,
    [data-wiso-theme="light"] .wiso_grid-body::-webkit-scrollbar-track {
        background: #f3f5f9;
    }

    [data-wiso-theme="light"] .wiso_data-wrap::-webkit-scrollbar-thumb,
    [data-wiso-theme="light"] .wiso_grid-body::-webkit-scrollbar-thumb {
        background-color: #b7c0cf;
        border-radius: 999px;
        border: 3px solid #f3f5f9;
    }

        [data-wiso-theme="light"] .wiso_data-wrap::-webkit-scrollbar-thumb:hover,
        [data-wiso-theme="light"] .wiso_grid-body::-webkit-scrollbar-thumb:hover {
            background-color: #9eabbe;
        }

    [data-wiso-theme="light"] .wiso_data-wrap::-webkit-scrollbar-corner,
    [data-wiso-theme="light"] .wiso_grid-body::-webkit-scrollbar-corner {
        background: #f3f5f9;
    }

    [data-wiso-theme="light"] .wiso_data-wrap::-webkit-scrollbar-button,
    [data-wiso-theme="light"] .wiso_grid-body::-webkit-scrollbar-button {
        display: none;
    }


/* ============================================================
   CONTRAST-LIGHT (mehr Sichtbarkeit)
   ============================================================ */
[data-wiso-theme="contrast-light"] .wiso_data-wrap,
[data-wiso-theme="contrast-light"] .wiso_grid-body {
    scrollbar-width: thin;
    scrollbar-color: #6f7d92 #ffffff; /* thumb | track */
}

    [data-wiso-theme="contrast-light"] .wiso_data-wrap::-webkit-scrollbar,
    [data-wiso-theme="contrast-light"] .wiso_grid-body::-webkit-scrollbar {
        width: 12px;
        height: 12px;
    }

    [data-wiso-theme="contrast-light"] .wiso_data-wrap::-webkit-scrollbar-track,
    [data-wiso-theme="contrast-light"] .wiso_grid-body::-webkit-scrollbar-track {
        background: #ffffff;
    }

    [data-wiso-theme="contrast-light"] .wiso_data-wrap::-webkit-scrollbar-thumb,
    [data-wiso-theme="contrast-light"] .wiso_grid-body::-webkit-scrollbar-thumb {
        background-color: #6f7d92;
        border-radius: 999px;
        border: 3px solid #ffffff;
    }

        [data-wiso-theme="contrast-light"] .wiso_data-wrap::-webkit-scrollbar-thumb:hover,
        [data-wiso-theme="contrast-light"] .wiso_grid-body::-webkit-scrollbar-thumb:hover {
            background-color: #556378;
        }

    [data-wiso-theme="contrast-light"] .wiso_data-wrap::-webkit-scrollbar-corner,
    [data-wiso-theme="contrast-light"] .wiso_grid-body::-webkit-scrollbar-corner {
        background: #ffffff;
    }

    [data-wiso-theme="contrast-light"] .wiso_data-wrap::-webkit-scrollbar-button,
    [data-wiso-theme="contrast-light"] .wiso_grid-body::-webkit-scrollbar-button {
        display: none;
    }


/* ============================================================
   DARK (edel, ruhig, W6-like)
   ============================================================ */
[data-wiso-theme="dark"] .wiso_data-wrap,
[data-wiso-theme="dark"] .wiso_grid-body {
    scrollbar-width: thin;
    scrollbar-color: #2a3550 #0b1326; /* thumb | track */
}

    [data-wiso-theme="dark"] .wiso_data-wrap::-webkit-scrollbar,
    [data-wiso-theme="dark"] .wiso_grid-body::-webkit-scrollbar {
        width: 10px;
        height: 10px;
    }

    [data-wiso-theme="dark"] .wiso_data-wrap::-webkit-scrollbar-track,
    [data-wiso-theme="dark"] .wiso_grid-body::-webkit-scrollbar-track {
        background: #0b1326;
    }

    [data-wiso-theme="dark"] .wiso_data-wrap::-webkit-scrollbar-thumb,
    [data-wiso-theme="dark"] .wiso_grid-body::-webkit-scrollbar-thumb {
        background-color: #2a3550;
        border-radius: 999px;
        border: 3px solid #0b1326;
    }

        [data-wiso-theme="dark"] .wiso_data-wrap::-webkit-scrollbar-thumb:hover,
        [data-wiso-theme="dark"] .wiso_grid-body::-webkit-scrollbar-thumb:hover {
            background-color: #3b4a6b;
        }

    [data-wiso-theme="dark"] .wiso_data-wrap::-webkit-scrollbar-corner,
    [data-wiso-theme="dark"] .wiso_grid-body::-webkit-scrollbar-corner {
        background: #0b1326;
    }

    [data-wiso-theme="dark"] .wiso_data-wrap::-webkit-scrollbar-button,
    [data-wiso-theme="dark"] .wiso_grid-body::-webkit-scrollbar-button {
        display: none;
    }


/* ============================================================
   CONTRAST-DARK (mehr Sichtbarkeit)
   ============================================================ */
[data-wiso-theme="contrast-dark"] .wiso_data-wrap,
[data-wiso-theme="contrast-dark"] .wiso_grid-body {
    scrollbar-width: thin;
    scrollbar-color: #6f86b8 #0b1220; /* thumb | track */
}

    [data-wiso-theme="contrast-dark"] .wiso_data-wrap::-webkit-scrollbar,
    [data-wiso-theme="contrast-dark"] .wiso_grid-body::-webkit-scrollbar {
        width: 12px;
        height: 12px;
    }

    [data-wiso-theme="contrast-dark"] .wiso_data-wrap::-webkit-scrollbar-track,
    [data-wiso-theme="contrast-dark"] .wiso_grid-body::-webkit-scrollbar-track {
        background: #0b1220;
    }

    [data-wiso-theme="contrast-dark"] .wiso_data-wrap::-webkit-scrollbar-thumb,
    [data-wiso-theme="contrast-dark"] .wiso_grid-body::-webkit-scrollbar-thumb {
        background-color: #6f86b8;
        border-radius: 999px;
        border: 3px solid #0b1220;
    }

        [data-wiso-theme="contrast-dark"] .wiso_data-wrap::-webkit-scrollbar-thumb:hover,
        [data-wiso-theme="contrast-dark"] .wiso_grid-body::-webkit-scrollbar-thumb:hover {
            background-color: #8fa3cf;
        }

    [data-wiso-theme="contrast-dark"] .wiso_data-wrap::-webkit-scrollbar-corner,
    [data-wiso-theme="contrast-dark"] .wiso_grid-body::-webkit-scrollbar-corner {
        background: #0b1220;
    }

    [data-wiso-theme="contrast-dark"] .wiso_data-wrap::-webkit-scrollbar-button,
    [data-wiso-theme="contrast-dark"] .wiso_grid-body::-webkit-scrollbar-button {
        display: none;
    }
/* ============================================================
   W6 / wiso – "Edel" Scrollbars für Layout-Zellen (DHTMLX 8.3.8 / wiso)
   Ziel-Elemente:
   - .wiso_layout-cell-content  (typisch: overflow:auto; padding:..)
   Optional zusätzlich:
   - .wiso_layout-cell-inner_html (wenn dort gescrollt wird)
   Themes:
   - [data-wiso-theme="light"]
   - [data-wiso-theme="contrast-light"]
   - [data-wiso-theme="dark"]
   - [data-wiso-theme="contrast-dark"]
   Unterstützt: Chromium/Edge/Chrome + Firefox
   ============================================================ */


/* ============================================================
   LIGHT
   ============================================================ */
[data-wiso-theme="light"] .wiso_layout-cell-content,
[data-wiso-theme="light"] .wiso_layout-cell-inner_html {
    scrollbar-width: thin;
    scrollbar-color: #b7c0cf #f3f5f9; /* thumb | track */
}

    [data-wiso-theme="light"] .wiso_layout-cell-content::-webkit-scrollbar,
    [data-wiso-theme="light"] .wiso_layout-cell-inner_html::-webkit-scrollbar {
        width: 10px;
        height: 10px;
    }

    [data-wiso-theme="light"] .wiso_layout-cell-content::-webkit-scrollbar-track,
    [data-wiso-theme="light"] .wiso_layout-cell-inner_html::-webkit-scrollbar-track {
        background: #f3f5f9;
        border-radius: 999px;
    }

    [data-wiso-theme="light"] .wiso_layout-cell-content::-webkit-scrollbar-thumb,
    [data-wiso-theme="light"] .wiso_layout-cell-inner_html::-webkit-scrollbar-thumb {
        background-color: #b7c0cf;
        border-radius: 999px;
        border: 3px solid #f3f5f9; /* "Luft" um Thumb */
    }

        [data-wiso-theme="light"] .wiso_layout-cell-content::-webkit-scrollbar-thumb:hover,
        [data-wiso-theme="light"] .wiso_layout-cell-inner_html::-webkit-scrollbar-thumb:hover {
            background-color: #9eabbe;
        }

    [data-wiso-theme="light"] .wiso_layout-cell-content::-webkit-scrollbar-corner,
    [data-wiso-theme="light"] .wiso_layout-cell-inner_html::-webkit-scrollbar-corner {
        background: #f3f5f9;
    }

    [data-wiso-theme="light"] .wiso_layout-cell-content::-webkit-scrollbar-button,
    [data-wiso-theme="light"] .wiso_layout-cell-inner_html::-webkit-scrollbar-button {
        display: none;
    }


/* ============================================================
   CONTRAST-LIGHT (mehr Sichtbarkeit)
   ============================================================ */
[data-wiso-theme="contrast-light"] .wiso_layout-cell-content,
[data-wiso-theme="contrast-light"] .wiso_layout-cell-inner_html {
    scrollbar-width: thin;
    scrollbar-color: #6f7d92 #ffffff; /* thumb | track */
}

    [data-wiso-theme="contrast-light"] .wiso_layout-cell-content::-webkit-scrollbar,
    [data-wiso-theme="contrast-light"] .wiso_layout-cell-inner_html::-webkit-scrollbar {
        width: 12px;
        height: 12px;
    }

    [data-wiso-theme="contrast-light"] .wiso_layout-cell-content::-webkit-scrollbar-track,
    [data-wiso-theme="contrast-light"] .wiso_layout-cell-inner_html::-webkit-scrollbar-track {
        background: #ffffff;
        border-radius: 999px;
    }

    [data-wiso-theme="contrast-light"] .wiso_layout-cell-content::-webkit-scrollbar-thumb,
    [data-wiso-theme="contrast-light"] .wiso_layout-cell-inner_html::-webkit-scrollbar-thumb {
        background-color: #6f7d92;
        border-radius: 999px;
        border: 3px solid #ffffff;
    }

        [data-wiso-theme="contrast-light"] .wiso_layout-cell-content::-webkit-scrollbar-thumb:hover,
        [data-wiso-theme="contrast-light"] .wiso_layout-cell-inner_html::-webkit-scrollbar-thumb:hover {
            background-color: #556378;
        }

    [data-wiso-theme="contrast-light"] .wiso_layout-cell-content::-webkit-scrollbar-corner,
    [data-wiso-theme="contrast-light"] .wiso_layout-cell-inner_html::-webkit-scrollbar-corner {
        background: #ffffff;
    }

    [data-wiso-theme="contrast-light"] .wiso_layout-cell-content::-webkit-scrollbar-button,
    [data-wiso-theme="contrast-light"] .wiso_layout-cell-inner_html::-webkit-scrollbar-button {
        display: none;
    }


/* ============================================================
   DARK (edel, ruhig, W6-like)
   ============================================================ */
[data-wiso-theme="dark"] .wiso_layout-cell-content,
[data-wiso-theme="dark"] .wiso_layout-cell-inner_html {
    scrollbar-width: thin;
    scrollbar-color: #2a3550 #0b1326; /* thumb | track */
}

    [data-wiso-theme="dark"] .wiso_layout-cell-content::-webkit-scrollbar,
    [data-wiso-theme="dark"] .wiso_layout-cell-inner_html::-webkit-scrollbar {
        width: 10px;
        height: 10px;
    }

    [data-wiso-theme="dark"] .wiso_layout-cell-content::-webkit-scrollbar-track,
    [data-wiso-theme="dark"] .wiso_layout-cell-inner_html::-webkit-scrollbar-track {
        background: #0b1326;
        border-radius: 999px;
    }

    [data-wiso-theme="dark"] .wiso_layout-cell-content::-webkit-scrollbar-thumb,
    [data-wiso-theme="dark"] .wiso_layout-cell-inner_html::-webkit-scrollbar-thumb {
        background-color: #2a3550;
        border-radius: 999px;
        border: 3px solid #0b1326;
    }

        [data-wiso-theme="dark"] .wiso_layout-cell-content::-webkit-scrollbar-thumb:hover,
        [data-wiso-theme="dark"] .wiso_layout-cell-inner_html::-webkit-scrollbar-thumb:hover {
            background-color: #3b4a6b;
        }

    [data-wiso-theme="dark"] .wiso_layout-cell-content::-webkit-scrollbar-corner,
    [data-wiso-theme="dark"] .wiso_layout-cell-inner_html::-webkit-scrollbar-corner {
        background: #0b1326;
    }

    [data-wiso-theme="dark"] .wiso_layout-cell-content::-webkit-scrollbar-button,
    [data-wiso-theme="dark"] .wiso_layout-cell-inner_html::-webkit-scrollbar-button {
        display: none;
    }


/* ============================================================
   CONTRAST-DARK (mehr Sichtbarkeit)
   ============================================================ */
[data-wiso-theme="contrast-dark"] .wiso_layout-cell-content,
[data-wiso-theme="contrast-dark"] .wiso_layout-cell-inner_html {
    scrollbar-width: thin;
    scrollbar-color: #6f86b8 #0b1220; /* thumb | track */
}

    [data-wiso-theme="contrast-dark"] .wiso_layout-cell-content::-webkit-scrollbar,
    [data-wiso-theme="contrast-dark"] .wiso_layout-cell-inner_html::-webkit-scrollbar {
        width: 12px;
        height: 12px;
    }

    [data-wiso-theme="contrast-dark"] .wiso_layout-cell-content::-webkit-scrollbar-track,
    [data-wiso-theme="contrast-dark"] .wiso_layout-cell-inner_html::-webkit-scrollbar-track {
        background: #0b1220;
        border-radius: 999px;
    }

    [data-wiso-theme="contrast-dark"] .wiso_layout-cell-content::-webkit-scrollbar-thumb,
    [data-wiso-theme="contrast-dark"] .wiso_layout-cell-inner_html::-webkit-scrollbar-thumb {
        background-color: #6f86b8;
        border-radius: 999px;
        border: 3px solid #0b1220;
    }

        [data-wiso-theme="contrast-dark"] .wiso_layout-cell-content::-webkit-scrollbar-thumb:hover,
        [data-wiso-theme="contrast-dark"] .wiso_layout-cell-inner_html::-webkit-scrollbar-thumb:hover {
            background-color: #8fa3cf;
        }

    [data-wiso-theme="contrast-dark"] .wiso_layout-cell-content::-webkit-scrollbar-corner,
    [data-wiso-theme="contrast-dark"] .wiso_layout-cell-inner_html::-webkit-scrollbar-corner {
        background: #0b1220;
    }

    [data-wiso-theme="contrast-dark"] .wiso_layout-cell-content::-webkit-scrollbar-button,
    [data-wiso-theme="contrast-dark"] .wiso_layout-cell-inner_html::-webkit-scrollbar-button {
        display: none;
    }

/* ============================================================
   A) NATIVE SCROLLBARS (Browser) – Grid / DataWrap / Layout Content
   ============================================================ */

/* Wir nehmen zusätzlich .wiso_layout-cell-content, weil du dort overflow:auto hast */
[data-wiso-theme="light"] .wiso_data-wrap,
[data-wiso-theme="light"] .wiso_grid-body,
[data-wiso-theme="light"] .wiso_layout-cell-content {
    scrollbar-width: thin;
    scrollbar-color: #b7c0cf #f3f5f9; /* thumb | track */
}

    [data-wiso-theme="light"] .wiso_data-wrap::-webkit-scrollbar,
    [data-wiso-theme="light"] .wiso_grid-body::-webkit-scrollbar,
    [data-wiso-theme="light"] .wiso_layout-cell-content::-webkit-scrollbar {
        width: 10px;
        height: 10px;
    }

    [data-wiso-theme="light"] .wiso_data-wrap::-webkit-scrollbar-track,
    [data-wiso-theme="light"] .wiso_grid-body::-webkit-scrollbar-track,
    [data-wiso-theme="light"] .wiso_layout-cell-content::-webkit-scrollbar-track {
        background: #f3f5f9;
    }

    [data-wiso-theme="light"] .wiso_data-wrap::-webkit-scrollbar-thumb,
    [data-wiso-theme="light"] .wiso_grid-body::-webkit-scrollbar-thumb,
    [data-wiso-theme="light"] .wiso_layout-cell-content::-webkit-scrollbar-thumb {
        background-color: #b7c0cf;
        border-radius: 999px;
        border: 3px solid #f3f5f9;
    }

        [data-wiso-theme="light"] .wiso_data-wrap::-webkit-scrollbar-thumb:hover,
        [data-wiso-theme="light"] .wiso_grid-body::-webkit-scrollbar-thumb:hover,
        [data-wiso-theme="light"] .wiso_layout-cell-content::-webkit-scrollbar-thumb:hover {
            background-color: #9eabbe;
        }

    [data-wiso-theme="light"] .wiso_data-wrap::-webkit-scrollbar-corner,
    [data-wiso-theme="light"] .wiso_grid-body::-webkit-scrollbar-corner,
    [data-wiso-theme="light"] .wiso_layout-cell-content::-webkit-scrollbar-corner {
        background: #f3f5f9;
    }

    [data-wiso-theme="light"] .wiso_data-wrap::-webkit-scrollbar-button,
    [data-wiso-theme="light"] .wiso_grid-body::-webkit-scrollbar-button,
    [data-wiso-theme="light"] .wiso_layout-cell-content::-webkit-scrollbar-button {
        display: none;
    }


/* ---------- CONTRAST-LIGHT ---------- */
[data-wiso-theme="contrast-light"] .wiso_data-wrap,
[data-wiso-theme="contrast-light"] .wiso_grid-body,
[data-wiso-theme="contrast-light"] .wiso_layout-cell-content {
    scrollbar-width: thin;
    scrollbar-color: #6f7d92 #ffffff;
}

    [data-wiso-theme="contrast-light"] .wiso_data-wrap::-webkit-scrollbar,
    [data-wiso-theme="contrast-light"] .wiso_grid-body::-webkit-scrollbar,
    [data-wiso-theme="contrast-light"] .wiso_layout-cell-content::-webkit-scrollbar {
        width: 12px;
        height: 12px;
    }

    [data-wiso-theme="contrast-light"] .wiso_data-wrap::-webkit-scrollbar-track,
    [data-wiso-theme="contrast-light"] .wiso_grid-body::-webkit-scrollbar-track,
    [data-wiso-theme="contrast-light"] .wiso_layout-cell-content::-webkit-scrollbar-track {
        background: #ffffff;
    }

    [data-wiso-theme="contrast-light"] .wiso_data-wrap::-webkit-scrollbar-thumb,
    [data-wiso-theme="contrast-light"] .wiso_grid-body::-webkit-scrollbar-thumb,
    [data-wiso-theme="contrast-light"] .wiso_layout-cell-content::-webkit-scrollbar-thumb {
        background-color: #6f7d92;
        border-radius: 999px;
        border: 3px solid #ffffff;
    }

        [data-wiso-theme="contrast-light"] .wiso_data-wrap::-webkit-scrollbar-thumb:hover,
        [data-wiso-theme="contrast-light"] .wiso_grid-body::-webkit-scrollbar-thumb:hover,
        [data-wiso-theme="contrast-light"] .wiso_layout-cell-content::-webkit-scrollbar-thumb:hover {
            background-color: #556378;
        }

    [data-wiso-theme="contrast-light"] .wiso_data-wrap::-webkit-scrollbar-corner,
    [data-wiso-theme="contrast-light"] .wiso_grid-body::-webkit-scrollbar-corner,
    [data-wiso-theme="contrast-light"] .wiso_layout-cell-content::-webkit-scrollbar-corner {
        background: #ffffff;
    }

    [data-wiso-theme="contrast-light"] .wiso_data-wrap::-webkit-scrollbar-button,
    [data-wiso-theme="contrast-light"] .wiso_grid-body::-webkit-scrollbar-button,
    [data-wiso-theme="contrast-light"] .wiso_layout-cell-content::-webkit-scrollbar-button {
        display: none;
    }


/* ---------- DARK ---------- */
[data-wiso-theme="dark"] .wiso_data-wrap,
[data-wiso-theme="dark"] .wiso_grid-body,
[data-wiso-theme="dark"] .wiso_layout-cell-content {
    scrollbar-width: thin;
    scrollbar-color: #2a3550 #0b1326;
}

    [data-wiso-theme="dark"] .wiso_data-wrap::-webkit-scrollbar,
    [data-wiso-theme="dark"] .wiso_grid-body::-webkit-scrollbar,
    [data-wiso-theme="dark"] .wiso_layout-cell-content::-webkit-scrollbar {
        width: 10px;
        height: 10px;
    }

    [data-wiso-theme="dark"] .wiso_data-wrap::-webkit-scrollbar-track,
    [data-wiso-theme="dark"] .wiso_grid-body::-webkit-scrollbar-track,
    [data-wiso-theme="dark"] .wiso_layout-cell-content::-webkit-scrollbar-track {
        background: #0b1326;
    }

    [data-wiso-theme="dark"] .wiso_data-wrap::-webkit-scrollbar-thumb,
    [data-wiso-theme="dark"] .wiso_grid-body::-webkit-scrollbar-thumb,
    [data-wiso-theme="dark"] .wiso_layout-cell-content::-webkit-scrollbar-thumb {
        background-color: #2a3550;
        border-radius: 999px;
        border: 3px solid #0b1326;
    }

        [data-wiso-theme="dark"] .wiso_data-wrap::-webkit-scrollbar-thumb:hover,
        [data-wiso-theme="dark"] .wiso_grid-body::-webkit-scrollbar-thumb:hover,
        [data-wiso-theme="dark"] .wiso_layout-cell-content::-webkit-scrollbar-thumb:hover {
            background-color: #3b4a6b;
        }

    [data-wiso-theme="dark"] .wiso_data-wrap::-webkit-scrollbar-corner,
    [data-wiso-theme="dark"] .wiso_grid-body::-webkit-scrollbar-corner,
    [data-wiso-theme="dark"] .wiso_layout-cell-content::-webkit-scrollbar-corner {
        background: #0b1326;
    }

    [data-wiso-theme="dark"] .wiso_data-wrap::-webkit-scrollbar-button,
    [data-wiso-theme="dark"] .wiso_grid-body::-webkit-scrollbar-button,
    [data-wiso-theme="dark"] .wiso_layout-cell-content::-webkit-scrollbar-button {
        display: none;
    }


/* ---------- CONTRAST-DARK ---------- */
[data-wiso-theme="contrast-dark"] .wiso_data-wrap,
[data-wiso-theme="contrast-dark"] .wiso_grid-body,
[data-wiso-theme="contrast-dark"] .wiso_layout-cell-content {
    scrollbar-width: thin;
    scrollbar-color: #6f86b8 #0b1220;
}

    [data-wiso-theme="contrast-dark"] .wiso_data-wrap::-webkit-scrollbar,
    [data-wiso-theme="contrast-dark"] .wiso_grid-body::-webkit-scrollbar,
    [data-wiso-theme="contrast-dark"] .wiso_layout-cell-content::-webkit-scrollbar {
        width: 12px;
        height: 12px;
    }

    [data-wiso-theme="contrast-dark"] .wiso_data-wrap::-webkit-scrollbar-track,
    [data-wiso-theme="contrast-dark"] .wiso_grid-body::-webkit-scrollbar-track,
    [data-wiso-theme="contrast-dark"] .wiso_layout-cell-content::-webkit-scrollbar-track {
        background: #0b1220;
    }

    [data-wiso-theme="contrast-dark"] .wiso_data-wrap::-webkit-scrollbar-thumb,
    [data-wiso-theme="contrast-dark"] .wiso_grid-body::-webkit-scrollbar-thumb,
    [data-wiso-theme="contrast-dark"] .wiso_layout-cell-content::-webkit-scrollbar-thumb {
        background-color: #6f86b8;
        border-radius: 999px;
        border: 3px solid #0b1220;
    }

        [data-wiso-theme="contrast-dark"] .wiso_data-wrap::-webkit-scrollbar-thumb:hover,
        [data-wiso-theme="contrast-dark"] .wiso_grid-body::-webkit-scrollbar-thumb:hover,
        [data-wiso-theme="contrast-dark"] .wiso_layout-cell-content::-webkit-scrollbar-thumb:hover {
            background-color: #8fa3cf;
        }

    [data-wiso-theme="contrast-dark"] .wiso_data-wrap::-webkit-scrollbar-corner,
    [data-wiso-theme="contrast-dark"] .wiso_grid-body::-webkit-scrollbar-corner,
    [data-wiso-theme="contrast-dark"] .wiso_layout-cell-content::-webkit-scrollbar-corner {
        background: #0b1220;
    }

    [data-wiso-theme="contrast-dark"] .wiso_data-wrap::-webkit-scrollbar-button,
    [data-wiso-theme="contrast-dark"] .wiso_grid-body::-webkit-scrollbar-button,
    [data-wiso-theme="contrast-dark"] .wiso_layout-cell-content::-webkit-scrollbar-button {
        display: none;
    }



/* ============================================================
   W6 / WISO – Custom Scrollbars for DataView
   Ziel: .wiso_dataview.wiso_dataview--has-scroll
   - Chrome/Edge/Safari: ::-webkit-scrollbar*
   - Firefox: scrollbar-color / scrollbar-width
   - Theme: html[data-wiso-theme="light|dark|contrast-light|contrast-dark"]
   ============================================================ */

/* ------------------------------------------------------------
   1) Theme Tokens (Scrollbar)
   ------------------------------------------------------------ */

/* Default: DARK (falls kein theme gesetzt) */
:root {
    --w6-scroll-size: 12px; /* Breite/Höhe Scrollbar */
    --w6-scroll-radius: 10px; /* Abrundung Thumb */
    --w6-scroll-track: rgba(255,255,255,.04);
    --w6-scroll-thumb: rgba(255,255,255,.18);
    --w6-scroll-thumb-hover: rgba(255,255,255,.28);
    --w6-scroll-thumb-active: rgba(255,255,255,.34);
    --w6-scroll-corner: rgba(255,255,255,.04);
    --w6-scroll-border: rgba(0,0,0,.00); /* optional Thumb-Outline */
}

/* LIGHT */
html[data-wiso-theme="light"],
html[data-wiso-theme="contrast-light"] {
    --w6-scroll-track: rgba(15,23,42,.05);
    --w6-scroll-thumb: rgba(15,23,42,.22);
    --w6-scroll-thumb-hover: rgba(15,23,42,.32);
    --w6-scroll-thumb-active: rgba(15,23,42,.40);
    --w6-scroll-corner: rgba(15,23,42,.05);
    --w6-scroll-border: rgba(255,255,255,.00);
}

/* DARK */
html[data-wiso-theme="dark"] {
    --w6-scroll-track: rgba(255,255,255,.04);
    --w6-scroll-thumb: rgba(255,255,255,.18);
    --w6-scroll-thumb-hover: rgba(255,255,255,.28);
    --w6-scroll-thumb-active: rgba(255,255,255,.34);
    --w6-scroll-corner: rgba(255,255,255,.04);
    --w6-scroll-border: rgba(0,0,0,.00);
}

/* CONTRAST DARK */
html[data-wiso-theme="contrast-dark"] {
    --w6-scroll-track: rgba(255,255,255,.06);
    --w6-scroll-thumb: rgba(255,255,255,.30);
    --w6-scroll-thumb-hover: rgba(255,255,255,.40);
    --w6-scroll-thumb-active: rgba(255,255,255,.48);
    --w6-scroll-corner: rgba(255,255,255,.06);
    --w6-scroll-border: rgba(0,0,0,.00);
}


/* ------------------------------------------------------------
   2) Scope: nur DataView mit Scroll
   ------------------------------------------------------------ */

.wiso_dataview.wiso_dataview--has-scroll {
    /* verhindert Layout-Wackeln beim Scrollbar Ein-/Ausblenden (Chromium) */
    scrollbar-gutter: stable both-edges;
    /* Firefox */
    scrollbar-width: thin; /* "auto" | "thin" */
    scrollbar-color: var(--w6-scroll-thumb) var(--w6-scroll-track);
}

    /* Optional: wenn du "thin" zu dünn findest, nimm auto:
.wiso_dataview.wiso_dataview--has-scroll { scrollbar-width: auto; }
*/


    /* ------------------------------------------------------------
   3) WebKit Scrollbars (Chrome/Edge/Safari)
   ------------------------------------------------------------ */

    .wiso_dataview.wiso_dataview--has-scroll::-webkit-scrollbar {
        width: var(--w6-scroll-size);
        height: var(--w6-scroll-size);
    }

    .wiso_dataview.wiso_dataview--has-scroll::-webkit-scrollbar-track {
        background: var(--w6-scroll-track);
        border-radius: 999px;
    }

    .wiso_dataview.wiso_dataview--has-scroll::-webkit-scrollbar-thumb {
        background: var(--w6-scroll-thumb);
        border-radius: var(--w6-scroll-radius);
        /* sorgt für "in Track liegend" + weicher Look */
        border: 3px solid transparent;
        background-clip: padding-box;
        /* optional Outline (meist 0) */
        box-shadow: inset 0 0 0 1px var(--w6-scroll-border);
    }

    .wiso_dataview.wiso_dataview--has-scroll:hover::-webkit-scrollbar-thumb {
        background: var(--w6-scroll-thumb-hover);
        background-clip: padding-box;
    }

    .wiso_dataview.wiso_dataview--has-scroll::-webkit-scrollbar-thumb:active {
        background: var(--w6-scroll-thumb-active);
        background-clip: padding-box;
    }

    .wiso_dataview.wiso_dataview--has-scroll::-webkit-scrollbar-corner {
        background: var(--w6-scroll-corner);
    }


/* ------------------------------------------------------------
   4) Feinschliff: keine Scrollbar bei "Overlay"-Modus
   (falls ihr irgendwo overflow hidden/auto toggelt)
   ------------------------------------------------------------ */

/* Wenn du bestimmte Container NICHT stylen willst, kannst du hier ausnehmen:
.wiso_dataview.wiso_dataview--has-scroll.w6_no_scrollbar_style { ... }
*/


/* ============================================================
   W6 / WISO – Custom Scrollbars for Sidebar
   Scope:
   - nav.wiso_sidebar (falls Sidebar selbst scrollt)
   - .wiso_sidebar .wiso_navbar--vertical (falls UL scrollt)
   Theme Tokens: nutzt die gleichen --w6-scroll-* Variablen
   ============================================================ */

/* ------------------------------------------------------------
   1) Sidebar (nav) – wenn DAS Element scrollt
   ------------------------------------------------------------ */

nav.wiso_sidebar {
    /* verhindert Layout-Wackeln bei auftauchender Scrollbar */
    scrollbar-gutter: stable both-edges;
    /* Firefox */
    scrollbar-width: thin;
    scrollbar-color: var(--w6-scroll-thumb) var(--w6-scroll-track);
}

    /* WebKit (Chrome/Edge/Safari) */
    nav.wiso_sidebar::-webkit-scrollbar {
        width: var(--w6-scroll-size);
        height: var(--w6-scroll-size);
    }

    nav.wiso_sidebar::-webkit-scrollbar-track {
        background: var(--w6-scroll-track);
        border-radius: 999px;
    }

    nav.wiso_sidebar::-webkit-scrollbar-thumb {
        background: var(--w6-scroll-thumb);
        border-radius: var(--w6-scroll-radius);
        border: 3px solid transparent;
        background-clip: padding-box;
        box-shadow: inset 0 0 0 1px var(--w6-scroll-border);
    }

    nav.wiso_sidebar:hover::-webkit-scrollbar-thumb {
        background: var(--w6-scroll-thumb-hover);
        background-clip: padding-box;
    }

    nav.wiso_sidebar::-webkit-scrollbar-thumb:active {
        background: var(--w6-scroll-thumb-active);
        background-clip: padding-box;
    }

    nav.wiso_sidebar::-webkit-scrollbar-corner {
        background: var(--w6-scroll-corner);
    }


    /* ------------------------------------------------------------
   2) Sidebar Inhalt (UL) – falls NICHT nav scrollt,
      sondern die Liste .wiso_navbar--vertical
   ------------------------------------------------------------ */

    nav.wiso_sidebar .wiso_navbar.wiso_navbar--vertical {
        scrollbar-gutter: stable both-edges;
        /* Firefox */
        scrollbar-width: thin;
        scrollbar-color: var(--w6-scroll-thumb) var(--w6-scroll-track);
    }

        /* WebKit */
        nav.wiso_sidebar .wiso_navbar.wiso_navbar--vertical::-webkit-scrollbar {
            width: var(--w6-scroll-size);
            height: var(--w6-scroll-size);
        }

        nav.wiso_sidebar .wiso_navbar.wiso_navbar--vertical::-webkit-scrollbar-track {
            background: var(--w6-scroll-track);
            border-radius: 999px;
        }

        nav.wiso_sidebar .wiso_navbar.wiso_navbar--vertical::-webkit-scrollbar-thumb {
            background: var(--w6-scroll-thumb);
            border-radius: var(--w6-scroll-radius);
            border: 3px solid transparent;
            background-clip: padding-box;
            box-shadow: inset 0 0 0 1px var(--w6-scroll-border);
        }

        nav.wiso_sidebar .wiso_navbar.wiso_navbar--vertical:hover::-webkit-scrollbar-thumb {
            background: var(--w6-scroll-thumb-hover);
            background-clip: padding-box;
        }

        nav.wiso_sidebar .wiso_navbar.wiso_navbar--vertical::-webkit-scrollbar-thumb:active {
            background: var(--w6-scroll-thumb-active);
            background-clip: padding-box;
        }

        nav.wiso_sidebar .wiso_navbar.wiso_navbar--vertical::-webkit-scrollbar-corner {
            background: var(--w6-scroll-corner);
        }
/* ============================================================
   WISO DATAVIEW – Custom Scrollbar + Loading State
   ============================================================ */

/* Basis: Dataview soll den Scrollbereich sauber definieren */
.wiso_widget.wiso_dataview {
    position: relative;
    overflow: auto; /* wichtig: damit Scrollbar wirklich am Dataview hängt */
    scrollbar-gutter: stable; /* verhindert "springen" wenn Scrollbar erscheint */
    overscroll-behavior: contain;
}

    /* ------------------------------------------------------------
   Scrollbar (Chromium/Edge/Safari)
   ------------------------------------------------------------ */
    .wiso_widget.wiso_dataview::-webkit-scrollbar {
        width: 10px;
        height: 10px;
    }

    .wiso_widget.wiso_dataview::-webkit-scrollbar-track {
        background: rgba(255, 255, 255, 0.04);
        border-radius: 999px;
        margin: 6px; /* Abstand oben/unten, damit es "eingebettet" wirkt */
    }

    .wiso_widget.wiso_dataview::-webkit-scrollbar-thumb {
        background: rgba(255, 255, 255, 0.18);
        border-radius: 999px;
        border: 2px solid rgba(0, 0, 0, 0.0); /* "Padding" Effekt */
        background-clip: padding-box;
    }

        /* Hover: nur leichte Farbänderung – KEIN Springen */
        .wiso_widget.wiso_dataview::-webkit-scrollbar-thumb:hover {
            background: rgba(255, 255, 255, 0.26);
        }

        /* Active: minimal stärker */
        .wiso_widget.wiso_dataview::-webkit-scrollbar-thumb:active {
            background: rgba(255, 255, 255, 0.34);
        }

/* ------------------------------------------------------------
   Scrollbar (Firefox)
   ------------------------------------------------------------ */
.wiso_widget.wiso_dataview {
    scrollbar-width: thin;
    scrollbar-color: rgba(255,255,255,0.22) rgba(255,255,255,0.06);
}

    /* ============================================================
   Loading / Ladezustand
   ============================================================ */

    /*
  Option A (empfohlen):
  Du setzt während des Ladens eine Klasse:
  .wiso_dataview--loading

  Option B:
  du setzt ein data-Attribut:
  data-loading="true"
*/
    .wiso_widget.wiso_dataview.wiso_dataview--loading,
    .wiso_widget.wiso_dataview[data-loading="true"] {
        /* Scrollbar bleibt stabil, aber Interaktion wird gedimmt */
        pointer-events: none;
    }

        /* Overlay */
        .wiso_widget.wiso_dataview.wiso_dataview--loading::before,
        .wiso_widget.wiso_dataview[data-loading="true"]::before {
            content: "";
            position: absolute;
            inset: 0;
            background: rgba(0, 0, 0, 0.18);
            backdrop-filter: blur(2px);
            z-index: 5;
            border-radius: 10px; /* falls Dataview in Card liegt */
        }

        /* Spinner */
        .wiso_widget.wiso_dataview.wiso_dataview--loading::after,
        .wiso_widget.wiso_dataview[data-loading="true"]::after {
            content: "";
            position: absolute;
            top: 18px;
            right: 18px;
            width: 18px;
            height: 18px;
            border-radius: 50%;
            border: 2px solid rgba(255,255,255,0.22);
            border-top-color: rgba(255,255,255,0.65);
            animation: wisoDataviewSpin 0.9s linear infinite;
            z-index: 6;
        }

        /* Optional: Skeleton-Anmutung für Items beim Laden */
        .wiso_widget.wiso_dataview.wiso_dataview--loading .wiso_dataview-item,
        .wiso_widget.wiso_dataview[data-loading="true"] .wiso_dataview-item {
            opacity: 0.55;
            filter: saturate(0.8);
        }

/* Spinner Animation */
@keyframes wisoDataviewSpin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

/* ============================================================
   OPTIONAL: Wenn du den Scrollbar-Track "dunkler" willst
   (passt gut zu deinen wf-surface Farben)
   ============================================================ */
.material .wiso_widget.wiso_dataview::-webkit-scrollbar-track,
.base .wiso_widget.wiso_dataview::-webkit-scrollbar-track {
    background: rgba(11, 18, 32, 0.35); /* angelehnt an --wf-surface-0 */
}

.material .wiso_widget.wiso_dataview::-webkit-scrollbar-thumb,
.base .wiso_widget.wiso_dataview::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.16);
}

/* ============================================================
   W6 / WISO – Custom Scrollbars for Forms
   Targets:
   - .wiso-form-full (typischer Scroll-Container)
   - .wiso_layout-cell-content (falls Layout-Content scrollt)
   - Textareas / Combobox dropdowns (häufig eigene Scrollflächen)
   ============================================================ */


/* ------------------------------------------------------------
   1) Form-Root – wenn der Formbereich selbst scrollt
   ------------------------------------------------------------ */

.wiso-form-full {
    scrollbar-gutter: stable both-edges;
    /* Firefox */
    scrollbar-width: thin;
    scrollbar-color: var(--w6-scroll-thumb) var(--w6-scroll-track);
}

    /* WebKit */
    .wiso-form-full::-webkit-scrollbar {
        width: var(--w6-scroll-size);
        height: var(--w6-scroll-size);
    }

    .wiso-form-full::-webkit-scrollbar-track {
        background: var(--w6-scroll-track);
        border-radius: 999px;
    }

    .wiso-form-full::-webkit-scrollbar-thumb {
        background: var(--w6-scroll-thumb);
        border-radius: var(--w6-scroll-radius);
        border: 3px solid transparent;
        background-clip: padding-box;
        box-shadow: inset 0 0 0 1px var(--w6-scroll-border);
    }

    .wiso-form-full:hover::-webkit-scrollbar-thumb {
        background: var(--w6-scroll-thumb-hover);
        background-clip: padding-box;
    }

    .wiso-form-full::-webkit-scrollbar-thumb:active {
        background: var(--w6-scroll-thumb-active);
        background-clip: padding-box;
    }

    .wiso-form-full::-webkit-scrollbar-corner {
        background: var(--w6-scroll-corner);
    }


    /* ------------------------------------------------------------
   2) Layout-Cell Content – falls NICHT .wiso-form-full scrollt,
      sondern der innere Content-Wrapper
   ------------------------------------------------------------ */

    .wiso-form-full .wiso_layout-cell-content {
        scrollbar-gutter: stable both-edges;
        /* Firefox */
        scrollbar-width: thin;
        scrollbar-color: var(--w6-scroll-thumb) var(--w6-scroll-track);
    }

        /* WebKit */
        .wiso-form-full .wiso_layout-cell-content::-webkit-scrollbar {
            width: var(--w6-scroll-size);
            height: var(--w6-scroll-size);
        }

        .wiso-form-full .wiso_layout-cell-content::-webkit-scrollbar-track {
            background: var(--w6-scroll-track);
            border-radius: 999px;
        }

        .wiso-form-full .wiso_layout-cell-content::-webkit-scrollbar-thumb {
            background: var(--w6-scroll-thumb);
            border-radius: var(--w6-scroll-radius);
            border: 3px solid transparent;
            background-clip: padding-box;
            box-shadow: inset 0 0 0 1px var(--w6-scroll-border);
        }

        .wiso-form-full .wiso_layout-cell-content:hover::-webkit-scrollbar-thumb {
            background: var(--w6-scroll-thumb-hover);
            background-clip: padding-box;
        }

        .wiso-form-full .wiso_layout-cell-content::-webkit-scrollbar-thumb:active {
            background: var(--w6-scroll-thumb-active);
            background-clip: padding-box;
        }

        .wiso-form-full .wiso_layout-cell-content::-webkit-scrollbar-corner {
            background: var(--w6-scroll-corner);
        }


    /* ------------------------------------------------------------
   3) Textarea (falls du welche hast) – eigene Scrollbar
   ------------------------------------------------------------ */

    .wiso-form-full textarea.wiso_input,
    .wiso-form-full .wiso_textarea,
    .wiso-form-full .wiso_textarea textarea {
        scrollbar-gutter: stable both-edges;
        /* Firefox */
        scrollbar-width: thin;
        scrollbar-color: var(--w6-scroll-thumb) var(--w6-scroll-track);
    }

        /* WebKit */
        .wiso-form-full textarea.wiso_input::-webkit-scrollbar,
        .wiso-form-full .wiso_textarea::-webkit-scrollbar,
        .wiso-form-full .wiso_textarea textarea::-webkit-scrollbar {
            width: var(--w6-scroll-size);
            height: var(--w6-scroll-size);
        }

        .wiso-form-full textarea.wiso_input::-webkit-scrollbar-track,
        .wiso-form-full .wiso_textarea::-webkit-scrollbar-track,
        .wiso-form-full .wiso_textarea textarea::-webkit-scrollbar-track {
            background: var(--w6-scroll-track);
            border-radius: 999px;
        }

        .wiso-form-full textarea.wiso_input::-webkit-scrollbar-thumb,
        .wiso-form-full .wiso_textarea::-webkit-scrollbar-thumb,
        .wiso-form-full .wiso_textarea textarea::-webkit-scrollbar-thumb {
            background: var(--w6-scroll-thumb);
            border-radius: var(--w6-scroll-radius);
            border: 3px solid transparent;
            background-clip: padding-box;
            box-shadow: inset 0 0 0 1px var(--w6-scroll-border);
        }

        .wiso-form-full textarea.wiso_input:hover::-webkit-scrollbar-thumb,
        .wiso-form-full .wiso_textarea:hover::-webkit-scrollbar-thumb,
        .wiso-form-full .wiso_textarea textarea:hover::-webkit-scrollbar-thumb {
            background: var(--w6-scroll-thumb-hover);
            background-clip: padding-box;
        }

        .wiso-form-full textarea.wiso_input::-webkit-scrollbar-thumb:active,
        .wiso-form-full .wiso_textarea::-webkit-scrollbar-thumb:active,
        .wiso-form-full .wiso_textarea textarea::-webkit-scrollbar-thumb:active {
            background: var(--w6-scroll-thumb-active);
            background-clip: padding-box;
        }

        .wiso-form-full textarea.wiso_input::-webkit-scrollbar-corner,
        .wiso-form-full .wiso_textarea::-webkit-scrollbar-corner,
        .wiso-form-full .wiso_textarea textarea::-webkit-scrollbar-corner {
            background: var(--w6-scroll-corner);
        }


    /* ------------------------------------------------------------
   4) Combobox Dropdown / Options – falls das Dropdown scrollt
   (Klassen können je nach DHTMLX/WISO-Version variieren,
    daher mehrere gängige Targets)
   ------------------------------------------------------------ */

    .wiso-form-full .wiso_combobox .wiso_list,
    .wiso-form-full .wiso_combobox .wiso_list-content,
    .wiso-form-full .wiso_combobox .wiso_combobox-input-list-wrapper,
    .wiso-form-full .wiso_combobox .wiso_popup,
    .wiso-form-full .wiso_popup .wiso_list {
        scrollbar-gutter: stable both-edges;
        /* Firefox */
        scrollbar-width: thin;
        scrollbar-color: var(--w6-scroll-thumb) var(--w6-scroll-track);
    }

        /* WebKit */
        .wiso-form-full .wiso_combobox .wiso_list::-webkit-scrollbar,
        .wiso-form-full .wiso_combobox .wiso_list-content::-webkit-scrollbar,
        .wiso-form-full .wiso_combobox .wiso_combobox-input-list-wrapper::-webkit-scrollbar,
        .wiso-form-full .wiso_combobox .wiso_popup::-webkit-scrollbar,
        .wiso-form-full .wiso_popup .wiso_list::-webkit-scrollbar {
            width: var(--w6-scroll-size);
            height: var(--w6-scroll-size);
        }

        .wiso-form-full .wiso_combobox .wiso_list::-webkit-scrollbar-track,
        .wiso-form-full .wiso_combobox .wiso_list-content::-webkit-scrollbar-track,
        .wiso-form-full .wiso_combobox .wiso_combobox-input-list-wrapper::-webkit-scrollbar-track,
        .wiso-form-full .wiso_combobox .wiso_popup::-webkit-scrollbar-track,
        .wiso-form-full .wiso_popup .wiso_list::-webkit-scrollbar-track {
            background: var(--w6-scroll-track);
            border-radius: 999px;
        }

        .wiso-form-full .wiso_combobox .wiso_list::-webkit-scrollbar-thumb,
        .wiso-form-full .wiso_combobox .wiso_list-content::-webkit-scrollbar-thumb,
        .wiso-form-full .wiso_combobox .wiso_combobox-input-list-wrapper::-webkit-scrollbar-thumb,
        .wiso-form-full .wiso_combobox .wiso_popup::-webkit-scrollbar-thumb,
        .wiso-form-full .wiso_popup .wiso_list::-webkit-scrollbar-thumb {
            background: var(--w6-scroll-thumb);
            border-radius: var(--w6-scroll-radius);
            border: 3px solid transparent;
            background-clip: padding-box;
            box-shadow: inset 0 0 0 1px var(--w6-scroll-border);
        }

        .wiso-form-full .wiso_combobox .wiso_list:hover::-webkit-scrollbar-thumb,
        .wiso-form-full .wiso_combobox .wiso_list-content:hover::-webkit-scrollbar-thumb,
        .wiso-form-full .wiso_combobox .wiso_combobox-input-list-wrapper:hover::-webkit-scrollbar-thumb,
        .wiso-form-full .wiso_combobox .wiso_popup:hover::-webkit-scrollbar-thumb,
        .wiso-form-full .wiso_popup .wiso_list:hover::-webkit-scrollbar-thumb {
            background: var(--w6-scroll-thumb-hover);
            background-clip: padding-box;
        }

        .wiso-form-full .wiso_combobox .wiso_list::-webkit-scrollbar-thumb:active,
        .wiso-form-full .wiso_combobox .wiso_list-content::-webkit-scrollbar-thumb:active,
        .wiso-form-full .wiso_combobox .wiso_combobox-input-list-wrapper::-webkit-scrollbar-thumb:active,
        .wiso-form-full .wiso_combobox .wiso_popup::-webkit-scrollbar-thumb:active,
        .wiso-form-full .wiso_popup .wiso_list::-webkit-scrollbar-thumb:active {
            background: var(--w6-scroll-thumb-active);
            background-clip: padding-box;
        }

        .wiso-form-full .wiso_combobox .wiso_list::-webkit-scrollbar-corner,
        .wiso-form-full .wiso_combobox .wiso_list-content::-webkit-scrollbar-corner,
        .wiso-form-full .wiso_combobox .wiso_combobox-input-list-wrapper::-webkit-scrollbar-corner,
        .wiso-form-full .wiso_combobox .wiso_popup::-webkit-scrollbar-corner,
        .wiso-form-full .wiso_popup .wiso_list::-webkit-scrollbar-corner {
            background: var(--w6-scroll-corner);
        }
/* ============================================================
   W6 / WISO – Edel Scrollbars (Light / Dark / Contrast)
   - Firefox: scrollbar-color / scrollbar-width
   - Chromium/Edge: ::-webkit-scrollbar*
   ============================================================ */

/* ---------- 1) Tokens (Default = Light) ---------- */
:root {
    --w6-sb-size: 12px; /* Breite/Höhe Scrollbar */
    --w6-sb-radius: 999px;
    --w6-sb-track: rgba(15,23,42,0.06);
    --w6-sb-thumb: rgba(15,23,42,0.22);
    --w6-sb-thumb-hover: rgba(15,23,42,0.32);
    --w6-sb-thumb-active: rgba(15,23,42,0.42);
    /* optional: feine Umrandung, wirkt "edel" */
    --w6-sb-border: rgba(255,255,255,0.55);
}

/* Dark */
html[data-wiso-theme="dark"] {
    --w6-sb-track: rgba(235,242,255,0.06);
    --w6-sb-thumb: rgba(235,242,255,0.22);
    --w6-sb-thumb-hover: rgba(235,242,255,0.30);
    --w6-sb-thumb-active: rgba(235,242,255,0.40);
    --w6-sb-border: rgba(11,18,32,0.55);
}

/* Contrast Dark */
html[data-wiso-theme="contrast-dark"] {
    --w6-sb-track: rgba(235,242,255,0.08);
    --w6-sb-thumb: rgba(235,242,255,0.28);
    --w6-sb-thumb-hover: rgba(235,242,255,0.36);
    --w6-sb-thumb-active: rgba(235,242,255,0.48);
    --w6-sb-border: rgba(7,12,22,0.60);
}

/* Contrast Light (falls vorhanden) */
html[data-wiso-theme="contrast-light"] {
    --w6-sb-track: rgba(15,23,42,0.07);
    --w6-sb-thumb: rgba(15,23,42,0.26);
    --w6-sb-thumb-hover: rgba(15,23,42,0.36);
    --w6-sb-thumb-active: rgba(15,23,42,0.46);
    --w6-sb-border: rgba(255,255,255,0.70);
}

/* ---------- 2) Firefox (global + typische WISO Container) ---------- */
html, body,
.wiso_widget, .wiso_layout, .wiso_layout-cell-content,
.wiso_grid-content, .wiso_grid-body, .wiso_data-wrap,
.wiso_popup, .wiso_popup-content,
.WIS_richtext__overflow-wrapper, .WIS_richtext__editor-holder,
.w6wf-addgrid__grid {
    scrollbar-width: thin;
    scrollbar-color: var(--w6-sb-thumb) var(--w6-sb-track);
}

    /* ---------- 3) Chromium/Edge/WebKit (global) ---------- */
    html::-webkit-scrollbar,
    body::-webkit-scrollbar,
    .wiso_widget::-webkit-scrollbar,
    .wiso_layout::-webkit-scrollbar,
    .wiso_layout-cell-content::-webkit-scrollbar,
    .wiso_grid-content::-webkit-scrollbar,
    .wiso_grid-body::-webkit-scrollbar,
    .wiso_data-wrap::-webkit-scrollbar,
    .wiso_popup::-webkit-scrollbar,
    .wiso_popup-content::-webkit-scrollbar,
    .WIS_richtext__overflow-wrapper::-webkit-scrollbar,
    .WIS_richtext__editor-holder::-webkit-scrollbar,
    .w6wf-addgrid__grid::-webkit-scrollbar {
        width: var(--w6-sb-size);
        height: var(--w6-sb-size);
    }

    html::-webkit-scrollbar-track,
    body::-webkit-scrollbar-track,
    .wiso_widget::-webkit-scrollbar-track,
    .wiso_layout::-webkit-scrollbar-track,
    .wiso_layout-cell-content::-webkit-scrollbar-track,
    .wiso_grid-content::-webkit-scrollbar-track,
    .wiso_grid-body::-webkit-scrollbar-track,
    .wiso_data-wrap::-webkit-scrollbar-track,
    .wiso_popup::-webkit-scrollbar-track,
    .wiso_popup-content::-webkit-scrollbar-track,
    .WIS_richtext__overflow-wrapper::-webkit-scrollbar-track,
    .WIS_richtext__editor-holder::-webkit-scrollbar-track,
    .w6wf-addgrid__grid::-webkit-scrollbar-track {
        background: var(--w6-sb-track);
    }

    html::-webkit-scrollbar-thumb,
    body::-webkit-scrollbar-thumb,
    .wiso_widget::-webkit-scrollbar-thumb,
    .wiso_layout::-webkit-scrollbar-thumb,
    .wiso_layout-cell-content::-webkit-scrollbar-thumb,
    .wiso_grid-content::-webkit-scrollbar-thumb,
    .wiso_grid-body::-webkit-scrollbar-thumb,
    .wiso_data-wrap::-webkit-scrollbar-thumb,
    .wiso_popup::-webkit-scrollbar-thumb,
    .wiso_popup-content::-webkit-scrollbar-thumb,
    .WIS_richtext__overflow-wrapper::-webkit-scrollbar-thumb,
    .WIS_richtext__editor-holder::-webkit-scrollbar-thumb,
    .w6wf-addgrid__grid::-webkit-scrollbar-thumb {
        background-color: var(--w6-sb-thumb);
        border-radius: var(--w6-sb-radius);
        /* "Edel"-Rand: Thumb wirkt wie eingelassen */
        border: 3px solid var(--w6-sb-border);
        background-clip: padding-box;
    }

        html::-webkit-scrollbar-thumb:hover,
        body::-webkit-scrollbar-thumb:hover,
        .wiso_widget::-webkit-scrollbar-thumb:hover,
        .wiso_layout::-webkit-scrollbar-thumb:hover,
        .wiso_layout-cell-content::-webkit-scrollbar-thumb:hover,
        .wiso_grid-content::-webkit-scrollbar-thumb:hover,
        .wiso_grid-body::-webkit-scrollbar-thumb:hover,
        .wiso_data-wrap::-webkit-scrollbar-thumb:hover,
        .wiso_popup::-webkit-scrollbar-thumb:hover,
        .wiso_popup-content::-webkit-scrollbar-thumb:hover,
        .WIS_richtext__overflow-wrapper::-webkit-scrollbar-thumb:hover,
        .WIS_richtext__editor-holder::-webkit-scrollbar-thumb:hover,
        .w6wf-addgrid__grid::-webkit-scrollbar-thumb:hover {
            background-color: var(--w6-sb-thumb-hover);
        }

        html::-webkit-scrollbar-thumb:active,
        body::-webkit-scrollbar-thumb:active,
        .wiso_widget::-webkit-scrollbar-thumb:active,
        .wiso_layout::-webkit-scrollbar-thumb:active,
        .wiso_layout-cell-content::-webkit-scrollbar-thumb:active,
        .wiso_grid-content::-webkit-scrollbar-thumb:active,
        .wiso_grid-body::-webkit-scrollbar-thumb:active,
        .wiso_data-wrap::-webkit-scrollbar-thumb:active,
        .wiso_popup::-webkit-scrollbar-thumb:active,
        .wiso_popup-content::-webkit-scrollbar-thumb:active,
        .WIS_richtext__overflow-wrapper::-webkit-scrollbar-thumb:active,
        .WIS_richtext__editor-holder::-webkit-scrollbar-thumb:active,
        .w6wf-addgrid__grid::-webkit-scrollbar-thumb:active {
            background-color: var(--w6-sb-thumb-active);
        }

    /* optional: Ecke wenn horizontal+vertikal */
    html::-webkit-scrollbar-corner,
    body::-webkit-scrollbar-corner,
    .wiso_widget::-webkit-scrollbar-corner,
    .wiso_layout::-webkit-scrollbar-corner,
    .wiso_layout-cell-content::-webkit-scrollbar-corner,
    .wiso_grid-content::-webkit-scrollbar-corner,
    .wiso_grid-body::-webkit-scrollbar-corner,
    .wiso_data-wrap::-webkit-scrollbar-corner,
    .wiso_popup::-webkit-scrollbar-corner,
    .wiso_popup-content::-webkit-scrollbar-corner,
    .WIS_richtext__overflow-wrapper::-webkit-scrollbar-corner,
    .WIS_richtext__editor-holder::-webkit-scrollbar-corner,
    .w6wf-addgrid__grid::-webkit-scrollbar-corner {
        background: var(--w6-sb-track);
    }