/* ============================================================
   BIM Forum Chile v14.16 — Biblioteca: explorador de archivos
   (árbol tipo project-browser BIM + visor de documento)
   ============================================================ */

.lib-explorer{
  display:grid; grid-template-columns:300px 1fr;
  border:1px solid var(--ink-100); border-radius:20px;
  background:#fff; min-height:600px; box-shadow:0 20px 50px -34px rgba(11,27,44,.2);
}

/* ── Panel árbol — fondo de trama tipo plano técnico ─────────── */
.lib-tree{
  position:sticky; top:96px; align-self:start;
  background:linear-gradient(180deg,var(--ink-50) 0%,#fff 260px);
  border-right:1px solid var(--ink-100); border-radius:20px 0 0 20px; padding:1.1rem .85rem 1.5rem;
}
.lib-tree::before{
  content:""; position:absolute; inset:0; opacity:.05; pointer-events:none;
  background-image:
    repeating-linear-gradient(0deg, var(--navy-900) 0 1px, transparent 1px 28px),
    repeating-linear-gradient(90deg, var(--navy-900) 0 1px, transparent 1px 28px);
}
.lib-tree__search{ position:relative; z-index:1; display:flex; align-items:center; gap:.55rem; background:#fff; border:1.5px solid var(--ink-100); border-radius:10px; padding:.65rem .8rem; margin-bottom:1rem; color:var(--ink-300); }
.lib-tree__search:focus-within{ border-color:var(--cta); box-shadow:0 0 0 3px rgba(1,117,201,.08); }
.lib-tree__search input{ border:0; background:transparent; outline:none; font:inherit; font-size:.82rem; width:100%; color:var(--ink-900); }

.lib-tree__root{
  position:relative; z-index:1; width:100%; display:flex; align-items:center; gap:.55rem;
  background:none; border:none; text-align:left; cursor:pointer;
  font-family:var(--f-d); font-weight:700; font-size:.85rem; color:var(--ink-700);
  padding:.6rem .55rem; border-radius:8px; margin-bottom:.35rem; transition:background .15s;
}
.lib-tree__root:hover{ background:var(--ink-50); }
.lib-tree__root.is-active{ background:color-mix(in srgb, var(--cta) 9%, white); color:var(--cta); }
.lib-tree__root-ico{ display:grid; place-items:center; color:var(--cta); flex-shrink:0; }

.lib-tree__list{ position:relative; z-index:1; display:flex; flex-direction:column; gap:1px; }
.lib-folder__row{ --tc:var(--cta); display:flex; align-items:center; gap:.35rem; border-radius:8px; transition:background .15s; }
.lib-folder__row.is-active{ background:color-mix(in srgb, var(--tc) 8%, white); }
.lib-folder__chevron{ display:grid; place-items:center; width:22px; height:22px; flex-shrink:0; background:none; border:none; color:var(--ink-300); cursor:pointer; transition:transform .25s ease, color .2s; border-radius:6px; }
.lib-folder__chevron:hover{ color:var(--tc); background:var(--ink-50); }
.lib-folder__chevron.is-open{ transform:rotate(90deg); }
.lib-folder__main{ flex:1; display:flex; align-items:center; gap:.55rem; min-width:0; background:none; border:none; cursor:pointer; padding:.5rem .3rem .5rem 0; text-align:left; }
.lib-folder__icon{ display:grid; place-items:center; width:24px; height:24px; border-radius:7px; color:#fff; flex-shrink:0; }
.lib-folder__name{ font-family:var(--f-d); font-weight:600; font-size:.82rem; color:var(--ink-700); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.lib-folder__row.is-active .lib-folder__name{ color:var(--tc); }
.lib-folder__count{ flex-shrink:0; font-family:var(--f-d); font-weight:700; font-size:.62rem; color:var(--ink-400); background:var(--ink-100); border-radius:99px; padding:.15rem .45rem; margin-right:.3rem; }

.lib-folder__files{ overflow:hidden; margin-left:20px; border-left:2px dashed var(--ink-100); transition:max-height .35s ease; }
.lib-file{
  --tc:var(--cta); position:relative; display:flex; align-items:center; gap:.5rem; width:calc(100% - 8px);
  margin-left:8px; padding:.5rem .5rem .5rem .7rem; border-radius:6px; border:none; background:none; cursor:pointer;
  text-align:left; font-family:var(--f-b); font-size:.76rem; color:var(--ink-500);
  animation:libFileIn .3s ease both; transition:background .15s, color .15s;
}
@keyframes libFileIn{ from{ opacity:0; transform:translateX(-8px); } to{ opacity:1; transform:none; } }
.lib-file::before{ content:""; position:absolute; left:-10px; top:50%; width:9px; height:1px; background:var(--ink-200); }
.lib-file:hover{ background:var(--ink-50); color:var(--ink-900); }
.lib-file.is-active{ background:var(--tc); color:#fff; }
.lib-file.is-active::before{ background:var(--tc); }
.lib-file__dot{ width:7px; height:7px; border-radius:2px; flex-shrink:0; }
.lib-file.is-active .lib-file__dot{ background:#fff !important; }
.lib-file__name{ flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.lib-file__ext{ flex-shrink:0; font-family:var(--f-d); font-weight:700; font-size:.6rem; opacity:.6; }

.lib-tree__results-h{ font-family:var(--f-d); font-weight:700; font-size:.72rem; color:var(--ink-400); text-transform:uppercase; letter-spacing:.06em; padding:.4rem .5rem .6rem; }

/* ── Visor ─────────────────────────────────────────────────── */
.lib-viewer{ padding:1.75rem 2.25rem 2.25rem; }
.lib-viewer__path{ display:flex; align-items:center; gap:.4rem; margin-bottom:1.4rem; font-family:var(--f-d); font-size:.78rem; color:var(--ink-400); }
.lib-viewer__path button{ background:none; border:none; cursor:pointer; font:inherit; color:var(--ink-400); padding:0; transition:color .2s; }
.lib-viewer__path button:hover{ color:var(--cta); }
.lib-viewer__path span{ color:var(--ink-900); font-weight:600; }
.lib-viewer__grid-h{ display:flex; align-items:baseline; justify-content:space-between; margin-bottom:1.1rem; }
.lib-viewer__grid-h h3{ font-family:var(--f-d); font-weight:700; font-size:1.25rem; color:var(--ink-900); }
.lib-viewer__grid-h span{ font-size:.78rem; color:var(--ink-400); }

/* ── Vista previa de página — dibujada en CSS ────────────────── */
.doc-page{ position:relative; flex-shrink:0; background:#fff; border:1px solid var(--ink-100); border-radius:8px; overflow:hidden; box-shadow:0 4px 10px -6px rgba(11,27,44,.15); display:flex; flex-direction:column; }
.doc-page--sm{ width:56px; height:72px; }
.doc-page--lg{ width:150px; height:194px; }
.doc-page__bar{ height:16px; flex-shrink:0; display:flex; align-items:center; justify-content:center; color:#fff; }
.doc-page--lg .doc-page__bar{ height:38px; }
.doc-page__body{ position:absolute; top:16px; left:0; right:0; bottom:0; padding:6px 7px; display:flex; flex-direction:column; gap:6px; }
.doc-page--lg .doc-page__body{ top:38px; padding:16px 14px; gap:11px; }
.doc-page__line{ display:block; height:4px; border-radius:2px; background:var(--ink-200); flex-shrink:0; }
.doc-page--lg .doc-page__line{ height:8px; border-radius:3px; }
.doc-page__grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:4px; }
.doc-page__grid span{ display:block; aspect-ratio:1.3; border-radius:2px; }
.doc-page__chart{ display:flex; align-items:flex-end; gap:4px; flex:1; }
.doc-page--lg .doc-page__chart{ gap:8px; }
.doc-page__chart span{ flex:1; border-radius:2px 2px 0 0; opacity:.85; min-height:6px; }
.doc-page__fold{ position:absolute; top:16px; right:0; width:0; height:0; border-style:solid; border-width:0 14px 14px 0; border-color:transparent currentColor transparent transparent; filter:brightness(.85); opacity:.9; }
.doc-page--lg .doc-page__fold{ top:38px; border-width:0 20px 20px 0; }
/* ── Icono de formato real (PDF/DOC/XLS/WEB) ──────────────── */
.fmt-icon{ position:absolute; bottom:6px; right:6px; display:flex; align-items:center; gap:3px; border-radius:5px; padding:.2rem .4rem; }
.fmt-icon__label{ font-family:var(--f-d); font-weight:800; font-size:.5rem; letter-spacing:.03em; color:#fff; }
.doc-page--lg .fmt-icon{ bottom:10px; right:10px; padding:.3rem .55rem; border-radius:6px; }
.doc-page--lg .fmt-icon__label{ font-size:.68rem; }

/* ── Ficha de documento (grid) ────────────────────────────────── */
.lib-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:1.1rem; }
.doc-card{
  display:flex; flex-direction:column; gap:.9rem; background:#fff; border:1px solid var(--ink-100);
  border-radius:14px; padding:1.1rem 1.2rem; transition:transform .22s ease, box-shadow .22s, border-color .22s;
  animation:libFileIn .35s ease both;
}
.doc-card:hover{ transform:translateY(-4px); box-shadow:0 22px 46px -26px rgba(11,27,44,.28); border-color:transparent; }
.doc-card__top{ display:flex; gap:.9rem; align-items:flex-start; }
.doc-card__info{ min-width:0; display:flex; flex-direction:column; gap:.3rem; }
.doc-card__type{ font-family:var(--f-d); font-weight:700; font-size:.64rem; letter-spacing:.09em; text-transform:uppercase; }
.doc-card__title{ font-family:var(--f-d); font-weight:700; font-size:.94rem; line-height:1.3; color:var(--ink-900); text-wrap:pretty; }
.doc-card__meta{ font-family:var(--f-d); font-size:.7rem; color:var(--ink-400); font-weight:500; }
.doc-card__foot{ display:flex; align-items:center; justify-content:space-between; gap:.75rem; padding-top:.85rem; border-top:1px solid var(--ink-100); margin-top:auto; }
.doc-card__view{ display:inline-flex; align-items:center; gap:.4rem; font-family:var(--f-d); font-weight:600; font-size:.78rem; color:var(--cta); background:none; border:none; cursor:pointer; padding:.3rem 0; transition:color .2s; }
.doc-card__view:hover{ color:var(--navy-900); }
.doc-card__dl{ display:grid; place-items:center; width:32px; height:32px; border-radius:50%; border:1.5px solid var(--ink-100); background:#fff; color:var(--ink-500); cursor:pointer; transition:all .2s; }
.doc-card__dl:hover{ border-color:var(--cta); color:#fff; background:var(--cta); }

/* ── Destacado (sin fotos) ────────────────────────────────────── */
.lib-feat{ display:flex; gap:1.75rem; align-items:center; background:linear-gradient(120deg,var(--navy-900) 0%,#0b2340 100%); border-radius:16px; padding:1.75rem; margin-bottom:1.75rem; animation:libFileIn .4s ease both; }
.lib-feat__body{ display:flex; flex-direction:column; gap:.5rem; }
.lib-feat__tag{ font-family:var(--f-d); font-weight:700; font-size:.7rem; letter-spacing:.12em; text-transform:uppercase; color:var(--c3); }
.lib-feat__body h3{ font-family:var(--f-d); font-weight:700; font-size:clamp(1.2rem,2vw,1.55rem); color:#fff; line-height:1.2; }
.lib-feat__body p{ color:rgba(255,255,255,.75); font-size:.86rem; line-height:1.55; max-width:44ch; }
.lib-feat__acts{ display:flex; gap:.6rem; margin-top:.5rem; flex-wrap:wrap; }

/* ── Vista detalle de un archivo (dentro del visor) ───────────── */
.lib-detail{ display:flex; gap:1.75rem; align-items:flex-start; animation:libDetailIn .3s ease; }
@keyframes libDetailIn{ from{ opacity:0; transform:translateY(8px); } to{ opacity:1; transform:none; } }
.lib-detail__info{ display:flex; flex-direction:column; gap:.65rem; min-width:0; }
.lib-detail__type{ display:inline-flex; align-items:center; gap:.4rem; width:fit-content; font-family:var(--f-d); font-weight:700; font-size:.68rem; letter-spacing:.08em; text-transform:uppercase; color:#fff; border-radius:99px; padding:.35rem .75rem; }
.lib-detail__info h3{ font-family:var(--f-d); font-weight:700; font-size:1.3rem; color:var(--ink-900); line-height:1.3; }
.lib-detail__info p{ color:var(--ink-500); font-size:.9rem; line-height:1.6; max-width:52ch; }
.lib-detail__meta{ display:flex; gap:1.2rem; flex-wrap:wrap; font-size:.78rem; color:var(--ink-400); padding:.7rem 0; border-top:1px solid var(--ink-100); border-bottom:1px solid var(--ink-100); }
.lib-detail__meta strong{ color:var(--ink-900); font-family:var(--f-d); }
.lib-detail__acts{ display:flex; gap:.65rem; margin-top:.3rem; flex-wrap:wrap; }

@media(max-width:900px){
  .lib-explorer{ grid-template-columns:1fr; }
  .lib-tree{ position:static; border-right:none; border-bottom:1px solid var(--ink-100); }
  .lib-feat, .lib-detail{ flex-direction:column; align-items:flex-start; }
}
@media(max-width:640px){
  .lib-grid{ grid-template-columns:1fr; }
  .lib-viewer{ padding:1.5rem 1.25rem 1.75rem; }
}
