/**
 * @file tools.css — инструменты страницы: «Избранное» (сердечко, счётчик), «Поделиться», «Добавить в календарь» (js/tools.js), плитка соцсетей.
 * Круглый значок с подписью (соцсети и каналы «Поделиться») — один вид. Кнопки — css/buttons.css; карточки избранного — css/cards.css.
 */
.ee-tools { display: flex; flex-wrap: wrap; align-items: flex-start; gap: var(--ee-s2) var(--ee-s3); margin: var(--ee-s5) 0 0; padding-top: var(--ee-s4); border-top: var(--ee-line) solid var(--border); }
.ee-tools__group { display: flex; flex-wrap: wrap; align-items: center; gap: var(--ee-s2); }
.ee-tools__title, .ee-tools__note { font-size: var(--ee-fs-meta); line-height: var(--ee-lh-meta); color: var(--muted-foreground); }
.ee-tools__note { min-height: var(--ee-lh-meta); }
@media (max-width: 47.99rem) { .ee-tools, .ee-tools__group { flex-direction: column; align-items: stretch; } .ee-tools .ee-btn { width: 100%; } .ee-share__panel { justify-content: center; } }

/* сердечко */
.ee-fav svg { flex: none; }
.ee-fav.is-on { --_fg: var(--destructive); --_bd: var(--destructive); }
.ee-fav.is-on svg { fill: currentColor; }
.ee-fav--card { position: absolute; top: var(--ee-s2); right: var(--ee-s2); z-index: 2; display: inline-flex; align-items: center; justify-content: center; width: var(--ee-control); height: var(--ee-control); padding: 0; border: 0; border-radius: var(--ee-radius-pill); background: color-mix(in oklab, var(--background) 88%, transparent); color: var(--foreground); box-shadow: var(--shadow-sm); cursor: pointer; }
.ee-fav--card:hover { background: var(--background); }
.ee-fav .ee-fav__count { display: inline-flex; align-items: center; justify-content: center; min-width: var(--ee-s5); height: var(--ee-s5); padding: 0 var(--ee-s2); border-radius: var(--ee-radius-pill); background: var(--ee-btn-accent); color: var(--ee-btn-accent-fg); font-size: var(--ee-fs-meta); font-weight: var(--ee-fw-heading); line-height: 1; }
.ee-header__fav { position: relative; display: inline-flex; align-items: center; justify-content: center; min-width: var(--ee-control); min-height: var(--ee-control); border-radius: var(--ee-radius-pill); color: var(--ee-header-fg); text-decoration: none; }
.ee-header__fav:hover { background: var(--ee-btn-soft); box-shadow: inset 0 0 0 var(--ee-line-strong) var(--ee-btn-accent); }
.ee-header__fav [data-ee-fav-count] { position: absolute; top: 0; right: 0; display: inline-flex; align-items: center; justify-content: center; min-width: var(--ee-s4); height: var(--ee-s4); padding: 0 var(--ee-s1); border-radius: var(--ee-radius-pill); background: var(--primary); color: var(--primary-foreground); font-size: var(--ee-fs-meta); font-weight: var(--ee-fw-heading); line-height: 1; }

/* «Поделиться»: кнопка = summary раскрывающегося блока; плитка каналов под кнопкой */
.ee-share { position: relative; }
.ee-share > summary { list-style: none; }
.ee-share > summary::-webkit-details-marker { display: none; }
.ee-share[open] > summary { --_bg: var(--ee-btn-soft); }
.ee-share__panel { display: flex; flex-wrap: wrap; gap: var(--ee-s2) var(--ee-s3); margin-top: var(--ee-s3); padding: var(--ee-s4); border: var(--ee-line) solid var(--border); border-radius: var(--ee-radius-card); background: var(--card); }

/* круглый значок с подписью: каналы «Поделиться» и «Мы в соцсетях» */
.field--name-field-social-links .field__items, .view-social-links .view-content > div { display: flex; flex-wrap: wrap; align-items: flex-start; gap: var(--ee-s3) var(--ee-s4); }
.ee-social__item { margin: 0; }
.ee-share__tile, .ee-social__tile { display: inline-flex; flex-direction: column; align-items: center; gap: var(--ee-s1); min-width: calc(var(--ee-icon) + var(--ee-s2)); max-width: calc(var(--ee-icon) * 2); padding: 0; border: 0; background: none; color: var(--foreground); font: inherit; font-size: var(--ee-fs-meta); line-height: var(--ee-lh-meta); text-align: center; text-decoration: none; cursor: pointer; }
.ee-share__icon, .ee-social__icon { display: inline-flex; align-items: center; justify-content: center; width: var(--ee-icon); height: var(--ee-icon); border: var(--ee-line-strong) solid var(--ee-btn-accent); border-radius: var(--ee-radius-pill); background: transparent; color: var(--ee-btn-accent); transition: background-color var(--ee-motion), color var(--ee-motion); }
:is(.ee-share__tile, .ee-social__tile):is(:hover, :focus-visible) .ee-share__icon, .ee-social__tile:hover .ee-social__icon { background: var(--ee-btn-accent); color: var(--ee-btn-accent-fg); }
.ee-social__name, .ee-share__name { max-width: 100%; color: var(--muted-foreground); overflow-wrap: break-word; }
.ee-social__tile:hover .ee-social__name { color: var(--foreground); }
:is(.ee-share__tile, .ee-social__tile):focus-visible { outline: 3px solid var(--ee-focus); outline-offset: 3px; border-radius: var(--radius); }