/* Header bell with site news (Oct 29, 2026). Markup in main.tpl (tools/news_bell/install.php), logic in js/ppb-bell.js,
   data from /ppb-news.php. The button is a fixed 44 px square from the first paint and the badge is absolute, so loading
   the count never moves the header. */
.ppb-bell {position: relative; flex: 0 0 auto; width: 44px; height: 44px;}
.ppb-bell__btn {display: inline-flex; align-items: center; justify-content: center; position: relative; width: 44px; height: 44px;
	margin: 0; padding: 0; border: 0; border-radius: 10px; background: none; color: var(--ppb-ink-2, #454a52); cursor: pointer;
	box-shadow: none; -webkit-tap-highlight-color: transparent;}
.ppb-bell__btn:hover, .ppb-bell__btn[aria-expanded="true"] {background: var(--ppb-surface-2, #eef0f2); color: var(--ppb-ink, #161616);}
.ppb-bell__btn:focus-visible {outline: 2px solid var(--ppb-accent, #3BA79A); outline-offset: 2px;}
.ppb-bell__btn svg {width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;}
.ppb-bell__badge {position: absolute; top: 5px; right: 4px; min-width: 18px; height: 18px; padding: 0 5px; box-sizing: border-box;
	border-radius: 9px; border: 2px solid #fff; background: #e5484d; color: #fff; font: 700 11px/14px Manrope, Arial, sans-serif;
	text-align: center; letter-spacing: 0;}
.ppb-bell__badge[hidden] {display: none;}

.ppb-bell__panel {position: absolute; top: calc(100% + 8px); right: -6px; z-index: 1000; width: 380px; max-height: min(560px, 75vh);
	display: flex; flex-direction: column; background: #fff; border: 1px solid var(--ppb-line, #e3e5e8); border-radius: 14px;
	box-shadow: 0 12px 32px rgba(22, 22, 22, .12); text-align: left; overflow: hidden;}
.ppb-bell__panel[hidden] {display: none;}
.ppb-bell__head {display: flex; align-items: center; justify-content: space-between; padding: 14px 10px 10px 18px;
	border-bottom: 1px solid var(--ppb-line, #e3e5e8);}
.ppb-bell__title {font: 700 16px/1.3 Manrope, Arial, sans-serif; color: var(--ppb-ink, #161616);}
.ppb-bell__close {display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; padding: 0; border: 0;
	border-radius: 8px; background: none; color: var(--ppb-muted, #6b6f76); cursor: pointer; box-shadow: none;}
.ppb-bell__close:hover {background: var(--ppb-surface-2, #eef0f2); color: var(--ppb-ink, #161616);}
.ppb-bell__close svg {width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round;}
.ppb-bell__list {overflow-y: auto; overscroll-behavior: contain; padding: 6px 0;}
.ppb-bell__item {display: grid; grid-template-columns: 56px minmax(0, 1fr); gap: 12px; align-items: start; padding: 12px 18px;
	color: var(--ppb-ink, #161616) !important; text-decoration: none !important;}
.ppb-bell__item:hover {background: var(--ppb-surface, #f7f8f9);}
.ppb-bell__item + .ppb-bell__item {border-top: 1px solid var(--ppb-surface-2, #eef0f2);}
.ppb-bell__media {width: 56px; height: 42px; border-radius: 8px; overflow: hidden; background: var(--ppb-surface-2, #eef0f2);
	display: flex; align-items: center; justify-content: center; color: var(--ppb-ink, #161616);}
.ppb-bell__media img {display: block; width: 100%; height: 100%; object-fit: cover;}
.ppb-bell__media svg {width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;}
.ppb-bell__item--ai .ppb-bell__media {background: #161616; color: #7fd6cb;}
.ppb-bell__t {display: block; font: 600 15px/1.35 Manrope, Arial, sans-serif; color: var(--ppb-ink, #161616);}
.ppb-bell__x {display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; margin-top: 3px;
	font: 400 13.5px/1.45 Manrope, Arial, sans-serif; color: var(--ppb-muted, #6b6f76);}
.ppb-bell__d {display: flex; align-items: center; gap: 6px; margin-top: 5px; font: 500 12.5px/1.3 Manrope, Arial, sans-serif; color: var(--ppb-muted, #6b6f76);}
.ppb-bell__item--new .ppb-bell__d::before {content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--ppb-accent, #3BA79A);}
.ppb-bell__empty {padding: 28px 18px; font: 400 14px/1.5 Manrope, Arial, sans-serif; color: var(--ppb-muted, #6b6f76);}
.ppb-bell__shade {display: none;}

/* the bell takes the free space on its left unless the language switch (which comes first) already does */
.header .ppb-bell {margin-left: auto;}
.header .ppb-lang ~ .ppb-bell {margin-left: 0;}
/* tablets: the bell sits between Авторизация and the menu button */
@media (max-width: 1219px) {
.header .ppb-bell ~ .header__btn-menu {margin-left: 0;}
}
/* phones: the bell joins the language row, right before the menu button; the panel is a full width sheet from the top */
@media (max-width: 760px) {
.header .ppb-bell, .header .ppb-lang ~ .ppb-bell {order: 2; margin-left: auto;}
.header .ppb-bell ~ .header__btn-menu, .header .ppb-lang ~ .ppb-bell ~ .header__btn-menu {margin-left: 4px;}
.ppb-bell__panel {position: fixed; top: 0; left: 0; right: 0; width: auto; max-height: 85vh; border: 0; border-radius: 0 0 16px 16px;
	box-shadow: 0 16px 40px rgba(22, 22, 22, .18);}
.ppb-bell__head {padding: 12px 8px 10px 20px;}
.ppb-bell__close {width: 44px; height: 44px;}
.ppb-bell__item {padding: 14px 20px;}
.ppb-bell__shade {display: block; position: fixed; inset: 0; z-index: 999; background: rgba(22, 22, 22, .35);}
.ppb-bell__shade[hidden] {display: none;}
}