html, body {
    height: 100%;
}

app {
    display: block;
    height: 100%;
}

/* Hide default XAF action toolbar */
.main-toolbar {
    display: none !important;
}

.header-logo {
    flex-shrink: 0;
    background-color: transparent;
    background-image: url('../images/logo_green_small.png');
    background-position: left center;
    background-repeat: no-repeat;
    background-size: contain;
    -webkit-mask: none;
    mask: none;
    /*background-color: currentColor;
    -webkit-mask: url('../images/logo_green_small.png');
    mask: url('../images/logo_green_small.png');
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-repeat: no-repeat;
    */ mask-repeat: no-repeat;
    width: 86px;
    height: 28px;
}

#blazor-error-ui {
    background: inherit;
    bottom: 0;
    display: none;
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 100001;
}


/* EmployeeEvaluationMedianGrid.razor.css */

.eval-card {
    padding: 24px;
    border-radius: 18px;
    border: 1px solid #e5e7eb;
    background: #fff;
}

.eval-header {
    display: flex;
    justify-content: space-between;
    gap: 24px;
    margin-bottom: 22px;
}

    .eval-header h2 {
        margin: 0 0 8px;
        font-size: 26px;
    }

    .eval-header p {
        margin: 0;
        color: #667085;
    }

.eval-level-box {
    min-width: 320px;
    padding: 18px;
    border-radius: 16px;
    border: 1px solid #e5e7eb;
}

    .eval-level-box strong {
        display: block;
        margin: 6px 0;
        color: #6941c6;
        font-size: 22px;
    }

    .eval-level-box span {
        color: #667085;
    }

.eval-grid {
    width: 100%;
    border-collapse: collapse;
    overflow: hidden;
    border-radius: 16px;
}

    .eval-grid th,
    .eval-grid td {
        padding: 18px;
        border: 1px solid #eaecf0;
        vertical-align: middle;
    }

    .eval-grid th {
        background: #f9fafb;
        text-align: left;
    }

.metric-name {
    font-weight: 700;
}

.metric-desc,
.metric-value span {
    color: #667085;
    font-size: 14px;
}

.metric-value strong {
    display: block;
    font-size: 26px;
    color: #2563eb;
}

.range-label {
    display: flex;
    justify-content: space-between;
    margin-bottom: 8px;
    font-size: 13px;
    color: #667085;
}

.range {
    position: relative;
    height: 8px;
    display: flex;
    border-radius: 999px;
    background: #e5e7eb;
}

.range-low {
    width: 33%;
    background: #fecaca;
    border-radius: 999px 0 0 999px;
}

.range-mid {
    width: 34%;
    background: #e5e7eb;
}

.range-high {
    width: 33%;
    background: #bbf7d0;
    border-radius: 0 999px 999px 0;
}

.median-marker {
    position: absolute;
    top: -10px;
    width: 2px;
    height: 28px;
    background: #111827;
}

.employee-marker {
    position: absolute;
    top: -6px;
    width: 20px;
    height: 20px;
    margin-left: -10px;
    border-radius: 50%;
    background: #2563eb;
    border: 2px solid #1d4ed8;
}

.status {
    font-weight: 700;
}

    .status.good {
        color: #16a34a;
    }

    .status.bad {
        color: #dc2626;
    }

.eval-footer {
    margin-top: 18px;
    padding: 18px;
    border-radius: 16px;
    background: #f4f0ff;
    color: #42307d;
}

    .eval-footer strong {
        display: block;
        margin-bottom: 4px;
    }

/* ============================================================
   WISESCI / XAF BLAZOR
   FINALNA NAWIGACJA SIDEBAR
   ============================================================ */

.xaf-sidebar {
    --nav-bg: #ffffff;
    --nav-text: #111111;
    --nav-muted: #9ca3af;
    --nav-hover: #f5f5f5;
    --nav-selected: #e5e5e5;
    --nav-border: #d7d7d7;
    --nav-font-size: 14px;
    --nav-font-weight: 500;
    background: var(--nav-bg) !important;
    color: var(--nav-text) !important;
    border-right: 1px solid #eeeeee;
    scrollbar-width: thin;
    scrollbar-color: #c9c9c9 transparent;
}

    /* ============================================================
   SEARCH / FILTER
   ============================================================ */

    .xaf-sidebar .dxbl-search-box {
        margin: 13px 19px 28px !important;
    }

        .xaf-sidebar .dxbl-search-box .dxbl-edit,
        .xaf-sidebar .dxbl-search-box .dxbl-text-edit {
            min-height: 40px !important;
            height: 40px !important;
            padding: 0 !important;
            background: #ffffff !important;
            border: 1px solid var(--nav-border) !important;
            border-radius: 4px !important;
            box-shadow: none !important;
        }

        .xaf-sidebar .dxbl-search-box input {
            min-height: 38px !important;
            height: 38px !important;
            padding-left: 9px !important;
            color: #555555 !important;
            font-size: 13px !important;
            font-weight: 400 !important;
            line-height: 1.2 !important;
            background: transparent !important;
        }

            .xaf-sidebar .dxbl-search-box input::placeholder {
                color: #9a9a9a !important;
                opacity: 1 !important;
            }

        .xaf-sidebar .dxbl-search-box svg {
            width: 18px !important;
            height: 18px !important;
            color: #111111 !important;
        }

        .xaf-sidebar .dxbl-search-box:focus-within .dxbl-edit,
        .xaf-sidebar .dxbl-search-box:focus-within .dxbl-text-edit {
            border-color: #b9b9b9 !important;
            box-shadow: none !important;
        }

    /* ============================================================
   ACCORDION
   ============================================================ */

    .xaf-sidebar .dxbl-accordion {
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        background: transparent !important;
        border: 0 !important;
        border-radius: 0 !important;
    }

    .xaf-sidebar .dxbl-accordion-group {
        --dxbl-accordion-group-border-width: 0;
        --dxbl-accordion-group-header-selected-bg: transparent;
        --dxbl-accordion-group-item-selection-bg: var(--nav-selected);
        margin: 0 !important;
        padding: 0 !important;
        background: transparent !important;
        border: 0 !important;
        border-radius: 0 !important;
    }

    .xaf-sidebar .dxbl-accordion-group-content,
    .xaf-sidebar .dxbl-accordion-group-body,
    .xaf-sidebar .dxbl-accordion-group-items {
        margin: 0 !important;
        padding: 0 !important;
    }

    /* ============================================================
   NAGLOWKI GRUP
   np. Wyniki jednostek
   ============================================================ */

    .xaf-sidebar .dxbl-accordion-group-header {
        min-height: 48px !important;
        height: auto !important;
        margin: 0 !important;
        padding: 11px 20px !important;
        color: var(--nav-text) !important;
        background: #ffffff !important;
        border: 0 !important;
        border-radius: 0 !important;
        font-size: var(--nav-font-size) !important;
        font-weight: 600 !important;
        line-height: 1.25 !important;
        text-decoration: none !important;
    }

        .xaf-sidebar .dxbl-accordion-group-header .dxbl-text,
        .xaf-sidebar .dxbl-accordion-group-header span,
        .xaf-sidebar .dxbl-accordion-group-header a {
            color: var(--nav-text) !important;
            font-size: var(--nav-font-size) !important;
            font-weight: 600 !important;
            line-height: 1.25 !important;
            white-space: normal !important;
            text-decoration: none !important;
        }

        .xaf-sidebar .dxbl-accordion-group-header:hover {
            background: var(--nav-hover) !important;
        }

        .xaf-sidebar .dxbl-accordion-group-header[aria-expanded="true"],
        .xaf-sidebar .dxbl-accordion-group-header:has(.dxbl-accordion-expand-btn[aria-expanded="true"]) {
            background: #ffffff !important;
        }

    /* ============================================================
   STRZALKI
   ============================================================ */

    .xaf-sidebar .dxbl-accordion-expand-btn {
        width: 16px !important;
        height: 16px !important;
        min-width: 16px !important;
        margin-right: 8px !important;
        padding: 0 !important;
        color: #111111 !important;
    }

        .xaf-sidebar .dxbl-accordion-expand-btn svg {
            width: 12px !important;
            height: 12px !important;
            color: #111111 !important;
        }

    /* ============================================================
   IKONY GRUP
   ============================================================ */

    .xaf-sidebar .dxbl-accordion-group-header .xaf-image,
    .xaf-sidebar .dxbl-accordion-group-header img {
        width: 16px !important;
        height: 16px !important;
        min-width: 16px !important;
        object-fit: contain;
    }

    .xaf-sidebar .dxbl-accordion-group-header .dxbl-accordion-item-text-container,
    .xaf-sidebar .dxbl-accordion-group-header .dxbl-accordion-group-header-content {
        gap: 7px !important;
    }

    /* ============================================================
   STANDARDOWE ELEMENTY MENU
   ============================================================ */

    .xaf-sidebar .dxbl-accordion-item {
        margin: 0 !important;
        padding: 0 !important;
    }

    .xaf-sidebar .dxbl-accordion-item-content {
        min-height: 52px !important;
        height: auto !important;
        margin: 0 !important;
        padding: 12px 20px !important;
        color: var(--nav-text) !important;
        background: #ffffff !important;
        border: 0 !important;
        border-radius: 0 !important;
        text-decoration: none !important;
        transition: background-color 120ms ease;
    }

        .xaf-sidebar .dxbl-accordion-item-content .dxbl-accordion-item-text-container {
            display: flex !important;
            align-items: flex-start !important;
            width: 100% !important;
            gap: 11px !important;
        }

        .xaf-sidebar .dxbl-accordion-item-content .dxbl-text,
        .xaf-sidebar .dxbl-accordion-item-content a {
            display: block !important;
            color: var(--nav-text) !important;
            font-size: var(--nav-font-size) !important;
            font-weight: var(--nav-font-weight) !important;
            line-height: 1.32 !important;
            white-space: normal !important;
            overflow: visible !important;
            text-overflow: clip !important;
            word-break: normal !important;
            overflow-wrap: break-word !important;
            text-decoration: none !important;
            text-decoration-line: none !important;
            border-bottom: 0 !important;
        }

        /* ============================================================
   IKONY ELEMENTOW
   ============================================================ */

        .xaf-sidebar .dxbl-accordion-item-content .xaf-image,
        .xaf-sidebar .dxbl-accordion-item-content img {
            width: 17px !important;
            height: 17px !important;
            min-width: 17px !important;
            max-width: 17px !important;
            margin-top: 1px !important;
            object-fit: contain;
        }

        .xaf-sidebar .dxbl-accordion-item-content svg {
            width: 17px !important;
            height: 17px !important;
            min-width: 17px !important;
            margin-top: 1px !important;
        }

        /* ============================================================
   HOVER
   ============================================================ */

        .xaf-sidebar .dxbl-accordion-item-content:hover {
            color: var(--nav-text) !important;
            background: var(--nav-hover) !important;
            text-decoration: none !important;
        }

            .xaf-sidebar .dxbl-accordion-item-content:hover .dxbl-text,
            .xaf-sidebar .dxbl-accordion-item-content:hover a {
                color: var(--nav-text) !important;
                text-decoration: none !important;
            }

        /* ============================================================
   AKTYWNA POZYCJA
   ============================================================ */

        .xaf-sidebar .dxbl-accordion-item-content.active,
        .xaf-sidebar .dxbl-accordion-item-content.dxbl-active,
        .xaf-sidebar .dxbl-accordion-item-content.dxbl-selected,
        .xaf-sidebar .dxbl-accordion-item-content[aria-current="page"],
        .xaf-sidebar .dxbl-accordion-item-content[aria-selected="true"] {
            color: var(--nav-text) !important;
            background: var(--nav-selected) !important;
            border: 0 !important;
            border-radius: 0 !important;
            text-decoration: none !important;
        }

            .xaf-sidebar .dxbl-accordion-item-content.active .dxbl-text,
            .xaf-sidebar .dxbl-accordion-item-content.dxbl-active .dxbl-text,
            .xaf-sidebar .dxbl-accordion-item-content.dxbl-selected .dxbl-text,
            .xaf-sidebar .dxbl-accordion-item-content[aria-current="page"] .dxbl-text,
            .xaf-sidebar .dxbl-accordion-item-content[aria-selected="true"] .dxbl-text,
            .xaf-sidebar .dxbl-accordion-item-content.active a,
            .xaf-sidebar .dxbl-accordion-item-content.dxbl-active a,
            .xaf-sidebar .dxbl-accordion-item-content.dxbl-selected a,
            .xaf-sidebar .dxbl-accordion-item-content[aria-current="page"] a,
            .xaf-sidebar .dxbl-accordion-item-content[aria-selected="true"] a {
                color: var(--nav-text) !important;
                font-weight: 500 !important;
                text-decoration: none !important;
            }

            .xaf-sidebar .dxbl-accordion-item-content.active:hover,
            .xaf-sidebar .dxbl-accordion-item-content.dxbl-active:hover,
            .xaf-sidebar .dxbl-accordion-item-content.dxbl-selected:hover,
            .xaf-sidebar .dxbl-accordion-item-content[aria-current="page"]:hover,
            .xaf-sidebar .dxbl-accordion-item-content[aria-selected="true"]:hover {
                background: var(--nav-selected) !important;
            }

        /* ============================================================
   PODGRUPY / FOLDERY WEWNETRZNE
   ============================================================ */

        .xaf-sidebar .dxbl-accordion-item-content:has(.dxbl-accordion-expand-btn) {
            min-height: 48px !important;
            height: auto !important;
            padding-top: 11px !important;
            padding-bottom: 11px !important;
            background: #ffffff !important;
        }

            .xaf-sidebar .dxbl-accordion-item-content:has(.dxbl-accordion-expand-btn) .dxbl-text {
                font-size: var(--nav-font-size) !important;
                font-weight: 600 !important;
                line-height: 1.3 !important;
            }

        .xaf-sidebar .dxbl-accordion-item-content:has(.dxbl-accordion-expand-btn[aria-expanded="true"]) {
            background: #ffffff !important;
        }

    /* ============================================================
   ELEMENTY DRUGIEGO POZIOMU
   ============================================================ */

    .xaf-sidebar .dxbl-accordion-item .dxbl-accordion-item .dxbl-accordion-item-content {
        min-height: 48px !important;
        height: auto !important;
        padding-top: 11px !important;
        padding-right: 20px !important;
        padding-bottom: 11px !important;
        padding-left: 50px !important;
        background: #ffffff !important;
    }

        .xaf-sidebar .dxbl-accordion-item .dxbl-accordion-item .dxbl-accordion-item-content .dxbl-text,
        .xaf-sidebar .dxbl-accordion-item .dxbl-accordion-item .dxbl-accordion-item-content a {
            font-size: 14px !important;
            font-weight: 400 !important;
            line-height: 1.3 !important;
            color: var(--nav-text) !important;
            white-space: normal !important;
            overflow: visible !important;
            text-decoration: none !important;
            text-decoration-line: none !important;
            border-bottom: 0 !important;
        }

    /* ============================================================
   TRZECI POZIOM
   ============================================================ */

    .xaf-sidebar .dxbl-accordion-item .dxbl-accordion-item .dxbl-accordion-item .dxbl-accordion-item-content {
        padding-left: 64px !important;
    }

    /* ============================================================
   BEZWZGLEDNE USUNIECIE PODKRESLEN
   ============================================================ */

    .xaf-sidebar a,
    .xaf-sidebar a:link,
    .xaf-sidebar a:visited,
    .xaf-sidebar a:hover,
    .xaf-sidebar a:focus,
    .xaf-sidebar a:active,
    .xaf-sidebar a *,
    .xaf-sidebar .dxbl-text,
    .xaf-sidebar .dxbl-text *,
    .xaf-sidebar .dxbl-accordion-item-content,
    .xaf-sidebar .dxbl-accordion-item-content *,
    .xaf-sidebar .dxbl-accordion-group-header,
    .xaf-sidebar .dxbl-accordion-group-header * {
        text-decoration: none !important;
        text-decoration-line: none !important;
    }

        /* ============================================================
   USUNIECIE PSEUDO-ELEMENTOW / LINII
   ============================================================ */

        .xaf-sidebar .dxbl-accordion-item-content::before,
        .xaf-sidebar .dxbl-accordion-item-content::after,
        .xaf-sidebar .dxbl-accordion-item-content .dxbl-text::before,
        .xaf-sidebar .dxbl-accordion-item-content .dxbl-text::after,
        .xaf-sidebar .dxbl-accordion-group-header::before,
        .xaf-sidebar .dxbl-accordion-group-header::after,
        .xaf-sidebar .dxbl-accordion-group-header .dxbl-text::before,
        .xaf-sidebar .dxbl-accordion-group-header .dxbl-text::after {
            content: none !important;
            display: none !important;
            width: 0 !important;
            height: 0 !important;
            border: 0 !important;
        }

    /* ============================================================
   ABOUT
   ============================================================ */

    .xaf-sidebar .about-info {
        padding: 12px 20px 16px !important;
        color: var(--nav-muted) !important;
        font-size: 11px !important;
        font-weight: 400 !important;
        line-height: 1.4 !important;
    }

        .xaf-sidebar .about-info a {
            color: var(--nav-muted) !important;
            text-decoration: none !important;
        }

    /* ============================================================
   SCROLLBAR
   ============================================================ */

    .xaf-sidebar::-webkit-scrollbar {
        width: 6px;
    }

    .xaf-sidebar::-webkit-scrollbar-track {
        background: transparent;
    }

    .xaf-sidebar::-webkit-scrollbar-thumb {
        background-color: #c9c9c9;
        border: 2px solid transparent;
        border-radius: 10px;
        background-clip: padding-box;
    }

        .xaf-sidebar::-webkit-scrollbar-thumb:hover {
            background-color: #a9a9a9;
        }

/* ============================================================
   MOBILE
   ============================================================ */

@media (max-width: 575.98px) {
    .xaf-sidebar .dxbl-search-box {
        margin: 12px 14px 22px !important;
    }

    .xaf-sidebar .dxbl-accordion-group-header {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }

    .xaf-sidebar .dxbl-accordion-item-content {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }

    .xaf-sidebar .dxbl-accordion-item .dxbl-accordion-item .dxbl-accordion-item-content {
        padding-left: 46px !important;
    }
}
