@charset "UTF-8";

/* ===== /assets/css/onboarding.css ===== */
/* onboarding.css — оформление подсказок Driver.js под тему Torkzt.
   Подключать ПОСЛЕ driver.css */

.driver-popover.torkzt-tour {
    background: var(--t-bg-elevated, #1a1c20);
    color: var(--t-text, #e8eaed);
    border-radius: 14px;
    box-shadow: 0 18px 50px rgba(0, 0, 0, .5);
    max-width: 320px;
    padding: 16px;
}

.driver-popover.torkzt-tour .driver-popover-title {
    font-size: 1rem;
    font-weight: 700;
    margin-bottom: 6px;
}

.driver-popover.torkzt-tour .driver-popover-description {
    font-size: .875rem;
    line-height: 1.45;
    color: var(--t-text-muted, #9aa0a6);
}

.driver-popover.torkzt-tour .driver-popover-progress-text {
    font-size: .75rem;
    color: var(--t-text-faint, #6b7178);
}

.driver-popover.torkzt-tour .driver-popover-navigation-btns button {
    background: rgba(255, 255, 255, .08);
    color: var(--t-text, #e8eaed);
    border: 0;
    border-radius: 8px;
    padding: 6px 14px;
    font-size: .85rem;
    font-weight: 600;
    text-shadow: none;
}

.driver-popover.torkzt-tour .driver-popover-navigation-btns button:hover {
    background: rgba(255, 255, 255, .14);
}

/* последняя кнопка (Далее / Понятно) — акцентная */
.driver-popover.torkzt-tour .driver-popover-navigation-btns button:last-child {
    background: linear-gradient(135deg, #ff9900, #ff5500);
    color: #fff;
}

.driver-popover.torkzt-tour .driver-popover-close-btn {
    color: var(--t-text-muted, #9aa0a6);
}

/* стрелка попапа — в цвет фона */
.driver-popover.torkzt-tour .driver-popover-arrow-side-left.driver-popover-arrow   { border-left-color:   var(--t-bg-elevated, #1a1c20); }
.driver-popover.torkzt-tour .driver-popover-arrow-side-right.driver-popover-arrow  { border-right-color:  var(--t-bg-elevated, #1a1c20); }
.driver-popover.torkzt-tour .driver-popover-arrow-side-top.driver-popover-arrow    { border-top-color:    var(--t-bg-elevated, #1a1c20); }
.driver-popover.torkzt-tour .driver-popover-arrow-side-bottom.driver-popover-arrow { border-bottom-color: var(--t-bg-elevated, #1a1c20); }

/* светлая тема */
body:not([data-bs-theme='dark']) .driver-popover.torkzt-tour {
    background: #fff;
    color: #212529;
}
body:not([data-bs-theme='dark']) .driver-popover.torkzt-tour .driver-popover-description { color: #6c757d; }
body:not([data-bs-theme='dark']) .driver-popover.torkzt-tour .driver-popover-navigation-btns button {
    background: #f1f3f5;
    color: #212529;
}
body:not([data-bs-theme='dark']) .driver-popover.torkzt-tour .driver-popover-arrow-side-left.driver-popover-arrow   { border-left-color:   #fff; }
body:not([data-bs-theme='dark']) .driver-popover.torkzt-tour .driver-popover-arrow-side-right.driver-popover-arrow  { border-right-color:  #fff; }
body:not([data-bs-theme='dark']) .driver-popover.torkzt-tour .driver-popover-arrow-side-top.driver-popover-arrow    { border-top-color:    #fff; }
body:not([data-bs-theme='dark']) .driver-popover.torkzt-tour .driver-popover-arrow-side-bottom.driver-popover-arrow { border-bottom-color: #fff; }

@media (max-width: 576px) {
    .driver-popover.torkzt-tour { max-width: 88vw; padding: 14px; }
}


/* ===== /assets/css/release_comments.css ===== */
/* release_comments.css — современный тёмный стиль комментариев */

#release-comments {
    margin-top: 2.5rem;
    color: #e8e8ea;
}

/* заголовок */
.cmt-header { display:flex; align-items:center; gap:.6rem; margin-bottom:1.25rem; }
.cmt-header h3 { color:#fff; font-weight:700; }
.cmt-header .cmt-count {
    background: linear-gradient(135deg,#4a90e2,#007aff);
    color:#fff; border-radius:12px; padding:1px 10px; font-size:.8rem; font-weight:600;
}

/* форма ввода */
.cmt-form-main { margin-bottom: 1.75rem; }
.cmt-input, .cmt-input-main {
    width:100%;
    border:1px solid rgba(255,255,255,.12);
    border-radius:14px;
    padding:14px 16px;
    background: rgba(255,255,255,.04);
    color:#e8e8ea;
    resize: vertical;
    font-size:.95rem;
    line-height:1.5;
    transition: border-color .15s, background .15s;
}
.cmt-input::placeholder, .cmt-input-main::placeholder { color:#8a8a92; }
.cmt-input:focus, .cmt-input-main:focus {
    outline:none;
    border-color:#4a90e2;
    background: rgba(255,255,255,.06);
}
.cmt-form-main .btn, .cmt-form .btn { margin-top:.65rem; border-radius:10px; }

/* элемент коммента */
.cmt-item { display:flex; gap:14px; padding:14px 0; }
.cmt-thread { padding-bottom:8px; margin-bottom:8px; }
.cmt-thread:not(:last-child) { border-bottom:1px solid rgba(255,255,255,.07); }

/* ветка ответов — линия слева */
.cmt-replies { margin-top:6px; position:relative; }
.cmt-item.cmt-reply {
    margin-left: 20px;
    padding:12px 0 12px 20px;
    border-left:2px solid rgba(255,255,255,.08);
}

/* аватар */
.cmt-avatar {
    width:44px; height:44px; min-width:44px; border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    color:#fff; font-weight:700; font-size:19px;
    box-shadow: 0 2px 8px rgba(0,0,0,.3);
}
.cmt-reply .cmt-avatar { width:36px; height:36px; min-width:36px; font-size:16px; }

.cmt-content { flex:1; min-width:0; }

/* шапка коммента */
.cmt-head { display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:3px; }
.cmt-author { font-weight:600; color:#fff; font-size:.95rem; }
.cmt-time { color:#7a7a82; font-size:.8rem; }
.cmt-edited { color:#6a6a72; font-style:italic; font-size:.75rem; }
.cmt-pin { color:#ffc857; font-size:.78rem; font-weight:600; }

/* тело */
.cmt-body {
    margin:2px 0 8px;
    color:#d0d0d5;
    line-height:1.55;
    font-size:.95rem;
    word-wrap:break-word;
}

/* упоминания */
.cmt-mention { color:#5aa9ff; font-weight:600; text-decoration:none; }
.cmt-mention:hover { text-decoration:underline; }

/* спойлер */
.cmt-spoiler {
    background:#2a2a30; color:transparent; border-radius:5px; padding:1px 6px;
    cursor:pointer; user-select:none; transition:color .15s;
}
.cmt-spoiler::before { content:"спойлер"; color:#8a8a92; font-size:.85em; }
.cmt-spoiler.revealed { color:#d0d0d5; background:#2a2a30; cursor:auto; }
.cmt-spoiler.revealed::before { content:""; }

/* действия */
.cmt-actions { display:flex; align-items:center; gap:2px; flex-wrap:wrap; }
.cmt-actions button {
    background:none; border:none; color:#8a8a92;
    font-size:.82rem; padding:4px 10px; border-radius:8px; cursor:pointer;
    transition: background .12s, color .12s;
}
.cmt-actions button:hover { background: rgba(255,255,255,.07); color:#e8e8ea; }
.cmt-vote { font-weight:500; }
.cmt-vote.active.cmt-like { color:#4ade80; }
.cmt-vote.active.cmt-dislike { color:#f87171; }
.cmt-reply-btn, .cmt-edit-btn, .cmt-del-btn { font-size:.8rem; }
.cmt-del-btn:hover { color:#f87171 !important; }

/* инлайн-форма ответа */
.cmt-reply-form:not(:empty) { margin-top:10px; }
.cmt-reply-form .cmt-form { display:flex; flex-direction:column; gap:6px; }
.cmt-reply-form .btn { align-self:flex-start; }

/* пусто */
.cmt-list .text-muted { color:#7a7a82 !important; }

/* ===== /assets/css/footer.css ===== */
/* Torkzt · footer.css — подвал сайта.
 *
 * Вынесено из инлайнового <style> в stdfoot.php: он ехал в каждый ответ и
 * не кэшировался.
 *
 * Главная правка вёрстки — раскладка ссылок. Было три бутстраповских
 * колонки, где на телефоне ссылки делились на две по col-6. Подпись
 * «Пользовательское соглашение» в половину ширины экрана не помещалась и
 * рвалась на две строки с большим межстрочным интервалом — читалось как
 * сбой. Теперь на телефоне один столбец, на десктопе — две тематические
 * колонки рядом с логотипом.
 */

.site-footer {
    margin-top: 40px;
    padding: 40px 0 28px;
    border-top: 1px solid rgba(128, 128, 128, .18);
    background: #fff;
}

/* ── верхняя часть ── */

.footer-top {
    display: grid;
    grid-template-columns: minmax(220px, 1.4fr) 1fr 1fr;
    gap: 32px;
    align-items: start;
}

.footer-brand { min-width: 0; }

.footer-logo {
    display: inline-block;
    margin-bottom: 10px;
}

.footer-logo img { display: block; height: auto; }

.footer-tagline {
    /* тэглайн на index.php выводится как <h1> ради SEO — размер задаём
       здесь, чтобы он не наследовал кегль заголовка первого уровня */
    font-size: .9rem;
    font-weight: 400;
    line-height: 1.5;
    color: #6c757d;
    margin: 0;
    max-width: 280px;
}

.footer-col { min-width: 0; }

.footer-col-title {
    margin-bottom: 12px;
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: #9aa2ab;
}

.footer-links {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-links li { margin-bottom: 9px; }
.footer-links li:last-child { margin-bottom: 0; }

.footer-links a {
    text-decoration: none;
    font-size: .9rem;
    line-height: 1.45;
    color: #6c757d;
    transition: color .15s;
}

.footer-links a:hover { color: #0a58ca; }
.footer-links a.active-link { color: #0a58ca; font-weight: 600; }

/* ── нижняя строка ── */

.footer-sep {
    margin: 28px 0 18px;
    opacity: .15;
}

.footer-bottom {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px 20px;
    font-size: .85rem;
    color: #6c757d;
}

.footer-rights { white-space: nowrap; }
.footer-counters { line-height: 0; }

.footer-debug {
    margin-top: 14px;
    font-size: .78rem;
    line-height: 1.6;
    color: #8a9099;
    text-align: center;
}

/* ── тост нового сообщения ──
   Инлайновые style с карточки тоста переехали сюда. */

#newMsgToast {
    border-radius: 16px;
    background: rgba(28, 30, 33, .85);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

#newMsgToast .toast-ico {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .1);
    font-size: 22px;
}

#newMsgToast .toast-title {
    font-size: 14px;
    font-weight: 500;
    letter-spacing: .3px;
}

#newMsgToast .btn-close { opacity: .6; }

/* ── лог SQL ── */

.sql-debug {
    max-width: 100%;
    margin: 12px 0 0;
    padding: 10px 12px;
    border-top: 1px solid rgba(128, 128, 128, .2);
    background: rgba(128, 128, 128, .06);
    font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
    font-size: 11px;
    line-height: 1.5;
    color: #7a828a;
    overflow-x: auto;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.sql-debug b { color: #5a6169; }

/* ── тёмная тема ── */

body[data-bs-theme='dark'] .site-footer { background: rgb(33, 37, 41); }
body[data-bs-theme='dark'] .footer-tagline,
body[data-bs-theme='dark'] .footer-bottom,
body[data-bs-theme='dark'] .footer-links a { color: #9aa0a6; }
body[data-bs-theme='dark'] .footer-links a:hover { color: #5aa9ff; }
body[data-bs-theme='dark'] .footer-col-title { color: #7d858e; }

/* ── планшет ── */

@media (max-width: 991px) {
    .footer-top { grid-template-columns: 1fr 1fr; gap: 28px; }
    .footer-brand { grid-column: 1 / -1; }
    .footer-tagline { max-width: none; }
}

/* ── телефон ── */

@media (max-width: 575px) {
    .site-footer { margin-top: 32px; padding: 32px 0 24px; }

    /* Один столбец вместо двух: в половину ширины экрана длинные подписи
       не помещались и разрывались посередине слова. */
    .footer-top { grid-template-columns: 1fr; gap: 26px; }
    .footer-brand { grid-column: auto; }

    .footer-links li { margin-bottom: 12px; }
    .footer-links a { font-size: .95rem; }

    .footer-sep { margin: 22px 0 16px; }

    .footer-bottom { justify-content: center; text-align: center; }
    .footer-rights { white-space: normal; }
}


/* ===== /assets/css/ad_slot.css ===== */
/* ============================================================
   Torkzt · assets/css/ad_slot.css
   Рекламный слот с резервом места: блок не прыгает при загрузке.
   Дописать в home.css ИЛИ подключить отдельно.
   ============================================================ */

/* ── слот: место зарезервировано ДО загрузки ──
   Размер должен совпадать с реальным баннером сетки,
   иначе скачок вернётся. Подставь свои значения. */
.ad-slot {
    position: relative;
    width: 100%;
    /* резерв: не фиксированная высота, а минимальная —
       баннер может прийти чуть выше, блок подрастёт вниз,
       а не сдвинет весь контент */
    min-height: 250px;
    margin: 0 0 18px;
    border-radius: 14px;
    /* overflow:hidden НЕ ставим — обрежет высокий креатив.
       Слот растёт под реальную высоту баннера. */
    background: #f4f6f9;
    /* высота блока = высота содержимого, чтобы соседи
       не оказались под баннером */
    display: flow-root;
    /* плавно подстраиваемся, если реальный баннер иного размера */
    transition: min-height .25s ease;
}

/* сам контейнер, куда сетка отрисует баннер.
   Именно он задаёт итоговую высоту слота. */
.ad-slot__frame {
    position: relative;
    z-index: 2;
    width: 100%;
    /* баннер не должен вылезать вбок за колонку */
    max-width: 100%;
}
.ad-slot__frame iframe,
.ad-slot__frame img { max-width: 100%; }

/* ── плейсхолдер «загружается» ── */
.ad-slot__ph {
    position: absolute;
    inset: 0;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    pointer-events: none;
    /* мягкий шиммер вместо мёртвого серого */
    background: linear-gradient(100deg,
        #f4f6f9 30%, #e9edf3 50%, #f4f6f9 70%);
    background-size: 200% 100%;
    animation: ad-shimmer 1.4s linear infinite;
}

.ad-slot__ph-text {
    font-size: .74rem;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: #9aa3af;
}

.ad-slot__ph svg {
    width: 22px;
    height: 22px;
    color: #c2c9d4;
}

@keyframes ad-shimmer { to { background-position: -200% 0; } }

/* ── состояния ── */

/* баннер отрисовался — плейсхолдер убираем, резерв снимаем */
.ad-slot.is-loaded { min-height: 0; background: transparent; }
.ad-slot.is-loaded .ad-slot__ph { display: none; }

/* реклама не пришла (блокировщик, нет заполнения, таймаут) —
   схлопываем слот полностью, чтобы не висела пустая дыра */
.ad-slot.is-empty {
    min-height: 0;
    margin: 0;
    background: transparent;
}
.ad-slot.is-empty .ad-slot__ph { display: none; }

@media (prefers-reduced-motion: reduce) {
    .ad-slot__ph { animation: none; }
}

/* ── мобильные: баннер обычно ниже ── */
@media (max-width: 575px) {
    .ad-slot { min-height: 200px; margin-bottom: 12px; }
}

/* ── тёмная тема (отключена, включим позже) ────────────────
body[data-bs-theme='dark'] .ad-slot { background: #1c1e23; }
body[data-bs-theme='dark'] .ad-slot__ph {
    background: linear-gradient(100deg, #1c1e23 30%, #24272d 50%, #1c1e23 70%);
    background-size: 200% 100%;
}
body[data-bs-theme='dark'] .ad-slot__ph-text { color: #6b7280; }
*/