/* Connected Community — левое меню и выравнивание страницы под него.
   Часть оформления портала. Файлы подключаются в templates/index.html по порядку номеров: поздние правила перебивают ранние. */
/* =========================================================
   ЛЕВОЕ МЕНЮ (второстепенные разделы)
   ========================================================= */
.sidenav{
  width:232px;flex-shrink:0;
  padding:28px 0 60px;
  display:flex;flex-direction:column;gap:4px;
  position:sticky;top:calc(var(--masthead-h,70px) + 0px);
  align-self:flex-start;
  transition:width .15s ease;
}
.nav-item.side{
  display:flex;align-items:center;gap:10px;
  padding:10px 12px;border-radius:10px;
  font-size:14px;font-weight:600;color:var(--ink-soft);
  white-space:nowrap;overflow:hidden;
}
.nav-item.side i{font-style:normal;font-size:18px;width:24px;text-align:center;flex-shrink:0;}
.nav-item.side:hover{background:var(--surface);color:var(--ink);}
.nav-item.side.active{background:var(--orange);color:#fff;}
.sidenav-toggle{
  margin-top:8px;align-self:flex-start;
  width:32px;height:32px;border-radius:50%;
  border:1px solid var(--border);background:var(--surface);color:var(--ink-soft);
  font-size:18px;line-height:1;cursor:pointer;
}
.sidenav-toggle:hover{border-color:var(--orange);color:var(--orange);}
body.sidenav-collapsed .sidenav{width:56px;}
body.sidenav-collapsed .nav-item.side{padding:10px 0;justify-content:center;}
body.sidenav-collapsed .nav-item.side span{display:none;}
body.sidenav-collapsed .sidenav-toggle{transform:rotate(180deg);align-self:center;}

/* сетка: слева меню, по центру контент, справа виджеты */
.body-row{gap:24px;max-width:1440px;}
.body-row.chat-mode .sidenav,.body-row.org-mode .sidenav{display:flex;}

@media (max-width:1100px){
  .body-row{flex-wrap:wrap;}
  .sidenav{width:100%;position:static;flex-direction:row;flex-wrap:wrap;padding:14px 0 0;gap:6px;}
  .nav-item.side{padding:8px 12px;font-size:13px;}
  .sidenav-toggle{display:none;}
  body.sidenav-collapsed .sidenav{width:100%;}
  body.sidenav-collapsed .nav-item.side span{display:inline;}
  body.sidenav-collapsed .nav-item.side{padding:8px 12px;}
}

/* ---- левое меню: заголовок и иконка бота ---- */
.sidenav-title{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:0.08em;color:var(--ink-soft);padding:0 12px 6px;}
.sidenav-title:not(:first-child){margin-top:18px;}   /* одинаковый отступ между всеми группами (08.10.2026) */
body.sidenav-collapsed .sidenav-title{display:none;}
.nav-item.side i img{width:22px;height:22px;object-fit:contain;display:block;}
.nav-item.side.active i img{filter:brightness(0) invert(1);}

/* ---- чат: без анимации появления (она застревала на прозрачности) ---- */
.body-row.chat-mode .main.fade-in{animation:none !important;opacity:1 !important;}
/* ---- левое меню: сворачивание перебивает всё ---- */
@media (min-width:1101px){
  body.sidenav-collapsed .sidenav{width:56px !important;}
}
.brand{cursor:pointer;}
.brand:hover .brand-name{color:var(--orange);}

/* ---- единый знак портала: домик + «Connected Community» в стиле логотипа ---- */
.brand{gap:10px;align-items:center;}
.brand-mark-img{height:40px;width:auto;display:block;}
.brand-wordmark{
  font-family:'Samsung Sans','Golos Text',sans-serif;font-weight:800;font-size:19px;line-height:0.98;
  letter-spacing:-0.02em;color:var(--orange);text-align:left;
}
.brand:hover .brand-wordmark{color:#E65C00;}
.brand-logo,.brand-divider,.brand-text{display:none;}
.site-footer-brand{display:flex;align-items:center;gap:8px;font-family:'Samsung Sans','Golos Text',sans-serif;font-weight:800;font-size:15px;color:var(--orange);}
.site-footer-brand img{height:22px;width:auto;}
.site-footer-brand span{color:var(--orange);}

/* =========================================================
   ЛЕВАЯ ПАНЕЛЬ у самого края окна (как в классических порталах)
   ========================================================= */
@media (min-width:1101px){
  .sidenav{
    position:fixed;left:0;top:var(--masthead-h,68px);bottom:0;
    width:232px;padding:18px 10px 20px;
    background:var(--surface);border-right:1px solid var(--border);
    overflow-y:auto;z-index:15;align-self:auto;
  }
  body.sidenav-collapsed .sidenav{width:60px !important;padding:18px 6px;}
  .sidenav-title{padding:0 10px 8px;}
  /* контент и футер сдвигаются вправо на ширину панели */
  .body-row,.site-footer{margin-left:232px;max-width:none;transition:margin-left .15s ease;}
  .body-row{padding:0 40px;}
  body.sidenav-collapsed .body-row,body.sidenav-collapsed .site-footer{margin-left:60px;}
  .body-row.chat-mode{margin-left:232px;}
  body.sidenav-collapsed .body-row.chat-mode{margin-left:60px;}
  .site-footer-inner{max-width:none;}
  /* центральная колонка не шире прежнего, но по центру оставшейся области */
  .body-row:not(.chat-mode):not(.org-mode){max-width:1320px;margin-right:auto;}
  .body-row.org-mode{max-width:none;}
  /* кнопка сворачивания — внизу панели */
  .sidenav-toggle{margin-top:auto;}
}

/* ---- макетные разделы ---- */
.soon-page{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:22px 26px;max-width:760px;}
.soon-page-head{display:flex;align-items:flex-start;gap:16px;padding-bottom:16px;border-bottom:1px solid var(--border);}
.soon-page-mark{font-size:36px;line-height:1;width:56px;height:56px;display:flex;align-items:center;justify-content:center;background:var(--orange-tint);border-radius:14px;flex-shrink:0;}
.soon-page-lead{font-size:15px;line-height:1.55;}
.soon-page-title{font-family:'Samsung Sans','Golos Text',sans-serif;font-weight:800;font-size:15px;margin:16px 0 8px;}
.soon-page-list{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:6px;}
.soon-page-list li{padding:10px 14px;background:var(--bg-soft);border-radius:9px;font-size:14px;border-left:3px solid var(--orange);}
.soon-page .soon-hint{margin-top:16px;}
/* левая панель: больше пунктов — компактнее */
@media (min-width:1101px){.nav-item.side{padding:8px 10px;font-size:13.5px;}.sidenav{gap:2px;}}

/* ---- продукты и доска почёта (страницы) ---- */
.prod-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px;}
.prod-card{background:var(--surface);border:1px solid var(--border);border-top:5px solid var(--orange);border-radius:14px;padding:20px 20px 16px;cursor:pointer;display:flex;flex-direction:column;gap:6px;}
.prod-card:hover{border-color:var(--orange);}
.prod-mark{font-size:32px;line-height:1;margin-bottom:6px;}
.prod-title{font-family:'Samsung Sans','Golos Text',sans-serif;font-weight:800;font-size:19px;}
.prod-sub{font-size:13px;color:var(--ink-soft);line-height:1.4;}
.prod-more{margin-top:auto;padding-top:10px;font-size:13px;font-weight:700;color:var(--orange);}
.honors-list{display:flex;flex-direction:column;gap:12px;}
.honor.past{background:var(--surface);border-color:var(--border);}
.honor.past .honor-label{color:var(--ink-soft);}
/* верхнее меню: 10 пунктов — компактнее */
.nav-tabs{gap:0;}
.nav-item{padding:8px 9px;font-size:13px;}

/* =========================================================
   ВЫРАВНИВАНИЕ ПОД ЛЕВУЮ ПАНЕЛЬ + одинаково во всех браузерах
   ========================================================= */
@media (min-width:1101px){
  /* ширина контейнера = окно минус панель; считаем от 100% (без полосы прокрутки), а не от 100vw */
  .body-row{width:auto !important;max-width:none !important;margin-left:232px;margin-right:0;box-sizing:border-box;}
  body.sidenav-collapsed .body-row{margin-left:60px;}
  /* обычные разделы: центральная колонка ограничена и центрирована в оставшемся месте */
  .body-row:not(.chat-mode):not(.org-mode){max-width:calc(1320px) !important;margin-left:max(232px, calc((100% - 1320px) / 2 + 116px));}
  body.sidenav-collapsed .body-row:not(.chat-mode):not(.org-mode){margin-left:max(60px, calc((100% - 1320px) / 2 + 30px));}
  /* Staff Road Map и чат — на всю оставшуюся ширину */
  .body-row.org-mode,.body-row.chat-mode{max-width:none !important;}
  .body-row.chat-mode{margin-left:232px !important;}
  body.sidenav-collapsed .body-row.chat-mode{margin-left:60px !important;}
  .site-footer{margin-left:232px;}
  body.sidenav-collapsed .site-footer{margin-left:60px;}
}
/* Яндекс/старые сборки Chromium: 100vh может включать панель браузера — используем dvh, где есть */
@supports (height: 100dvh){
  .body-row.chat-mode{height:calc(100dvh - var(--masthead-h,68px) - var(--viewas-h,0px)) !important;max-height:calc(100dvh - var(--masthead-h,68px) - var(--viewas-h,0px)) !important;}
  .body-row.chat-mode .main{height:calc(100dvh - var(--masthead-h,68px) - var(--viewas-h,0px)) !important;max-height:calc(100dvh - var(--masthead-h,68px) - var(--viewas-h,0px)) !important;}
  @media (min-width:1101px){.sidenav{bottom:0;height:auto;}}
}
/* карточки руководителей на Road Map: не уже минимума, переносятся строками при нехватке места */
.org-heads{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));}

/* ---- все обычные разделы: одинаковая колонка, один правый край ---- */
@media (min-width:1101px){
  .body-row:not(.chat-mode):not(.org-mode){width:1320px !important;max-width:calc(100% - 232px) !important;}
  body.sidenav-collapsed .body-row:not(.chat-mode):not(.org-mode){max-width:calc(100% - 60px) !important;}
  .body-row:not(.chat-mode):not(.org-mode) .main{flex:1 1 0 !important;min-width:0;}
  .body-row:not(.chat-mode):not(.org-mode) .side-widgets{width:280px;flex:0 0 280px;}
  .sidenav{transition:none;}  /* без анимации: ширина меняется мгновенно, контент не «плывёт» */
  .body-row,.site-footer{transition:none;}
}

/* ---- кросс-браузерные подстраховки ---- */
/* длинные почты/ссылки не вылезают из карточек */
.person-email,.partner-link,.emp-row b a,.widget-row-name{overflow-wrap:anywhere;word-break:break-word;}
.person-card{min-width:0;}
/* фото ивентов: фиксированная высота на случай, если aspect-ratio не поддерживается */
.gal-photo{height:150px;}
@supports (aspect-ratio:4/3){.gal-photo{height:auto;aspect-ratio:4/3;}}
/* max() для отступов: запасной вариант для старых сборок */
@supports not (margin-left:max(1px,2px)){
  @media (min-width:1101px){
    .body-row:not(.chat-mode):not(.org-mode){margin-left:232px !important;}
    body.sidenav-collapsed .body-row:not(.chat-mode):not(.org-mode){margin-left:60px !important;}
  }
}

/* Пункт-ссылка на другой сайт (Connected Space, 23.10.2026): выглядит как остальные пункты меню */
a.nav-item{color:inherit;text-decoration:none;}
