:root {
    --forge-page-bg: #f5f6fa;
    --forge-card-bg: #ffffff;
    --forge-card-bg-soft: #f8fafc;
    --forge-card-border: rgba(148, 163, 184, 0.18);
    --forge-card-shadow: 0 10px 28px rgba(15, 23, 42, 0.04);
    --forge-text: #0f172a;
    --forge-text-soft: #334155;
    --forge-text-muted: #64748b;
    --forge-input-bg: #ffffff;
    --forge-input-border: #dcdee4;
    --forge-input-text: #283c50;
    --forge-input-placeholder: #94a3b8;
    --forge-table-bg: #ffffff;
    --forge-table-header-bg: #f8fafc;
    --forge-table-filter-bg: #ffffff;
    --forge-table-border: rgba(148, 163, 184, 0.18);
    --forge-hover-bg: #f1f5f9;
    --forge-accent: #3454d1;
    --forge-accent-soft: rgba(52, 84, 209, 0.12);
}

html.app-skin-dark {
    --forge-page-bg: #0f172a;
    --forge-card-bg: #121a2d;
    --forge-card-bg-soft: #0f172a;
    --forge-card-border: #1b2436;
    --forge-card-shadow: none;
    --forge-text: #f8fafc;
    --forge-text-soft: #e2e8f0;
    --forge-text-muted: #b1b4c0;
    --forge-input-bg: #0f172a;
    --forge-input-border: #1b2436;
    --forge-input-text: #f8fafc;
    --forge-input-placeholder: #64748b;
    --forge-table-bg: #121a2d;
    --forge-table-header-bg: #121a2d;
    --forge-table-filter-bg: #0f172a;
    --forge-table-border: #1b2436;
    --forge-hover-bg: #172033;
    --forge-accent: #8ea2ff;
    --forge-accent-soft: rgba(129, 140, 248, 0.16);
}

.forge-surface {
    background: var(--forge-card-bg);
    border: 1px solid var(--forge-card-border);
    color: var(--forge-text-soft);
    box-shadow: var(--forge-card-shadow);
}

.forge-surface-soft {
    background: var(--forge-card-bg-soft);
    border: 1px solid var(--forge-card-border);
    color: var(--forge-text-soft);
}

.forge-theme-text {
    color: var(--forge-text) !important;
}

.forge-theme-muted {
    color: var(--forge-text-muted) !important;
}

.forge-theme-border {
    border-color: var(--forge-card-border) !important;
}

html.app-skin-dark body {
    background-color: var(--forge-page-bg);
    color: var(--forge-text-soft);
}

html.app-skin-dark .card,
html.app-skin-dark .modal-content,
html.app-skin-dark .dropdown-menu,
html.app-skin-dark .list-group-item {
    background-color: var(--forge-card-bg);
    border-color: var(--forge-card-border);
    color: var(--forge-text-soft);
}

html.app-skin-dark .card-header,
html.app-skin-dark .card-footer,
html.app-skin-dark .modal-header,
html.app-skin-dark .modal-footer {
    background-color: var(--forge-card-bg);
    border-color: var(--forge-card-border);
    color: var(--forge-text);
}

html.app-skin-dark .dropdown-item,
html.app-skin-dark .card-title,
html.app-skin-dark .modal-title,
html.app-skin-dark .text-dark,
html.app-skin-dark .fw-semibold.text-dark {
    color: var(--forge-text) !important;
}

html.app-skin-dark .dropdown-item:hover,
html.app-skin-dark .dropdown-item:focus {
    background-color: var(--forge-hover-bg);
    color: var(--forge-text) !important;
}

html.app-skin-dark .text-muted,
html.app-skin-dark .form-text {
    color: var(--forge-text-muted) !important;
}

html.app-skin-dark .form-control,
html.app-skin-dark .form-select,
html.app-skin-dark .input-group-text,
html.app-skin-dark .dataTables_wrapper .dataTables_filter input,
html.app-skin-dark .dataTables_wrapper .dataTables_length select {
    background-color: var(--forge-input-bg);
    border-color: var(--forge-input-border);
    color: var(--forge-input-text);
}

html.app-skin-dark .form-control::placeholder {
    color: var(--forge-input-placeholder);
}

html.app-skin-dark .form-control:focus,
html.app-skin-dark .form-select:focus {
    background-color: var(--forge-input-bg);
    border-color: rgba(129, 140, 248, 0.55);
    color: var(--forge-input-text);
    box-shadow: 0 0 0 0.2rem rgba(52, 84, 209, 0.18);
}

html.app-skin-dark .form-select option {
    background-color: var(--forge-input-bg);
    color: var(--forge-input-text);
}

html.app-skin-dark .table {
    --bs-table-bg: var(--forge-table-bg);
    --bs-table-color: var(--forge-text-soft);
    --bs-table-border-color: var(--forge-table-border);
    --bs-table-hover-bg: var(--forge-hover-bg);
    --bs-table-hover-color: var(--forge-text);
    color: var(--forge-text-soft);
    border-color: var(--forge-table-border);
}

html.app-skin-dark .table > :not(caption) > * > * {
    background-color: transparent;
    border-color: var(--forge-table-border);
    color: inherit;
}

html.app-skin-dark table.dataTable thead th,
html.app-skin-dark table.dataTable thead td {
    background-color: var(--forge-table-header-bg);
    color: var(--forge-text);
    border-color: var(--forge-table-border);
}

html.app-skin-dark table.dataTable thead .datatable-filters th,
html.app-skin-dark table.dataTable thead .column-search th,
html.app-skin-dark table.dataTable thead .column-filter th {
    background-color: var(--forge-table-filter-bg);
}

html.app-skin-dark .dataTables_wrapper .dataTables_length,
html.app-skin-dark .dataTables_wrapper .dataTables_filter,
html.app-skin-dark .dataTables_wrapper .dataTables_info,
html.app-skin-dark .dataTables_wrapper .dataTables_paginate,
html.app-skin-dark .dataTables_wrapper .dataTables_empty {
    color: var(--forge-text-muted);
}

html.app-skin-dark .page-link {
    background-color: var(--forge-input-bg);
    border-color: var(--forge-input-border);
    color: var(--forge-text-soft);
}

html.app-skin-dark .page-link:hover,
html.app-skin-dark .page-link:focus {
    background-color: var(--forge-hover-bg);
    border-color: var(--forge-input-border);
    color: var(--forge-text);
}

html.app-skin-dark .page-item.active .page-link {
    background-color: var(--forge-accent);
    border-color: var(--forge-accent);
    color: #ffffff;
}

html.app-skin-dark .select2-container--default .select2-selection--single,
html.app-skin-dark .select2-container--default .select2-selection--multiple {
    background-color: var(--forge-input-bg);
    border-color: var(--forge-input-border);
    color: var(--forge-input-text);
}

html.app-skin-dark .select2-container--default .select2-selection--single .select2-selection__rendered,
html.app-skin-dark .select2-container--default .select2-selection--multiple .select2-selection__choice {
    color: var(--forge-input-text);
}

html.app-skin-dark .select2-dropdown,
html.app-skin-dark .select2-results__option {
    background-color: var(--forge-card-bg);
    color: var(--forge-input-text);
}

html.app-skin-dark .select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: var(--forge-accent);
    color: #ffffff;
}

html.app-skin-dark .project-workspace-shell,
html.app-skin-dark .project-module-card,
html.app-skin-dark .project-overview-list,
html.app-skin-dark .project-overview-progress,
html.app-skin-dark .project-overview-item,
html.app-skin-dark .project-overview-description,
html.app-skin-dark .project-reports-shell,
html.app-skin-dark .project-reports-section-card,
html.app-skin-dark .project-reports-task-summary-card,
html.app-skin-dark .project-reports-task-summary-unavailable,
html.app-skin-dark .task-list-card,
html.app-skin-dark .task-detail-hint,
html.app-skin-dark .notes-card,
html.app-skin-dark .note-preview-card,
html.app-skin-dark .tag-summary-card,
html.app-skin-dark .note-structure-panel,
html.app-skin-dark .note-structure-line,
html.app-skin-dark .note-view-shell,
html.app-skin-dark .note-path-line,
html.app-skin-dark .note-structure-card,
html.app-skin-dark .vault-entity-card,
html.app-skin-dark .vault-explorer-sidebar,
html.app-skin-dark .vault-explorer-main,
html.app-skin-dark .vault-explorer-toolbar,
html.app-skin-dark .vault-result-header,
html.app-skin-dark .vault-empty-state,
html.app-skin-dark .vault-folder-create,
html.app-skin-dark .vault-secret-form-shell,
html.app-skin-dark .vault-secret-view-shell,
html.app-skin-dark .vault-secret-detail-card,
html.app-skin-dark .project-notes-table-shell,
html.app-skin-dark .project-tasks-table-shell,
html.app-skin-dark .task-view-shell,
html.app-skin-dark .task-meta-card,
html.app-skin-dark .task-section-card,
html.app-skin-dark .task-description-card,
html.app-skin-dark .task-summary-item,
html.app-skin-dark .task-metadata-panel,
html.app-skin-dark .task-relationship-item,
html.app-skin-dark .task-relationship-context,
html.app-skin-dark .task-form-shell,
html.app-skin-dark .task-form-card-header,
html.app-skin-dark .task-relationship-card,
html.app-skin-dark .client-projects-shell,
html.app-skin-dark .client-workspace-card,
html.app-skin-dark .client-module-card {
    background: var(--forge-card-bg);
    border-color: var(--forge-card-border);
    color: var(--forge-text-soft);
    box-shadow: var(--forge-card-shadow);
}

html.app-skin-dark .project-status-breakdown-card,
html.app-skin-dark .project-task-kanban-column,
html.app-skin-dark .project-task-kanban-empty,
html.app-skin-dark .project-task-kanban-column-empty,
html.app-skin-dark .project-task-kanban-status-toggle,
html.app-skin-dark .project-kanban-column,
html.app-skin-dark .project-kanban-card,
html.app-skin-dark .project-kanban-empty,
html.app-skin-dark .project-kanban-column-empty,
html.app-skin-dark .project-kanban-status-toggle,
html.app-skin-dark .task-relationship-empty,
html.app-skin-dark .forge-attachment-dropzone,
html.app-skin-dark .forge-attachment-preview,
html.app-skin-dark .forge-attachment-inspector-preview,
html.app-skin-dark .forge-project-visual,
html.app-skin-dark .project-visual-choice-panel {
    background: var(--forge-card-bg-soft);
    border-color: var(--forge-card-border);
    color: var(--forge-text-soft);
}

html.app-skin-dark .project-workspace-tab,
html.app-skin-dark .note-tree-toggle,
html.app-skin-dark .note-chip,
html.app-skin-dark .project-note-tag,
html.app-skin-dark .vault-tag-pill {
    background: var(--forge-card-bg-soft);
    border-color: var(--forge-card-border);
    color: var(--forge-text);
}

html.app-skin-dark .project-workspace-tab.active,
html.app-skin-dark .note-chip.active {
    background: var(--forge-accent);
    border-color: var(--forge-accent);
    color: #ffffff;
}

html.app-skin-dark .project-task-kanban-column-header {
    background: rgba(18, 26, 45, 0.96);
    border-color: var(--forge-card-border);
}

html.app-skin-dark .project-kanban-column-header {
    background: rgba(18, 26, 45, 0.96);
    border-color: var(--forge-card-border);
}

html.app-skin-dark .project-action-btn,
html.app-skin-dark .project-action-btn.primary,
html.app-skin-dark .project-action-btn.secondary,
html.app-skin-dark .project-action-btn.subtle,
html.app-skin-dark .project-actions-group .project-action-btn.small.subtle {
    background: var(--forge-card-bg);
    border-color: var(--forge-card-border);
    color: var(--forge-text);
}

html.app-skin-dark .project-action-btn:hover,
html.app-skin-dark .project-action-btn:focus {
    background: var(--forge-hover-bg);
    color: var(--forge-text);
}

html.app-skin-dark .project-action-btn small,
html.app-skin-dark .client-module-status,
html.app-skin-dark .client-module-helper,
html.app-skin-dark .project-actions-text,
html.app-skin-dark .project-actions-group-label,
html.app-skin-dark .project-overview-empty,
html.app-skin-dark .project-task-kanban-summary,
html.app-skin-dark .project-kanban-summary,
html.app-skin-dark .project-kanban-meta,
html.app-skin-dark .note-tree-meta,
html.app-skin-dark .note-tree-summary,
html.app-skin-dark .notes-quick-create-help,
html.app-skin-dark .table-meta-line,
html.app-skin-dark .table-meta-label,
html.app-skin-dark .table-timeline,
html.app-skin-dark .vault-entity-meta,
html.app-skin-dark .project-description-preview,
html.app-skin-dark .forge-attachment-meta,
html.app-skin-dark .forge-attachment-detail-label {
    color: var(--forge-text-muted);
}

html.app-skin-dark .project-actions-title,
html.app-skin-dark .client-module-card h5,
html.app-skin-dark .table-primary-link,
html.app-skin-dark .table-meta-line a,
html.app-skin-dark .forge-user-link,
html.app-skin-dark .note-tree-button,
html.app-skin-dark .note-tree-title,
html.app-skin-dark .note-child-link,
html.app-skin-dark .note-related-task-link,
html.app-skin-dark .note-view-content,
html.app-skin-dark .note-view-content blockquote,
html.app-skin-dark .task-rich-text,
html.app-skin-dark .task-rich-text *:not(a),
html.app-skin-dark .task-timeline-item strong,
html.app-skin-dark .workspace-meta-value,
html.app-skin-dark .forge-attachment-name,
html.app-skin-dark .forge-attachment-detail-value {
    color: var(--forge-text) !important;
}

html.app-skin-dark .client-next-step {
    background: rgba(14, 165, 233, 0.12);
    border-color: rgba(125, 211, 252, 0.22);
}

html.app-skin-dark .client-next-step-label,
html.app-skin-dark .client-module-icon {
    color: #7dd3fc;
}

html.app-skin-dark .client-next-step-body {
    color: var(--forge-text-soft);
}

html.app-skin-dark .client-module-icon {
    background: rgba(14, 165, 233, 0.16);
}

/* Forge-owned sidebar behavior overrides. Keep these after NobleUI theme CSS. */
.nxl-navigation .nxl-submenu.forge-submenu-open {
    display: block;
}

.nxl-navigation .nxl-link {
    min-width: 0;
}

.forge-sidebar-rail-actions {
    display: none;
}

html.minimenu .nxl-navigation {
    width: 76px !important;
    box-shadow: 8px 0 24px rgba(15, 23, 42, 0.05);
}

html.minimenu .nxl-header {
    left: 76px !important;
    width: calc(100% - 76px);
}

html.minimenu .nxl-container {
    margin-left: 76px !important;
}

html.minimenu .page-header {
    left: 76px !important;
}

html.minimenu .nxl-navigation .navbar-wrapper,
html.minimenu .nxl-navigation .navbar-content,
html.minimenu .nxl-navigation .nxl-navbar {
    width: 76px !important;
    overflow-x: hidden;
}

html.minimenu .nxl-navigation .navbar-content {
    padding-top: 6px;
}

html.minimenu .nxl-navigation .m-header {
    width: 76px !important;
    height: 64px;
    min-height: 64px;
    padding: 12px 0 4px !important;
    justify-content: center;
}

html.minimenu .nxl-navigation .m-header .b-brand {
    width: 44px;
    height: 44px;
    justify-content: center;
    border-radius: 14px;
}

html.minimenu .nxl-navigation .logo-lg {
    display: none !important;
}

html.minimenu .nxl-navigation .logo-sm {
    display: inline-block !important;
    max-width: 34px;
    max-height: 34px;
}

html.minimenu .forge-sidebar-rail-actions {
    display: flex;
    width: 76px;
    justify-content: center;
    padding: 2px 0 8px;
}

.forge-sidebar-rail-expand {
    display: none;
    width: 40px;
    height: 40px;
    padding: 0;
    border: 1px solid var(--forge-card-border);
    border-radius: 13px;
    background: var(--forge-card-bg-soft);
    color: var(--forge-text-soft);
    align-items: center;
    justify-content: center;
    transition: background-color .15s ease, color .15s ease, border-color .15s ease, transform .15s ease;
}

html.minimenu .forge-sidebar-rail-expand {
    display: inline-flex;
}

.forge-sidebar-rail-expand:hover,
.forge-sidebar-rail-expand:focus {
    background: var(--forge-accent-soft);
    border-color: rgba(52, 84, 209, 0.26);
    color: var(--forge-accent);
    transform: translateX(1px);
}

html.minimenu .nxl-navigation .nxl-caption,
html.minimenu .nxl-navigation .nxl-mtext,
html.minimenu .nxl-navigation .nxl-arrow,
html.minimenu .nxl-navigation .nxl-submenu {
    display: none !important;
}

html.minimenu .nxl-navigation .nxl-caption {
    height: 0 !important;
    min-height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}

html.minimenu .nxl-navigation .nxl-item {
    width: 76px !important;
    margin: 0 !important;
    padding: 0 !important;
}

html.minimenu .nxl-navigation .nxl-item > .nxl-link {
    position: relative;
    width: 44px !important;
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 !important;
    margin: 3px auto !important;
    border-radius: 14px !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    gap: 0;
    overflow: hidden;
    white-space: nowrap;
    color: var(--forge-text-muted);
}

html.minimenu .nxl-navigation .nxl-item > .nxl-link:hover,
html.minimenu .nxl-navigation .nxl-item > .nxl-link:focus {
    background: var(--forge-hover-bg);
    color: var(--forge-text);
}

html.minimenu .nxl-navigation .nxl-micon {
    width: auto !important;
    min-width: 0 !important;
    height: auto !important;
    margin: 0 !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
}

html.minimenu .nxl-navigation .nxl-micon i {
    margin: 0 !important;
    font-size: 1.08rem;
}

html.minimenu .nxl-navigation .nxl-item.active > .nxl-link,
html.minimenu .nxl-navigation .nxl-item.nxl-trigger > .nxl-link,
html.minimenu .nxl-navigation .nxl-item.forge-flyout-open > .nxl-link {
    background: rgba(52, 84, 209, 0.12);
    color: #3454d1;
}

html.minimenu .nxl-navigation .nxl-item.active > .nxl-link::before,
html.minimenu .nxl-navigation .nxl-item.nxl-trigger > .nxl-link::before {
    content: "";
    position: absolute;
    left: 0;
    top: 11px;
    width: 3px;
    height: 22px;
    border-radius: 0 999px 999px 0;
    background: currentColor;
}

html.minimenu .nxl-navigation .nxl-item.active > .nxl-link::after,
html.minimenu .nxl-navigation .nxl-item.nxl-trigger > .nxl-link::after {
    display: none !important;
}

.forge-sidebar-flyout {
    position: fixed;
    z-index: 1080;
    width: 238px;
    max-width: calc(100vw - 96px);
    padding: 10px;
    border: 1px solid var(--forge-card-border);
    border-radius: 8px;
    background: var(--forge-card-bg);
    color: var(--forge-text-soft);
    box-shadow: 0 18px 42px rgba(15, 23, 42, 0.16);
}

.forge-sidebar-flyout-title {
    padding: 6px 8px 10px;
    color: var(--forge-text);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.2;
}

.forge-sidebar-flyout-list {
    display: flex;
    flex-direction: column;
    gap: 3px;
}

.forge-sidebar-flyout-link {
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: 34px;
    padding: 8px 9px;
    border-radius: 7px;
    color: var(--forge-text-soft);
    font-size: 13px;
    font-weight: 600;
}

.forge-sidebar-flyout-link:hover,
.forge-sidebar-flyout-link:focus,
.forge-sidebar-flyout-link.active {
    background: var(--forge-accent-soft);
    color: var(--forge-accent);
}

.forge-sidebar-flyout-link i {
    width: 16px;
    min-width: 16px;
    text-align: center;
}

#menu-mini-button,
#menu-expend-button,
#mobile-collapse {
    cursor: pointer;
}

.forge-sidebar-overlay {
    display: none;
}

@media (max-width: 1024px) {
    html,
    body {
        overflow-x: hidden;
    }

    html.minimenu .nxl-header,
    html.minimenu .nxl-container,
    .nxl-header,
    .nxl-container {
        left: 0 !important;
        margin-left: 0 !important;
        width: 100% !important;
    }

    html.minimenu .page-header,
    .page-header {
        left: 0 !important;
    }

    .nxl-navigation {
        width: 280px;
        max-width: min(280px, 86vw);
        left: -290px;
        z-index: 1060;
        box-shadow: none;
    }

    .nxl-navigation.mob-navigation-active {
        left: 0 !important;
        box-shadow: 0 18px 45px rgba(15, 23, 42, 0.22);
    }

    .nxl-navigation.mob-navigation-active .nxl-submenu.forge-submenu-open,
    .nxl-navigation.mob-navigation-active .nxl-item.nxl-trigger > .nxl-submenu {
        display: block;
    }

    .forge-sidebar-overlay {
        display: block;
        position: fixed;
        inset: 0;
        z-index: 1050;
        width: 100vw;
        height: 100vh;
        padding: 0;
        border: 0;
        background: rgba(15, 23, 42, 0.42);
        cursor: default;
    }

    body.forge-sidebar-mobile-open {
        overflow: hidden;
    }

    .forge-sidebar-flyout {
        display: none !important;
    }
}

@media (min-width: 1024.02px) {
    html:not(.minimenu) .nxl-navigation .nxl-submenu.forge-submenu-open {
        display: block;
    }

    html:not(.minimenu) .forge-sidebar-overlay {
        display: none !important;
    }
}

html.app-skin-dark.minimenu .nxl-navigation .nxl-item.active > .nxl-link,
html.app-skin-dark.minimenu .nxl-navigation .nxl-item.nxl-trigger > .nxl-link,
html.app-skin-dark.minimenu .nxl-navigation .nxl-item.forge-flyout-open > .nxl-link {
    background: rgba(96, 165, 250, 0.18);
    color: #bfdbfe;
}

html.app-skin-dark .forge-sidebar-rail-expand {
    border-color: var(--forge-card-border);
    background: var(--forge-hover-bg);
    color: var(--forge-text-soft);
}

html.app-skin-dark .forge-sidebar-rail-expand:hover,
html.app-skin-dark .forge-sidebar-rail-expand:focus {
    background: rgba(96, 165, 250, 0.18);
    border-color: rgba(147, 197, 253, 0.34);
    color: #bfdbfe;
}

html.app-skin-dark .forge-sidebar-flyout {
    box-shadow: 0 18px 42px rgba(0, 0, 0, 0.38);
}

html.app-skin-dark .forge-sidebar-flyout-link:hover,
html.app-skin-dark .forge-sidebar-flyout-link:focus,
html.app-skin-dark .forge-sidebar-flyout-link.active {
    background: rgba(96, 165, 250, 0.18);
    color: #bfdbfe;
}

html.app-skin-dark .forge-sidebar-overlay {
    background: rgba(2, 6, 23, 0.62);
}

html.app-skin-dark .comment-body,
html.app-skin-dark .note-preview-content,
html.app-skin-dark .project-overview-description,
html.app-skin-dark .task-rich-text {
    color: var(--forge-text-soft);
}

html.app-skin-dark .comment-mention-menu,
html.app-skin-dark .comment-mention-option,
html.app-skin-dark .forge-attachment-card,
html.app-skin-dark .forge-attachment-inspector {
    background: var(--forge-card-bg);
    border-color: var(--forge-card-border);
    color: var(--forge-text-soft);
}

html.app-skin-dark .comment-mention-option {
    border-bottom-color: var(--forge-card-border);
}

html.app-skin-dark .comment-mention-option.active,
html.app-skin-dark .comment-mention-option:hover {
    background: var(--forge-hover-bg);
}

html.app-skin-dark .comment-mention-option-name {
    color: var(--forge-text);
}

html.app-skin-dark .comment-mention-option-role {
    color: var(--forge-text-muted);
}

html.app-skin-dark .forge-attachment-inspector-header,
html.app-skin-dark .forge-attachment-inspector-footer,
html.app-skin-dark .forge-attachment-card,
html.app-skin-dark .forge-attachment-preview,
html.app-skin-dark .forge-attachment-inspector-preview {
    border-color: var(--forge-card-border);
}

html.app-skin-dark .project-reports-row-count-badge {
    background: var(--forge-card-bg-soft);
    border-color: var(--forge-card-border);
    color: var(--forge-text);
}