/**
 * Torkzt · assets/css/torrent_guest.css
 * Гостевая страница раздачи (torrentPage.php).
 *
 * Страница видна только незалогиненным и поисковикам, поэтому стили
 * самостоятельные: ничего не наследуют от оформления кабинета и ничего
 * туда не отдают. Один файл — вся страница.
 */

.tg-wrap {
    max-width: 960px;
    margin: 0 auto;
    padding: 16px 14px 32px;
}

/* ═══ хлебные крошки ═══ */

.tg-crumbs ol {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    margin: 0 0 16px;
    padding: 0;
    list-style: none;
    font-size: 13px;
}

.tg-crumbs li + li::before {
    content: "›";
    margin-right: 6px;
    opacity: .45;
}

.tg-crumbs a {
    color: inherit;
    text-decoration: none;
    opacity: .7;
}

.tg-crumbs a:hover { opacity: 1; text-decoration: underline; }

.tg-crumbs .is-current {
    opacity: .5;
    /* Длинное название не должно уносить крошки в три строки. */
    max-width: 46ch;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ═══ карточка ═══ */

.tg-card {
    display: flex;
    gap: 24px;
    align-items: flex-start;
}

.tg-poster {
    flex: 0 0 auto;
    width: 230px;
}

.tg-poster img {
    width: 100%;
    height: auto;
    display: block;
    border-radius: 14px;
}

/* Заглушка держит ту же пропорцию 2:3, что и постер: без неё вёрстка
   прыгает между раздачами с обложкой и без. */
.tg-poster-empty {
    width: 100%;
    aspect-ratio: 2 / 3;
    border-radius: 14px;
    background: rgba(128, 128, 128, .12);
}

.tg-body {
    flex: 1 1 auto;
    min-width: 0;
}

.tg-body h1 {
    margin: 0 0 4px;
    font-size: 26px;
    line-height: 1.25;
    font-weight: 700;
}

.tg-year { font-weight: 400; opacity: .55; }

.tg-orig {
    margin-bottom: 10px;
    font-size: 15px;
    opacity: .6;
}

/* ═══ плашки ═══ */

.tg-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 12px 0 16px;
}

.tg-chip {
    padding: 3px 11px;
    border-radius: 999px;
    background: rgba(128, 128, 128, .14);
    font-size: 13px;
    line-height: 1.6;
}

.tg-chip.is-type {
    background: #2b2f36;
    color: #fff;
}

.tg-chip.is-rating {
    background: rgba(240, 180, 40, .18);
    font-weight: 600;
}

/* ═══ описание ═══ */

.tg-descr {
    margin: 0 0 18px;
    font-size: 15px;
    line-height: 1.6;
    overflow-wrap: anywhere;
}

/* ═══ факты ═══ */

.tg-facts {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 8px 22px;
    margin: 0 0 22px;
}

.tg-facts > div {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 6px 0;
    border-bottom: 1px solid rgba(128, 128, 128, .16);
    font-size: 14px;
}

.tg-facts dt { opacity: .6; }

.tg-facts dd {
    margin: 0;
    text-align: right;
    overflow-wrap: anywhere;
}

/* ═══ приглашение ═══ */

.tg-cta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 14px;
    padding: 16px 18px;
    border: 1px solid rgba(128, 128, 128, .22);
    border-radius: 14px;
    background: rgba(128, 128, 128, .06);
}

.tg-cta-text {
    flex: 1 1 260px;
    font-size: 15px;
    line-height: 1.5;
}

.tg-cta-btns {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
}

.tg-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    padding: 0 20px;
    border: 1px solid rgba(128, 128, 128, .3);
    border-radius: 12px;
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
    color: inherit;
    white-space: nowrap;
    transition: background-color .15s, border-color .15s;
}

.tg-btn:hover { background: rgba(128, 128, 128, .12); }

.tg-btn.is-primary {
    background: #2e9e5b;
    border-color: #2e9e5b;
    color: #fff;
}

.tg-btn.is-primary:hover { background: #27874e; border-color: #27874e; }

/* ═══ другие раздачи ═══ */

.tg-others {
    margin-top: 28px;
    padding-top: 20px;
    border-top: 1px solid rgba(128, 128, 128, .2);
}

.tg-others h2 {
    margin: 0 0 12px;
    font-size: 17px;
    font-weight: 600;
}

.tg-others ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.tg-others li {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 14px;
    padding: 9px 0;
    border-bottom: 1px solid rgba(128, 128, 128, .12);
    font-size: 14px;
}

.tg-others a {
    color: inherit;
    text-decoration: none;
    overflow-wrap: anywhere;
}

.tg-others a:hover { text-decoration: underline; }

.tg-others span {
    flex: 0 0 auto;
    opacity: .55;
    white-space: nowrap;
}

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

@media (max-width: 640px) {
    .tg-wrap { padding: 12px 12px 28px; }

    /* Постер сверху по центру: в две колонки на 360px картинке остаётся
       120px, а тексту — остаток, и обрывается и то и другое. */
    .tg-card {
        flex-direction: column;
        align-items: center;
        gap: 16px;
    }

    .tg-poster { width: 180px; }

    .tg-body { width: 100%; }

    .tg-body h1 { font-size: 21px; text-align: center; }

    .tg-orig { text-align: center; }

    .tg-chips { justify-content: center; }

    .tg-facts { grid-template-columns: 1fr; }

    .tg-cta { flex-direction: column; align-items: stretch; }

    .tg-cta-btns { flex-direction: column; }

    .tg-btn { width: 100%; }

    .tg-others li { display: block; }

    .tg-others span { display: block; margin-top: 2px; }
}