/* ══════════════════════════════════════════════════════════════════════════ shell.css · La carcasa de navegacion de The Grow Mode ────────────────────────────────────────────────────────────────────────── DOS patrones, no uno que se encoge: · Escritorio → barra lateral plegable (300 px con etiquetas / 56 px solo iconos). El estado se recuerda por dispositivo. · Movil → barra inferior de iconos, al alcance del pulgar. NO hay hamburguesa: anadiria un clic a lo que hoy se alcanza directo. DOS MODOS de montaje (los decide shell.js, no el HTML): · ABSORBER (el CRM) → el CRM YA TIENE .app{grid:300px 1fr} + .sidebar + .rail-items + .sb-footer. La carcasa se INYECTA dentro de esa barra. No cuesta ni un pixel de ancho util: reutiliza los 300 que ya se gastan. Aqui NO se dibuja marca, ni cuenta, ni barra inferior: ya existen. · AUTONOMO (Agenda panel, Viral Scanner) → esas paginas no tienen barra. La carcasa se dibuja entera y empuja el contenido con padding sobre . NO toca la altura de ninguna cabecera. El kanban del CRM depende de max-height:calc(100vh - 260px) y se rompe en silencio si eso cambia. Se enlaza SIEMPRE con ?v= (lo pone herramientas/sellar-version.mjs). herramientas/comprobar-enlaces.mjs falla si una pagina interna lo enlaza sin version, y falla tambien si una pagina PUBLICA lo menciona siquiera. ══════════════════════════════════════════════════════════════════════════ */ /* Los colores salen de las variables del CRM cuando existen, y si no, del sistema de diseno tal cual. Asi la carcasa se ve igual dentro del CRM que sola en el Scanner, sin duplicar la paleta en dos sitios. */ :root{ --sh-bg: var(--dark, #0E0E14); --sh-bg2: var(--dark2, #13131f); --sh-acc: var(--gp2, #9A57F5); --sh-acc-d:var(--gp1, #6D28D9); --sh-acc-l:var(--gp3, #D3A4FF); --sh-acc-bg: var(--gd, rgba(154,87,245,0.10)); --sh-acc-bd: var(--gb, rgba(154,87,245,0.28)); --sh-bd: var(--border, rgba(255,255,255,0.07)); --sh-bd2: var(--border2,rgba(255,255,255,0.14)); --sh-muted:var(--muted, rgba(255,255,255,0.57)); --sh-bright:var(--bright,#fff); --sh-ease: var(--ease, cubic-bezier(.16,1,.3,1)); --sh-w: 300px; --sh-w-min: 56px; --sh-bottom-h: 58px; } /* ── ARMAZON, MODO AUTONOMO ─────────────────────────────────────────────── */ body.shell-host{ padding-left: var(--sh-w); transition: padding-left .22s var(--sh-ease); } body.shell-host.sidebar-collapsed{ padding-left: var(--sh-w-min); } .shell{ position:fixed; top:0; left:0; z-index:80; width: var(--sh-w); height:100vh; display:flex; flex-direction:column; background: var(--sh-bg2); border-right:0.5px solid var(--sh-bd2); font-family: Barlow, system-ui, -apple-system, sans-serif; color: var(--sh-bright); overflow:hidden; transition: width .22s var(--sh-ease); } body.sidebar-collapsed .shell{ width: var(--sh-w-min); } /* En modo ABSORBER no hay