/* Свайп по диалогу — кнопки действий справа (dialog-swipe.js) */
/* Строка — точка отсчёта для кнопок и обрезает их за своим краем. Для ВСЕХ строк
   свайпа (диалоги и уведомления): без этого у уведомления кнопки отсчитывались
   от всего списка и растягивались на его высоту */
.dsw-item { position: relative; overflow: hidden; touch-action: pan-y; }
.dsw-drag > * { will-change: transform; }
/* Копия точки «в сети» на время сдвига (holdDot в dialog-swipe.js) */
.dsw-dot { position: absolute; z-index: 2; box-sizing: border-box; border-radius: 50%; pointer-events: none; }
.dsw-drag > .dsw-dot { will-change: auto; }
.dsw-dot-held .dialog-info .online-dot { visibility: hidden; }
/* Кнопки — сразу за правым краем строки; при свайпе едут вместе с ней */
.dsw-tray {
    position: absolute; top: 0; bottom: 0; left: 100%;
    display: flex; align-items: stretch;
}
.dsw-btn {
    flex: 1 1 0; min-width: 0; border: 0; margin: 0; padding: 0 4px;
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
    color: #fff; font: inherit; font-size: 11px; font-weight: 600; line-height: 1.1;
    cursor: pointer; -webkit-tap-highlight-color: transparent;
}
.dsw-btn svg { width: 20px; height: 20px; flex: 0 0 auto; }
.dsw-btn span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; }
.dsw-btn:active { filter: brightness(.9); }
/* Цвета — в гамме сайта: прочтение и закрепление — фиолетовые, архив — тёплый */
.dsw-read    { background: #8e7cc3; }
.dsw-pin,
.dsw-unpin   { background: #7c5cff; }
.dsw-archive { background: #e08a3c; }
.dsw-mute,
.dsw-unmute  { background: #7d8597; }
.dsw-restore { background: #3fae7a; }
.dark-theme .dsw-read    { background: #6f5fa6; }
.dark-theme .dsw-pin,
.dark-theme .dsw-unpin   { background: #6447d9; }
.dark-theme .dsw-archive { background: #b86f2e; }
.dark-theme .dsw-mute,
.dark-theme .dsw-unmute  { background: #5c6373; }
.dark-theme .dsw-restore { background: #2f8a60; }
@media (prefers-reduced-motion: reduce) {
    .dsw-item > * { transition: none !important; }
}

/* На сенсорных экранах маленькие кнопки строки (закрепить, скрыть, вернуть)
   не показываем: те же действия — свайпом влево, крупно и под палец. Сами
   кнопки остаются в разметке — свайп нажимает именно их (dialog-swipe.js).
   На компьютере свайпа нет, там кнопки на месте. */
@media (pointer: coarse) {
    .dialog-item .dialog-pin-btn,
    .dialog-item .dialog-mute-btn,
    .dialog-item .dialog-close-btn,
    .dialog-item .restore-dialog-btn { display: none !important; }
    /* Кнопок справа не видно — значку непрочитанных место под них не нужно:
       иначе он висел посреди строки (отступ под три кнопки, style.css) */
    .dialog-item .unread-count { margin-right: 6px !important; }
    /* И тексту последнего сообщения резервировать под них нечего */
    .dialog-item.has-preview .dialog-preview { margin-right: 0 !important; }
    .dialog-item .dialog-live { right: 0 !important; }
    /* Удержание ссылки — наше меню, а не перетаскивание и не меню браузера */
    .dialog-item a { -webkit-user-drag: none; -webkit-touch-callout: none; -webkit-user-select: none; user-select: none; }
}

/* Одноразовое обучение (dialog-swipe.js, tutRun): облачко над строкой,
   стрелка указывает на выехавшие кнопки. top/right ставит скрипт. */
.dsw-tip {
    --dsw-arrow: 40px;
    position: fixed; z-index: 2000; max-width: min(300px, calc(100vw - 32px));
    /* Облачко у панели диалогов лежит вне <body> — шрифт задаём сами */
    font-family: "Fira Sans", sans-serif;
    padding: 10px 14px; border-radius: 14px;
    background: #7c5cff; color: #fff; font-size: 13px; line-height: 1.35;
    box-shadow: 0 8px 24px rgba(40, 20, 90, .35);
    pointer-events: none;
    display: flex; flex-direction: column; align-items: flex-end; gap: 8px;
    opacity: 0; transform: translateY(-6px);
    transition: opacity .25s ease, transform .3s cubic-bezier(.32, .72, 0, 1);
}
.dsw-tip b { font-weight: 700; }
.dsw-tip.on { opacity: 1; transform: none; pointer-events: auto; }
.dsw-tip > div { align-self: stretch; }
.dsw-tip-ok {
    border: 0; border-radius: 10px; padding: 6px 14px; cursor: pointer;
    background: #fff; color: #5b3fd6; font: inherit; font-size: 13px; font-weight: 700;
    -webkit-tap-highlight-color: transparent;
}
.dsw-tip-ok:active { transform: scale(.95); }
:root.dark-theme-root .dsw-tip-ok { background: #efeaff; color: #4a32b8; }
.dsw-tip.below { transform: translateY(6px); }
.dsw-tip.below.on { transform: none; }
/* Стрелка-уголок к кнопкам */
.dsw-tip::after {
    content: ''; position: absolute; right: var(--dsw-arrow); top: 100%;
    border: 7px solid transparent; border-top-color: #7c5cff;
}
.dsw-tip.below::after { top: auto; bottom: 100%; border-top-color: transparent; border-bottom-color: #7c5cff; }
:root.dark-theme-root .dsw-tip { background: #6447d9; box-shadow: 0 8px 24px rgba(0, 0, 0, .5); }
:root.dark-theme-root .dsw-tip::after { border-top-color: #6447d9; }
:root.dark-theme-root .dsw-tip.below::after { border-top-color: transparent; border-bottom-color: #6447d9; }

/* Уведомления (dialog-swipe.js): «Прочитано» и «Удалить» */
.dsw-nread   { background: #8e7cc3; }
.dsw-ndelete { background: #d64545; }
.dark-theme .dsw-nread   { background: #6f5fa6; }
.dark-theme .dsw-ndelete { background: #b23a3a; }

/* Крестик уведомления на телефоне не нужен — удаление свайпом (кнопка остаётся
   в разметке: свайп нажимает именно её) */
@media (pointer: coarse) {
    .notif-item .notif-delete-btn { display: none !important; }
}

/* Строка обучения прокручена за край списка — облачко прячется (dialog-swipe.js, place) */
.dsw-tip.on.away { opacity: 0; pointer-events: none; }

/* Узкие кнопки (четыре на телефоне) — подпись мельче, чтобы влезла целиком */
.dsw-tight .dsw-btn { font-size: 10px; padding: 0 2px; }
.dsw-tight .dsw-btn svg { width: 18px; height: 18px; }

/* Подсказка про свайп — только там, где он есть */
@media (pointer: fine) { .swipe-indicator { display: none !important; } }