/* ═════════ Левое меню, круг 3 (владелец, 19.10.2026) ═════════
   «Значки маленькие, текст мелкий, всё слиплось — разделите визуально, как в kokonut»; «Мои задачи
   и Воронки — два главных поля»; «в свёрнутом — значки крупные, как в amoCRM»; «логотип крупнее,
   цифры скромнее»; «тема и свернуть — под профилем». Поверх dz-theme.css. Цвета — только токены. */

/* ── широкое ── */
html:not([data-dz-off]) body:not(.nav-collapsed) .side{width:264px}
html:not([data-dz-off]) body:not(.nav-collapsed) .main{margin-left:264px}
html:not([data-dz-off]) body:not(.nav-collapsed) .nav{padding:0 12px 10px}

/* логотип крупнее */
html:not([data-dz-off]) body:not(.nav-collapsed) .logo{padding:16px 18px 10px}
html:not([data-dz-off]) body:not(.nav-collapsed) .logo-img{height:50px}
html:not([data-dz-off]) body:not(.nav-collapsed) .logo .brand.rd-brand{font-size:19px;line-height:1.08}

html:not([data-dz-off]) body:not(.nav-collapsed) .nav-group{display:flex;align-items:center;gap:10px;
  margin:6px 0 2px;padding:9px 10px 3px;border-top:1px solid var(--line);
  font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
html:not([data-dz-off]) body:not(.nav-collapsed) .nav > .nav-group:first-child{margin-top:0;border-top:0;padding-top:4px}

html:not([data-dz-off]) body:not(.nav-collapsed) .nav > button{position:relative;gap:12px;padding:3px 10px 3px 6px;margin:1px 0;
  border-radius:12px;font-size:15px;font-weight:500;line-height:1.25;color:var(--ink)}
html:not([data-dz-off]) body:not(.nav-collapsed) .nav > button .ico{flex:0 0 34px;width:34px;height:34px;display:inline-flex;
  align-items:center;justify-content:center;border-radius:10px;background:var(--hover);opacity:1;font-size:18px;
  color:var(--muted);transition:background .15s,color .15s}
html:not([data-dz-off]) body:not(.nav-collapsed) .nav > button .ico .dz-svg{width:20px;height:20px}
html:not([data-dz-off]) body:not(.nav-collapsed) .nav > button:hover{background:var(--hover)}
html:not([data-dz-off]) body:not(.nav-collapsed) .nav > button:hover .ico{background:var(--panel);color:var(--ink);box-shadow:var(--sh-1)}
html:not([data-dz-off]) body:not(.nav-collapsed) .nav > button.active{background:var(--soft-gold);color:var(--ink-gold);font-weight:600}
html:not([data-dz-off]) body:not(.nav-collapsed) .nav > button.active .ico{background:var(--gold-fill);color:var(--on-gold);box-shadow:var(--sh-1)}
html:not([data-dz-off]) body:not(.nav-collapsed) .nav > button.active::before{content:"";position:absolute;left:-12px;top:8px;bottom:8px;
  width:3px;border-radius:0 3px 3px 0;background:var(--gold-fill)}

/* счётчики — скромно: просто серое число, без плашки */
html:not([data-dz-off]) body:not(.nav-collapsed) .nav > button .dz-cnt{min-width:0;padding:0;background:transparent;
  font-size:12px;font-weight:500;color:var(--muted);font-variant-numeric:tabular-nums}
html:not([data-dz-off]) body:not(.nav-collapsed) .nav > button.active .dz-cnt{background:transparent;color:var(--ink-gold)}

/* «Главное»: «Мои задачи» и «Воронки» — наверху своей группой, размером как все пункты (владелец, 19.10.2026) */

/* Низкие окна: меню прокручивается, значки НЕ сжимаем (владелец, 05.09.2026) — ужимаем только воздух */
@media (max-height:860px){
  html:not([data-dz-off]) body:not(.nav-collapsed) .nav > button{padding:2px 10px 2px 6px;margin:0}
  html:not([data-dz-off]) body:not(.nav-collapsed) .nav-group{margin-top:4px;padding-top:6px}
  html:not([data-dz-off]) body:not(.nav-collapsed) .logo-img{height:40px}
}

/* ── узкое: крупные значки, как в amoCRM; группы — тонкой линией ── */
html:not([data-dz-off]) body.nav-collapsed .side{width:100px}
html:not([data-dz-off]) body.nav-collapsed .main{margin-left:100px}
html:not([data-dz-off]) body.nav-collapsed .logo-img{height:46px}
html:not([data-dz-off]) body.nav-collapsed .nav{padding:2px 0}
html:not([data-dz-off]) body.nav-collapsed .nav > button{width:76px;height:52px;padding:0;margin:1px auto;border-radius:16px;background:transparent}
html:not([data-dz-off]) body.nav-collapsed .nav > button .ico{width:60px;height:52px;display:inline-flex;align-items:center;justify-content:center;
  border-radius:16px;background:transparent;opacity:1;color:var(--muted);transition:background .15s,color .15s}
html:not([data-dz-off]) body.nav-collapsed .nav > button .ico .dz-svg{width:32px;height:32px;stroke-width:1.6}
html:not([data-dz-off]) body.nav-collapsed .nav > button:hover{background:transparent}
html:not([data-dz-off]) body.nav-collapsed .nav > button:hover .ico{background:var(--hover);color:var(--ink)}
html:not([data-dz-off]) body.nav-collapsed .nav > button.active{background:transparent}
html:not([data-dz-off]) body.nav-collapsed .nav > button.active .ico{background:var(--gold-fill);color:var(--on-gold);box-shadow:var(--sh-1)}
html:not([data-dz-off]) body.nav-collapsed .nav > button .dz-cnt{top:3px;right:4px;min-width:16px;height:16px;padding:0 4px;
  font-size:9.5px;line-height:16px;font-weight:600}
html:not([data-dz-off]) body.nav-collapsed .nav-group[data-grp]{display:block;height:0;margin:4px 22px;padding:0;
  border-top:1px solid var(--line);font-size:0;overflow:hidden}
html:not([data-dz-off]) body.nav-collapsed .nav > .nav-group:first-child{display:none}
@media (max-height:860px){
  html:not([data-dz-off]) body.nav-collapsed .nav > button{height:46px}
  html:not([data-dz-off]) body.nav-collapsed .nav > button .ico{height:46px}
  html:not([data-dz-off]) body.nav-collapsed .nav-group[data-grp]{margin:2px 22px}
}

/* «Мой кабинет» открывается кликом по профилю внизу — отдельным пунктом не дублируем.
   Кнопка остаётся в разметке (на неё завязаны адрес /home и запасной раздел) — только скрыта. */
html:not([data-dz-off]) .nav > button[data-view="home"]{display:none}

/* Выход — только в «Моём кабинете» (кнопка «Выйти из профиля»), в меню значка нет */
html:not([data-dz-off]) .side-foot .uc-logout,
html:not([data-dz-off]) .side-foot .user-chip.rd-chip .uc-logout,
html:not([data-dz-off]) body.nav-collapsed .side-foot .user-chip.rd-chip .uc-logout{display:none}

/* ── Под профилем: «Тема» и «Свернуть меню» — всегда здесь, в одном месте (js/84_dz3-nav.js) ── */
.dz3n-bar{display:none}
html:not([data-dz-off]) .dz3n-bar{display:flex;gap:6px;padding:0 12px 10px;flex:none}
html:not([data-dz-off]) .dz3n-bar .dz3n-btn{position:static;flex:1 1 0;display:flex;align-items:center;justify-content:center;gap:7px;
  width:auto;height:32px;margin:0;padding:0 8px;border:1px solid var(--line);border-radius:10px;background:var(--panel);
  color:var(--muted);font-size:12.5px;font-weight:500;box-shadow:none;cursor:pointer;white-space:nowrap}
html:not([data-dz-off]) .dz3n-bar .dz3n-btn:hover{background:var(--hover);color:var(--ink)}
html:not([data-dz-off]) .dz3n-bar .dz3n-btn .lbl{display:inline}
/* короткие подписи: полная — в подсказке */
html:not([data-dz-off]) body:not(.nav-collapsed) .dz3n-bar #dzNavMini .lbl{display:none}
html:not([data-dz-off]) body:not(.nav-collapsed) .dz3n-bar #dzNavMini::after{content:"Свернуть"}
html:not([data-dz-off]) .dz3n-bar .dz3n-ic{display:inline-flex}
html:not([data-dz-off]) body.nav-collapsed .dz3n-bar{justify-content:center;gap:4px;padding:0 8px 10px}
html:not([data-dz-off]) body.nav-collapsed .dz3n-bar .dz3n-btn{flex:none;width:38px;height:34px;padding:0}
html:not([data-dz-off]) body.nav-collapsed .dz3n-bar .dz3n-btn .lbl{display:none}
html:not([data-dz-off]) body.nav-collapsed .dz3n-bar .dz3n-btn svg{width:20px;height:20px}
html:not([data-dz-off]) body:not(.nav-collapsed) .side-foot{padding-bottom:8px}
@media (max-width:900px){ html:not([data-dz-off]) .dz3n-bar #dzNavMini{display:none} }

/* место по высоте: поиск и профиль плотнее */
html:not([data-dz-off]) body:not(.nav-collapsed) .dz-sidesearch{margin-top:6px;margin-bottom:6px}
html:not([data-dz-off]) body:not(.nav-collapsed) .side-foot{padding-top:6px}
html:not([data-dz-off]) body.nav-collapsed .dz-sidesearch{width:60px;height:34px;margin:4px auto}
html:not([data-dz-off]) body.nav-collapsed .side-foot{padding-top:4px;padding-bottom:4px}
