/* --- LAYOUT & GEOMETRY --- */
html, body {
    margin: 0;
    padding: 0;
    height: 100%;
    overflow: hidden;
    font-family: 'Segoe UI', Arial, sans-serif;
    font-size: 12px;
    font-style: normal;

    --bg-color: #313131;
    --fg-color: #ffffff;

    .source-documents-list, .publication-usages-list {
        list-style: none;
        margin: 0;
        padding: 0;
    }

    .source-documents-list li span{
        padding-left: 8px;
    }

    .publication-usages-list li span {
        background-image: url("../images/publish_w.png");
        background-repeat: no-repeat;
        background-size: 22px;
        background-position-y: center;
        padding-left: 24px;
        display: block;
    }

    --3d-scene-bg: rgb(176,176,176);
    --3d-body: rgb(160, 160, 160);
    --3d-body-db: rgb(120, 120, 120);
    --3d-edges: #00;
    --3d-grid: #000;
    --3d-edges-db: #000;
    --3d-assembly: #ae86c1;
    --3d-ann: #000;
    --3d-select: #caa153;
    --3d-select-edges: #dd8100;
    --3d-context: #6f97d8;
    --3d-context-wire: #1768a5;
    --3d-link: #4d9d6c;
    --3d-red: #f66;
    --3d-yellow: #fc0;
    --3d-green: #5d5;

    --3d-select-BIM: #ffb70095;
    --3d-hover: #93c4ff55;
    --3d-hover-outline: #ffffff;
    --3d-hover-edges: #6cbe00;
    --3d-sketch: #00ccff;
    --3d-sketch-selected: #e4a225;

    --3d-light-ambient: #ededed;
    --3d-light-dir: #9c9c9c;
    --3d-light-bottom: #acacac;

    --fg-select: #000;
    --bg-select: #e4a225;
    --bg-grid-select: #f6c365;
    --bg-select-btn: rgba(0,0,0,0.25);
    --bg-assembly: #bf79f7;
    --fg-context: #000;
    --bg-context: #7abeff;
    --fg-ann: #fff347;
    --bg-ann: #00000088;
    --gizmo-context: #000000;
    --fg-link: #000;
    --bg-link: #98e755;
    --bg-hover: #bce3ff;
}

/* Global scrollbar styling (Firefox) */
html {
    scrollbar-width: thin;
    scrollbar-color: rgba(180, 180, 180, 0.75) rgba(0, 0, 0, 0.8);
}

/* Global scrollbar styling (Chromium/WebKit) */
::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.2);
    border-radius: 10px;
}

::-webkit-scrollbar-thumb {
    background: rgba(180, 180, 180, 0.75);
    border-radius: 10px;
    border: 2px solid rgba(0, 0, 0, 0.15);
}

::-webkit-scrollbar-thumb:hover {
    background: rgba(210, 210, 210, 0.9);
}

.k-link {
    font-style: normal;
}

/* Default app behavior: text is not selectable unless explicitly enabled. */
body,
body * {
    -webkit-user-select: none;
    user-select: none;
}

input,
textarea,
[contenteditable],
[contenteditable="true"],
.k-input-inner,
.allow-text-select,
.allow-text-select * {
    -webkit-user-select: text;
    user-select: text;
}


/**********************************************/
/* Treeview -> #bom-tree & features-treeview  */
/**********************************************/
#bom-tree .k-treeview, #bom-tree .k-icon, #features-treeview .k-item, #features-treeview .k-icon {
    color: var(--fg-color);
}
#bom-tree .k-treeview-leaf.k-hover, #bom-tree .k-treeview-leaf:hover, #features-treeview .k-treeview-leaf.k-hover, #features-treeview .k-treeview-leaf:hover {
    color: var(--fg-color);
}
#bom-tree .k-content {
    color: var(--fg-color)!important;
}
.k-tabstrip-items-wrapper .k-item.k-state-hover, .k-tabstrip-items-wrapper .k-item:hover {
    background-color: rgba(0,0,0,0.4);
    border: 1px solid #0000
}

/**********************************************/
/* window -> all                              */
/**********************************************/
.k-window {
    background: #0000;
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 8px;
}

.k-window-titlebar {
    padding: 4px 0 4px 8px;
    background-color: #333333;
    color: var(--fg-color, #fff);
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
}

.k-window-title {
    font-size: 14px;
}
.k-window-content {
    background-color: #444;
    color: var(--fg-color, #ffffff);
    border-bottom-right-radius: 8px;
    border-bottom-left-radius: 8px;
    box-shadow: 0px 0px 15px #000a;
}

.k-window-titlebar {
    border-color: rgba(255, 255, 255, 0.13);
}

/**********************************************/
/* TabStrip -> all                            */
/**********************************************/
.k-tabstrip:focus {
    box-shadow: none;
}
.k-tabstrip-items .k-link {
    color: var(--fg-color, #fff) !important;
}
.k-tabstrip-items .k-item:hover,
.k-tabstrip-items .k-item.k-state-hover {
    background-color: #3a3a3a !important;
    border-color: rgba(255, 255, 255, 0.18) !important;
    color: var(--fg-color, #fff) !important;
}
.k-tabstrip-items-wrapper {
    border-color: rgba(255, 255, 255, 0.13);
}
.k-tabstrip-items .k-item {
    background-color: rgba(0, 0, 0, 0.1);
    border-color: rgba(255, 255, 255, 0.13) !important;
    color: var(--fg-color, #fff) !important;
}
.k-tabstrip-items .k-item.k-state-active,
.k-tabstrip-items .k-item.k-state-selected,
.k-tabstrip-items .k-item.k-active,
.k-tabstrip-items .k-item.k-selected {
    border-color: rgba(255, 255, 255, 0) !important;
    color: var(--fg-color, #fff) !important;
    border-bottom-color: #333 !important;
    background-color: rgba(0, 0, 0, 0.4);
}
.k-tabstrip-content, .k-tabstrip > .k-content {
    background-color: rgba(0,0,0,0.4);
    border-color: rgba(255, 255, 255, 0.13);
    color: var(--fg-color, #fff);
}
.k-tabstrip-content.k-state-focused, .k-tabstrip-content:focus, .k-tabstrip>.k-content.k-state-focused, .k-tabstrip>.k-content:focus {
    outline-color:  rgba(255, 255, 255, 0.3);
}

/**********************************************/
/* TabStrip -> #props-tabstrip                */
/**********************************************/
#props-tabstrip .k-tabstrip-items .k-state-active .k-link {
    color: var(--fg-color)!important;
    font-weight: normal;
}
#props-tabstrip .k-tabstrip-items-wrapper {
    border-color: rgba(255, 255, 255, 0.2);

}
#props-tabstrip .k-tabstrip-content, #props-tabstrip .k-tabstrip>.k-content {
    border-top-color: rgba(255, 255, 255, 0.2);
    border-right-color: rgba(255, 255, 255, 0.2);
    border-bottom-color: rgba(255, 255, 255, 0.2);
}
#props-tabstrip .k-tabstrip-items-wrapper .k-item.k-state-active, #props-tabstrip .k-tabstrip-items-wrapper .k-item.k-state-selected, #props-tabstrip .k-tabstrip-items-wrapper .k-item:active {
    border-top-color: rgba(255, 255, 255, 0.2);
    border-left-color: rgba(255, 255, 255, 0.2);
    border-bottom-color: rgba(255, 255, 255, 0.2);
    color: var(--fg-color);
    background-color: rgba(0, 0, 0, 0.4);
}
#props-tabstrip .k-tabstrip-items .k-link {
    color: var(--fg-color);
    font-weight: normal;
}
#props-tabstrip .k-tabstrip-content, #props-tabstrip .k-tabstrip>.k-content {
    background-color: rgba(0, 0, 0, 0.4)
}

.material-form-grid {
    display: grid;
    gap: 16px;
    margin-top: 10px;
    padding: 10px;
}

#material-hide-selection-toggle {
    margin: 0 0 0 8px;
}

.prop-section.material-tab {
    margin-top: 25px;
}

.material-selector-row {
    margin-bottom: 10px;
}

#part-material-select {
    color: rgba(0, 0, 0, 0.88) !important;
    background-color: #fff !important;
    -webkit-text-fill-color: rgba(0, 0, 0, 0.88);
}

#part-material-select option {
    color: rgba(0, 0, 0, 0.88) !important;
    background-color: #fff !important;
}

#part-material-select:focus,
#part-material-select:active {
    color: rgba(0, 0, 0, 0.88) !important;
    background-color: #fff !important;
}

#part-material-select + .k-input,
#part-material-select + .k-picker,
#part-material-select + .k-combobox {
    width: 100%;
    color: rgba(0, 0, 0, 0.88) !important;
    background-color: #fff !important;
    border-color: rgba(0, 0, 0, 0.2) !important;
    align-items: center;
}

#part-material-select + .k-combobox .k-input-inner,
#part-material-select + .k-combobox input,
#part-material-select + .k-combobox .k-input-inner::placeholder,
#part-material-select + .k-combobox .k-input-button,
#part-material-select + .k-combobox .k-input-value-text,
#part-material-select + .k-combobox .k-input-solid,
#part-material-select + .k-combobox .k-input,
#part-material-select + .k-combobox .k-input-md,
#part-material-select + .k-picker .k-input-inner,
#part-material-select + .k-picker .k-input-button,
#part-material-select + .k-picker .k-input-value-text,
#part-material-select + .k-picker .k-input-solid {
    color: rgba(0, 0, 0, 0.88) !important;
    background-color: #fff !important;
    -webkit-text-fill-color: rgba(0, 0, 0, 0.88);
}

#part-material-select + .k-combobox input {
    caret-color: rgba(0, 0, 0, 0.88);
}

#part-material-select + .k-combobox .k-i-caret-alt-down,
#part-material-select + .k-combobox .k-svg-icon,
#part-material-select + .k-picker .k-i-caret-alt-down,
#part-material-select + .k-picker .k-svg-icon {
    color: rgba(0, 0, 0, 0.72) !important;
    fill: rgba(0, 0, 0, 0.72) !important;
}

.material-hide-selection-row {
    margin-bottom: 10px;
}

.material-slider-row {
    margin-top: 2px;
}

.material-tab .setup-range-row {
    background: rgba(255, 255, 255, 0.2);
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 6px;
    padding: 14px 10px 6px;
}

.material-tab .setup-range-value {
    color: rgba(0, 0, 0, 0.78);
}

.material-form-row {
    display: grid;
    grid-template-columns: 30% minmax(0, 1fr);
    align-items: center;
    gap: 10px;
}

.material-form-input,
.material-form-textarea,
.material-form-select {
    width: 100%;
}

.material-form-row > .prop-label {
    margin: 0;
}

.material-tab .mini-slider-track::before {
    background: rgba(0, 0, 0, 0.18);
}

.material-tab .mini-slider-fill {
    background: rgba(0, 0, 0, 0.42);
}

.material-tab .mini-slider-scale-mark {
    background: rgba(0, 0, 0, 0.48);
}

.material-tab .mini-slider-scale-label {
    color: rgba(0, 0, 0, 0.68);
}

.material-form-textarea {
    resize: vertical;
    min-height: 72px;
}

.material-form-toggle {
    margin-top: 4px;
}

#material-form-save {
    width: 94%;
}

.material-form-actions {
    margin: 24px 14px 14px;
    display: flex;
    justify-content: center;
}

.material-form-save {
    min-width: 120px;
    font-weight: 700;
}


/**********************************************/
/* ckeckbox                               */
/**********************************************/
.k-checkbox {
    border-color:rgba(255, 255, 255, 0.4);
    background-color: rgba(0, 0, 0, 0.2);
}

/**********************************************/
/* Switch small                               */
/**********************************************/
.k-switch-sm {
    width: 40px;
    height: 18px;
}
.k-switch-sm .k-switch-track {
    width: 32px;
    height: 18px;
    margin: 0 4px;
}
.k-switch-sm .k-switch-thumb {
    width: 14px;
    height: 14px;
}

.k-treeview-leaf.k-focus, .k-treeview-leaf:focus {
    box-shadow: none;
}

/* Hide Kendo TreeView custom sprites (keep expand/collapse icons) */
.k-treeview .k-sprite:not(.k-i-expand):not(.k-i-collapse) {
    display: none;
}

/* Quality indicators (replace emoji semaphores) */
.quality-red {
    color: #ff1a1a!important;
    font-weight: bold;
}

.quality-red-db {
    color: #e62b2b !important;
    font-weight: bold;
    background-image: url(/images/warning.png);
    background-size: contain;
    background-repeat: no-repeat;
    width: 30px;
    display: inline-block;
    text-align: right;
}


.quality-yellow {
    color: #f57c00!important;
    font-weight: bold;
}

/**********************************************/
/* Grid / TreeList -> all                     */
/**********************************************/
.k-grid,
.k-treelist {
    background-color: #252526;
    color: var(--fg-color, #fff);
    border-color: rgba(255, 255, 255, 0.13);
}

.k-grid-header,
.k-treelist-header {
    border-color: #444;
    color: var(--fg-color, #fff);
    background-color: #333333;
    font-weight: bold;
}

.k-grid-footer {
    border-color: #444;
    color: #fff;
    background-color: #222;
}

.k-grid-header .k-header,
.k-treelist-header .k-header,
.k-grid-header .k-table-th,
.k-treelist-header .k-table-th {
    border-color: rgba(255, 255, 255, 0.13);
    color: var(--fg-color, #fff);
    background-color: transparent;
}

.k-grid-content,
.k-treelist-content,
.k-grid td,
.k-treelist td,
.k-grid .k-table-td,
.k-treelist .k-table-td {
    background-color: transparent;
    border-color: rgba(255, 255, 255, 0.13);
    color: var(--fg-color, #fff);
}

.k-grid tr.k-alt,
.k-treelist tr.k-alt,
.k-grid .k-table-alt-row,
.k-treelist .k-table-alt-row {
    background-color: rgba(255, 255, 255, 0.04);
}

.k-grid tbody tr:hover,
.k-treelist tbody tr:hover,
.k-grid .k-table-row:hover,
.k-treelist .k-table-row:hover {
    background-color: rgba(255, 255, 255, 0.07);
}

.k-grid-toolbar,
.k-treelist-toolbar,
.k-grid-pager,
.k-pager {
    background-color: #333333;
    border-color: rgba(255, 255, 255, 0.13);
    color: var(--fg-color, #fff);
}

/* Model Manager Grid */
#model-manager-grid .model-manager-toolbar {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
    flex-wrap: wrap;
    padding: 4px 0;
}

#model-manager-grid,
#model-manager-grid .k-grid,
#model-manager-grid .k-grid-toolbar {
    overflow: visible;
}

#model-manager-grid .k-grid-toolbar {
    position: relative;
    z-index: 3;
}

#model-manager-grid .model-manager-type-dropdown {
    width: 84px;
    flex-shrink: 0;
    z-index: 4;
}

#model-manager-grid .model-manager-type-dropdown .mode-dropdown-selected {
    min-height: 0;
    padding: 0;
    background: none;
}

#model-manager-grid .model-manager-type-dropdown .mode-dropdown-menu {
    min-width: 80px;
    background-color:#444;
    z-index: 1001;
}

#model-manager-grid .model-manager-type-dropdown .mode-dropdown-item {
    justify-content: center;
    padding: 4px 0;
}

#model-manager-grid .model-manager-actions {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
}

#model-manager-grid .model-manager-icon-action {
    width: 34px;
    min-width: 34px;
    height: 34px;
    padding: 0;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 18px 18px;
    font-size: 0;
}

#model-manager-grid .model-manager-icon-edit {
    background-image: url(/images/edit.png);
}

#model-manager-grid .model-manager-icon-new {
    background-image: url(/images/add_w.png);
}

#model-manager-grid .model-manager-icon-duplicate {
    background-image: url(/images/duplicate_w.png);
}

#model-manager-grid .model-manager-icon-delete {
    background-image: url(/images/trash_w.png);
}

#model-manager-grid .model-manager-action[disabled] {
    opacity: 0.55;
    cursor: default;
}

#model-manager-grid .model-manager-search {
    width: 240px;
    max-width: 100%;
}

#model-manager-grid .k-grid-content tr {
    cursor: pointer;
}

#model-manager-grid .model-manager-select-cell {
    text-align: center;
    padding: 4px 2px;
}

#model-manager-grid .model-manager-row-select {
    min-width: 32px;
    width: 32px;
    height: 32px;
    padding: 0;
}

#model-manager-grid .model-manager-row-select .k-icon {
    font-size: 18px;
}

#model-manager-create-dialog,
#model-manager-duplicate-dialog {
    padding: 0;
}

.model-manager-form {
    display: grid;
    gap: 12px;
    padding: 10px 10px 0;
}

.model-manager-form-intro {
    font-size: 12px;
    color: rgba(0, 0, 0, 0.72);
}

.model-manager-form-field {
    display: grid;
    gap: 6px;
    font-size: 12px;
    color: rgba(0, 0, 0, 0.78);
}

.model-manager-form-field > span {
    font-weight: 600;
}

.model-manager-form-field textarea.k-textbox {
    min-height: 72px;
    resize: vertical;
}

.model-manager-form-field .k-dropdownlist {
    width: 50%;
}

.model-manager-form-actions {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding-top: 4px;
    margin: 0 5% 3%;
}

#model-manager-dialog {
    overflow: hidden;
}

/* TreeView checkbox styling */
.k-treeview .k-checkbox {
    width: 16px;
    height: 16px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}
#bom-tree.bom-tree-view-pbs .k-checkbox-wrapper,
#bom-tree.bom-tree-view-pbs .k-checkbox {
    display: none;
}
#bom-tree.bom-tree-view-fbs .k-checkbox-wrapper,
#bom-tree.bom-tree-view-fbs .k-checkbox {
    display: none;
}
#bom-tree.bom-tree-mode-cad .k-checkbox,
#bom-tree.bom-tree-mode-bim .k-checkbox {
    color: transparent;
}
#bom-tree.bom-tree-mode-cad .k-checkbox::before,
#bom-tree.bom-tree-mode-cad .k-checkbox:checked::before,
#bom-tree.bom-tree-mode-cad .k-checkbox:indeterminate::before,
#bom-tree.bom-tree-mode-bim .k-checkbox::before,
#bom-tree.bom-tree-mode-bim .k-checkbox:checked::before,
#bom-tree.bom-tree-mode-bim .k-checkbox:indeterminate::before {
    display: none;
}

#bom-tree.bom-tree-mode-cad .k-checkbox:checked,
#bom-tree.bom-tree-mode-cad .k-checkbox:indeterminate,
.k-treeview .k-checkbox:checked,
.k-treeview .k-checkbox:indeterminate {
    background-color: rgba(0, 0, 0, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.4);
    color: var(--fg-context);
}

#bom-tree.bom-tree-mode-bim .k-checkbox:checked,
#bom-tree.bom-tree-mode-bim .k-checkbox:indeterminate,
.k-treeview .k-checkbox:checked,
.k-treeview .k-checkbox:indeterminate {
    background-color: rgba(0, 0, 0, 0.1);
    border: 0 none #000;
    color: var(--fg-context);
}

#props-grid .k-treeview {
    color: rgba(255, 255, 255, 0.7);
}

#btn-checkout {
    width: 94%;
    margin: 3%;
}

#btn-release {
    width: 94%;
    margin: 3%;
    font-weight: bold;
    background-color: #16a34a;
    border-color: #0f6f32;
}

#material-form-save, #btn-checkout span {
    color: var(--fg-select)
}

.k-treeview .k-checkbox:checked::before,
.k-treeview .k-checkbox:indeterminate::before {
    color: var(--fg-context);
}
#bom-tree.bom-tree-mode-cad .k-checkbox {
    background-image: url("/images/bom-toggle-cad-off.png");
}
#bom-tree.bom-tree-mode-cad .k-checkbox:checked {
    background-image: url("/images/bom-toggle-cad-on.png");
}
#bom-tree.bom-tree-mode-cad .k-checkbox:indeterminate {
    background-image: url("/images/bom-toggle-cad-indeterminate.png");
}
#bom-tree.bom-tree-mode-bim .k-checkbox {
    background-image: url("/images/bom-toggle-bim-off.png");
    border: 0;
    opacity: 0.6;
}
#bom-tree.bom-tree-mode-bim .k-checkbox:checked {
    background-image: url("/images/bom-toggle-bim-on.png");
    opacity: 1;
}
#bom-tree.bom-tree-mode-bim .k-checkbox:indeterminate {
    background-image: url("/images/bom-toggle-bim-indeterminate.png");
    opacity: 1;
}
#bom-tree.bom-tree-view-wbs .k-checkbox {
    background-image: url("/images/bom-toggle-wbs-off.png");
}
#bom-tree.bom-tree-view-wbs .k-checkbox:checked {
    background-image: url("/images/bom-toggle-wbs-on.png");
}
#bom-tree.bom-tree-view-wbs .k-checkbox:indeterminate {
    background-image: url("/images/bom-toggle-wbs-indeterminate.png");
}
.k-treeview .k-checkbox:checked {
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2020%2020%27%3E%3Cpath%20fill%3D%27none%27%20stroke%3D%27currentColor%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%20stroke-width%3D%273%27%20d%3D%27M6%2010l3%203l6-6%27/%3E%3C/svg%3E");
}
.k-treeview .k-checkbox:indeterminate {
    background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%2020%2020%27%3E%3Cpath%20fill%3D%27none%27%20stroke%3D%27currentColor%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%20stroke-width%3D%273%27%20d%3D%27M6%2010h8%27/%3E%3C/svg%3E");
}

.k-button {
    background-color: #555;
    border-color: #777;
    color: #fff
}
.k-button-solid-primary, .k-treeview-leaf.k-selected {
    border: 1px solid var(--bg-select);
    background-color: var(--bg-select);
    color: var(--fg-select);
    font-weight: bold;
}
.k-treeview-leaf.k-selected {
    background-color: var(--bg-select);
    color: var(--fg-select);
    border-radius: 8px;
}
.k-button-solid-primary.k-hover, .k-button-solid-primary:hover {
    border-color: var(--bg-select);
    background-color: var(--bg-select);
}
.k-button-solid-base.k-hover, .k-button-solid-base:hover {
    background-color: #666;
}
.k-treeview-leaf.k-hover {
    background-color: rgba(255,255,255,0.3);
/*    color: rgba(0,0,0,0.9);*/
}
.k-list-item.k-selected, .k-selected.k-list-optionlabel {
    color: var(--fg-select);
    background-color: var(--bg-select);
}
.k-list-item.k-selected.k-hover, .k-list-item.k-selected:hover, .k-selected.k-hover.k-list-optionlabel, .k-selected.k-list-optionlabel:hover {
    background-color: var(--bg-select);
}
.k-list-item.k-selected, .k-selected.k-list-optionlabel {
    background-color: var(--bg-select);
}
.k-grid tr.k-state-selected>td ,
.k-grid tr.k-selected:hover {
    color: var(--fg-select);
    background-color: var(--bg-grid-select);
    font-weight: bold;
}
.k-grid tr.k-selected > td,
.k-grid tr.k-selected:hover > td,
.k-grid .k-table-row.k-selected > .k-table-td,
.k-grid .k-table-row.k-selected:hover > .k-table-td,
.k-grid td[aria-selected="true"] {
    color: var(--fg-select) !important;
    background-color: var(--bg-select) !important;
    box-shadow: none !important;
}
.k-focus.k-list-optionlabel, .k-list-item.k-focus, .k-list-item:focus, .k-list-optionlabel:focus {
    box-shadow: none;
}
.k-list-item-text::before, .k-list-optionlabel::before {
    content: "";
}

.toolbar .search-input {
    font-size: 13px;
}

#app-layout {
    height: 100%;
    position: relative;
}

/* Viewer container - full screen background */
#viewer-container {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    outline: none;
    cursor: default;
    background: #9ca7b1;
}

#selection-overlay {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

/* Top toolbar */
#top-toolbar {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 36px;
    background: rgba(0, 0, 0, 0.5);
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 4px;
    box-sizing: border-box;
    z-index: 1000;
    pointer-events: auto;
}

#toolbar-left {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
}

#model-dropdown {
    width: 220px;
}

#model-type-dropdown {
    width: 110px;
}

#toolbar-left .model-type-mode-dropdown {
    width: 84px;
    flex-shrink: 0;
}

#toolbar-left .model-type-mode-dropdown .mode-dropdown-selected {
    min-height: 0px;
    padding: 0;
    background: rgba(0, 0, 0, 0.38);
}

#toolbar-left .model-type-mode-dropdown .mode-dropdown-menu {
    min-width: 80px;
    background-color: rgba(90, 90, 90, 0.9);
}

#toolbar-left .model-type-mode-dropdown .mode-dropdown-item {
    justify-content: center;
    padding: 4px 0;
    width: 66px;
}

#btn-model-manager {
    width: 24px;
    height: 24px;
    padding: 4px;
    border: 0 none #000;
    border-radius: 4px;
    cursor: pointer;
    font-size: 14px;
    display: flex;
    opacity: 0.7;
    align-items: center;
    justify-content: center;
    transition: background 0.2s;
    background-color: #0000;
    background-image: url("../images/cube_w.png");
    background-size: contain;
}

#btn-model-manager[data-model-type="BIM"] {
    background-image: url("../images/house_w.png");
}

#btn-model-manager[data-model-type="CAD"] {
    background-image: url("../images/cube_w.png");
}

#btn-model-manager:hover {
    opacity:1;
}

#toolbar-model-name {
    color: #ccc;
    font-size: 13px;
    max-width: 220px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    line-height: 24px;
}

#btn-model-load {
    height: 30px;
    padding: 0 12px;
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 6px;
    cursor: pointer;
    font-size: 13px;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: rgba(255, 255, 255, 0.7);
    background: rgba(255, 255, 255, 0.15);
}

#btn-model-load:hover {
    background: rgba(255, 255, 255, 0.25);
}

/* Bold selected value when dropdown is closed */
#model-dropdown + .k-input-value-text,
.k-dropdownlist[aria-controls="model-dropdown-list"] .k-input-value-text {
    font-weight: bold;
}

/* Override Kendo list item padding for model dropdown */
#model-dropdown-list .k-list-item-text {
    padding: 6px 8px;
}

#model-type-dropdown-list .k-list-item-text {
    padding: 4px 8px;
}

.model-dropdown-item {
    padding: 0;
}

.model-type-dropdown-item {
    padding: 0;
    font-weight: 700;
}

.model-type {
    height: 24px;
    width: 34px;
    line-height: 24px;
    background-size: 18px;
    background-repeat: no-repeat;
    background-position: 5px center;
    background-color: #555;
    color: #fff;
    padding: 2px 0 0 28px;
    margin: 0;
    border-radius: 12px;
    border: 1px solid #777;
}
.model-type-mini {
    height: 24px;
    width: 34px;
    line-height: 24px;
    background-size: 18px;
    background-repeat: no-repeat;
    background-position: 5px center;
    font-weight: bold;
    padding: 2px 0 0 28px;
    margin: 0 0 0 8px;
    border-radius: 12px;
}


.model-type-cad {
    background-image: url(/images/cube_w.png);
}

.model-type-bim {
    background-image: url(/images/house_w.png);
}

.model-type-cad-drop {
    background-color: #5f5f5f;
    background-image: url(/images/cube_w.png);
    opacity: 0.8;
}
.model-type-cad-drop:hover {
    background-color: #333;
}

.model-type-bim-drop {
    background-color: #5f5f5f;
    background-image: url(/images/house_w.png);
    opacity: 0.8;
}
.model-type-bim-drop:hover {
    background-color: #333;
}

#model-type-dropdown + .k-picker .model-type-cad,
#model-type-dropdown + .k-picker .model-type-bim,
.k-dropdownlist[aria-controls="model-type-dropdown-list"] .model-type-cad,
.k-dropdownlist[aria-controls="model-type-dropdown-list"] .model-type-bim {
    font-weight: 700;
}

.model-dropdown-item .model-main {
    font-weight: bold;
}

.model-dropdown-item .model-desc {
    font-size: 12px;
    margin-top: 2px;
}

#toolbar-center {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    pointer-events: auto;
}

#toolbar-message {
    display: flex;
    align-items: center;
    gap: 0;
    font-size: 14px;
    font-weight: bold;
    color: #fff;
    text-shadow: 1px 1px 2px #000, -1px -1px 2px #000;
    white-space: nowrap;
}

#msg-partnumber {
    margin: 4px 8px;
}


#msg-filename {
    padding-left: 4px;
}

#floating-toolbar-message {
    position: absolute;
    top: 60px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    pointer-events: none;
    z-index: 200;
}

#app-layout:has(#gizmo-toolbar[style*="display: flex"]) #floating-toolbar-message,
#app-layout:has(#part-transform-toolbar[style*="display: flex"]) #floating-toolbar-message {
    top: 118px;
}

.viewer-busy-indicator {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 4px;
    padding: 3px 10px;
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.16);
    color: rgba(255, 255, 255, 0.95);
    font-size: 12px;
    font-weight: 600;
}

.viewer-busy-indicator.viewer-busy-indicator-pane {
    margin: 8px 10px 0 10px;
    align-self: stretch;
    justify-content: center;
    border-radius: 10px;
    background: rgba(243, 108, 52, 0.14);
    color: rgba(255, 255, 255, 0.96);
}

.viewer-busy-indicator.viewer-busy-indicator-centered {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    margin-top: 0;
    padding: 10px 16px;
    font-size: 15px;
    border-radius: 999px;
    background: rgba(0, 0, 0, 0.68);
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.28);
    z-index: 5000;
    pointer-events: none;
}

.viewer-busy-dot {
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: #f36c34;
    animation: viewer-busy-pulse 1s ease-in-out infinite;
}

body.viewer-busy {
    cursor: progress;
}

@keyframes viewer-busy-pulse {
    0%, 100% { transform: scale(0.8); opacity: 0.55; }
    50% { transform: scale(1); opacity: 1; }
}

#toolbar-right {
    display: flex;
    align-items: center;
    flex-shrink: 0;
}

#btn-fullscreen {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    cursor: pointer;
    background: none;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    line-height: 32px;
    transition: all 0.2s;
    margin-right: 8px;
    color: var(--fg-color);
}

#btn-fullscreen:hover {
    background: rgba(0, 0, 0, 0.2);
}

#user-menu {
    position: relative;
}

#app-menu {
    position: relative;
}

#user-avatar {
    width: 28px;
    height: 28px;
    background-image: url(../images/user_w.png);
    background-size: 18px;
    background-repeat: no-repeat;
    background-position: center;
    align-items: center;
    justify-content: center;
    color: white;
    font-size: 16px;
    transition: all 0.2s;
}
#user-avatar.active {
    background-color: rgba(255, 255, 255, 0.4);
}

/* Client connection status badge */
.toolbar-user-trigger-wrap {
    position: relative;
    display: inline-flex;
}

.status-badge {
    position: absolute;
    bottom: -2px;
    right: -3px;
    width: 9px;
    height: 9px;
    border-radius: 50%;
    border: 0px none #000;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
    transition: background-color 0.3s;
}
.status-badge.online {
    background-color: #4caf50;
}
.status-badge.offline {
    background-color: #f44336;
}

.toolbar-menu-trigger {
    width: 28px;
    height: 28px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s;
    color: var(--fg-color);
    text-indent: -9999px;
    overflow: hidden;
}

.toolbar-user-trigger {
    background-color: rgba(255, 255, 255, 0.2);
    cursor: pointer;
}

.toolbar-app-trigger {
    margin-left: 8px;
    background-image: url(../images/vmore_w.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 20px;
    cursor: pointer;
}
#app-menu-trigger.active {
    background-color: rgba(255, 255, 255, 0.4);
}

#user-dropdown-menu,
#app-dropdown-menu {
    display: none;
}

#user-dropdown-menu.k-context-menu,
#app-dropdown-menu.k-context-menu {
    min-width: 220px;
    background: #252526;
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 6px;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.6);
    overflow: hidden;
    z-index: 220;
}

#user-dropdown-menu.k-context-menu .k-link,
#app-dropdown-menu.k-context-menu .k-link {
    padding: 9px 12px;
    font-size: 13px;
    color: var(--fg-color, #ccc);
}

#user-dropdown-menu.k-context-menu .k-link:hover,
#app-dropdown-menu.k-context-menu .k-link:hover {
    background-color: rgba(255, 255, 255, 0.07);
}

.toolbar-menu-item {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    box-sizing: border-box;
}

.toolbar-menu-kicon {
    flex: 0 0 auto;
    font-size: 16px;
    color: rgba(255, 255, 255, 0.72);
}

.toolbar-menu-text {
    flex: 1 1 auto;
}

.toolbar-menu-profile {
    display: flex;
    flex-direction: column;
    gap: 4px;
    text-align: center;
}

.toolbar-menu-profile strong {
    font-size: 14px;
}

.toolbar-menu-profile span {
    font-size: 12px;
    opacity: 0.8;
}

.menu-static > .k-link {
    cursor: default;
    background-color: rgba(255, 255, 255, 0.06);
}

#user-dropdown-menu.k-context-menu .k-separator,
#app-dropdown-menu.k-context-menu .k-separator,
#more-menu.k-context-menu .k-separator,
.menu-separator {
    height: 1px;
    margin: 2px 0;
    background: rgba(255, 255, 255, 0.25);
    pointer-events: none;
}

#user-dropdown-menu.k-context-menu .k-separator,
#app-dropdown-menu.k-context-menu .k-separator,
#more-menu.k-context-menu .k-separator {
    display: block;
    padding: 0;
    min-height: 1px;
    border: 0;
    background-color: rgba(255, 255, 255, 0.25);
}

#user-dropdown-menu.k-context-menu .k-separator > .k-link,
#app-dropdown-menu.k-context-menu .k-separator > .k-link,
#more-menu.k-context-menu .k-separator > .k-link,
.menu-separator > .k-link {
    display: none !important;
}

.saved-sessions-toolbar {
    display: flex;
    gap: 8px;
    align-items: center;
    padding: 8px 12px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.saved-sessions-toolbar label {
    font-size: 12px;
}

.saved-sessions-toolbar select,
.saved-sessions-toolbar input {
    font-size: 12px;
    padding: 4px 6px;
    border-radius: 4px;
    border: 1px solid rgba(0, 0, 0, 0.2);
    background: #fff;
}

.saved-sessions-toolbar input {
    flex: 1;
}

.setup-tab {
    padding: 12px;
    height: 270px
}

.setup-label {
    display: block;
    text-align: center;
    font-size: 12px;
    padding: 0 4px 0;
    line-height: 13px;
    font-weight: normal;
}

#preferences-dialog .setup-label {
    text-align: left;
}

#props-grid .setup-label {
    color: rgba(255, 255, 255, 0.7);
}

.setup-label-img {
    height: 16px;
    background-repeat: no-repeat;
    background-position: left;
    background-size: contain;
    display: inline-block;
    width: 16px;
    vertical-align: text-bottom;
}

.setup-select {
    font-size: 12px;
    padding: 6px 8px;
    border-radius: 4px;
    border: 1px solid rgba(0, 0, 0, 0.2);
    background: #fff;
    display: block;
    margin: 4px auto;
}

.setup-render-selects .setup-color-cell {
    text-align: center;
}

.setup-render-selects .setup-select {
    display: block;
    width: 84%;
    margin: 8px auto 0;
}

.setup-viewer-top-row {
    display: flex;
    gap: 10px;
    align-items: flex-end;
    padding: 8px;
}

.setup-viewer-secondary-row {
    padding-top: 0;
    align-items: center;
}

.setup-viewer-field {
    min-width: 0;
}

.setup-viewer-field-wide {
    flex: 2 1 0;
}

.setup-viewer-field-compact {
}

.setup-inline-field {
    display: flex;
    align-items: center;
    gap: 8px;
}

.setup-inline-field .setup-select {
    flex: 1 1 auto;
}

.setup-inline-label {
    padding: 0;
    white-space: nowrap;
}

.setup-viewer-actions {
    margin: 0 10px 14px 10px;
    bottom: 0;
    position: absolute;
}

.setup-viewer-actions .k-button {
    min-width: 72px;
    height: 22px;
    padding: 2px;
    margin: 2px 4px;
    font-size: 12px;
}

.setup-actions {
    margin-top: 12px;
    display: flex;
    justify-content: flex-end;
}

.setup-toggle-row {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 8px;
}

.setup-toggle-row .setup-label {
    margin: 0;
    padding: 0;
}

.setup-toggle-row input[type="checkbox"] {
    margin: 0;
}

.setup-colors-grid {
    display: grid;
    grid-template-columns: repeat(8, minmax(0, 1fr));
    gap: 10px 12px;
    align-items: end;
    margin-top: 10px;
}

.setup-lights-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px 12px;
    margin-top: 10px;
    align-items: center;
}

.setup-lights-grid-4 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.setup-lights-grid-5 {
    grid-template-columns: repeat(5, minmax(0, 1fr));
}

.setup-lights-grid-7 {
    grid-template-columns: repeat(7, minmax(0, 1fr));
}

.setup-lights-grid-8 {
    grid-template-columns: repeat(8, minmax(0, 1fr));
}

.setup-lights-grid-6 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
}

.setup-lights-grid-3 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.setup-color-cell input[type="color"] {
    width: 60%;
    margin: 8px auto 4px ! important;
    display: block;
    height: 34px;
    border: 1px solid rgba(0, 0, 0, 0.2);
    border-radius: 4px;
    background: none;
    padding: 2px;
}

.setup-color-cell input[type="range"] {
    width: 100%;
    margin-top: 6px;
}

.setup-range-row {
    position: relative;
    display: block;
    padding-top: 12px;
}

.setup-range-row-light {
    display: flex;
    align-items: center;
    gap: 8px;
}

.setup-range-row input[type="range"] {
    flex: 1 1 auto;
    margin-top: 0;
}

.setup-range-row .mini-slider-host,
.setup-range-row .mini-slider {
    flex: 1 1 auto;
    width: 100%;
}

.setup-range-row-compact .mini-slider-host,
.setup-range-row-compact .mini-slider {
    width: min(180px, 100%);
    margin: 0 auto;
}

.setup-range-row-light .mini-slider-host,
.setup-range-row-light .mini-slider {
    min-width: 0;
}

.setup-range-value {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: auto;
    text-align: center;
    margin: 0;
    display: block;
    font-size: 11px;
    color: #ddd;
    font-variant-numeric: tabular-nums;
}

.setup-inline-color {
    width: 24px !important;
    min-width: 24px;
    height: 24px !important;
    margin: 0 !important;
    display: block;
    padding: 1px !important;
    border-radius: 4px;
    flex: 0 0 24px;
    align-self: center;
}

.setup-number-input {
    width: 100%;
    height: 34px;
    box-sizing: border-box;
    margin-top: 8px;
    padding: 6px 8px;
    border: 1px solid rgba(0, 0, 0, 0.18);
    border-radius: 4px;
    background: #fff;
    color: #222;
    font-size: 12px;
    font-variant-numeric: tabular-nums;
}

.setup-number-input:disabled {
    opacity: 0.45;
    background: rgba(0, 0, 0, 0.05);
    cursor: not-allowed;
}

.setup-range-row-walk .mini-slider-host,
.setup-range-row-walk .mini-slider {
    width: 100%;
}

.setup-range-value-walk {
    font-weight: 600;
}

.mini-slider-host {
    min-width: 0;
}

.mini-slider {
    position: relative;
    min-width: 0;
    outline: none;
    user-select: none;
    touch-action: none;
    --mini-slider-track-inset: 5.5px;
}

.mini-slider-horizontal {
    height: 22px;
}

.mini-slider-has-scale.mini-slider-horizontal {
    height: 40px;
}

.mini-slider-track {
    position: absolute;
    margin: 0 var(--mini-slider-track-inset);
    left: 0;
    right: 0;
    top: 7px;
    height: 14px;
}

.mini-slider-track::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    height: 4px;
    transform: translateY(-50%);
    border-radius: 999px;
    background: #555;
}

.mini-slider-fill {
    position: absolute;
    left: 0;
    top: 50%;
    height: 4px;
    transform: translateY(-50%);
    border-radius: 999px;
    background: #aaa;
}

.mini-slider-thumb {
    position: absolute;
    top: 50%;
    width: 12px;
    height: 12px;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 0 0 2px #aaa;
    cursor: pointer;
}

.mini-slider:focus-visible .mini-slider-track::before {
    box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.12);
}

.mini-slider-scale {
    position: absolute;
    left: var(--mini-slider-track-inset);
    right: var(--mini-slider-track-inset);
    top: 20px;
    height: 18px;
    pointer-events: none;
}

.mini-slider-scale-item {
    position: absolute;
    top: 0;
    width: 0;
}

.mini-slider-scale-mark {
    display: block;
    width: 1px;
    height: 6px;
    margin: 0 0 2px;
    background:#ddd;
}

.mini-slider-scale-label {
    position: absolute;
    top: 8px;
    left: 0;
    display: block;
    white-space: nowrap;
    font-size: 10px;
    line-height: 1;
    color: #ddd;
    font-variant-numeric: tabular-nums;
}

.mini-slider-scale-item-min {
    left: 0;
    transform: none;
}

.mini-slider-scale-item-min .mini-slider-scale-label {
    transform: translateX(-50%);
}

.mini-slider-scale-item-max {
    left: 100%;
    transform: none;
}

.mini-slider-scale-item-max .mini-slider-scale-label {
    left: auto;
    right: 0;
    transform: translateX(50%);
}

.mini-slider-scale-item-zero {
    left: calc(var(--mini-slider-ratio) * 100%);
    transform: translateX(-50%);
}

.mini-slider-scale-item-zero .mini-slider-scale-mark {
    margin-left: auto;
    margin-right: auto;
}

.mini-slider-scale-item-zero .mini-slider-scale-label {
    left: 50%;
    transform: translateX(-50%);
}

@media (max-width: 680px) {
    .setup-viewer-top-row {
        flex-direction: column;
        align-items: stretch;
    }
    .setup-inline-field {
        align-items: stretch;
        flex-direction: column;
        gap: 4px;
    }
    .setup-toggle-row {
        grid-template-columns: auto 20px;
    }
    .setup-colors-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* Left pane - floating panel */
#left-pane {
    position: absolute;
    top: 50px;
    left: 10px;
    width: 320px;
    min-width: 200px;
    max-width: 70%;
    max-height: calc(100% - 70px);
    display: flex;
    flex-direction: column;
    background: rgba(0, 0, 0, 0.5);
    border-radius: 8px;
    border: 1px solid rgba(0, 0, 0, 0.1);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
    pointer-events: auto;
    z-index: 100;
    resize: horizontal;
    overflow: hidden;
}

#left-pane .panel-header {
    padding: 8px 15px;
    font-weight: normal;
    font-size: 13px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 8px 8px 0 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: var(--fg-color);
    background-color: rgba(0,0,0,0.6);
}

#left-pane.collapsed #bom-tree {
    display: none;
}

#left-pane.collapsed #bom-tree-search-wrap {
    display: none;
}

#left-pane.collapsed .panel-header {
    border-bottom: none;
    border-radius: 8px;
}

/* BOM actions menu */
#bom-actions-wrap {
    flex-shrink: 0;
    margin-left: auto;
}


#btn-bom-menu {
    color: #fff;
    width: 24px;
    font-size: 20px;
    font-weight: bold;
    opacity: 1;
}

.btn-bom-menu {
    background: none;
    border: none;
    cursor: pointer;
    color: var(--fg-color);
    font-size: 18px;
    line-height: 1;
    padding: 0 5px;
    margin-top: 1px;
    border-radius: 5px;
    opacity: 0.65;
    height: 24px;
}
.btn-bom-menu:hover { opacity: 1; }

#bom-actions-dropdown {
    display: none;
    position: fixed;
    background: #252526;
    border: 1px solid rgba(255,255,255,0.13);
    border-radius: 5px;
    padding: 4px 0;
    z-index: 1000;
    min-width: 160px;
    box-shadow: 0 6px 18px rgba(0,0,0,0.6);
    flex-direction: column;
}
#bom-actions-dropdown.open { display: flex; }

#bom-edit-toolbar { display: contents; }

.bom-menu-item {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    background: none;
    border: none;
    padding: 7px 14px;
    font-size: 13px;
    color: var(--fg-color, #ccc);
    cursor: pointer;
    text-align: left;
    white-space: nowrap;
}
.bom-menu-item:hover { background: rgba(255,255,255,0.07); }
.bom-menu-item.active { background: rgba(68, 143, 218, 0.18); color: #cfe6ff; }
.bom-menu-item-danger { color: #e07070; }
.bom-menu-item-danger:hover { background: rgba(224,112,112,0.1); }
.bom-menu-item-ok { color: #6fcf6f; }
.bom-menu-item-ok:hover { background: rgba(111,207,111,0.1); }
.bom-menu-item-disabled { color: rgba(255,255,255,0.25); pointer-events: none; }
.bom-menu-hidden { display: none !important; }

.bom-menu-separator {
    height: 1px;
    margin: 4px 0;
    background: rgba(255,255,255,0.25);
}

.bom-menu-submenu {
    position: relative;
}

.bom-menu-submenu-trigger {
    padding-right: 10px;
}

.bom-menu-submenu-arrow {
    margin-left: auto;
    font-size: 11px;
    opacity: 0.7;
}

.bom-menu-submenu-panel {
    display: none;
    position: absolute;
    top: -5px;
    left: calc(100% - 4px);
    min-width: 160px;
    padding: 4px 0;
    background: #252526;
    border: 1px solid rgba(255,255,255,0.13);
    border-radius: 5px;
    box-shadow: 0 6px 18px rgba(0,0,0,0.6);
    z-index: 1001;
}

.bom-menu-submenu:hover > .bom-menu-submenu-panel,
.bom-menu-submenu:focus-within > .bom-menu-submenu-panel {
    display: block;
}

.bom-menu-icon {
    display: inline-block;
    width: 18px;
    height: 18px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    flex-shrink: 0;
    font-style: normal;
    text-align: center;
    line-height: 18px;
}
#bom-icon-new-assembly    { background-image: url(../images/folder_new.png); }
#bom-icon-new-item        { background-image: url(../images/add_w.png); }
#bom-icon-new-sketch      { background-image: url(../images/ruler.png); }
#bom-icon-new-item-from-db{ background-image: url(../images/db_new_w.png); }
#bom-icon-edit-mode       { background-image: url(../images/reparent.png); }
.bom-menu-icon-filter     { background-image: url(../images/filter_w.png); }
.bom-menu-icon-view       { background-image: url(../images/view_w.png); }
.bom-menu-icon-export     { background-image: url(../images/export_w.png); }
.bom-menu-icon-import     { background-image: url(../images/export_w.png); transform: scaleY(-1); }
#bom-icon-info            { background-image: url(../images/info_w.png); }
#bom-icon-sort-mode       { background-image: url(../images/sort.png); }
#bom-icon-delete          { background-image: url(../images/trash_w.png); }

.bom-sort-controls {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    margin-left: 8px;
    vertical-align: middle;
}

.bom-sort-btn {
    width: 18px;
    height: 18px;
    padding: 0;
    border: none;
    background-color: transparent;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 16px 16px;
    cursor: pointer;
    opacity: 1;
    flex-shrink: 0;
}
.bom-sort-btn:hover { opacity: 1; }
.bom-sort-btn:disabled {
    opacity: 0.22;
    cursor: default;
}

.bom-sort-btn-move { background-image: url(../images/insert.png); }

#left-pane.bom-edit-active { border-color: var(--bg-select); }

/* Edit mode status bar */
#bom-edit-status-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 4px 8px 4px 12px;
    font-size: 12px;
    color: var(--bg-select);
    background: rgba(0, 0, 0, 0.2);
    border-bottom: 1px solid rgba(0, 0, 0, 0.3);
}
#bom-edit-status-label {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-weight: 600;
}
.bom-edit-status-actions { display: flex; gap: 2px; flex-shrink: 0; }
.bom-status-btn {
    background: none;
    border: none;
    cursor: pointer;
    padding: 2px 5px;
    border-radius: 3px;
    font-size: 14px;
    line-height: 1;
}
.bom-status-btn:hover { opacity: 1; background: rgba(255,255,255,0.08); }
.bom-status-btn-ok     { color: #6fcf6f; }
.bom-status-btn-cancel { color: #e07070; }

/* Cut node in edit mode */
#bom-tree .bom-cut > .k-in { opacity: 0.4; text-decoration: line-through; }

/* Inline paste button on assemblies in edit mode */
.bom-paste-btn {
    display: inline-block;
    margin-left: 5px;
    cursor: pointer;
    background: none;
    border: none;
    width: 20px;
    height: 20px;
    padding: 0 2px;
    vertical-align: middle;
    line-height: 1;
    background-size: 18px;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url(..//images/left-arrow.png);
}
.bom-paste-btn:hover { opacity: 1; }

#bom-tree-search-wrap {
    padding: 8px 8px 4px 8px;
    display: flex;
    align-items: center;
    gap: 10px;
    position: relative;
    overflow: visible;
}

#bom-tree-search {
    width: 100%;
    flex: 1 1 auto;
    height: 30px;
    box-sizing: border-box;
    border: 1px solid rgba(255, 255, 255, 0.22);
    border-radius: 6px;
    background: rgba(0, 0, 0, 0.22);
    color: var(--fg-color);
    padding: 0 10px;
    font-size: 12px;
    outline: none;
}

#bom-tree-search::placeholder {
    color: rgba(255, 255, 255, 0.6);
}

#bom-tree-search:focus {
    border-color: rgba(68, 143, 218, 0.85);
    box-shadow: 0 0 0 2px rgba(68, 143, 218, 0.25);
}

.btn-bom-search {
    flex: 0 0 auto;
    width: 30px;
    height: 30px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.08) url(../images/search_w.png) center / 16px 16px no-repeat;
    cursor: pointer;
    opacity: 0.82;
}

.btn-bom-search:hover {
    opacity: 1;
    background-color: rgba(255, 255, 255, 0.14);
}

#left-pane.hide-part-numbers #bom-tree .tree-name {
    display: none;
}

#bom-tree .bom-count-badge {
    display: inline-flex;
    align-items: center;
    margin-left: 6px;
    padding: 0 6px 1px 6px;
    min-height: 16px;
    border-radius: 999px;
    background: rgba(0, 0, 0, 0);
    color: rgba(255, 255, 255, 0.8);
    font-size: 12px;
    font-weight: 600;
    line-height: 1.4;
    vertical-align: middle;
}

#bom-tree .wbs-status-badge {
    width: 14px;
    height: 14px;
    margin-right: 5px;
    vertical-align: middle;
    object-fit: contain;
    flex-shrink: 0;
}

#bom-tree .pbs-coverage-badge {
    display: inline-flex;
    align-items: center;
    margin-left: auto;
    padding: 0 6px 1px 6px;
    min-height: 16px;
    background: rgba(0, 0, 0, 0.3);
    color: rgba(255, 255, 255, 0.85);
    font-size: 12px;
    font-weight: 600;
    line-height: 1.4;
    vertical-align: middle;
}

#bom-tree .pbs-coverage-badge.pbs-coverage-empty {
    color: #F77;
}

#bom-tree {
    overflow: auto;
    padding: 5px;
    direction: rtl; /* Scrollbar a sinistra */
    max-height: calc(100vh - 176px); /* Altezza massima per evitare overflow */
}

#bom-tree > * {
    direction: ltr; /* Contenuto normale */
}

.tree-name {
display: inline-block;
    padding: 0 6px 2px;
    font-weight: normal;
    margin: 0 2px 0 4px;
/*    font-size: 11px;*/
    line-height: 16px;
    background: rgba(255, 255, 255, 0.2);
    border-radius: 12px;
    color: var(--fg-color);
    border: 1px solid rgba(255, 255, 255, 0.4);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.tree-filename {
    padding-left: 4px;
    font-weight: normal;
}
.tree-name.part-hidden {
    text-decoration: line-through;
    opacity: 0.45;
}

#bom-tree .part-row-hidden > div {
    background: rgba(255, 255, 255, 0.08);
}

#bom-tree .part-leaf-hidden {
    opacity: 0.75;
}

#bom-tree .part-leaf-hidden .instance-name,
#bom-tree .part-leaf-hidden .tree-name {
    padding-left: 24px;
    background-image: url(/images/hide_w.png);
    background-size: contain;
    background-repeat: no-repeat;
}

#bom-tree .bim-part-row-hidden > div {
    background: rgba(0, 94, 184, 0.08);
}

#bom-tree .bim-part-leaf-hidden {
    opacity: 0.7;
}

.tree-name.bim-part-hidden {
    opacity: 0.5;
}

#bom-tree .instance-name {
    color: var(--fg-color);
    font-weight: normal;
}

.instance-name {
    padding-right: 6px;
    display: inline-block;
}

#bom-tree .k-selected .instance-name, #bom-tree .k-selected .tree-name {
    color: var(--fg-select);
    font-weight: bold;
}

.assembly-node {
    color: var(--fg-color)!important;
    font-weight: bold;
}

#bom-tree .k-treeview-item {
    overflow: hidden;
}

/* Assembly styling on Kendo wrapper nodes (higher-level hooks) */
#bom-tree .assembly-leaf {
    background-color: rgba(0,0,0, 0.5);
    width: 100%;
    opacity: 0.9;
}

#bom-tree .assembly-leaf.k-selected {
    border-radius: 8px;
    border: 3px solid var(--bg-assembly);
}

#bom-tree li.k-item > div:has(.bom-meta-row) .k-checkbox-wrapper,
#bom-tree li.k-item > div:has(.bom-meta-row) input[type="checkbox"] {
    display: none !important;
}

#bom-tree .bom-meta-row {
    opacity: 0.9;
}

#bom-tree .bom-meta-row-shell {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 4px 4px 4px 8px;
    background: linear-gradient(90deg, rgba(30, 30, 30, 0.3) 0%, rgba(230, 230, 230, 0.3) 101%);
}

.bom-meta-row-sketches {
    background: url(../images/ruler.png) no-repeat left;
    background-size: 18px 18px;
    padding-left: 24px;
}
.bom-meta-row-rules {
    background: url(../images/magic-wand_w.png) no-repeat left;
    background-size: 18px 18px;
    padding-left: 24px;
}


#bom-tree .bom-meta-actions {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-left: auto;
}

#bom-tree .bom-meta-action {
width: 24px;
    min-width: 24px;
    height: 24px;
    padding: 0;
    border: 0;
    border-radius: 4px;
    background-color: rgba(255, 255, 255, 0.3);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 14px 14px;
    cursor: pointer;
}

#bom-tree .bom-meta-action:hover {
    background-color: rgba(255, 255, 255, 0.18);
}

#bom-tree .bom-meta-action.bom-meta-action-show {
    background-image: url("../images/hide_w.png");
}

#bom-tree .bom-meta-action.bom-meta-action-show.active {
    background-image: url("../images/view_w.png");
}

#bom-tree .bom-meta-action.bom-meta-action-edit {
    background-image: url("/images/edit_w.png");
}

#bom-tree .bom-meta-action.bom-meta-action-generate {
    background-image: url("/images/regenerate_w.png");
    background-size: 18px;
}

#bom-tree .bom-meta-action.bom-meta-action-reset {
    background-image: url("/images/trash_w.png");
}

#bom-tree .bom-meta-action.is-disabled,
#bom-tree .bom-meta-action:disabled {
    opacity: 0.35;
    cursor: default;
}

.k-treeview-md .k-treeview-leaf {width: 100%;}

.lock-icon {
    display: inline-block;
    margin-right: 4px;
    color: #e74c3c;
    background-color: #000;
    cursor: help;
}

.locked-by-me {
    color: #2196F3;
    font-weight: 600;
}

.locked-by-other {
    color: #e74c3c;
    font-weight: 600;
}

/* Right pane - floating panel */
#right-pane {
    position: absolute;
    top: 50px;
    right: 10px;
    width: 380px;
    min-width: 380px;
    max-width: 70%;
    max-height: calc(100% - 70px);
    display: flex;
    flex-direction: column;
    background: rgba(0, 0, 0, 0.5);
    border-radius: 8px;
    border: 1px solid rgba(0, 0, 0, 0.1);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
    pointer-events: auto;
    z-index: 100;
    resize: horizontal;
    color: var(--fg-color);
    overflow: hidden;
    direction: rtl; /* Resize handle a sinistra */
}

#right-pane > * {
    direction: ltr; /* Contenuto normale */
}

#right-pane .panel-header {
    padding: 8px 15px;
    font-size: 13px;
    font-weight: normal;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 8px 8px 0 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: rgba(0, 0, 0, 0.6);}

.btn-collapse {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 12px;
    color: var(--fg-color);
    padding: 2px 6px;
    border-radius: 3px;
    transition: all 0.2s;
}

#right-pane.collapsed #props-grid {
    display: none;
}

#right-pane.collapsed .panel-header {
    border-bottom: none;
    border-radius: 8px;
}

#props-grid {
    padding: 10px;
    font-size: 13px;
    overflow: hidden;
    height: calc(100vh - 162px);
    display: flex;
    flex-direction: column;
}

#file-id {
    background-color: rgba(0, 0, 0, 0.3);
    border: 1px solid rgba(255, 255, 255, 0.3);
}

/* Versioning history tab */
.vh-list { padding: 8px 12px; color: var(--fg-color); }
.vh-empty { padding: 20px; text-align: center; opacity: 0.6; }
.vh-version { margin-bottom: 12px; }
.vh-version-header {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 5px 0;
    border-bottom: 1px solid rgba(255,255,255,0.1);
    margin-bottom: 4px;
    flex-wrap: wrap;
}
.vh-ver-label { font-weight: 600; font-size: 13px; }
.vh-released-at { font-size: 10px; opacity: 0.45; margin-left: auto; }
.vh-state-badge {
    font-size: 10px;
    padding: 2px 7px;
    border-radius: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    white-space: nowrap;
}
.vh-state-in_work    { background: rgba(59,130,246,0.2);  color: #93c5fd; }
.vh-state-in_review  { background: rgba(245,158,11,0.2);  color: #fcd34d; }
.vh-state-released   { background: rgba(34,197,94,0.2);   color: #86efac; }
.vh-state-obsolete   { background: rgba(107,114,128,0.2); color: #9ca3af; }
.vh-revision {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 6px;
    padding: 4px 0 4px 10px;
    border-left: 2px solid rgba(255,255,255,0.1);
    margin: 3px 0;
}
.vh-checked-out { border-left-color: #fbbf24; background: rgba(251,191,36,0.06); border-radius: 0 4px 4px 0; }
.vh-rev-num  { font-size: 11px; font-weight: 700; opacity: 0.75; white-space: nowrap; }
.vh-rev-meta { font-size: 12px; }
.vh-rev-date { font-size: 10px; opacity: 0.45; white-space: nowrap; }
.vh-rev-comment { width: 100%; font-size: 11px; opacity: 0.65; font-style: italic; padding-left: 10px; }

.qc-badge,
.qc-finding-meta {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.3px;
    text-transform: uppercase;
    white-space: nowrap;
}

.qc-badge-error {
    background: rgba(239, 68, 68, 0.18);
    color: #fca5a5;
}

.qc-badge-warning {
    background: rgba(245, 158, 11, 0.2);
    color: #fcd34d;
}

.qc-badge-info {
    background: rgba(59, 130, 246, 0.2);
    color: #93c5fd;
}

.qc-inline-badges,
.qc-report-badges {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex-wrap: wrap;
}

.qc-finding-item {
    border-left: 3px solid transparent;
}

.qc-finding-error {
    border-left-color: #ef4444;
}

.qc-finding-warning {
    border-left-color: #f59e0b;
}

.qc-finding-info {
    border-left-color: #3b82f6;
}

.qc-finding-meta {
    background: rgba(255, 255, 255, 0.08);
    color: rgba(255, 255, 255, 0.78);
    font-weight: 500;
    text-transform: none;
}

.qc-history-btn {
    flex: 0 0 auto;
}

.qc-report-dialog-content {
    height: 100%;
    overflow: auto;
    padding: 14px;
    background: rgba(11, 15, 20, 0.95);
}

.qc-report-shell {
    display: flex;
    flex-direction: column;
    gap: 12px;
}

.qc-report-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
}

.qc-report-title {
    font-size: 16px;
    font-weight: 600;
    color: var(--fg-color);
}

.qc-report-subtitle {
    margin-top: 4px;
    font-size: 12px;
    opacity: 0.6;
    color: var(--fg-color);
}

/* Links tab — related documents */
.source-documents-list { list-style: none; margin: 0; padding: 0; }
.link-item { border-bottom: 1px solid rgba(255,255,255,0.06); }
.link-item:last-child { border-bottom: none; }
.link-item .prop-sub { padding-bottom: 6px; }

#props-tabstrip {
    flex: 1;
    display: flex;
    min-height: 0;
}

#tab-bim-building,
#tab-bim-ifctypes,
#tab-bim-spaces {
    height: 100%;
    overflow: hidden;
}

#tab-bim-building .prop-section,
#tab-bim-building,
#tab-bim-ifctypes,
#tab-bim-spaces {
    height: 100%;
    min-height: 0;
}

#tab-bim-building .prop-section,
#tab-bim-ifctypes .prop-section,
#tab-bim-spaces .prop-section {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 0;
    margin-bottom: 0;
}

#bim-props-tree,
#bim-ifctypes-tree,
#bim-spaces-tree {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
}

#bim-props-tree .k-checkbox:checked,
#bim-props-tree .k-checkbox:indeterminate,
#bim-ifctypes-tree .k-checkbox:checked,
#bim-ifctypes-tree .k-checkbox:indeterminate,
#bim-spaces-tree .k-checkbox:checked,
#bim-spaces-tree .k-checkbox:indeterminate {
    background-color: #26aaa3;
}

.bim-tree-status {
    padding: 8px;
    color: rgba(255,255,255,0.7);
}

.bim-storeys-header-actions {
    display: flex;
    align-items: center;
    gap: 6px;
}

.bim-storeys-section-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.bim-storeys-section-title {
    min-width: 0;
}

.bim-storeys-icon-btn {
    width: 28px;
    min-width: 28px;
    height: 28px;
    padding: 0;
    border-radius: 6px;
    background-color: rgba(255,255,255,0.06);
    border-color: rgba(255,255,255,0.18);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 16px 16px;
}

.bim-storeys-clear-btn {
    background-image: url("../images/deselect.png");
}

.bim-storeys-icon-btn:hover {
    background-color: rgba(255,255,255,0.14);
    border-color: rgba(255,255,255,0.3);
}

.bim-storeys-layout {
    min-height: 0;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.4);
    border: 0px none;
}

.bim-storeys-main,
.bim-storeys-props {
    min-height: 0;
    height: 100%;
}

.bim-ifctypes-main,
.bim-ifctypes-props,
.bim-spaces-main,
.bim-spaces-props {
    min-height: 0;
    height: 100%;
}

.bim-storeys-layout > .k-pane {
    overflow: hidden;
}

.bim-storeys-layout .k-splitbar {
    background: rgba(255,255,255,0.08);
    border-color: rgba(255,255,255,0.14);
}

.bim-storeys-layout .k-collapse-prev,
.bim-storeys-layout .k-collapse-next {
    color: rgba(255,255,255,0.65);
}

.bim-storeys-properties-content {
    max-height: 100%;
    overflow: auto;
}

.bim-storeys-empty {
    padding: 10px 0;
    color: rgba(255,255,255,0.62);
    font-style: italic;
}

.bim-analytics-tabstrip {
    min-height: 0;
}

#bim-analytics-dialog {
    overflow: hidden;
}

#bim-analytics-dialog .k-window-content {
    background-color: #252526;
}

#bim-analytics-dialog .k-grid,
#bim-analytics-dialog .k-treelist,
#bim-analytics-dialog .k-table {
    background-color: #252526 !important;
}

#bim-analytics-dialog .k-grid-content,
#bim-analytics-dialog .k-treelist-content {
    background-color: #252526 !important;
}

.bim-analytics-tabstrip > .k-tabstrip-wrapper {
    min-height: 0;
}

.bim-analytics-tabstrip > .k-content,
.bim-analytics-tabstrip > .k-tabstrip-wrapper > .k-content {
    min-height: 0;
    padding: 12px;
    box-sizing: border-box;
    overflow: hidden;
    background-color: #252526;
}

.bim-analytics-page {
    display: flex;
    flex-direction: column;
    gap: 10px;
    height: 100%;
    min-height: 0;
    padding: 10px 12px 12px;
    box-sizing: border-box;
    background-color: #444;
}

.bim-analytics-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 14px;
}

.bim-analytics-title-wrap {
    min-width: 0;
}

.bim-analytics-title {
    font-size: 24px;
    font-weight: 700;
    color: var(--fg-color, #e2e8f0);
}

.bim-analytics-subtitle {
    margin-top: 4px;
    color: #94a3b8;
    font-size: 13px;
}

.bim-analytics-controls {
    display: flex;
    flex: 0 0 auto;
    gap: 12px;
    flex-wrap: wrap;
    justify-content: flex-start;
    align-items: flex-end;
        padding: 0 0 12px;
}

.bim-analytics-actions {
    display: flex;
    align-items: flex-end;
    gap: 14px;
}

#bim-analytics-load, #bim-analytics-storeys-load, #bim-analytics-compare {
    align-self: flex-end;
    margin-bottom: 1px;
    flex: 0 0 auto;
    font-weight: bold;
    padding: 4px 8px;
    border-radius: 6px;
}

.bim-analytics-view-toggle {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 0 0 6px;
    font-size: 12px;
    font-weight: 600;
    color: #94a3b8;
}

.bim-analytics-view-toggle label {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    cursor: pointer;
}

.bim-analytics-view-toggle input[type="radio"] {
    margin: 0;
}

#bim-analytics-model + .k-input-inner,
#bim-analytics-building + .k-input-inner,
#bim-analytics-measure + .k-input-inner,
#bim-analytics-model + .k-picker,
#bim-analytics-building + .k-picker,
#bim-analytics-measure + .k-picker,
#bim-analytics-model + .k-picker .k-input-inner,
#bim-analytics-building + .k-picker .k-input-inner,
#bim-analytics-measure + .k-picker .k-input-inner {
    min-height: 44px;
}

#bim-analytics-model + .k-picker,
#bim-analytics-building + .k-picker,
#bim-analytics-measure + .k-picker {
    align-items: stretch;
}

#bim-analytics-building + .k-picker {
    min-width: 260px;
}

.k-animation-container .bim-analytics-building-leaf > div > .k-in,
.k-animation-container .bim-analytics-building-leaf > .k-treeview-leaf > .k-in,
.k-animation-container .bim-analytics-building-leaf > .k-mid > .k-in {
    border-radius: 6px;
    transition: background-color 120ms ease, color 120ms ease;
}

.k-animation-container .bim-analytics-building-leaf > div > .k-in:hover,
.k-animation-container .bim-analytics-building-leaf > .k-treeview-leaf > .k-in:hover,
.k-animation-container .bim-analytics-building-leaf > .k-mid > .k-in:hover {
    background: rgba(255, 255, 255, 0.12);
    color: var(--fg-color, #e2e8f0);
    cursor: pointer;
}

#bim-analytics-model + .k-picker .k-input-button,
#bim-analytics-building + .k-picker .k-input-button,
#bim-analytics-measure + .k-picker .k-input-button {
    min-height: 44px;
}

.bim-analytics-control {
    display: flex;
    flex-direction: column;
    gap: 5px;
    min-width: 180px;
    font-size: 12px;
    font-weight: 600;
}

.bim-analytics-grid-wrap {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
}

.bim-analytics-chart-wrap {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    gap: 10px;
}

.bim-analytics-delta-wrap {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    overflow: hidden;
}

.bim-analytics-empty-state {
    flex: 1 1 auto;
    min-height: 240px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #888;
    font-size: 14px;
    text-align: center;
    padding: 20px;
    background: #222;
}

#bim-analytics-delta {
    flex: 1 1 auto;
    min-height: 240px;
}

#bim-analytics-delta .k-grid-header,
#bim-analytics-delta .k-grid-content,
#bim-analytics-delta .k-treelist-header,
#bim-analytics-delta .k-treelist-content {
    box-sizing: border-box;
}

#bim-analytics-delta .k-grid-header-wrap,
#bim-analytics-delta .k-treelist-header-wrap {
    overflow-y: hidden;
}

#bim-analytics-delta .k-header:not(:first-child),
#bim-analytics-delta td:not(:first-child),
#bim-analytics-delta .k-table-th:not(:first-child),
#bim-analytics-delta .k-table-td:not(:first-child) {
    text-align: right;
}

#bim-analytics-delta .k-header:first-child,
#bim-analytics-delta td:first-child,
#bim-analytics-delta .k-table-th:first-child,
#bim-analytics-delta .k-table-td:first-child,
#bim-analytics-delta .bim-analytics-ifctype-cell {
    text-align: left;
}

#bim-analytics-delta .text-left {
    text-align: left !important;
}

#bim-analytics-delta td.text-left,
#bim-analytics-delta th.text-left,
#bim-analytics-delta .k-table-th.text-left,
#bim-analytics-delta .k-table-td.text-left,
#bim-analytics-delta .bim-analytics-ifctype-cell.text-left {
    text-align: left !important;
}

.bim-analytics-chart-panel {
    position: relative;
    flex: 1 1 auto;
    min-height: 0;
    border: 1px solid rgba(255, 255, 255, 0.13);
    background: #252526;
    overflow: hidden;
}

#bim-analytics-chart {
    width: 100%;
    min-height: 240px;
}

#bim-analytics-chart-pivot {
    position: absolute;
    right: 12px;
    bottom: 12px;
    z-index: 3;
}

.bim-analytics-chart-empty {
    flex: 1 1 auto;
    min-height: 240px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #94a3b8;
    font-size: 14px;
    text-align: center;
    padding: 20px;
    background: #252526;
}

#bim-analytics-grid {
    flex: 1 1 auto;
    min-height: 240px;
}

#bim-analytics-grid .k-grid-content,
#bim-analytics-grid .k-treelist-content {
    min-height: 0;
}

#bim-analytics-grid .k-grid-header,
#bim-analytics-grid .k-grid-footer,
#bim-analytics-grid .k-treelist-header {
    background: #333333;
}

#bim-analytics-grid td.text-right,
#bim-analytics-grid th.text-right,
#bim-analytics-grid .k-table-td.text-right,
#bim-analytics-grid .k-table-th.text-right,
#bim-analytics-grid .bim-analytics-matrix-cell,
#bim-analytics-grid .bim-analytics-matrix-header {
    text-align: right;
}

#bim-analytics-grid .bim-analytics-column-title {
    text-align: center;
}

#bim-analytics-grid .bim-analytics-ifctype-cell,
#bim-analytics-grid .bim-analytics-total-label {
    text-align: left;
}

#bim-database-grid .bim-db-measure-filter-cell {
    display: flex;
    align-items: stretch;
}

#bim-database-grid .bim-db-measure-filter-wrapper {
    display: flex;
    align-items: stretch;
    flex: 1 1 auto;
    min-width: 0;
    width: 100%;
}

#bim-database-grid .bim-db-measure-filter-cell .k-filtercell-operator,
#bim-database-grid .bim-db-measure-filter-cell .k-operator-hidden,
#bim-database-grid .bim-db-measure-filter-cell .k-clear-value,
#bim-database-grid .bim-db-measure-filter-cell .k-input-button.k-clear-button,
#bim-database-grid .bim-db-measure-filter-cell .k-button.k-clear-button {
    display: none !important;
    width: 0 !important;
    min-width: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
    overflow: hidden !important;
}

#bim-database-grid .bim-db-measure-filter-cell > .k-hidden,
#bim-database-grid .bim-db-measure-filter-cell > input[style*="display: none"] {
    flex: 0 0 auto;
    width: 0 !important;
    min-width: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    border: 0 !important;
}

#bim-database-grid .bim-db-measure-filter-host {
    display: block;
    flex: 1 1 auto;
    min-width: 0;
    width: 100%;
}

#bim-database-grid .bim-db-measure-filter-host .k-dropdownlist,
#bim-database-grid .bim-db-measure-filter-host .k-picker {
    width: 100%;
}

#bim-database-grid .bim-db-footer-label,
#bim-database-grid .bim-db-measure-footer {
    font-weight: 700;
}

#bim-database-grid .bim-db-measure-footer {
    width: 100%;
    text-align: right;
}

.bim-analytics-ifctype-stack {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
}

.bim-analytics-ifctype-label {
    font-size: 12px;
    font-weight: 700;
    color: var(--fg-color, #e2e8f0);
    line-height: 1.15;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.bim-analytics-group-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
    min-width: 0;
}

.bim-analytics-group-title {
    font-weight: 700;
    color: var(--fg-color, #e2e8f0);
    white-space: nowrap;
}

.bim-analytics-group-metrics {
    display: inline-flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px 14px;
    min-width: 0;
    color: #94a3b8;
    font-size: 12px;
}

.bim-analytics-group-metric strong {
    color: var(--fg-color, #e2e8f0);
}

.bim-analytics-ifctype-code {
    font-size: 11px;
    color: #94a3b8;
    line-height: 1.1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

#bim-analytics-grid .k-table-td {
    vertical-align: top;
}

#bim-analytics-grid .bim-analytics-total-column {
    position: sticky;
    right: 0;
    z-index: 2;
    background: #333333;
    box-shadow: -1px 0 0 rgba(255, 255, 255, 0.13);
}

#bim-analytics-grid .bim-analytics-total-strong,
#bim-analytics-grid .bim-analytics-total-strong .bim-analytics-metric-value {
    font-weight: bold;
}

#bim-analytics-grid .k-grid-header .bim-analytics-total-column,
#bim-analytics-grid .k-grid-footer .bim-analytics-total-column,
#bim-analytics-grid .k-treelist-header .bim-analytics-total-column {
    z-index: 3;
    background: #333333;
}

#bim-analytics-grid .bim-analytics-total-label {
    background: #333333;
}

#bim-analytics-storeys-grid {
    flex: 1 1 auto;
    min-height: 240px;
}

#bim-analytics-storeys-grid .k-grid-content,
#bim-analytics-storeys-grid .k-treelist-content {
    min-height: 0;
}

#bim-analytics-storeys-grid .k-grid-header,
#bim-analytics-storeys-grid .k-grid-footer,
#bim-analytics-storeys-grid .k-treelist-header {
    background: #333333;
}

#bim-analytics-storeys-grid td.text-right,
#bim-analytics-storeys-grid th.text-right,
#bim-analytics-storeys-grid .k-table-td.text-right,
#bim-analytics-storeys-grid .k-table-th.text-right,
#bim-analytics-storeys-grid .bim-analytics-matrix-cell,
#bim-analytics-storeys-grid .bim-analytics-matrix-header {
    text-align: right;
}

#bim-analytics-storeys-grid .bim-analytics-column-title {
    text-align: center;
}

#bim-analytics-storeys-grid .bim-analytics-ifctype-cell,
#bim-analytics-storeys-grid .bim-analytics-total-label {
    text-align: left;
}

#bim-analytics-storeys-grid .k-table-td {
    vertical-align: top;
}

#bim-analytics-storeys-grid .bim-analytics-total-column {
    position: sticky;
    right: 0;
    z-index: 2;
    background: #333333;
    box-shadow: -1px 0 0 rgba(255, 255, 255, 0.13);
}

#bim-analytics-storeys-grid .bim-analytics-total-strong,
#bim-analytics-storeys-grid .bim-analytics-total-strong .bim-analytics-metric-value {
    font-weight: bold;
}

#bim-analytics-storeys-grid .k-grid-header .bim-analytics-total-column,
#bim-analytics-storeys-grid .k-grid-footer .bim-analytics-total-column,
#bim-analytics-storeys-grid .k-treelist-header .bim-analytics-total-column {
    z-index: 3;
    background: #333333;
}

#bim-analytics-storeys-grid .bim-analytics-total-label {
    background: #333333;
}

.bim-analytics-cell-stack {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 92px;
}

.bim-analytics-cell-single {
    display: flex;
    justify-content: flex-end;
    min-width: 92px;
}

.bim-analytics-cell-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 4px 6px;
    min-width: 110px;
}

.bim-analytics-cell-stack-compact {
    gap: 3px;
}

.bim-analytics-metric-row {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
    line-height: 1.1;
    min-width: 0;
}

.bim-analytics-metric-value {
    display: inline-flex;
    background-repeat: no-repeat;
    background-position: left;
    background-size: 14px;
    padding-left: 14px;
}

.bim-analytics-metric-icon-count {
    background-image: url(../images/count.png);
}

.bim-analytics-metric-icon-cost {
    background-image: url(../images/money.png);
}

.bim-analytics-metric-icon-weight {
    background-image: url(../images/weight.png);
}

.bim-analytics-metric-icon-co2 {
    background-image: url(../images/co2.png);
}

/* Delta coloring – using classes avoids # in Kendo footerTemplate strings */
.bim-analytics-delta-decrease { color: #dc2626; font-weight: 600; }
.bim-analytics-delta-increase { color: #16a34a; font-weight: 600; }


/* Delta tab – control dropdowns (same sizing rules as summary tab controls) */
#bim-analytics-delta-model + .k-input-inner,
#bim-analytics-delta-building-a + .k-input-inner,
#bim-analytics-delta-building-b + .k-input-inner,
#bim-analytics-delta-measure + .k-input-inner,
#bim-analytics-delta-model + .k-picker,
#bim-analytics-delta-building-a + .k-picker,
#bim-analytics-delta-building-b + .k-picker,
#bim-analytics-delta-measure + .k-picker,
#bim-analytics-delta-model + .k-picker .k-input-inner,
#bim-analytics-delta-building-a + .k-picker .k-input-inner,
#bim-analytics-delta-building-b + .k-picker .k-input-inner,
#bim-analytics-delta-measure + .k-picker .k-input-inner {
    min-height: 44px;
}

#bim-analytics-delta-model + .k-picker,
#bim-analytics-delta-building-a + .k-picker,
#bim-analytics-delta-building-b + .k-picker,
#bim-analytics-delta-measure + .k-picker {
    align-items: stretch;
}

#bim-analytics-storeys-building + .k-picker,
#bim-analytics-delta-building-a + .k-picker,
#bim-analytics-delta-building-b + .k-picker {
    min-width: 260px;
}

#bim-analytics-delta-model + .k-picker .k-input-button,
#bim-analytics-delta-building-a + .k-picker .k-input-button,
#bim-analytics-delta-building-b + .k-picker .k-input-button,
#bim-analytics-delta-measure + .k-picker .k-input-button {
    min-height: 44px;
}

.bim-analytics-delta-bar-cell {
    padding-top: 6px;
    padding-bottom: 6px;
}

.bim-analytics-delta-bar {
    position: relative;
    width: 100%;
    height: 18px;
}

.bim-analytics-delta-bar-axis {
    position: absolute;
    left: 50%;
    top: 0;
    bottom: 0;
    width: 1px;
    background: #94a3b8;
    transform: translateX(-0.5px);
}

.bim-analytics-delta-bar-fill {
    position: absolute;
    top: 3px;
    height: 12px;
    border-radius: 3px;
}

.bim-analytics-delta-bar-fill-positive {
    background: #dc2626;
}

.bim-analytics-delta-bar-fill-negative {
    background: #16a34a;
}

#bim-analytics-delta .k-grid-header,
#bim-analytics-delta .k-grid-footer,
#bim-analytics-delta .k-treelist-header {
    background: #333333;
}

#bim-analytics-delta .bim-analytics-total-strong,
#bim-analytics-delta .bim-analytics-total-strong .bim-analytics-metric-value {
    font-weight: bold;
}

#bim-analytics-grid .k-treelist,
#bim-analytics-storeys-grid .k-treelist,
#bim-analytics-delta .k-treelist {
    height: 100% !important;
    background-color: #252526 !important;
}

#bim-analytics-grid .k-table,
#bim-analytics-storeys-grid .k-table,
#bim-analytics-delta .k-table {
    background-color: #252526 !important;
}

#bim-analytics-grid .k-treelist-content,
#bim-analytics-storeys-grid .k-treelist-content,
#bim-analytics-delta .k-treelist-content,
#bim-analytics-grid .k-grid-content,
#bim-analytics-storeys-grid .k-grid-content,
#bim-analytics-delta .k-grid-content {
    background-color: #252526 !important;
}

#bim-analytics-grid .k-treelist-content td,
#bim-analytics-storeys-grid .k-treelist-content td,
#bim-analytics-delta .k-treelist-content td,
#bim-analytics-grid .k-grid-content td,
#bim-analytics-storeys-grid .k-grid-content td,
#bim-analytics-delta .k-grid-content td {
    vertical-align: top;
    background-color: red;
}

#bim-analytics-grid .k-treelist tbody tr,
#bim-analytics-storeys-grid .k-treelist tbody tr,
#bim-analytics-delta .k-treelist tbody tr,
#bim-analytics-grid .k-treelist .k-table-row,
#bim-analytics-storeys-grid .k-treelist .k-table-row,
#bim-analytics-delta .k-treelist .k-table-row,
#bim-analytics-grid .k-treelist tbody tr.k-alt,
#bim-analytics-storeys-grid .k-treelist tbody tr.k-alt,
#bim-analytics-delta .k-treelist tbody tr.k-alt {
    background-color: transparent !important;
}

#bim-analytics-grid .k-treelist td.bim-analytics-cell-type,
#bim-analytics-storeys-grid .k-treelist td.bim-analytics-cell-type,
#bim-analytics-delta .k-treelist td.bim-analytics-cell-type {
    background-color: transparent !important;
}

#bim-analytics-grid .k-treelist tbody tr.bim-analytics-row-category,
#bim-analytics-storeys-grid .k-treelist tbody tr.bim-analytics-row-category,
#bim-analytics-delta .k-treelist tbody tr.bim-analytics-row-category,
#bim-analytics-grid .k-treelist .k-table-row.bim-analytics-row-category,
#bim-analytics-storeys-grid .k-treelist .k-table-row.bim-analytics-row-category,
#bim-analytics-delta .k-treelist .k-table-row.bim-analytics-row-category {
    background-color: rgba(255, 255, 255, 0.06) !important;
}

#bim-analytics-grid .k-treelist td.bim-analytics-cell-category,
#bim-analytics-storeys-grid .k-treelist td.bim-analytics-cell-category,
#bim-analytics-delta .k-treelist td.bim-analytics-cell-category {
    background-color: rgba(255, 255, 255, 0.06) !important;
}

#bim-analytics-grid .k-treelist tbody tr.bim-analytics-row-total,
#bim-analytics-storeys-grid .k-treelist tbody tr.bim-analytics-row-total,
#bim-analytics-delta .k-treelist tbody tr.bim-analytics-row-total,
#bim-analytics-grid .k-treelist .k-table-row.bim-analytics-row-total,
#bim-analytics-storeys-grid .k-treelist .k-table-row.bim-analytics-row-total,
#bim-analytics-delta .k-treelist .k-table-row.bim-analytics-row-total {
    background-color: rgba(255, 255, 255, 0.12) !important;
}

#bim-analytics-grid .k-treelist td.bim-analytics-cell-total,
#bim-analytics-storeys-grid .k-treelist td.bim-analytics-cell-total,
#bim-analytics-delta .k-treelist td.bim-analytics-cell-total {
    background-color: rgba(255, 255, 255, 0.12) !important;
}

#bim-analytics-grid .k-treelist tbody tr.bim-analytics-row-category > td,
#bim-analytics-storeys-grid .k-treelist tbody tr.bim-analytics-row-category > td,
#bim-analytics-delta .k-treelist tbody tr.bim-analytics-row-category > td,
#bim-analytics-grid .k-treelist .k-table-row.bim-analytics-row-category > td,
#bim-analytics-storeys-grid .k-treelist .k-table-row.bim-analytics-row-category > td,
#bim-analytics-delta .k-treelist .k-table-row.bim-analytics-row-category > td {
    background-color: rgba(255, 255, 255, 0.06) !important;
}

#bim-analytics-grid .k-treelist tbody tr.bim-analytics-row-total > td,
#bim-analytics-storeys-grid .k-treelist tbody tr.bim-analytics-row-total > td,
#bim-analytics-delta .k-treelist tbody tr.bim-analytics-row-total > td,
#bim-analytics-grid .k-treelist .k-table-row.bim-analytics-row-total > td,
#bim-analytics-storeys-grid .k-treelist .k-table-row.bim-analytics-row-total > td,
#bim-analytics-delta .k-treelist .k-table-row.bim-analytics-row-total > td {
    background-color: rgba(255, 255, 255, 0.12) !important;
}

.bim-analytics-tree-label {
    font-weight: 700;
    color: var(--fg-color, #e2e8f0);
}

.bim-analytics-tree-label-total {
    letter-spacing: 0.02em;
}

.bim-analytics-tree-label-category {
    color: #cbd5e1;
}

#bim-analytics-grid .k-selected,
#bim-analytics-storeys-grid .k-selected,
#bim-analytics-delta .k-selected,
#bim-analytics-grid td[aria-selected="true"],
#bim-analytics-storeys-grid td[aria-selected="true"],
#bim-analytics-delta td[aria-selected="true"] {
    box-shadow: inset 0 0 0 2px #f59e0b;
    position: relative;
    z-index: 1;
}

.bim-analytics-element-detail-wrap {
    background: rgba(255, 255, 255, 0.04);
    padding: 12px;
    box-sizing: border-box;
    overflow: hidden;
}

.bim-analytics-element-tabs .k-tabstrip-content,
.bim-analytics-element-tabs .k-content {
    height: 340px;
    min-height: 340px;
    max-height: 340px;
    overflow: auto;
}

.bim-analytics-element-detail {
    padding: 8px 12px;
    background: #333333;
}

.bim-analytics-element-detail-row {
    display: grid;
    grid-template-columns: 160px minmax(0, 1fr);
    gap: 8px 12px;
    padding: 6px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}

.bim-analytics-element-detail-row:last-child {
    border-bottom: none;
}

.bim-analytics-element-detail-label {
    font-weight: 700;
}

.bim-analytics-element-detail-value {
    color: var(--fg-color, #e2e8f0);
    min-width: 0;
    word-break: break-word;
}

.bim-analytics-detail-tree {
    padding: 10px 12px;
    color: #fff
}

.bim-analytics-detail-tree .k-treeview {
    background: #252526;
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 6px;
    padding: 8px;
}

.bim-analytics-rawjson-host {
    padding: 10px 12px;
}

.bim-analytics-element-json {
    margin: 0;
    padding: 10px 12px;
    background: #252526;
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 6px;
    font-size: 11px;
    line-height: 1.45;
    overflow: auto;
    max-height: 300px;
}

.bim-analytics-tree-label-revitcat {
    display: inline-block;
    margin-left: 6px;
    font-size: 11px;
    font-weight: 400;
    color: #94a3b8;
}

#actions-area {
    padding: 12px;
    border-top: 1px solid rgba(0, 0, 0, 0.08);
}

#actions-area .actions-container {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

#actions-area .action-btn-full {
    width: 100%;
}

#actions-area .actions-container.actions-row-two {
    flex-direction: row;
}

#actions-area .actions-container.actions-row-two .action-btn-full {
    flex: 1 1 0;
    width: auto;
}

#left-pane-bom-view-label {
    color: #fff;
    font-size: 12px;
    font-weight: 500;
    white-space: nowrap;
    opacity: 0.9;
}

#pbs-unresolved-toggle {
    padding: 6px 10px;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
}
#pbs-unresolved-toggle label {
    display: flex;
    align-items: center;
    gap: 6px;
    color: #fff;
    font-size: 12px;
    opacity: 0.9;
    cursor: pointer;
    user-select: none;
}
#pbs-unresolved-toggle input[type="checkbox"] {
    cursor: pointer;
}



/* Toolbar - floating */
#viewer-toolbar {
    position: static;
    display: flex;
    gap: 10px;
    pointer-events: auto;
    z-index: 0;
/*    background-color: rgba(0, 0, 0, 0.38); */
    padding: 6px 8px;
    border-radius: 8px;
}

.toolbar-group {
    pointer-events: auto;
    display: flex;
    align-items: center;
    gap: 10px;
}

.btn {
    padding: 13px;
    cursor: pointer;
    border-radius: 4px;
    transition: all 0.2s;
    background-size: 20px;
    background-position: center;
    background-repeat: no-repeat;
    background-color: rgba(255,255,255,0.2);
    border: 1px solid rgba(255, 255, 255, 0.25);
}

.btn.active {
    background-color: rgba(255,255,255,0.2);
    border: 1px solid #ffc05c;
}

#btn-context-select {
    background-image: url("../images/select_w.png");
}
#btn-context-select.active {
    background-image: url("../images/select_w_active.png");
}
#btn-part-transform {
    background-image: url("../images/control.png");
}
#btn-part-transform.active {
    background-image: url("../images/control_active.png");
}

#btn-context-select.inactive,
#btn-context-select:disabled,
#btn-part-transform.inactive,
#btn-part-transform:disabled {
    opacity: 0.35;
    cursor: default;
    pointer-events: none;
}
#btn-bim-panorama {
    background-image: url("../images/pano.png");
}
#btn-bim-panorama.active {
    background-image: url("../images/pano_active.png");
}
#btn-links {
    background-image: url("../images/link_w.png");
}
#btn-links.active {
    background-image: url("../images/link_w_active.png");
}
#btn-focus {
    background-image: url("../images/focus_w.png");
}
#btn-focus.active {
    background-image: url("../images/focus_w.png");
}
#btn-deselect {
    background-image: url(../images/deselect.png);
}
#btn-hide-part {
    background-image: url("../images/hide_w.png");
}
#btn-hide-part.active {
    background-image: url("../images/hide_w.png");
}

.preferences-group {
    margin-top: 4px;
    padding-top: 1px;
    border-top: 1px solid rgba(255, 255, 255, 0.12);
}

.preferences-group-title {
    margin-bottom: 8px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    opacity: 0.8;
}

.preferences-row {
    margin-top: 0;
}

.preferences-inline {
}

.preferences-fixed-label {
    flex: 0 0 90px;
    width: 120px;
    display: inline-block;
}

.preferences-inline-toggle {
display: inline-flex;
    align-items: baseline;
    gap: 6px;
    /* margin-left: auto; */
    white-space: nowrap;
}

.preferences-select {
    min-width: 128px;
    margin-left: 0;
    display: inline-block
}

.preferences-note,
.setup-note {
    margin-top: 10px;
    font-size: 12px;
    line-height: 1.4;
    color: rgba(45, 45, 45, 0.78);
}

.viewer-capability-disabled {
    opacity: 0.52;
    pointer-events: none;
}

#more-menu {
    display: none;
}

#more-menu.k-context-menu {
    min-width: 210px;
    background: #252526;
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 6px;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.6);
    overflow: hidden;
    z-index: 220;
}

/*
#more-menu.k-context-menu .k-item {
    border: 0;
    background: transparent;
}
*/

#more-menu.k-context-menu .k-link {
    padding: 9px 12px;
    font-size: 13px;
    color: var(--fg-color, #ccc);
}

#more-menu.k-context-menu .k-link:hover {
    background-color: rgba(255, 255, 255, 0.07);
}

#btn-more {
    background-image: url("../images/more_w.png");
}
#btn-more.active {
    background-image: url("../images/more_w_active.png");
}

.sections-window-content {
    padding: 12px;
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.sections-row {
    display: grid;
    grid-template-columns: 20px 1fr auto auto;
    align-items: center;
    gap: 8px;
}

.sections-slider-host,
.sections-row .mini-slider {
    width: 100%;
}

.sections-row .mini-slider-horizontal {
    height: 22px;
}

.sections-row-camera .sections-slider-host {
    grid-column: 2;
}

.sections-placeholder {
    visibility: hidden;
    pointer-events: none;
}

.sections-placeholder-toggle {
    display: inline-block;
    width: 40px;
    height: 18px;
}

.sections-axis {
    font-weight: 700;
    text-align: center;
}

.sections-axis-z {
    color: #fff;
    background-color: rgb(0, 128, 187);
    border-radius: 50%;
    width: 20px;
    height: 20px;
}
.sections-axis-y {
    color: #fff;
    background-color: rgb(0, 187, 28);
    border-radius: 50%;
    width: 20px;
    height: 20px;
}
.sections-axis-x {    color: #fff;
    background-color: #b00;
    border-radius: 50%;
    width: 20px;
    height: 20px;

}

label.sections-axis.sections-axis-camera {
    background-color: #fff;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background-image: url(../images/view.png);
    background-size: 16px;
    background-position: center;
    border: 1px solid #aaa;
    background-repeat: no-repeat;
}

.sections-invert-label {
    font-size: 12px;
}

.sections-footer {
    display: flex;
    justify-content: flex-end;
    margin-top: 2px;
}

.sections-step-field {
    min-width: 120px;
}

input#sections-step {
    width: 80px;
    text-align: right;
}

.focus-mode-item {
    display: inline-block;
    padding: 12px 6px;
}
.focus-target-item {
    display: inline-block;
    padding: 12px 6px 30px;
}
.focus-actions {
    float: right;
}



#btn-ghost {
    background-image: url("../images/ghost_w.png");
}
#btn-ghost.active {
    background-image: url("../images/ghost_w_active.png");
}

#btn-edges {
    background-image: url("../images/edge_w.png");
}
#btn-edges.active {
    background-image: url("../images/edge_w_active.png");
}

#btn-camera {
    background-image: url("../images/ortho_w.png");
}
#btn-camera.active {
    background-image: url("../images/ortho_w_active.png");
}

#btn-reset-cam {
    background-image: url("../images/fit_w.png");
}

label {
   font-size: 12px;
    font-weight: 600;
}

input[type=range] {
    vertical-align: middle;
    cursor: pointer;
}

#tooltip {
    display: none !important; /* No longer used - info shown in toolbar */
}

table {
    width: 100%;
    border-collapse: collapse;
}

td {
    padding: 6px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

/* Properties Panel - Organized Sections */
.prop-section {
    margin-bottom: 12px;
    border-radius: 4px;
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, 0.2);
    background: rgba(255, 255, 255, 0.03);
    font-style: normal;
    color: rgba(255,255,255,0.7);
}

.prop-section-header {
    background: rgba(255, 255, 255, 0.15);
    padding: 0 8px 4px;
    font-weight: normal;
    color: var(--fg-color);
    font-style: normal;
}

.prop-row {
    padding: 8px;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}

.prop-row:last-child {
    border-bottom: none;
}

.generative-sketch-toggle {
    margin: 12px 0 0;
}

.prop-sub {
    font-size: 12px;
    color: rgba(255, 255, 255, 0.9);
    text-align: right;
    opacity: 0.6;
    padding: 4px 10px 4px;
}

.prop-label {
font-size: 13px;
    color: var(--fg-color);
    font-weight: normal;
    flex-shrink: 0;
    margin-right: 10px;
}

.prop-value {
    font-size: 13px;
    text-align: right;
    opacity: 0.7;
    word-break: break-word;
    color: var(--fg-color);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-top: 3px;
}

input.prop-value {
    background-color: rgba(0,0,0, 0.2);
    border: 1px solid rgba(0, 0, 0, 0.7);
    width: 100%;
}

.prop-value-highlight {
    font-size: 13px;
    color: rgba(0, 0, 0, 0.95);
    text-align: right;
}

.prop-value-mono {
    color: rgba(0, 0, 0, 0.85);
    text-align: right;
    line-height: 1.5;
}

.prop-row-feature {
    padding: 6px 10px;
    color: rgba(0, 0, 0, 0.8);
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    cursor: pointer;
    user-select: none;
}

.prop-row-feature:hover {
    background: rgba(0, 0, 0, 0.02);
}

.prop-row-feature:last-child {
    border-bottom: none;
}

.relation-section-header {
    background: #efefef;
    border-bottom: 1px solid #dadada;
    padding: 4px 8px;
    font-weight: bold;
    color: #000;
    font-style: normal;
}

.relation-row {
    padding: 0px 10px;
    justify-content: space-between;
    align-items: flex-start;
}


.relation-label {
    font-size: 13px;
    color: rgba(0, 0, 0, 0.6);
    font-weight: bold;
    flex-shrink: 0;
}

.relation-value {
    font-size: 13px;
    color: rgba(0, 0, 0, 0.85);
    word-break: break-word;
}


.feature-name {
    display: flex;
    align-items: center;
    gap: 5px;
}

.feature-expand {
    display: inline-block;
    width: 10px;
    color: rgba(0, 0, 0, 0.5);
    transition: transform 0.2s;
    font-size: 9px;
}

.feature-params {
    margin-top: 5px;
    padding: 5px 8px;
    background: rgba(0, 0, 0, 0.03);
    border-radius: 3px;
    color: rgba(0, 0, 0, 0.6);
    line-height: 1.4;
    margin-left: 15px;
}

.prop-feature-type {
    color: rgba(0, 0, 0, 0.5);
}



/* Gizmo Toolbar - 3D Box Selection Mode */
#gizmo-toolbar {
    position: absolute;
    top: 60px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    background: rgba(0, 0, 0, 0.6);
    border-radius: 8px;
    border: 1px solid rgba(0, 0, 0, 0.9);
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
    z-index: 200;
    pointer-events: auto;
}

#part-transform-toolbar {
    position: absolute;
    top: 60px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    background: rgba(0, 0, 0, 0.6);
    border-radius: 8px;
    border: 1px solid rgba(0, 0, 0, 0.9);
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.2);
    z-index: 200;
    pointer-events: auto;
}

.viewport-gizmo-wrap {
    position: absolute;
    left: 50%;
    bottom: 50px;
    transform: translateX(-50%);
    gap: 8px;
    z-index: 210;
    pointer-events: none;
}

#bottom-status-bar {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 36px;
    background: rgba(0, 0, 0, 0.5);
    border-top: 1px solid rgba(0, 0, 0, 0.1);
    display: flex;
    align-items: center;
    box-sizing: border-box;
    padding: 0 8px;
    z-index: 210;
    pointer-events: auto;
}

#fps-counter {
    margin-left: auto;
    font-family: Consolas, Monaco, monospace;
    font-size: 12px;
    color: #0b0;
    white-space: nowrap;
    pointer-events: none;
    user-select: none;
}

#walk-crosshair {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 123px;
    height: 24px;
    transform: translate(-50%, -50%);
    pointer-events: none;
    z-index: 215;
}

#walk-crosshair[hidden] {
    display: none !important;
}

#walk-crosshair .walk-crosshair-h,
#walk-crosshair .walk-crosshair-v {
    position: absolute;
    display: block;
    background: rgba(255, 255, 255, 0.75);
    box-shadow: 2px 2px 2px rgba(0, 0, 0, 0.6);
}

#walk-crosshair .walk-crosshair-h {
    left: 50%;
    top: 50%;
    width: 24px;
    height: 2px;
    transform: translate(-50%, -50%);
}

#walk-crosshair .walk-crosshair-v {
    left: 50%;
    top: 50%;
    width: 2px;
    height: 24px;
    transform: translate(-50%, -50%);
}

#viewer-hud-toast {
    position: absolute;
    bottom: 60px;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(0, 0, 0, 0.55);
    color: #fff;
    font-size: 13px;
    font-family: inherit;
    padding: 6px 14px;
    border-radius: 6px;
    pointer-events: none;
    white-space: nowrap;
    z-index: 220;
    opacity: 0;
    transition: opacity 0.15s ease;
}

#viewer-hud-toast.visible {
    opacity: 1;
}

.viewport-gizmo-anchor {
    position: relative;
    display: inline-block;
    width: 94px;
    height: 94px;
    pointer-events: auto;
}

.viewport-gizmo-controls {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    gap: 4px;
    pointer-events: auto;
}

.viewport-gizmo-btn {
    width: 28px;
    height: 28px;
    border: 0 none rgba(0, 0, 0, 0);
    border-radius: 50%;
    background-color: rgba(0,0,0,0);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 18px 18px;
}
.viewport-gizmo-btn:hover {
    background-color: rgba(255, 255, 255, 0.15);
}

#btn-viewport-gizmo {
    cursor: pointer;
    background-image: url('../images/gizmo_w.png');
}
#btn-viewport-gizmo[data-gizmo-state="none"] {
    opacity: 0.4;
}

#btn-viewport-pan {
    cursor: move;
}
#btn-viewport-zoom {
    cursor: n-resize;
}
#btn-viewport-camera {
    cursor: pointer;
}
#btn-viewport-grid {
    cursor: pointer;
}
#btn-viewport-walk {
    cursor: pointer;
    background-image: url('../images/walk.png');
}
#btn-viewport-walk[aria-pressed="true"] {
    background-image: url('../images/orbit.png');
}

#btn-status-help {
    cursor: pointer;
    background-image: url('../images/help_w.png');
    flex-shrink: 0;
    position: relative;
}

.help-dropdown {
    display: none;
    position: fixed;
    background: #252526;
    border: 1px solid rgba(255,255,255,0.13);
    border-radius: 5px;
    padding: 4px 0;
    z-index: 1010;
    min-width: 160px;
    box-shadow: 0 6px 18px rgba(0,0,0,0.6);
    flex-direction: column;
}

.help-dropdown.open {
    display: flex;
}

.help-dropdown-item {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    background: none;
    border: none;
    padding: 7px 14px;
    font-size: 13px;
    color: #ccc;
    cursor: pointer;
    text-align: left;
    white-space: nowrap;
}

.help-dropdown-item:hover {
    background: rgba(255,255,255,0.07);
}

#hotkey-dialog-content,
#help-dialog-content {
    max-height: 70vh;
    overflow-y: auto;
    padding: 0;
}

#hotkey-dialog-content table,
#help-dialog-content table {
    width: 100%;
    border-collapse: collapse;
}

#hotkey-dialog-content th,
#help-dialog-content th {
    font-size: 12px;
    color: #fff;
    font-weight: 600;
    text-align: left;
    padding: 6px 10px;
    border-bottom: 1px solid rgba(255,255,255,0.5);
}

#hotkey-dialog-content td,
#help-dialog-content td {
    font-size: 13px;
    padding: 0 10px;
    border-bottom: 1px solid rgba(255,255,255,0.05);
}

#hotkey-dialog-content tr:hover td,
#help-dialog-content tr:hover td {
    background: rgba(255,255,255,0.04);
}

#hotkey-dialog-content .hotkey-key,
#help-dialog-content .hotkey-key {
    font-family: Consolas, Monaco, monospace;
    font-size: 12px;
    color: #fff;
    font-weight: 600;
    white-space: nowrap;
    padding-bottom: 0;
    padding-top: 0;
}

#hotkey-dialog-content .hotkey-action,
#help-dialog-content .hotkey-action {
    color: #fff;
}

.help-swatch {
    display: inline-block;
    width: 16px;
    height: 16px;
    border-radius: 3px;
}

.help-color-legend {
    margin-top: 12px;
}

.help-placeholder {
    padding: 20px;
    text-align: center;
    color: rgba(0,0,0,0.4);
    font-size: 13px;
}

.help-nav-section {
    margin-bottom: 14px;
}

.help-nav-title {
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 6px;
    background-color: rgba(255, 255, 255, 0.15);
    padding: 3px 0 3px 8px;
    line-height: 24px;
}

.help-nav-table {
    width: 100%;
    border-collapse: collapse;
}

.help-nav-table td {
    font-size: 12px;
    padding: 3px 0;
    vertical-align: middle;
}

.help-nav-key {
    width: 160px;
/*    font-family: Consolas, Monaco, monospace; */
    font-weight: 600;
    white-space: nowrap;
}

.gizmo-toolbar-group {
    display: flex;
    align-items: center;
    gap: 4px;
}

.gizmo-group-label {
    font-size: 10px;
    font-weight: 600;
    color: rgba(0, 0, 0, 0.5);
    text-transform: uppercase;
    margin-right: 4px;
}

.gizmo-toolbar-divider {
    width: 1px;
    height: 32px;
    background: rgba(0, 0, 0, 0.15);
    margin: 0 8px;
}

/* Gizmo mode buttons - placeholder icons (replace with your images) */
#btn-gizmo-translate {
    background-image: url("../images/translate_w.png");
}

#btn-gizmo-translate.active {
    background-image: url("../images/translate_active.png");
}

#btn-gizmo-rotate {
    background-image: url("../images/rotate_w.png");
}

#btn-gizmo-rotate.active {
    background-image: url("../images/rotate_active.png");
}

#btn-gizmo-scale {
    background-image: url("../images/scale_w.png");
}

#btn-gizmo-scale.active {
    background-image: url("../images/scale_active.png");
}

#btn-gizmo-sphere-shape {
    background-image: url("../images/circle_w.png");
}

#btn-gizmo-sphere-shape.active {
    background-image: url("../images/circle_active.png");
}

#btn-gizmo-ellipsoid-shape {
    background-image: url("../images/ellipse_w.png");
}

#btn-gizmo-ellipsoid-shape.active {
    background-image: url("../images/ellipse_active.png");
}

.gizmo-shape-btn {
    min-width: 40px;
    padding: 8px 10px;
    background-image: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.gizmo-shape-btn span {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.08em;
    color: rgba(255, 255, 255, 0.92);
    pointer-events: none;
}

.btn-gizmo-action:hover {
    background-color: rgba(255, 255, 255);
}

#btn-gizmo-replace {
    background-image: url("../images/select_replace.png");
}

#btn-gizmo-add {
    background-image: url("../images/select_add.png");
}

#btn-gizmo-cancel {
    background-image: url("../images/cancel.png");
}

.part-transform-setup-section {
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 8px;
    padding: 8px 8px;
    margin: 8px 0;
    background-color: rgba(0, 0, 0, 0.35);
}

#btn-part-transform-setup {
    padding: 11px 12px 8px 32px;
    background-image: url(../images/settings_w.png);
    background-size: 18px 18px;
    background-position: 8px center;
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    height: 34px;
}

.part-transform-setup-label {
    color: rgba(255, 255, 255, 0.92);
    font-size: 12px;
    font-weight: normal;
    line-height: 1;
    pointer-events: none;
}

.part-transform-setup-dialog {
    position: static;
    width: auto;
    padding: 14px;
    background: rgba(0, 0, 0, 0.5);
}

.part-transform-setup-heading {
    margin-bottom: 8px;
    color: rgba(255, 255, 255, 0.95);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}

.part-transform-axis-field {
    margin-bottom: 0;
}

.part-transform-axis-options {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
}

.part-transform-axis-option {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: rgba(255, 255, 255, 0.9);
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}

.part-transform-axis-option .k-radio {
    margin: 0;
    width: 16px;
    height: 16px;
    flex: 0 0 16px;
}

.part-transform-axis-option .k-radio-label {
    color: rgba(255, 255, 255, 0.9);
    font-size: 12px;
    font-weight: 600;
}

.fem-bc-type-options {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    flex-wrap: wrap;
}

.fem-bc-type-option {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    color: rgba(255, 255, 255, 0.92);
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}

.fem-bc-type-option .k-radio {
    margin: 0;
    width: 12px;
    height: 12px;
    flex: 0 0 12px;
    border-left-width: 2px;
}

.fem-bc-type-option .k-radio-label {
    color: inherit;
    font-size: inherit;
    font-weight: inherit;
}

.fem-bc-param-row {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    align-items: flex-start;
    gap: 6px;
}

.fem-bc-param-field {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
}

.fem-bc-param-field span {
    color: #888;
    font-size: 10px;
    line-height: 1.2;
    white-space: nowrap;
}

.part-transform-steps-field {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 10px;
}

.part-transform-steps-field span {
    color: rgba(255, 255, 255, 0.82);
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}

.part-transform-steps-field input[type="number"] {
    width: 100%;
    box-sizing: border-box;
    padding: 7px 9px;
    border-radius: 6px;
    border: 1px solid rgba(255, 255, 255, 0.3);
    background: rgba(0, 0, 0, 0.6);
    color: #fff;
    font-size: 12px;
}

.part-transform-steps-field input[type="number"]:focus {
    outline: none;
    border-color: rgba(255, 255, 255, 0.9);
}

.part-transform-steps-field input[type="number"]::-webkit-outer-spin-button,
.part-transform-steps-field input[type="number"]::-webkit-inner-spin-button,
.part-transform-absolute-field input[type="number"]::-webkit-outer-spin-button,
.part-transform-absolute-field input[type="number"]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

.part-transform-steps-field input[type="number"],
.part-transform-absolute-field input[type="number"] {
    appearance: textfield;
    -moz-appearance: textfield;
}

.part-transform-increments-row {
    display: flex;
    gap: 12px;
}

.part-transform-inline-field {
    flex: 1 1 0;
    margin-bottom: 0;
}

.part-transform-absolute-block + .part-transform-absolute-block {
    margin-top: 12px;
}

.part-transform-absolute-title {
    margin-bottom: 8px;
    color: rgba(255, 255, 255, 0.85);
    font-size: 12px;
    font-weight: 600;
}

.part-transform-absolute-row {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
    gap: 10px 12px;
    align-items: center;
}

.part-transform-absolute-field {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    align-items: center;
    gap: 8px;
}

.part-transform-absolute-field span {
    color: rgba(255, 255, 255, 0.82);
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}

.part-transform-absolute-field input {
    width: 100%;
    box-sizing: border-box;
    padding: 7px 9px;
    border-radius: 6px;
    border: 1px solid rgba(255, 255, 255, 0.3);
    background: rgba(0, 0, 0, 0.6);
    color: #fff;
    font-size: 12px;
}

.part-transform-absolute-field input:focus {
    outline: none;
    border-color: rgba(255, 255, 255, 0.9);
}

.part-transform-absolute-row > .k-button {
    height: 25px;
    align-self: center;
    font-weight: bold;
    border-radius: 4px;
    margin-bottom: 3px;
}

#btn-part-transform-ok {
    background-image: url("../images/ok.png");
}

#btn-part-transform-ok.is-busy {
    position: relative;
    opacity: 0.82;
    cursor: wait;
}

#btn-part-transform-ok.is-busy::after {
    content: "";
    position: absolute;
    width: 12px;
    height: 12px;
    top: 50%;
    left: 50%;
    margin-left: -6px;
    margin-top: -6px;
    border-radius: 50%;
    border: 2px solid rgba(255, 255, 255, 0.35);
    border-top-color: rgba(255, 255, 255, 0.95);
    animation: part-transform-save-spin 0.75s linear infinite;
}

#btn-part-transform-cancel {
    background-image: url("../images/cancel.png");
}

@keyframes part-transform-save-spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

/* Selection Mode Dropdown */
.mode-dropdown {
    position: relative;
}

.mode-dropdown-selected {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 6px 8px;
    background: rgba(0, 0, 0, 0.05);
    border-radius: 4px;
    cursor: pointer;
    transition: all 0.2s;
}

.mode-dropdown-selected:hover {
    background: rgba(0, 0, 0, 0.1);
    border-color: rgba(0, 0, 0, 0.25);
}

.mode-dropdown-arrow {
    font-size: 8px;
    margin-left: 2px;
    color: #fff;
    transition: transform 0.2s;
}

.mode-dropdown.open .mode-dropdown-arrow {
    transform: rotate(180deg);
    color: #000;
}

.mode-dropdown-menu {
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    min-width: 130px;
    margin-top: 4px;
    background: rgba(255, 255, 255, 0.98);
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 4px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    display: none;
    overflow: hidden;
    z-index: 1000;
}

.mode-dropdown.open .mode-dropdown-menu {
    display: block;
}

.mode-dropdown-item {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    cursor: pointer;
    font-size: 12px;
    color: rgba(0, 0, 0, 0.8);
    transition: background 0.15s;
}

.mode-dropdown-item:hover {
    background: rgba(0, 0, 0, 0.08);
}

.mode-dropdown-item.active {
    color: rgba(120, 120, 120, 1);
}

.mode-icon {
    width: 20px;
    height: 20px;
    object-fit: contain;
}


/* === Quality Section Styles === */
.quality-section {
    border-left: 3px solid #4caf50;
}

.quality-section.quality-red {
    border-left-color: #f44336;
    background: rgba(244, 67, 54, 0.05);
}

.quality-section.quality-yellow {
    border-left-color: #ff9800;
    background: rgba(255, 152, 0, 0.05);
}

.quality-section.quality-green {
    border-left-color: #4caf50;
    background: rgba(76, 175, 80, 0.05);
}

.quality-badge {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border-radius: 12px;
    font-weight: 600;
    font-size: 11px;
}

.quality-badge.quality-red {
    background: rgba(244, 67, 54, 0.15);
    color: #c62828!important;
}

.quality-badge.quality-yellow {
    background: rgba(255, 152, 0, 0.15);
    color: #ef6c00!important;
}

.quality-badge.quality-green {
    background: rgba(76, 175, 80, 0.15);
    color: #2e7d32!important;
}

.quality-counts {
    display: flex;
    gap: 8px;
    font-size: 13px;
}

.count-red { color: #c62828; }
.count-yellow { color: #ef6c00; }
.count-green { color: #2e7d32; }

.quality-blocked {
    color: #c62828;
    font-weight: 600;
}

.param-item {
    padding: 8px 10px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.05);
    background: rgba(0, 0, 0, 0.02);
}

.param-item:hover {
    background: rgba(0, 0, 0, 0.04);
}

.param-item.quality-red {
    border-left: 3px solid #f44336;
}

.param-item.quality-yellow {
    border-left: 3px solid #ff9800;
}

.param-item.quality-green {
    border-left: 3px solid #4caf50;
}

.param-header {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 2px;
}

.param-quality {
    font-size: 10px;
}

.param-name {
    font-weight: 600;
    color: rgba(0, 0, 0, 0.85);
    font-size: 12px;
}

.param-formula {
    font-family: 'Courier New', monospace;
    font-size: 11px;
    color: rgba(0, 0, 0, 0.65);
    background: rgba(0, 0, 0, 0.03);
    padding: 2px 6px;
    border-radius: 3px;
    margin: 4px 0;
    word-break: break-all;
}

.param-meta {
    font-size: 10px;
    color: rgba(0, 0, 0, 0.5);
}

/* === PMI Section Styles === */
.pmi-list {
    padding: 5px;
}

.pmi-item {
    padding: 10px 12px;
    margin-bottom: 6px;
    border-radius: 6px;
    border-left: 3px solid #ccc;
    background: rgba(0, 0, 0, 0.02);
    transition: all 0.15s ease;
}

.pmi-item:hover {
    background: rgba(0, 0, 0, 0.05);
    box-shadow: 0 1px 3px rgba(0,0,0,0.1);
}

/* Type-specific colors */
.pmi-item.pmi-type-dimension { border-left-color: #2196F3; }
.pmi-item.pmi-type-geometricaltolerance { border-left-color: #9C27B0; }
.pmi-item.pmi-type-datum { border-left-color: #FF9800; }
.pmi-item.pmi-type-datumtarget { border-left-color: #FF5722; }
.pmi-item.pmi-type-roughness { border-left-color: #4CAF50; }
.pmi-item.pmi-type-text, .pmi-item.pmi-type-noa { border-left-color: #607D8B; }
.pmi-item.pmi-type-flag { border-left-color: #F44336; }
.pmi-item.pmi-type-weld { border-left-color: #FFC107; }

.pmi-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 4px;
}

.pmi-icon {
    font-size: 14px;
    width: 20px;
    text-align: center;
}

.pmi-name {
    font-weight: 600;
    color: rgba(0, 0, 0, 0.85);
    flex: 1;
}

.pmi-type-badge {
    font-size: 9px;
    padding: 2px 6px;
    border-radius: 10px;
    background: rgba(0, 0, 0, 0.08);
    color: rgba(0, 0, 0, 0.6);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.pmi-value-row {
    display: block;
    margin-top: 4px;
}

.pmi-kv-row {
    display: grid;
    grid-template-columns: 90px 1fr;
    gap: 8px;
    margin: 2px 0;
}

.pmi-kv-label {
    color: rgba(0, 0, 0, 0.55);
    font-size: 11px;
}

.pmi-main-value {
    font-family: 'Courier New', monospace;
    font-size: 13px;
    font-weight: 600;
    color: #1976D2;
}

.pmi-tolerance {
    font-family: 'Courier New', monospace;
    font-size: 11px;
    color: #666;
    background: rgba(0,0,0,0.05);
    padding: 2px 6px;
    border-radius: 3px;
}

.pmi-ttrs {
    font-size: 11px;
    color: #7B1FA2;
    font-weight: 500;
}

.pmi-datum-label {
    font-size: 14px;
    font-weight: 700;
    color: #E65100;
    background: rgba(255, 152, 0, 0.15);
    padding: 2px 10px;
    border-radius: 4px;
}

.pmi-roughness {
    font-family: 'Courier New', monospace;
    font-size: 11px;
    color: #2E7D32;
}

.pmi-nonsemantic {
    font-size: 9px;
    color: #F57C00;
    background: rgba(255, 152, 0, 0.1);
    padding: 1px 4px;
    border-radius: 3px;
}

.pmi-select-row {
    cursor: pointer;
    color: #fff;
    font-weight: normal;
}

.pmi-select-row:hover {
    background-color: rgba(255, 255, 255, 0.08);
}

.pmi-select-row.active {
    box-shadow: inset 0 0 0 1px var(--bg-select);
    background-color: rgba(255, 255, 255, 0.15);
}

.pmi-section-header-row {
    display: flex;
    align-items: center;
    gap: 6px;
    padding-left: 6px;
}

.pmi-header-main {
    flex: 1;
    text-align: left;
    background: transparent;
    border: 0;
    color: inherit;
    font: inherit;
    cursor: pointer;
    padding: 0;
}

.pmi-header-toggle {
    width: 22px;
    height: 22px;
    border: 0;
    border-radius: 4px;
    background: rgba(0, 0, 0, 0.12);
    color: rgba(255, 255, 255, 0.92);
    font-size: 11px;
    line-height: 22px;
    text-align: center;
    cursor: pointer;
    transform: rotate(0deg);
    transition: transform 0.12s ease, background-color 0.12s ease;
}

.pmi-select-row.expanded .pmi-header-toggle {
    transform: rotate(90deg);
}

.pmi-section-body {
    display: none;
    padding-top: 8px;
}

.pmi-select-row.expanded .pmi-section-body {
    display: block;
}


/* === Context Link Header with Quality === */
.context-link-header {
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 3px;
}

.context-link-quality {
    font-size: 10px;
}

.context-link-item.quality-red {
    border-left: 3px solid #f44336;
}

.context-link-item.quality-yellow {
    border-left: 3px solid #ff9800;
}

.context-link-item.quality-green {
    border-left: 3px solid #4caf50;
}

/* --- PUBLICATIONS TAB --- */
.publications-list {
    padding: 5px;
}

.publication-item {
    padding: 8px 12px;
    margin-bottom: 6px;
    background-color: rgba(255, 255, 255, 0.1);
    border-radius: 8px;
    color: rgba(255,255,255,0.8);
}

.publication-header {
    display: flex;
    align-items: center;
    gap: 8px;
}

.publication-icon {
    font-size: 14px;
}

.publication-name {
    font-weight: 600;
    font-size: 13px;
}

.publication-details {
    margin-top: 4px;
    padding-left: 0;
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}


/* --- CHECKOUT WINDOW --- */
#checkout-window {
    font-family: 'Segoe UI', Arial, sans-serif;
}

#checkout-window h3 {
    color: #333;
    margin-bottom: 10px;
}

#checkout-window p {
    line-height: 1.5;
}

.checkout-header {
    font-weight: bold;
    font-size: 14px;
    padding-right: 8px;
}
.checkout-subheader {
    font-weight: normal;
    font-size: 14px;
}

#checkout-grid {
    margin-top: 10px;
}

/* Checkout preview thumbnails */
.checkout-preview {
    display: inline-block;
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 4px;
    overflow: hidden;
    background: #f5f5f5;
}

.checkout-preview img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

/* Checkout category badges (oval) */
.checkout-badge {
    display: inline-block;
    padding: 4px;
    border-radius: 12px;
    font-size: 11px;
    font-weight: bold;
    color: var(--fg-select);
    min-width: 70px;
    text-align: center;
}

.checkout-badge-selected {
    background: var(--bg-select);
    color: var(--fg-select);
}

.checkout-badge-link {
    background: var(--bg-link);
    color: #000;
    color: var(--fg-link);
}

.checkout-badge-context {
    background: var(--bg-context);
    color: var(--fg-context);
}

.checkout-type-select {
border: none;
    border-radius: 12px;
    padding: 3px 6px;
    font-size: 11px;
    font-weight: bold;
    cursor: pointer;
    outline: none;
    min-width: 78px;
    text-align: center;
    text-align-last: center;
    appearance: none;
    -webkit-appearance: none;
    height: 24px;
    background-image: url(../images/triangle_down.png);
    background-size: 12px;
    background-repeat: no-repeat;
    background-position: right 4px center;
    padding-right: 12px;
}

.checkout-type-select option {
    background: #fff;
    color: #000;
    font-weight: normal;
}

.checkout-version {
    font-size: 11px;
    font-family: monospace;
    opacity: 0.75;
}

.checkout-version-stale {
    font-size: 11px;
    font-family: monospace;
    opacity: 0.75;
    font-weight: 600;
}

/* Quality badge in grid */
.quality-badge {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 12px;
    font-size: 11px;
    font-weight: 600;
}

.quality-badge.quality-green {
    background: rgba(76, 175, 80, 0.15);
    color: #2e7d32;
}

.quality-badge.quality-yellow {
    background: rgba(255, 193, 7, 0.15);
    color: #f57c00;
}

.quality-badge.quality-red {
    background: rgba(244, 67, 54, 0.15);
    color: #c62828;
}

.grid-file-name {
    font-weight: bold;
}
.grid-file-size {
    float: right;
}

#db-manager-insert-footer {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding: 18px 0 0;
}

#db-manager-insert-btn {
    min-width: 80px;
    background-color: var(--bg-select);
    color: var(--fg-select);
    font-weight: bold;
    border-radius: 5px;
    font-size: 13px;
}

#db-manager-grid .db-feature-filter-btn-inline {
    padding: 0;
    width: 18px;
    height: 18px;
    min-width: 18px;
    border: none;
    background: transparent;
    cursor: pointer;
}

#db-manager-grid th.db-count-col-header .k-cell-inner {
    display: flex;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    padding-left: 0;
    padding-right: 0;
    justify-content: center;
}

#db-manager-grid th.db-count-col-header .k-link {
    display: flex;
    flex: 1 1 auto;
    width: 100%;
    box-sizing: border-box;
    padding-left: 0;
    padding-right: 0;
    justify-content: center;
}

/* DB Manager: keep boolean filter cells compact (tri-state only) */
#db-manager-grid .db-bool-filter-cell .k-input-inner,
#db-manager-grid .db-bool-filter-cell .k-input-button,
#db-manager-grid .db-bool-filter-cell .k-filtercell-operator,
#db-manager-grid .db-bool-filter-cell .k-clear-value,
#db-manager-grid .db-bool-filter-cell .k-i-filter-clear,
#db-manager-grid .db-bool-filter-cell .k-i-filter-clear::before {
    display: none !important;
}

.db-bool-filter-cell {
    width: 20px;
    margin: auto;
}

/* DB Manager detail rows */
#db-manager-grid tr.k-detail-row > td.k-detail-cell {
    max-height: 380px;
    height: 380px;
    overflow: hidden;
    padding: 0;
}

#db-manager-grid .db-detail-wrap {
    background-color: rgba(0, 0, 0, .04);
    padding: 12px;
    height: 100%;
    box-sizing: border-box;
    overflow: hidden;
}

#db-manager-grid .db-detail-tabs .k-tabstrip-content,
#db-manager-grid .db-detail-tabs .k-content {
    height: 360px;
    min-height: 360px;
    max-height: 360px;
    overflow: auto;
}

#db-manager-grid .db-detail-3d-pane {
    height: 330px;
    min-height: 330px;
    padding: 0 !important;
}

#db-manager-grid .db-detail-3d-host {
    width: auto;
    margin: 8px;
    height: 340px;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 4px;
    overflow: hidden;
    background: #f5f5f5;
}

#db-manager-grid .db-detail-3d-host canvas {
    display: block;
    width: 100%;
    height: 330px;
}

#db-manager-grid .db-detail-summary {
    padding: 8px 12px;
}

#db-manager-grid .db-detail-row {
    display: grid;
    grid-template-columns: 140px 1fr;
    gap: 8px;
    padding: 6px 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
}

#db-manager-grid .db-detail-row:last-child {
    border-bottom: none;
}

#db-manager-grid .db-detail-label {
    font-weight: 600;
}

#db-manager-grid .db-detail-value {
    word-break: break-word;
}

#db-manager-grid .db-detail-pre {
    margin: 0;
    padding: 10px;
    max-height: 312px;
    overflow: auto;
    white-space: pre;
    background: rgba(0, 0, 0, 0.04);
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 4px;
    font-size: 11px;
}

#db-manager-grid .db-json-pre,
.bim-analytics-rawjson-host .db-json-pre {
    font-family: Consolas, "Courier New", monospace;
    line-height: 1.45;
}

#db-manager-grid .db-json-viewer-host,
.bim-analytics-rawjson-host.db-json-viewer-host,
.bim-analytics-rawjson-host {
    height: 310px;
    overflow: auto;
    padding: 0;
    background: rgba(0, 0, 0, 0.03);
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 4px;
}

#db-manager-grid .db-json-toolbar,
.bim-analytics-rawjson-host .db-json-toolbar {
    align-items: center;
    gap: 4px;
    padding: 4px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.08);
    position: sticky;
    top: 0;
    z-index: 1;
}

#db-manager-grid .db-json-search-input,
.bim-analytics-rawjson-host .db-json-search-input {
    flex: 1 1 auto;
    height: 24px;
    padding: 0 4px;
    border: 1px solid rgba(0, 0, 0, 0.14);
    border-radius: 4px;
    background: #fff;
    font-size: 13px;
}

#db-manager-grid .db-json-toolbar-btn,
.bim-analytics-rawjson-host .db-json-toolbar-btn {
    background-repeat: no-repeat;
    background-size: 16px;
    border-radius: 4px;
    width: 24px;
    height: 24px;
    background-position: center;
}

#db-manager-grid .db-json-toolbar-btn.is-active,
.bim-analytics-rawjson-host .db-json-toolbar-btn.is-active {
    border-color: rgba(11, 94, 215, 0.55);
    background: rgba(11, 94, 215, 0.1);
    color: #0b5ed7;
}

#db-manager-grid .db-json-toolbar-status,
.bim-analytics-rawjson-host .db-json-toolbar-status {
    margin-left: auto;
    min-width: 44px;
    text-align: right;
    font-size: 11px;
    color: rgba(0, 0, 0, 0.58);
    opacity: 0;
    transition: opacity 120ms ease;
}

#db-manager-grid .db-json-toolbar-status.is-visible,
.bim-analytics-rawjson-host .db-json-toolbar-status.is-visible {
    opacity: 1;
}

#db-manager-grid .db-json-viewer-wrap,
.bim-analytics-rawjson-host .db-json-viewer-wrap {
    padding: 0 6px;
}

#db-manager-grid .db-json-viewer-host json-viewer,
#db-manager-grid .db-json-viewer-host andypf-json-viewer,
.bim-analytics-rawjson-host json-viewer,
.bim-analytics-rawjson-host andypf-json-viewer {
    --background-color: transparent;
    --color: #111827;
    --property-color: #0b5ed7;
    --string-color: #0f6b3e;
    --number-color: #b45309;
    --boolean-color: #6d28d9;
    --null-color: #6b7280;
    --preview-color: #7a4b2f;
    --highlight-color: #eeffbf;
    --outline-color: rgba(0, 0, 0, 0.2);
    --font-family: Consolas, "Courier New", monospace;
    --font-size: 11px;
}

#db-manager-grid .db-json-key,
.bim-analytics-rawjson-host .db-json-key {
    color: #0b5ed7;
    font-weight: 600;
}

#db-manager-grid .db-json-string,
.bim-analytics-rawjson-host .db-json-string {
    color: #198754;
}

#db-manager-grid .db-json-number,
.bim-analytics-rawjson-host .db-json-number {
    color: #b54708;
}

#db-manager-grid .db-json-boolean,
.bim-analytics-rawjson-host .db-json-boolean {
    color: #7e22ce;
    font-weight: 600;
}

#db-manager-grid .db-json-null,
.bim-analytics-rawjson-host .db-json-null {
    color: #6c757d;
    font-style: italic;
}

#db-manager-grid .db-detail-loading,
#db-manager-grid .db-detail-error,
.bim-analytics-rawjson-host .db-detail-loading,
.bim-analytics-rawjson-host .db-detail-error {
    padding: 10px;
    font-size: 12px;
}

.db-feature-search-content {
    display: flex;
    flex-direction: column;
    gap: 8px;
    height: 100%;
    box-sizing: border-box;
}

.db-feature-search-toolbar {
    display: flex;
    align-items: center;
    gap: 8px;
}

.db-feature-search-toolbar #db-feature-apply {
    margin-left: auto;
}

.db-feature-search-status {
    font-size: 12px;
    color: rgba(0, 0, 0, 0.7);
}

.db-feature-search-results {
    flex: 1 1 auto;
    min-height: 220px;
    overflow: auto;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 6px;
    padding: 8px;
    background: rgba(255, 255, 255, 0.55);
}

.db-feature-query-row {
    display: grid;
    grid-template-columns: minmax(180px, 1fr) minmax(170px, 1.2fr) minmax(170px, 1.6fr) 60px minmax(100px, 1fr) 34px;
    gap: 8px;
    align-items: start;
    margin-bottom: 8px;
    padding: 8px;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 6px;
    background: rgba(255, 255, 255, 0.72);
}

.db-feature-row-delete {
    width: 28px;
    min-width: 28px;
    height: 28px;
    padding: 0;
    line-height: 28px;
    justify-self: end;
}

.db-feature-row-condition-wrap {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.db-feature-row-meta {
    font-size: 11px;
    color: rgba(0, 0, 0, 0.62);
    min-height: 14px;
}

.db-feature-row-value.is-empty {
    min-height: 28px;
}

.db-feature-row-value-input,
.db-feature-row-value-select {
    width: 100%;
}

.db-feature-row-operator.is-hidden {
    visibility: hidden;
}

@media (max-width: 1000px) {
    .db-feature-query-row {
        grid-template-columns: 1fr 34px;
    }

    .db-feature-row-feature,
    .db-feature-row-category,
    .db-feature-row-condition-wrap,
    .db-feature-row-operator,
    .db-feature-row-value {
        grid-column: 1;
    }

    .db-feature-row-delete {
        grid-column: 2;
        grid-row: 1;
    }
}

.db-feature-search-empty {
    padding: 12px;
    text-align: center;
    font-size: 12px;
    color: rgba(0, 0, 0, 0.68);
}

/* DB Manager: disable zebra striping */
#db-manager-grid .k-grid-content tr.k-alt {
    background-color: inherit !important;
}


/* Checkout notification */
.checkout-notification {
    position: fixed;
    top: 70px;
    left: 50%;
    transform: translateX(-50%);
    padding: 12px 24px;
    border-radius: 6px;
    font-size: 14px;
    font-weight: 500;
    z-index: 10002;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.checkout-notification.success {
    background: #4caf50;
    color: white;
}

.checkout-notification.error {
    background: #f44336;
    color: white;
}


.db-detail-wrap * {

}
.db-detail-wrap .prop-section-header{
    background-color: rgba(0,0,0,0.08);
}

.db-detail-wrap .source-documents-list li span {
    background-image: url(../images/link.png);
}

.db-detail-wrap .publication-item {
    padding: 8px 12px;
    margin-bottom: 6px;
    background-color: rgba(0,0,0, 0.04);
    border-radius: 8px;
}

.db-detail-wrap .publication-usages-list li span {
    background-image: url(../images/publish.png);
}


#fem-panel-window {
    background: rgba(0, 0, 0, 0.8);
}
    background-color: rgba(0,0,0, 0.04);
    border-radius: 8px;
}

.db-detail-wrap .publication-usages-list li span {
    background-image: url(../images/publish.png);
}


#fem-panel-window {
    background: rgba(0, 0, 0, 0.8);
}

/* --- Costing tooltip --- */

.costing-tt-table {
    border-collapse: collapse;
    border-radius: 30px;
    width: 100%;
    font-size: 12px;
    line-height: 1.6;
}

.costing-tt-table .tt-label {
    color: rgba(255, 255, 255, 0.6);
    padding: 1px 8px 1px 0;
    white-space: nowrap;
}

.costing-tt-table .tt-value {
    color: #fff;
    font-weight: 600;
    text-align: right;
    padding: 1px 0;
    white-space: nowrap;
}

.costing-tt-table .tt-sep {
    padding: 2px 0;
    border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}