.listGrid {
    width: 100%;
    min-height: calc(100vh - 280px); 
    font-size: 0.9em;
}

.listGrid-small {
    width: 100%;
    height: 300px;
    font: 0.9em;
}

.listGrid-HeaderStyles {
    font-weight: 600;
    color: #4b286d !important;
    background-color: #fff !important;
}

.listGrid-HeaderStyles.text-center span{
	margin-left:13px;
}

.listGrid-HeaderStyles.text-center .ui-grid-invisible{
	display:none;
}

.ui-grid-menu-button {
    height: 30px;
    width: 30px;
    color: #4b286d;
    text-align: center;
    font-size: 1em;
}

.ui-grid-icon-ok:before {
    content: '\c362';
    font-size: 0.85em !important;
    color: #4b286d;
}

.ui-grid-icon-plus-squared {
    content: '\c351';
    font-size: 0.85em !important;
    color: #4b286d;
    font-size: 1em;
}

.ui-grid-icon-minus-squared {
    content: '\c351';
    font-size: 0.85em !important;
    color: #4b286d;
    font-size: 1em;
}

[class^="ui-grid-icon"]:before, [class*=" ui-grid-icon"]:before {
    font-family: "ui-grid";
    speak: none;
    display: inline-block;
    text-decoration: inherit;
    text-align: center;
    text-transform: none;
    line-height: 1em;
}

.rowExpandPanelTable{
	display: block;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 5px 10px;
}

 .rowExpandPanelTableRow{
	margin-bottom: 10px;
}

.rowExpandPanelTableRow-title{
	font-size: 1em; 
	font-weight: 500; 
	padding: 5px 0; 
	border-bottom: 1px solid #ccc;
} 

.ui-grid-expandable-buttons-cell{
	text-align:center;
}

.ui-grid-pinned-container.ui-grid-pinned-container-left .ui-grid-header-cell{
	vertical-align: middle;
}

.expandableRow {
	overflow-y: auto;
    overflow-x: hidden;
}

.ui-grid-header .select2-drop{
    width:auto;
    position: inherit;
    top: inherit;
    font-weight: 500; 
}	

.ui-grid-header .select2-container-multi .select2-choices .select2-search-choice{
    font-size: 0.75em;
}

.ui-grid-header .select2-results .select2-result-label{
    font-size: 0.85em;
}

.ui-grid-header .select2-container-multi .select2-choices .select2-search-field input {
    line-height: 1;
}

/* Tree-specific styles */
.tree-grid {
    position: relative;
}

.tree-controls {
    margin-bottom: 10px;
    padding: 5px 0;
}

.tree-controls .btn {
    margin-right: 5px;
}

.tree-cell {
    display: flex;
    align-items: center;
    height: 100%;
    padding: 2px 0;
}

.tree-toggle-icon {
    cursor: pointer;
    margin-right: 5px;
    color: #4b286d;
    font-size: 14px;
    width: 16px;
    text-align: center;
    transition: color 0.2s ease;
}

.tree-toggle-icon:hover {
    color: #6a3d8a;
}

.tree-leaf-icon {
    margin-right: 5px;
    color: #999;
    font-size: 12px;
    width: 16px;
    text-align: center;
}

.tree-node-text {
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Tree level indentation styles for native ui-grid tree - using CSS classes */
.tree-grid .ui-grid-row .ui-grid-cell {
  transition: padding-left 0.2s ease;
}

/* Primary approach: Tree level indentation using CSS classes - Extended for deeper hierarchies */
.tree-grid .ui-grid-row.tree-level-0 .ui-grid-cell { padding-left: 8px; }
.tree-grid .ui-grid-row.tree-level-1 .ui-grid-cell { padding-left: 28px; }
.tree-grid .ui-grid-row.tree-level-2 .ui-grid-cell { padding-left: 48px; }
.tree-grid .ui-grid-row.tree-level-3 .ui-grid-cell { padding-left: 68px; }
.tree-grid .ui-grid-row.tree-level-4 .ui-grid-cell { padding-left: 88px; }
.tree-grid .ui-grid-row.tree-level-5 .ui-grid-cell { padding-left: 108px; }
.tree-grid .ui-grid-row.tree-level-6 .ui-grid-cell { padding-left: 128px; }
.tree-grid .ui-grid-row.tree-level-7 .ui-grid-cell { padding-left: 148px; }
.tree-grid .ui-grid-row.tree-level-8 .ui-grid-cell { padding-left: 168px; }
.tree-grid .ui-grid-row.tree-level-9 .ui-grid-cell { padding-left: 188px; }
.tree-grid .ui-grid-row.tree-level-10 .ui-grid-cell { padding-left: 208px; }

/* Fallback: Tree level indentation using data attributes - Extended for deeper hierarchies */
.tree-grid .ui-grid-row[data-tree-level="0"] .ui-grid-cell { padding-left: 8px; }
.tree-grid .ui-grid-row[data-tree-level="1"] .ui-grid-cell { padding-left: 28px; }
.tree-grid .ui-grid-row[data-tree-level="2"] .ui-grid-cell { padding-left: 48px; }
.tree-grid .ui-grid-row[data-tree-level="3"] .ui-grid-cell { padding-left: 68px; }
.tree-grid .ui-grid-row[data-tree-level="4"] .ui-grid-cell { padding-left: 88px; }
.tree-grid .ui-grid-row[data-tree-level="5"] .ui-grid-cell { padding-left: 108px; }
.tree-grid .ui-grid-row[data-tree-level="6"] .ui-grid-cell { padding-left: 128px; }
.tree-grid .ui-grid-row[data-tree-level="7"] .ui-grid-cell { padding-left: 148px; }
.tree-grid .ui-grid-row[data-tree-level="8"] .ui-grid-cell { padding-left: 168px; }
.tree-grid .ui-grid-row[data-tree-level="9"] .ui-grid-cell { padding-left: 188px; }
.tree-grid .ui-grid-row[data-tree-level="10"] .ui-grid-cell { padding-left: 208px; }

/* Custom tree cell indentation styles (for custom implementations) - Extended for deeper hierarchies */
.tree-cell .tree-level-0 { margin-left: 0px; }
.tree-cell .tree-level-1 { margin-left: 20px; }
.tree-cell .tree-level-2 { margin-left: 40px; }
.tree-cell .tree-level-3 { margin-left: 60px; }
.tree-cell .tree-level-4 { margin-left: 80px; }
.tree-cell .tree-level-5 { margin-left: 100px; }
.tree-cell .tree-level-6 { margin-left: 120px; }
.tree-cell .tree-level-7 { margin-left: 140px; }
.tree-cell .tree-level-8 { margin-left: 160px; }
.tree-cell .tree-level-9 { margin-left: 180px; }
.tree-cell .tree-level-10 { margin-left: 200px; }

/* Tree row highlighting */
.tree-grid .ui-grid-row.tree-parent-row {
    background-color: #f8f9fa;
}

.tree-grid .ui-grid-row.tree-child-row {
    background-color: #ffffff;
}

.tree-grid .ui-grid-row.tree-child-row:hover {
    background-color: #f1f3f4;
}

/* Tree expand/collapse icons using ui-grid font */
.ui-grid-icon-tree-expand:before {
    content: '\e81a'; /* Plus square icon */
    font-family: "ui-grid";
}

.ui-grid-icon-tree-collapse:before {
    content: '\e819'; /* Minus square icon */
    font-family: "ui-grid";
}

.ui-grid-icon-tree-leaf:before {
    content: '\e818'; /* Dot or small icon for leaf nodes */
    font-family: "ui-grid";
}

/* Alternative icons if ui-grid font doesn't have the needed icons */
.tree-toggle-icon.fa-plus-square:before {
    content: '\f0fe';
    font-family: FontAwesome;
}

.tree-toggle-icon.fa-minus-square:before {
    content: '\f146';
    font-family: FontAwesome;
}

.tree-leaf-icon.fa-circle:before {
    content: '\f111';
    font-family: FontAwesome;
    font-size: 8px;
}

/* Tree grid specific adjustments */
.tree-grid .ui-grid-cell {
    border-right: 1px solid #d4d4d4;
}

.tree-grid .ui-grid-cell:first-child {
    border-left: none;
}

/* Tree node selection styles */
.tree-grid .ui-grid-row.ui-grid-row-selected .tree-cell {
    background-color: #337ab7;
    color: white;
}

.tree-grid .ui-grid-row.ui-grid-row-selected .tree-toggle-icon,
.tree-grid .ui-grid-row.ui-grid-row-selected .tree-leaf-icon {
    color: white;
}

/* Responsive tree indentation */
@media (max-width: 768px) {
    /* Responsive indentation for CSS classes */
    .tree-grid .ui-grid-row.tree-level-1 .ui-grid-cell { padding-left: 23px; }
    .tree-grid .ui-grid-row.tree-level-2 .ui-grid-cell { padding-left: 38px; }
    .tree-grid .ui-grid-row.tree-level-3 .ui-grid-cell { padding-left: 53px; }
    .tree-grid .ui-grid-row.tree-level-4 .ui-grid-cell { padding-left: 68px; }
    .tree-grid .ui-grid-row.tree-level-5 .ui-grid-cell { padding-left: 83px; }
    
    /* Responsive indentation for data attributes */
    .tree-grid .ui-grid-row[data-tree-level="1"] .ui-grid-cell { padding-left: 23px; }
    .tree-grid .ui-grid-row[data-tree-level="2"] .ui-grid-cell { padding-left: 38px; }
    .tree-grid .ui-grid-row[data-tree-level="3"] .ui-grid-cell { padding-left: 53px; }
    .tree-grid .ui-grid-row[data-tree-level="4"] .ui-grid-cell { padding-left: 68px; }
    .tree-grid .ui-grid-row[data-tree-level="5"] .ui-grid-cell { padding-left: 83px; }
    
    /* Custom tree cell responsive indentation */
    .tree-cell .tree-level-1 { margin-left: 15px; }
    .tree-cell .tree-level-2 { margin-left: 30px; }
    .tree-cell .tree-level-3 { margin-left: 45px; }
    .tree-cell .tree-level-4 { margin-left: 60px; }
    .tree-cell .tree-level-5 { margin-left: 75px; }
}

/* Additional UI-Grid native tree view styles */
.tree-grid .ui-grid-tree-header-row .ui-grid-tree-header-priority {
    width: 30px;
    padding: 0;
    text-align: center;
}

.tree-grid .ui-grid-tree-base-row-header-cell {
    text-align: center;
    width: 30px;
    min-width: 30px;
    max-width: 30px;
    padding: 0;
}

.tree-grid .ui-grid-tree-base-row-header-cell .ui-grid-cell-contents {
    padding: 5px 2px;
    text-align: center;
}

/* Tree expand/collapse button styling */
.tree-grid .ui-grid-icon-plus-squared,
.tree-grid .ui-grid-icon-minus-squared {
    color: #4b286d;
    cursor: pointer;
    font-size: 14px;
    line-height: 1;
    transition: color 0.2s ease;
}

.tree-grid .ui-grid-icon-plus-squared:hover,
.tree-grid .ui-grid-icon-minus-squared:hover {
    color: #6a3d8a;
}

/* Child row styling */
.tree-grid .ui-grid-row.ui-grid-tree-level-1 {
    background-color: #fafbfc;
}

.tree-grid .ui-grid-row.ui-grid-tree-level-1:nth-child(even) {
    background-color: #f5f6f7;
}

/* Parent row with children styling */
.tree-grid .ui-grid-row.ui-grid-tree-parent {
    background-color: #f8f9fa;
    font-weight: 500;
}

/* Ensure tree indentation works properly */
.tree-grid .ui-grid-tree-base-row-header-cell {
    border-right: 1px solid #d4d4d4;
}

/* Fix tree row height */
.tree-grid .ui-grid-row {
    min-height: 35px;
    height: 35px;
}

/* Tree cell content alignment */
.tree-grid .ui-grid-cell .ui-grid-cell-contents {
    padding: 5px 8px;
    vertical-align: middle;
    line-height: 1.4;
}

/* Association indicator styling for child documents */
.tree-grid .ui-grid-tree-level-1 .ui-grid-cell:first-child .ui-grid-cell-contents {
    position: relative;
}

.tree-grid .ui-grid-tree-level-1 .ui-grid-cell:first-child .ui-grid-cell-contents:before {
    content: "└─";
    position: absolute;
    left: -15px;
    color: #999;
    font-family: monospace;
}