/**
 * Voxel Collapsible Terms - Styles
 */

/* Tree container */
.ts-collapsible-tree .ts-tree-root {
  list-style: none;
  padding: 0;
  margin: 0;
}

/* Tree item row */
.ts-collapsible-tree .ts-tree-item {
  display: flex;
  align-items: center;
  width: 100%;
  position: relative;
  padding-right: 36px;
  gap: 8px;
}

/* Checkbox area */
.ts-collapsible-tree .ts-tree-check {
  display: flex;
  align-items: center;
  flex-shrink: 0;
}

/* Link inside tree item - align text and count */
.ts-collapsible-tree .ts-tree-link {
  display: flex;
  align-items: center;
  flex: 1;
  min-width: 0;
  gap: 6px;
}

/* Nested children indentation */
.ts-collapsible-tree .ts-tree-children {
  list-style: none;
  padding: 0;
  margin: 0;
  padding-left: 20px;
}

/* Toggle button gray circle */
.ts-collapsible-tree .ts-tree-toggle {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  padding: 0;
  margin: 0;
  background: var(--ts-shade-6, #d5d5d5);
  border: none;
  cursor: pointer;
  color: var(--ts-shade-1, #444);
  border-radius: 50%;
  transition: all 0.2s ease;
  flex-shrink: 0;
}

.ts-collapsible-tree .ts-tree-toggle:hover {
  color: var(--ts-shade-1, #333);
  background: var(--ts-shade-6, #ddd);
}

.ts-collapsible-tree .ts-tree-toggle svg {
  transition: transform 0.25s ease;
  transform: rotate(0deg);
}

.ts-collapsible-tree .ts-tree-toggle.ts-tree-expanded svg {
  transform: rotate(90deg);
}

/* Label text */
.ts-collapsible-tree .ts-tree-label {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Ensure post counts don't overlap toggle */
.ts-collapsible-tree .ts-term-count {
  margin-right: 4px;
  flex-shrink: 0;
}

/* Ensure term icons don't overlap toggle */
.ts-collapsible-tree .ts-term-icon {
  margin-right: 4px;
  flex-shrink: 0;
}

/* Smooth appearance of children */
.ts-collapsible-tree .ts-tree-children {
  animation: vct-slide-down 0.2s ease-out;
}

@keyframes vct-slide-down {
  from {
    opacity: 0;
    transform: translateY(-4px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Selected parent with children indicator */
.ts-collapsible-tree li.ts-tree-has-children > .ts-tree-item {
  font-weight: inherit;
}

/* Depth visual guides - subtle left border for nested levels */
.ts-collapsible-tree .ts-tree-children > li {
  position: relative;
}

.ts-collapsible-tree .ts-tree-children > li::before {
  content: "";
  position: absolute;
  left: -10px;
  top: 0;
  bottom: 0;
  width: 1px;
  background: var(--ts-shade-6, #e0e0e0);
}

/* Adjust checkbox container for tree layout */
.ts-collapsible-tree .ts-checkbox-container {
  flex-shrink: 0;
}