/* Mindflow — Diretório: navegador de arquivos em duas colunas (pastas + lista | preview) */

/* ---------- TOPBAR: botão Drive ---------- */
.drive-link{
  display:flex; align-items:center; gap:8px;
  margin-left:auto; padding:0 14px; height:36px;
  border:1px solid var(--line); border-radius:var(--radius-sm);
  background:transparent; color:var(--ink);
  font-size:13px; font-weight:500; text-decoration:none;
  transition:background .15s ease;
}
.drive-link svg{ width:16px; height:16px; flex:none; }
.drive-link:hover{ background:var(--surface-2); }
.drive-link.is-disabled{ color:var(--ink-faint); cursor:default; pointer-events:none; }
#theme-toggle{ margin-left:0; }

.dir-shell{ display:flex; align-items:stretch; height:calc(100vh - var(--topbar-h)); }

/* ---------- COLUNA ESQUERDA ---------- */
.dir-left{
  flex:0 0 420px; width:420px;
  border-right:1px solid var(--line);
  display:flex; flex-direction:column;
  height:100%;
}
.dir-head{ padding:32px 24px 20px; flex:none; }
.dir-head h1{ font-size:1.75rem; }
.dir-head p{ font-size:13.5px; margin-top:10px; }

.dir-tabs{
  display:flex; flex-wrap:wrap; gap:4px 6px;
  padding:0 20px 16px; flex:none;
  border-bottom:1px solid var(--line);
}
.dir-tab{
  display:inline-flex; align-items:baseline; gap:6px;
  padding:6px 10px 7px; border:none; border-bottom:2px solid transparent; border-radius:0;
  background:none; cursor:pointer;
  font:inherit; font-size:13.5px; color:var(--ink-soft);
}
.dir-tab:hover{ color:var(--ink); }
.dir-tab-num{ font-size:11px; color:var(--ink-faint); font-variant-numeric:tabular-nums; }
.dir-tab.is-active{ color:var(--ink); font-weight:600; border-bottom-color:var(--accent); }

.dir-filelist{ flex:1; min-height:0; overflow-y:auto; padding:8px 12px 32px; }
.dir-subhead{
  font-size:12px; font-weight:600; letter-spacing:.01em;
  color:var(--ink); padding:20px 12px 6px;
}
.dir-file{
  display:flex; flex-direction:column; gap:2px;
  padding:11px 12px; border-radius:var(--radius-sm); cursor:pointer;
  border-bottom:1px solid var(--line);
}
.dir-file:hover{ background:var(--surface-2); }
.dir-file .dir-file-name{ font-size:14px; color:var(--ink); font-weight:500; line-height:1.35; }
.dir-file.is-active .dir-file-name{ background:var(--lime); color:var(--on-lime); align-self:flex-start; padding:0 .3em; margin-left:-.3em; -webkit-box-decoration-break:clone; box-decoration-break:clone; }
.dir-file .dir-file-meta{ font-size:12px; color:var(--ink-faint); font-variant-numeric:tabular-nums; }

.dir-empty-list{
  margin:10px; padding:16px; text-align:center;
  border:1px dashed var(--line); border-radius:var(--radius-md);
  color:var(--ink-faint); font-size:13px;
}

/* ---------- COLUNA DIREITA (preview) ---------- */
.dir-right{ flex:1; min-width:0; height:100%; display:flex; flex-direction:column; }

.dir-preview-head{
  flex:none; padding:20px 28px; border-bottom:1px solid var(--line);
  display:flex; align-items:center; justify-content:space-between; gap:16px;
}
.dir-preview-title{ min-width:0; }
.dir-preview-title .name{ font-size:15px; font-weight:500; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.dir-preview-title .meta{ font-size:12px; color:var(--ink-faint); margin-top:2px; }
.dir-preview-open{
  flex:none; font-size:13px; font-weight:500; color:var(--ink);
  text-decoration:none; border:1px solid var(--line); border-radius:var(--radius-sm);
  padding:7px 14px; white-space:nowrap;
  transition:background .15s ease;
}
.dir-preview-open:hover{ background:var(--surface-2); }
.dir-preview-open.is-disabled{ color:var(--ink-faint); pointer-events:none; }

.dir-preview-body{ flex:1; min-height:0; background:var(--surface-2); }
.dir-preview-body iframe{ width:100%; height:100%; border:none; display:block; }

.dir-empty{
  flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:10px; padding:40px; text-align:center; color:var(--ink-faint); font-size:13.5px;
}
.dir-empty svg{ width:28px; height:28px; opacity:.6; }

@media (max-width: 880px){
  .dir-shell{ flex-direction:column; height:auto; }
  .dir-left{ flex:none; width:100%; height:auto; border-right:none; border-bottom:1px solid var(--line); }
  .dir-filelist{ max-height:46vh; }
  .dir-right{ height:80vh; }
}