/* ── Node Definitions (supplements standard .card / .table / .execution-list) ── */

/* Status dots — inline colored circles like execution status */
.nd-status-dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    margin-right: 4px;
    vertical-align: middle;
}
.nd-status-dot--active    { background: var(--accent-confirm, #22c55e); }
.nd-status-dot--draft     { background: var(--accent-caution, #eab308); }
.nd-status-dot--deprecated { background: var(--text-muted, #888); }

/* Detail view meta grid */
.nd-detail-meta {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: var(--spacing-sm);
}
.nd-detail-meta .meta-item {
    font-size: var(--font-size-body-sm, 0.85rem);
}
.nd-detail-meta .meta-item strong {
    color: var(--text-secondary);
}
.nd-detail-meta .meta-item code {
    font-size: var(--font-size-body-xs, 0.8rem);
    color: var(--accent-main);
}

/* Tabs */
.nd-detail-tabs {
    display: flex;
    gap: 4px;
    margin: var(--spacing-md) 0 var(--spacing-sm);
    border-bottom: 1px solid var(--border-default);
}
.nd-tab {
    padding: var(--spacing-sm) var(--spacing-md);
    border: none;
    background: none;
    color: var(--text-secondary);
    cursor: pointer;
    font-size: var(--font-size-body-sm, 0.85rem);
    border-bottom: 2px solid transparent;
    transition: color var(--transition-fast), border-color var(--transition-fast);
}
.nd-tab:hover { color: var(--text-primary); }
.nd-tab.active {
    color: var(--accent-main);
    border-bottom-color: var(--accent-main);
}

/* JSON view (read-only) */
.nd-json-view {
    margin: 0;
    padding: var(--spacing-md);
    overflow-x: auto;
    font-size: var(--font-size-body-xs, 0.8rem);
    line-height: 1.5;
    max-height: 600px;
    overflow-y: auto;
    background: transparent;
}
.json-key    { color: var(--accent-main, #8b5cf6); }
.json-string { color: var(--accent-confirm, #22c55e); }
.json-number { color: var(--accent-caution, #eab308); }
.json-bool   { color: #3b82f6; }
.json-null   { color: var(--text-muted); }

/* History timeline */
.nd-history-timeline {
    display: flex;
    flex-direction: column;
    gap: var(--spacing-sm);
}
.nd-history-entry {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
    padding: var(--spacing-sm) var(--spacing-md);
}
.nd-history-version {
    font-weight: 700;
    color: var(--accent-main);
    min-width: 36px;
}
.nd-history-info { flex: 1; }
.nd-history-note { font-size: var(--font-size-body-sm, 0.85rem); }
.nd-history-meta {
    font-size: var(--font-size-body-xs, 0.75rem);
    color: var(--text-muted);
    margin-top: 2px;
}

/* Tag badges */
.nd-tag {
    display: inline-block;
    padding: 1px 6px;
    border-radius: 8px;
    font-size: var(--font-size-body-xs, 0.72rem);
    background: var(--bg-muted);
    color: var(--text-secondary);
}

/* ── Editor ───────────────────────────────────────────────── */

.nd-editor-header {
    display: flex;
    align-items: center;
    gap: var(--spacing-md);
    margin-bottom: var(--spacing-md);
}
.nd-editor-header h2 {
    margin: 0;
    font-size: var(--font-size-h4);
    font-weight: 600;
}
.nd-editor-mode-toggle {
    display: flex;
    gap: 4px;
    margin-bottom: var(--spacing-md);
}
.nd-mode-btn {
    border: 1px solid var(--border-default);
    padding: var(--spacing-xs) var(--spacing-sm);
    border-radius: var(--border-radius-lg, 4px);
    background: transparent;
    color: var(--text-secondary);
    cursor: pointer;
    font-size: var(--font-size-body-xs);
}
.nd-mode-btn.active {
    background: var(--accent-main);
    color: #fff;
    border-color: var(--accent-main);
}

.nd-editor-visual .form-group { margin-bottom: var(--spacing-md); }
.nd-editor-visual label {
    display: block;
    font-size: var(--font-size-body-xs);
    color: var(--text-secondary);
    margin-bottom: var(--spacing-xs);
    font-weight: 600;
}
.nd-editor-visual .form-row {
    display: flex;
    gap: var(--spacing-md);
}
.nd-editor-visual .form-row .form-group { flex: 1; }

.nd-field {
    width: 100%;
    padding: var(--spacing-xs) var(--spacing-sm);
    border: 1px solid var(--border-default);
    border-radius: var(--border-radius-lg, 4px);
    background: var(--bg-elevated);
    color: var(--text-primary);
    font-size: var(--font-size-body-sm);
    box-sizing: border-box;
}
textarea.nd-field { resize: vertical; font-family: inherit; }
select.nd-field { cursor: pointer; }

.nd-json-editor {
    width: 100%;
    padding: var(--spacing-md);
    border: 1px solid var(--border-default);
    border-radius: var(--border-radius-lg, 4px);
    background: var(--bg-elevated);
    color: var(--text-primary);
    font-family: 'SF Mono', 'Fira Code', monospace;
    font-size: var(--font-size-body-xs, 0.8rem);
    line-height: 1.5;
    resize: vertical;
    box-sizing: border-box;
    tab-size: 2;
}
.nd-json-error {
    margin-top: var(--spacing-xs);
    padding: var(--spacing-xs) var(--spacing-sm);
    border-radius: var(--border-radius-lg, 4px);
    background: rgba(239, 68, 68, 0.12);
    color: var(--accent-danger, #ef4444);
    font-size: var(--font-size-body-xs);
}

/* Secret picker chips */
.nd-secret-chip:has(input:checked) {
    background: rgba(71, 144, 255, 0.12);
    border-color: var(--accent-main);
    color: var(--text-primary);
}
.nd-secret-chip:hover {
    background: var(--bg-muted);
}

.nd-editor-footer {
    margin-top: var(--spacing-md);
    padding-top: var(--spacing-md);
    border-top: 1px solid var(--border-default);
}
.nd-editor-buttons {
    display: flex;
    gap: var(--spacing-sm);
    justify-content: flex-end;
    margin-top: var(--spacing-sm);
}

/* ── NodeTypeId uniqueness validation ─────────────────────── */

.nd-id-validation {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-left: var(--spacing-sm);
    font-size: var(--font-size-body-xs, 0.75rem);
    font-weight: 500;
    vertical-align: middle;
}
.nd-id-validation--available { color: var(--accent-confirm, #22c55e); }
.nd-id-validation--taken     { color: var(--accent-danger, #ef4444); }
.nd-id-validation--checking  { color: var(--text-muted, #888); }
.nd-id-validation--error     { color: var(--accent-caution, #eab308); }

/* ── Continue Creating mode ───────────────────────────────── */

.nd-continue-creating {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-right: auto;
    font-size: var(--font-size-body-sm, 0.85rem);
    cursor: pointer;
    font-weight: 400;
}
.nd-continue-creating input[type="checkbox"] { margin: 0; }
.nd-created-list {
    font-size: var(--font-size-body-xs, 0.75rem);
    color: var(--text-secondary);
    margin-top: var(--spacing-xs);
}
.nd-created-list code {
    color: var(--accent-main);
    font-size: var(--font-size-body-xs, 0.75rem);
}

/* ── Provenance badge in detail view ──────────────────────── */

.nd-provenance-link {
    color: var(--accent-main);
    text-decoration: none;
}
.nd-provenance-link:hover {
    text-decoration: underline;
}