/* Altgram — системные уведомления (notify.js): плашка «Включить уведомления»
   над списком чатов и тост напоминания с «Открыть». Цвета — только токены
   темы, светлая и тёмная получаются сами. */

/* ---- плашка над списком чатов ---- */
.ntf-banner{
  display:flex;align-items:flex-start;gap:12px;flex:0 0 auto;
  margin:4px 8px 6px;padding:12px 12px 12px 12px;border-radius:14px;
  background:var(--accent-soft);border:1px solid var(--border);
  animation:ntfIn .25s cubic-bezier(.2,.9,.3,1);
}
@keyframes ntfIn{from{opacity:0;transform:translateY(-6px)}}
.ntf-banner-ico{
  flex:none;width:36px;height:36px;border-radius:50%;display:grid;place-items:center;
  background:linear-gradient(135deg,var(--accent-deep),var(--accent));color:var(--on-accent);
}
.ntf-banner-body{flex:1;min-width:0}
.ntf-banner-title{font-weight:700;font-size:14.5px;color:var(--text);line-height:1.25}
.ntf-banner-sub{font-size:12.5px;color:var(--text-2);line-height:1.35;margin-top:2px}
.ntf-banner-acts{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.ntf-banner-acts .btn{padding:7px 14px;font-size:13px;border-radius:10px}
.ntf-banner-later{background:transparent;color:var(--text-2)}
.ntf-banner-later:hover{color:var(--text)}
/* Только в разделе «Чаты» и не во время поиска (результаты занимают место списка). */
.sidebar[data-tab]:not([data-tab="chats"]) > .ntf-banner{display:none!important}
.sidebar:has(> .search-results:not([hidden])) > .ntf-banner{display:none}

/* ---- строка в профиле ---- */
.ntf-row.is-disabled{opacity:.75}
.ntf-row.is-disabled input{cursor:not-allowed}

/* ---- тост с действием (напоминание) ---- */
/* .toasts — fixed с left:50%: без явной ширины тост сжимается до половины
   экрана и на телефоне рвёт текст по слогам. max-content + предел — короткий
   остаётся компактным, длинный переносится по словам. */
.toast.ntf-toast{
  display:flex;align-items:center;gap:10px;pointer-events:auto;
  padding:8px 6px 8px 14px;width:max-content;max-width:min(calc(100vw - 24px),460px);
}
.ntf-toast-text{flex:1;min-width:0;overflow-wrap:anywhere;line-height:1.35}
.ntf-toast-act{
  flex:none;padding:6px 10px;border-radius:8px;font-weight:700;font-size:13.5px;
  color:var(--accent);background:var(--accent-soft);
}
.ntf-toast-act:hover{filter:brightness(1.1)}
.ntf-toast-x{flex:none;width:28px;height:28px;border-radius:8px;display:grid;place-items:center;color:var(--muted)}
.ntf-toast-x:hover{background:var(--hover);color:var(--text)}
.toast.ntf-toast.is-out{opacity:0;transform:translateY(10px);transition:opacity .3s,transform .3s}
/* Пока тост с действием на экране, стопка тостов стоит над полем ввода /
   нижней панелью (высоту считает liftToasts в notify.js). */
.toasts.ntf-lift{bottom:var(--ntf-lift,20px);transition:bottom .18s ease}
/* Сенсорный экран: наведения (паузы по нему) нет — нажатия ловят только
   кнопки, а через текст тоста можно нажать то, что под ним. */
@media (hover:none){
  .toast.ntf-toast{pointer-events:none}
  .ntf-toast-act,.ntf-toast-x{pointer-events:auto}
}