/* Paleta mínima para que luzca como admin (sin depender de otras vars) */
:root{
    --c-text:#e6f2f7; --c-muted:#9fb5c4; --c-line:#224053;
    --c-chip:#132e3e; --c-card:#0f2533;
  }
  
  .accordion{padding:6px}
  
  /* item contenedor (similar a .node del admin) */
  .accordion .acc-item{
    border:1px solid var(--c-line);
    border-radius:12px;
    background:rgba(16,32,44,.6);
    margin:8px 0;
    overflow:hidden;
  }
  
  /* encabezado botón (similar a .node-head) */
  .accordion .acc-toggle{
    width:100%;
    display:flex; align-items:center; justify-content:space-between; gap:10px;
    padding:10px 12px;
    background:linear-gradient(180deg,#0f2633,#0e2130);
    border:0; border-bottom:1px solid #153245;
    color:var(--c-text);
    font:inherit; text-align:left; cursor:pointer;
  }
  .accordion .acc-title{display:flex; align-items:center; gap:8px; font-weight:600}
  .accordion .acc-title i{color:var(--c-muted)}
  
  /* panel acordeón con animación grid (igual al admin) */
  .accordion .acc-panel{
    display:grid; grid-template-rows:0fr; transition:grid-template-rows .24s ease;
  }
  .accordion .acc-item.open > .acc-panel{
    grid-template-rows:1fr;
  }
  .accordion .acc-panel > .panel-inner{
    overflow:hidden; padding:10px 12px;
  }
  
  /* lista de docs */
  .accordion .doc-list{list-style:none; padding:0; margin:0}
  .accordion .doc-item{
    display:flex; align-items:center; gap:8px;
    padding:6px 8px; background:#113045; border-radius:10px;
    margin:6px 0; color:var(--c-text);
  }
  .accordion .doc-item .doc-badge{
    margin-left:auto; background:#0b2a3c; border:1px solid #27485d;
    padding:3px 8px; border-radius:999px; font-size:12px; color:var(--c-muted);
  }
  
  /* niveles (sangría visual leve) */
  .accordion .level2{margin-left:8px}
  .accordion .level3{margin-left:16px}
  
  /* Animación del chevron (como admin, CSP-safe) */
  .accordion .acc-toggle i.fa-chevron-down{
    transition:transform .2s ease;
    will-change:transform;
  }
  .accordion .acc-item.open > .acc-toggle i.fa-chevron-down,
  .accordion .acc-toggle[aria-expanded="true"] i.fa-chevron-down{
    transform:rotate(-180deg);
  }
  
  /* pequeño hover en encabezado */
  .accordion .acc-toggle:hover{filter:brightness(1.05)}