/* Estructura Sites, identidad Valri; no altera contenido ni reglas comerciales. */
.mobile-navigation, .navigation-close { display: none; }
@media screen {
  #sidebar {
    inset: 12px auto 12px 12px;
    width: 226px;
    border: 1px solid #383a3e;
    border-top: 3px solid var(--red);
    border-radius: 18px;
    background: #202124;
    color: #fff;
    padding: 18px 10px 12px;
    box-shadow: 0 5px 16px #10182812;
  }
  #sidebar .sidebar-top { display:flex; align-items:center; justify-content:space-between; gap:6px; margin-bottom:20px; flex-shrink:0; }
  #sidebar .brand { gap:10px; padding:0 4px; }
  #sidebar .sidebar-logo { width:44px; height:44px; flex-basis:44px; background:#fff; border-radius:50%; }
  #sidebar .brand strong { color:#fff; font-size:23px; }
  #sidebar .brand small { color:#c7cbd2; font-size:9px; }
  #sidebar .sidebar-primary { background:var(--red); color:white; border-color:var(--red); justify-content:center; margin-bottom:16px; border-radius:10px; }
  #sidebar .sidebar-primary .nav-icon { color:inherit; }
  #sidebar .sidebar-primary:hover { background:var(--red-dark); }
  #nav { flex:1 1 auto; min-height:0; overflow-y:auto; scrollbar-color:#6b7280 #202124; }
  #sidebar .sidebar-section-label { color:#afb5c0; font-size:9px; padding-inline:10px; }
  #nav .nav-parent-btn { color:#d7dbe2; font-size:13px; gap:10px; min-height:46px; padding-inline:10px; }
  #nav .nav-icon, #sidebar .settings-link .nav-icon { color:#aeb7c6; }
  #nav .nav-parent-btn:hover { background:#303237; color:#fff; }
  #nav .nav-parent-btn[aria-current="page"],
  #nav .nav-group:has(.nav-sub-item.active) > .nav-parent-btn { background:#fff; color:#202124; border-radius:9px; }
  #nav .nav-parent-btn[aria-current="page"] .nav-icon,
  #nav .nav-group:has(.nav-sub-item.active) > .nav-parent-btn .nav-icon { color:var(--red); }
  #nav .nav-sub-items, #nav .nav-group.open .nav-sub-items { border-color:#4b5059; }
  #nav .nav-sub-item { color:#c0c7d2; }
  #nav .nav-sub-item:hover { background:#303237; color:#fff; }
  #nav .nav-sub-item.active { background:#3a2a32; color:#fff; }
  #nav .nav-sub-item.active .sub-bullet { background:#ff7892; }
  #sidebar .sidebar-bottom { flex-shrink:0; border-color:#383a3e; gap:6px; padding-top:10px; }
  #sidebar .help-card { background:#2b2d31; color:#d7dbe2; border-color:#383a3e; }
  #sidebar .help-card span { color:#ff9db0; }
  #sidebar .settings-link { color:#d7dbe2; font-size:13px; padding:10px; }
  #sidebar .settings-link:hover { background:#303237; color:white; }
  #sidebar .prototype-label { color:#adb5c2; font-size:8px; padding-inline:10px; }
  #sidebar button:focus-visible { outline:2px solid #ff9db0; outline-offset:-3px; }
}
@media screen and (max-width:980px) {
  #sidebar { inset:0 auto 0 0 !important; width:min(304px,calc(100vw - 40px)) !important; border-radius:0 16px 16px 0; padding-top:20px; height:100dvh; }
  #sidebar .navigation-close { display:grid; place-items:center; width:44px; height:44px; flex:0 0 44px; color:#d7dbe2; font-size:28px; border-radius:8px; }
  #sidebar .navigation-close:hover { background:#383a3e; }
  body:has(#sidebar.open) { overflow:hidden; }
  #app > .mobile-navigation:not([hidden]) {
    position:fixed; inset:auto 0 0; z-index:9000;
    display:grid; grid-auto-flow:column; grid-auto-columns:minmax(0,1fr);
    min-height:72px; padding:6px 8px calc(6px + env(safe-area-inset-bottom,0px));
    background:#fff; border-top:1px solid var(--line); box-shadow:0 -4px 18px #0f172a08;
  }
  .mobile-navigation button { display:flex; flex-direction:column; justify-content:center; align-items:center; gap:4px; min-width:0; min-height:56px; padding:5px 2px; color:#526077; font-size:10px; line-height:1.3; border-radius:9px; font-weight:550; }
  .mobile-navigation svg { width:20px; height:20px; flex-shrink:0; }
  .mobile-navigation button[aria-current="page"] { background:var(--red-soft); color:var(--red-dark); font-weight:700; }
  .mobile-navigation button:hover, .mobile-navigation button[aria-expanded="true"] { background:#f1f3f7; }
  .mobile-navigation button:focus-visible { outline:2px solid var(--red); outline-offset:-2px; }
  #app #main { padding-bottom:calc(104px + env(safe-area-inset-bottom,0px)); }
}
@media screen and (max-height:600px) and (max-width:980px) {
  #app > .mobile-navigation:not([hidden]) { min-height:60px; padding-top:3px; padding-bottom:calc(3px + env(safe-area-inset-bottom,0px)); }
  .mobile-navigation button { min-height:48px; gap:2px; }
}
@media print { .mobile-navigation, .navigation-close { display:none !important; } }

/* Un acceso al menú en el mismo punto de quiebre de la barra inferior. */
.navigation-session { display:none; }
@media screen and (max-width:980px) {
  #app:has(> .mobile-navigation:not([hidden])) #menu { display:none !important; }
  #sidebar .navigation-session { display:flex; flex-direction:column; gap:2px; padding:8px 10px; color:#eef0f3; font-size:13px; line-height:1.4; overflow-wrap:anywhere; }
  #sidebar .navigation-session span { color:#bdc4ce; font-size:11px; }
}

/* Créditos es una consulta dentro de cotizaciones de solo material. */
#nav .nav-sub-branch { min-width:0; }
#nav .nav-sub-children { margin-left:14px; padding-left:8px; border-left:1px solid #4b5059; }
#nav .nav-sub-children .nav-sub-item { font-size:12px; min-height:44px; }
#nav .nav-sub-branch:has(.nav-sub-children .active) > .nav-sub-item { color:#fff; font-weight:650; }