/* Universal asset/behavior/cause/effect picker — see BuilderModalSelect.js */

.select-content {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
}

/* --space-2 between sibling top-level items without using flex (which would
   make .expandable children flex-shrink and overlap their content) */
.select-content .modal-part-list > * + * {
    margin-top: var(--space-2);
}

/* Drop the trailing --space-2 the shared .modal-part-list rule would otherwise
   reserve below the list (relevant in single mode with no buttons) */
.select-content .modal-part-list {
    margin-bottom: 0;
}

.select-empty {
    padding: var(--space-3);
    text-align: center;
    color: var(--color-text-dark);
}

/* In the picker, an inner that holds only leaf trigger rows lets the leaves
   own their padding (modal-checkbox-item provides its own) — keep it flush
   in both collapsed and expanded states. */
.select-content .expandable-part-content-inner,
.select-content .expandable.expanded > .expandable-part-content > .expandable-part-content-inner {
    padding: 0;
}

/* Inners that hold nested expandable cards (folder→assets/folders,
   asset→behaviors): horizontal --space-2 always so the cards are inset
   without animating; vertical --space-2 only when expanded so the height
   transition reveals the inset cleanly. Matches the Assets Panel's pattern
   — only padding-top/bottom animate, never padding-left/right, so the
   content width stays constant through the expand/collapse animation. */
.select-content .expandable-part-content-inner:has(> .expandable) {
    padding: 0 var(--space-2);
}

.select-content .expandable.expanded > .expandable-part-content > .expandable-part-content-inner:has(> .expandable) {
    padding: var(--space-2);
}

/* Trigger lists (modal-checkbox-item children only) sit flush — each row
   has its own border-bottom, so the inner's --space-2 gap from the shared
   rule would be redundant. */
.select-content .expandable-part-content-inner:not(:has(> .expandable)) {
    gap: 0;
}

/* Footer buttons in this picker (e.g., "New Condition" / "New Operation"
   when surfacing Logic targets) stretch to share the row equally. */
.modal:has(.select-content) .modal-part-buttons .button {
    flex: 1;
}