/* Directory Tree Generator (.dtg-*) */ .dtg-card { padding: 16px 18px; margin-bottom: 14px; } .dtg-upload { text-align: center; padding: 30px 20px; background: var(--yst-bg-subtle); border: 2px dashed var(--yst-border); border-radius: 10px;
}
.dtg-upload-icon { font-size: 48px; margin-bottom: 10px; }
.dtg-upload-title { font: 700 18px var(--yst-font); color: var(--yst-text); margin: 0 0 6px; }
.dtg-upload-desc { font: 13px var(--yst-font); color: var(--yst-text-muted); margin: 0 0 14px; } .dtg-chips { display: flex; justify-content: center; gap: 6px; margin-bottom: 16px; flex-wrap: wrap;
}
.dtg-chip { background: #fff; border: 1px solid var(--yst-border); border-radius: 999px; padding: 3px 12px; font: 11px var(--yst-font); color: var(--yst-text-2);
} .dtg-select-btn { padding: 0 28px !important; height: 48px !important; font-size: 14px !important; margin-bottom: 18px; } .dtg-steps { list-style: none; margin: 0; padding: 0; display: flex; justify-content: center; gap: 18px; flex-wrap: wrap;
}
.dtg-steps li { display: flex; align-items: center; gap: 6px; font: 13px var(--yst-font); color: var(--yst-text-2);
}
.dtg-step-num { width: 22px; height: 22px; background: var(--yst-brand); color: #fff; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font: 700 12px var(--yst-font-mono, monospace);
} /* Results */
.dtg-info-banner { background: var(--yst-brand-soft); border: 1px solid var(--yst-brand); border-radius: 6px; padding: 10px 14px; font: 12px var(--yst-font); color: var(--yst-text); margin-bottom: 12px;
}
.dtg-info-banner strong { color: var(--yst-brand); } .dtg-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 8px; margin-bottom: 12px;
}
.dtg-stat { background: var(--yst-bg-subtle); border: 1px solid var(--yst-border); border-left: 3px solid var(--yst-brand); border-radius: 6px; padding: 10px 14px; display: flex; flex-direction: column; gap: 4px;
}
.dtg-stat-label { font: 11px var(--yst-font); color: var(--yst-text-muted); text-transform: uppercase; letter-spacing: 1.2px;
}
.dtg-stat-value { font: 700 18px var(--yst-font-mono, monospace); color: var(--yst-text);
} .dtg-controls { display: flex; gap: 8px; align-items: center; margin-bottom: 10px; flex-wrap: wrap;
}
.dtg-filter { flex: 1; min-width: 180px; } .dtg-export { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; margin-bottom: 12px; padding: 8px 12px; background: var(--yst-bg-subtle); border-radius: 6px;
}
.dtg-export-label { font: 600 11px var(--yst-font); color: var(--yst-text-muted); text-transform: uppercase; letter-spacing: 1.2px; margin-right: 4px;
} .dtg-tree-container { background: #1f2937; color: #e5e7eb; border-radius: 8px; padding: 14px 18px; max-height: 600px; overflow: auto; font: 12px/1.6 var(--yst-font-mono, monospace);
}
.dtg-tree { color: #e5e7eb; }
.dtg-tree .tree-folder { color: #fbbf24; cursor: pointer; }
.dtg-tree .tree-file { color: #cbd5e1; }
.dtg-tree .tree-children { padding-left: 20px; } @media (max-width: 768px) { .dtg-controls { flex-direction: column; align-items: stretch; }
}