/* ====================== 05-NODE-BASE.CSS ====================== */
/* Базовая структура узла: .node, .node-header, текст, иконка, toggle */

.node {
    font-weight: 600;
    color: var(--text-primary);
    cursor: pointer;
    display: flex;
    flex-direction: column;
    gap: 4px;
    padding: 9px 10px 9px 6px;
    border-radius: 10px;
    transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);

    /* Важно для позиционирования меню */
    position: relative;
    z-index: 30;
    isolation: isolate;
    min-width: 0;
    background: var(--bg-card);
}

/* ====================== ПЕРВАЯ СТРОКА (название + меню) ====================== */
.node-header {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
}

/* ====================== ТЕКСТ УЗЛА ====================== */
.node-text {
    flex: 1;
    min-width: 0;
    line-height: 1.4;
    word-break: break-all;
    overflow-wrap: break-word;
    hyphens: auto;
    white-space: normal;
}

/* ====================== ИКОНКА И TOGGLE ====================== */
.node-icon {
    font-size: 1.25em;
    width: 26px;
    text-align: center;
    flex-shrink: 0;
    line-height: 1;
}

.toggle {
    width: 20px;
    font-size: 1.15em;
    flex-shrink: 0;
    text-align: center;
    color: var(--text-muted);
    font-weight: 700;
}

/* Листовые узлы */
.node.leaf .node-icon {
    font-size: 1.22em;
}

.node.leaf .toggle {
    visibility: hidden;
    width: 0;
    margin-right: 0;
}


/* ====================== SINGLE LINE MODE — обрезка названий узлов ====================== */

/* Кнопка в шапке */
.single-line-toggle-btn {
    background: transparent;
    border: none;
    font-size: 1.35em;
    padding: 6px 10px;
    border-radius: 8px;
    cursor: pointer;
    transition: all 0.2s ease;
    color: var(--text-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    height: 36px;
}

.single-line-toggle-btn:hover {
    background: var(--bg-hover, #f0f0f0);
}

.single-line-toggle-btn.single-line-active {
    background: rgba(52, 152, 219, 0.12);
    color: #3498db;
}

/* Обрезанный текст узла */
.node-text-truncated {
    white-space: nowrap !important;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
    display: inline-block;
    vertical-align: middle;
}

/* Красивая индикация "есть ещё строки" */
.node-text-truncated::after {
    content: ' ⋯';
    color: var(--text-muted);
    font-weight: 400;
    margin-left: 4px;
    opacity: 0.65;
    font-size: 0.92em;
    letter-spacing: 0.5px;
}

/* Лёгкий hover-эффект на обрезанном тексте */
.node-text-truncated:hover {
    color: var(--text-primary);
}

/* Опционально: чуть более заметный индикатор в тёмной теме */
.dark-theme .node-text-truncated::after {
    opacity: 0.75;
}