/* ============================================================
   Chrome compartido de TODO el ERP: topbar, insignia de empresa,
   menu de usuario, tira de indicadores (UF/UTM/USD). Un solo
   archivo servido desde admin.gerentus.com -si se edita aca, el
   cambio se ve en facturador/contabilidad/inventario/ventas/rrhh/
   erpx a la vez, sin tocar cada repo por separado.
   Depende de los tokens --primary/--primary-dark/--primary-soft/
   --navy/--navy-dark/--line/--ink/--muted/--danger ya declarados
   en el :root de cada modulo (via admin.gerentus.com/theme.php).
   ============================================================ */
.topbar{min-height:70px;height:auto;background:linear-gradient(120deg,var(--navy),var(--navy-dark));border:0;padding:10px 28px;color:#fff;box-shadow:0 4px 18px rgba(23,40,64,.14);display:flex;align-items:center;justify-content:space-between;gap:16px;position:sticky;top:0;z-index:20}
.brand{display:flex;align-items:center;gap:14px;color:#fff;letter-spacing:.04em;min-width:0}
.brand-logo{width:150px;height:auto;max-height:42px;object-fit:contain;display:block;flex-shrink:0}
.brand-module{font-size:12px;font-weight:800;letter-spacing:.14em;color:#ffe0a9;border-left:1px solid rgba(255,255,255,.28);padding-left:14px;white-space:nowrap}
.mobile-menu-btn{display:none;border:0;background:rgba(255,255,255,.12);color:#fff;width:36px;height:36px;border-radius:8px;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0}
.mobile-menu-btn:hover{background:rgba(255,255,255,.22)}
.user{display:flex;align-items:center;gap:12px;margin-left:auto;min-width:0}

/* Tira de indicadores del dia (UF/UTM/USD/EUR), muy pequeña, entre la
   marca y el resto del header -actualizada 1 vez al dia desde
   mindicador.cl por un timer compartido. */
.indicadores-strip{display:flex;align-items:center;gap:12px;font-size:11px;color:#cfe0f0;white-space:nowrap;overflow:hidden}
.indicador-item{display:inline-flex;align-items:center;gap:3px;font-variant-numeric:tabular-nums}
.indicador-item b{color:#ffdda7;font-weight:800;font-size:9.5px;letter-spacing:.04em}
.indicador-fecha{color:#8fa3ba;font-size:10px;padding-left:4px;border-left:1px solid rgba(255,255,255,.16)}

.company-badge{display:flex;align-items:center;gap:10px;padding:6px 16px 6px 6px;border-radius:999px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);min-width:0}
.company-badge-icon{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:rgba(255,255,255,.16);color:#fff;flex:none}
.company-badge-icon svg{width:15px;height:15px;display:block}
.company-badge-text{display:flex;flex-direction:column;line-height:1.3;min-width:0}
.company-badge-text strong{font-size:13px;font-weight:700;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:280px}
.company-badge-text span{font-size:11.5px;color:#b9cadb;font-variant-numeric:tabular-nums}

.usermenu-wrap{position:relative;flex:none}
.usermenu summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:9px;padding:6px 12px 6px 6px;border-radius:999px;transition:background .15s ease;user-select:none;border:1px solid rgba(255,255,255,.18)}
.usermenu summary::-webkit-details-marker{display:none}
.usermenu summary::marker{content:''}
.usermenu summary:hover{background:rgba(255,255,255,.12)}
.usermenu-avatar{width:30px;height:30px;border-radius:50%;background:linear-gradient(135deg,var(--navy),var(--navy-dark));color:#fff;display:flex;align-items:center;justify-content:center;font-size:12.5px;font-weight:700;flex-shrink:0}
.usermenu-name{font-weight:700;font-size:13.5px;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:160px}
.usermenu-caret{color:#b9cadb;font-size:9px;transition:transform .15s ease;margin-left:2px}
.usermenu[open] .usermenu-caret{transform:rotate(180deg)}
.usermenu-panel{position:absolute;right:0;top:calc(100% + 10px);background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 16px 36px rgba(23,46,73,.18);min-width:220px;padding:7px;display:flex;flex-direction:column;z-index:30}
.usermenu-panel a{padding:10px 12px;border-radius:8px;color:var(--ink);text-decoration:none;font-size:13.5px;font-weight:600;display:flex;align-items:center;gap:10px}
.usermenu-panel a:hover{background:var(--primary-soft);color:var(--primary-dark)}
.usermenu-panel .usermenu-icon{width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center;color:var(--muted)}
.usermenu-panel .usermenu-icon svg{width:15px;height:15px}
.usermenu-panel a:hover .usermenu-icon{color:var(--primary-dark)}
.usermenu-divider{height:1px;background:var(--line);margin:6px 8px}
.usermenu-panel a.danger{color:var(--danger)}
.usermenu-panel a.danger .usermenu-icon{color:var(--danger)}
.usermenu-panel a.danger:hover{background:#fff0f0}

/* ============================================================
   Sidebar completo del ERP (acordeon con TODOS los modulos activos,
   no solo el modulo actual) -mismo componente en todos lados, para que
   cambiar de modulo no se sienta como entrar a otro sistema. */
.shell{display:grid;grid-template-columns:236px minmax(0,1fr);align-items:start;min-height:calc(100vh - 70px);transition:grid-template-columns .18s ease}
.shell.collapsed{grid-template-columns:64px minmax(0,1fr)}
.shell.collapsed .sidebar-head h3,.shell.collapsed .nav-group>span{display:none}
.shell.collapsed .nav-group a{justify-content:center;padding:9px}
.shell.collapsed .nav-label{display:none}
.sidebar{background:linear-gradient(180deg,var(--navy),var(--navy-dark));padding:14px 12px 18px;color:#fff;position:sticky;top:70px;min-height:calc(100vh - 70px);max-height:calc(100vh - 70px);overflow-y:auto;overflow-x:hidden}
.sidebar-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:4px 6px 14px;border-bottom:1px solid rgba(255,255,255,.14);margin-bottom:12px}
.sidebar-head h3{margin:0;font-size:13px;color:#fff;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sidebar-toggle{border:0;background:rgba(255,255,255,.1);color:#fff;width:28px;height:28px;border-radius:7px;display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0}
.sidebar-toggle:hover{background:rgba(255,255,255,.2)}
.nav-icon{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:8px;background:rgba(255,255,255,.08);flex:none;transition:background .15s ease}
.nav-icon svg{width:17px;height:17px;display:block}
.nav-label{overflow:hidden;text-overflow:ellipsis}
.sidebar-backdrop{display:none}
.nav-modules{display:grid;gap:2px}
.nav-module{border-radius:9px;overflow:hidden}
.nav-module-head{display:flex;align-items:center;gap:11px;width:100%;border:0;background:none;color:#fff;font-size:13px;font-weight:700;padding:9px 10px;border-radius:9px;cursor:pointer;text-align:left}
.nav-module-head:hover{background:rgba(255,255,255,.09)}
.nav-module.open>.nav-module-head{background:var(--primary);color:var(--navy)}
.nav-module.open>.nav-module-head .nav-module-icon .nav-icon{background:rgba(255,255,255,.25)}
.nav-module-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nav-chevron{transition:transform .15s ease;flex-shrink:0}
.nav-module.open .nav-chevron{transform:rotate(90deg)}
.nav-module-items{display:none;background:rgba(0,0,0,.16);padding:4px 0 6px;margin-top:1px;border-radius:0 0 9px 9px}
.nav-module.open .nav-module-items{display:grid;gap:1px}
.nav-module-items a{display:flex;align-items:center;gap:10px;padding:8px 10px 8px 20px;color:#b7c4d6;font-size:12.5px;font-weight:600;border-radius:0;text-decoration:none}
.nav-module-items a:hover{background:rgba(255,255,255,.07);color:#fff}
.nav-module-items a .nav-icon{width:24px;height:24px;background:none}
.nav-module-items a.active{background:var(--primary-soft);color:var(--primary-dark);font-weight:800}
.nav-module-items a.active .nav-icon{background:none;color:var(--primary-dark)}
.shell.collapsed .nav-module-name,.shell.collapsed .nav-chevron{display:none}
.shell.collapsed .nav-module-items{display:none!important}
.shell.collapsed .nav-module-head{justify-content:center;padding:9px}
@media(max-width:760px){
  .shell{display:block;position:relative}
  .sidebar-toggle{display:none}
  .sidebar{position:fixed;top:0;left:0;bottom:0;width:264px;max-height:none;z-index:40;transform:translateX(-100%);transition:transform .2s ease;padding-top:80px;box-shadow:8px 0 30px rgba(15,26,43,.25)}
  .shell.mobile-open .sidebar{transform:translateX(0)}
  .sidebar-backdrop{display:block;position:fixed;inset:0;background:rgba(15,26,43,.5);z-index:30;opacity:0;pointer-events:none;transition:opacity .2s ease}
  .shell.mobile-open .sidebar-backdrop{opacity:1;pointer-events:auto}
}

@media(max-width:1050px){
  .topbar{padding:10px 14px}
  .brand-logo{width:128px}
  .brand-module{display:none}
  .indicadores-strip{display:none}
  .user .company-badge{display:none}
}
@media(max-width:760px){
  .mobile-menu-btn{display:flex}
  .topbar{align-items:flex-start;gap:10px}
  .user{flex-wrap:wrap;justify-content:flex-end}
}
@media(max-width:640px){
  .usermenu-name{max-width:70px}
}
