/* place_social.css — ИСТОЧНИКИ-НА-СТРАНИЦЕ-ЗАВЕДЕНИЯ-1 (25.10.2026).

   Задача: «показать источники/соцсети заведения на странице /place/place.php».
   Блок стоит в панели «О заведении» (#place_info), сразу под строкой «Сайт:»,
   поэтому фон у него тёмный — «таблетки» ресурсов (.cb-collective-link из
   place_links.css) здесь не годятся: они белые и рассчитаны на светлый фон
   раздела «Ресурсы заведения». Здесь своя, такая же по форме «таблетка»:
   полупрозрачная подложка, тонкий кант, значок .cb-ni из links_icons.css.

   Тёмная панель задаёт ссылкам цвет через `#slider .cb-pg-panel a { color: … }`
   — селектор с id, поэтому свои правила пишем с тем же id и классом ссылки,
   иначе цвет перебьётся и подпись сольётся с фоном.

   Телефон 375px: строка — flex с переносом (flex-wrap), «таблетки» не
   растягиваются (flex: 0 0 auto) и не вылезают за панель (max-width: 100%),
   длинная подпись переносится внутри своей кнопки. Панель сама скроллится
   (overflow-y: auto в place_v2.tpl), поэтому лишняя строка страницу не ломает. */

#slider .cb-pg-panel-social { margin-top: 8px; }

#slider .cb-pg-panel-social .cb-pg-social-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 6px;
}

#slider .cb-pg-panel a.cb-pg-social-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex: 0 0 auto;
  max-width: 100%;
  padding: 5px 10px;
  border-radius: 14px;
  background: rgba(255, 255, 255, .08);
  border: 1px solid rgba(255, 255, 255, .18);
  color: #cfd8e3;
  font-size: 13px;
  line-height: 1.2;
  text-decoration: none;
  box-sizing: border-box;
}

#slider .cb-pg-panel a.cb-pg-social-link:hover,
#slider .cb-pg-panel a.cb-pg-social-link:focus {
  border-color: #4fc8f2;
  color: #fff;
}

#slider .cb-pg-panel a.cb-pg-social-link .cb-ni { margin-top: -1px; }

/* Узкий телефон: кегль и отступы на шаг меньше — две «таблетки» встают в ряд. */
@media (max-width: 480px) {
  #slider .cb-pg-panel a.cb-pg-social-link { font-size: 12px; padding: 5px 9px; }
}