/* IDE consumer panels (Plan 70.1.3+). Styling for the project-explorer panel
   bodies (viewer now, tree at 70.1.5) that mount inside workbench panels. The
   workbench frame (workbench.css) owns the dock/panel chrome; this owns body
   content. Theme tokens are DaisyUI oklch vars, matching the app. */

.ide-file-viewer {
  height: 100%;
  min-height: 0;
}

.ide-file-viewer pre {
  margin: 0;
  font-size: 0.8rem;
  line-height: 1.45;
  white-space: pre;
  tab-size: 4;
}

.ide-file-viewer code {
  font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
}

.ide-file-viewer-status,
.ide-file-viewer-error {
  padding: 0.5rem 0.65rem;
  font-size: 0.8rem;
  color: oklch(var(--bc) / 0.6);
}

.ide-file-viewer-error {
  color: oklch(var(--er));
}

/* IDE host (Plan 70.1.6) — the registered view the workbench mounts into, shown
   in place of messages-host.
   ⚠ createWorkbench renders INTO this element: render() adds the `wb-root` class
   to the host ITSELF (not a child), so #ide-screen *is* the .wb-root. Therefore
   set ONLY the grid placement here and let .wb-root (workbench.css) own
   display/flex-direction/size. `grid-row: 2` pins it to #chat-screen's `1fr`
   content cell exactly as its sibling views do (#project-page → projects.css,
   .career-screen → jobs.css). DO NOT set flex-direction here: ide.css loads after
   workbench.css, so a `flex-direction: column` would win the tie over .wb-root's
   `flex-direction: row` and stack the docks vertically instead of side-by-side. */
.ide-screen {
  grid-row: 2;
}
.ide-screen[hidden] { display: none; }

/* File tree (Plan 70.1.5) — the project-explorer edge-dock panel body. Rows are
   built by file-tree.js; depth indent comes from inline padding-left there. */

.ide-file-tree {
  height: 100%;
  min-height: 0;
  overflow: auto;
  padding: 0.25rem 0;
  font-size: 0.8rem;
  font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
}

.ide-file-tree .ide-tree-row {
  white-space: pre;
  cursor: pointer;
  padding: 0.05rem 0.5rem;
  color: oklch(var(--bc) / 0.85);
}

.ide-file-tree .ide-tree-row:hover {
  background: oklch(var(--bc) / 0.08);
}

.ide-file-tree .ide-tree-row-dir {
  color: oklch(var(--bc));
}

.ide-file-tree .ide-tree-status,
.ide-file-tree .ide-tree-error {
  padding: 0.5rem 0.65rem;
  color: oklch(var(--bc) / 0.6);
}

.ide-file-tree .ide-tree-error {
  color: oklch(var(--er));
  white-space: pre-wrap;
}
