/**
 * anime-lite.css — упрощённая классическая страница аниме (2026-11-05).
 * Подключается только при $anime_lite (includes/anime_lite.php). Всё под .av-lite.
 */

/* ---------- HERO ---------- */
.av-lite .anime-hero { margin-bottom: 18px; }
.av-lite .hero-content { padding: 28px; gap: 28px; }
.av-lite .hero-poster { width: 220px; }
.av-lite .hero-original-title { margin-bottom: 12px; }

.av-lite .hero-ratings {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 16px;
}
.av-lite .hero-ratings .hero-rating {
    margin: 0;
    padding: 6px 14px;
    text-decoration: none;
    color: inherit;
}
.av-lite .hero-ratings .hero-rating .score { font-size: 1.3em; }
.av-lite .hero-rating--vibe .score { color: var(--header-accent, #f2cf8d); }
.av-lite .hero-rating--vibe .label { color: rgba(255, 255, 255, 0.78); }

.av-lite .hero-meta-tags { margin-bottom: 18px; gap: 8px; }
.av-lite .hero-tag { white-space: nowrap; }
.av-lite .hero-tag--studio { max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
.av-lite .hero-tag__dot {
    width: 8px;
    height: 8px;
    flex-shrink: 0;
    border-radius: 50%;
    background: #a0a0b8;
}
.av-lite .hero-tag--ongoing .hero-tag__dot { background: #4ade80; box-shadow: 0 0 0 3px rgba(74, 222, 128, 0.2); }
.av-lite .hero-tag--announce .hero-tag__dot { background: #f5a524; }
.av-lite .hero-tag--released .hero-tag__dot { background: #8fa3ff; }

.av-lite .hero-next {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: -8px 0 18px;
    font-size: 0.92em;
    color: rgba(255, 255, 255, 0.75);
}
.av-lite .hero-next i { color: var(--header-accent, #f2cf8d); }
.av-lite .hero-next b { color: #fff; font-weight: 600; white-space: nowrap; }

/* Постер: статус уже есть в тегах; по нажатию — увеличение */
.av-lite .hero-poster .poster-status-label { display: none; }
.av-lite .hero-poster img[data-lite-zoom] { cursor: zoom-in; }
.av-lite .hero-poster:focus-visible { outline: 2px solid var(--header-accent, #f2cf8d); outline-offset: 3px; }

.lite-lightbox {
    position: fixed;
    inset: 0;
    z-index: 10050;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    background: rgba(8, 8, 20, 0.88);
    backdrop-filter: blur(6px);
    cursor: zoom-out;
    animation: lite-lightbox-in 0.18s ease;
}
.lite-lightbox img {
    max-width: min(92vw, 640px);
    max-height: 88vh;
    width: auto;
    height: auto;
    border-radius: 14px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.6);
}
.lite-lightbox__close {
    position: absolute;
    top: 16px;
    right: 16px;
    width: 44px;
    height: 44px;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
}
.lite-lightbox__close:hover { background: rgba(255, 255, 255, 0.22); }
@keyframes lite-lightbox-in { from { opacity: 0; } to { opacity: 1; } }

.av-lite .hero-share { position: relative; }
.av-lite .hero-share__pop {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    z-index: 30;
    padding: 10px;
    border-radius: 12px;
    background: #1b1b33;
    border: 1px solid var(--border, #4a4a6c);
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.45);
}
.av-lite .hero-share__pop[hidden] { display: none; }
.av-lite .hero-share__pop .share-buttons-list { display: flex; gap: 8px; }
.av-lite .hero-share__pop .share-btn {
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
}

/* ---------- PLAYER ---------- */
/* Заголовок «Просмотр» прячем, если в шапке секции нет админ-кнопок */
.av-lite #player-section > .section-head:not(:has(.admin-magnet-controls, .admin-edit-btn)) { display: none; }
.av-lite #player-section > .section-head > h3 { display: none; }

.av-lite .player-source-switcher { gap: 8px; padding: 8px 12px; }
.av-lite .player-source-btn { min-height: 40px; }
.av-lite .lite-watching {
    margin-left: auto;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    color: var(--muted, #a0a0b8);
    white-space: nowrap;
}
.av-lite .lite-watching__dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #4ade80;
    box-shadow: 0 0 0 3px rgba(74, 222, 128, 0.18);
}

/* «Обсудить серию» свёрнуто в одну строку (класс ставит anime-lite.js) */
.av-lite .episode-discussion.lite-collapsible .episode-discussion__head { cursor: pointer; }
.av-lite .episode-discussion.lite-collapsible:not(.is-open) { padding-top: 12px; padding-bottom: 12px; }
.av-lite .episode-discussion.lite-collapsible:not(.is-open) .episode-discussion__form { display: none; }
.av-lite .episode-discussion.lite-collapsible:not(.is-open) .episode-discussion__eyebrow { display: none; }
.av-lite .episode-discussion.lite-collapsible .lite-discussion-chevron {
    margin-left: 8px;
    font-size: 12px;
    color: var(--muted, #a0a0b8);
    transition: transform 0.2s ease;
}
.av-lite .episode-discussion.lite-collapsible.is-open .lite-discussion-chevron { transform: rotate(180deg); }

/* ---------- CONTENT ---------- */
.av-lite .anime-content-left { min-width: 0; }
.av-lite .lite-about {
    background: var(--card, rgba(25, 25, 45, 0.6));
    border: 1px solid var(--border, #4a4a6c);
    border-radius: var(--radius, 14px);
    padding: 20px;
    min-width: 0;
}
/* Комментарии идут сразу под карточкой в левой колонке — без пустоты рядом с сайдбаром */
.av-lite .anime-content-left > .modern-tabs-container { margin-top: 24px; }
.av-lite .anime-sidebar-right { position: sticky; top: 90px; }
.av-lite .description-section h3 { margin-top: 0; }

/* Оценка: одна строка «Понравилось? 👍 N 👎 N» */
.av-lite .section-vibe-rating {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 12px;
    margin-top: 16px !important;
    padding: 14px 0 0 !important;
    background: none !important;
    border: 0 !important;
    border-top: 1px solid var(--border, #4a4a6c) !important;
    border-radius: 0 !important;
    box-shadow: none !important;
}
.av-lite .lite-vibe-q { flex: 1 1 auto; font-weight: 600; text-align: left; }
.av-lite .section-vibe-rating .vibe-rating-controls {
    margin: 0;
    padding: 0;
    gap: 8px;
    justify-content: flex-end;
    background: none;
    border: 0;
}
.av-lite .section-vibe-rating .vibe-score-display { display: none; }
.av-lite .section-vibe-rating .vibe-btn { min-height: 40px; padding: 6px 14px; }
.av-lite .section-vibe-rating .guest-tooltip { flex: 1 1 100%; margin: 0; }
.av-lite .section-vibe-rating.lite-flash { animation: lite-flash 1.6s ease; }
@keyframes lite-flash {
    0%, 60% { box-shadow: 0 0 0 3px rgba(242, 207, 141, 0.55); border-radius: 10px !important; }
    100% { box-shadow: 0 0 0 0 rgba(242, 207, 141, 0); }
}

/* Сайдбар */
.av-lite .lite-news {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 14px;
    padding: 12px 14px;
    border-radius: 12px;
    background: var(--card, rgba(25, 25, 45, 0.6));
    border: 1px solid var(--border, #4a4a6c);
    color: inherit;
    text-decoration: none;
    font-size: 0.92em;
}
.av-lite .lite-news > span { flex: 1 1 auto; min-width: 0; }
.av-lite .lite-news > .fa-bell { color: var(--header-accent, #f2cf8d); }

.av-lite .lite-similar {
    background: var(--card, rgba(25, 25, 45, 0.6));
    border: 1px solid var(--border, #4a4a6c);
    border-radius: var(--radius, 14px);
    padding: 16px;
}
.av-lite .lite-similar__head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    margin-bottom: 12px;
}
.av-lite .lite-similar__head h3 { margin: 0; font-size: 1.1em; }
.av-lite .lite-similar__toggle {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 36px;
    padding: 0;
    border: 0;
    background: none;
    color: inherit;
    font: inherit;
    font-weight: 700;
    cursor: pointer;
}
.av-lite .lite-similar__toggle i {
    font-size: 0.7em;
    color: var(--muted, #a0a0b8);
    transition: transform 0.2s ease;
}
.av-lite .lite-similar.is-collapsed .lite-similar__toggle i { transform: rotate(-90deg); }
.av-lite .lite-similar.is-collapsed .lite-similar__list,
.av-lite .lite-similar.is-collapsed .lite-similar__all { display: none; }
.av-lite .lite-similar.is-collapsed .lite-similar__head { margin-bottom: 0; }
.av-lite .lite-similar__all {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 32px;
    padding: 0 12px;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid var(--border, #4a4a6c);
    color: var(--header-accent, #f2cf8d);
    font-size: 0.82em;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    transition: background 0.15s ease, border-color 0.15s ease;
}
.av-lite .lite-similar__all i { font-size: 0.75em; }
.av-lite .lite-similar__all:hover {
    background: rgba(242, 207, 141, 0.12);
    border-color: rgba(242, 207, 141, 0.45);
    color: var(--header-accent-strong, #f8e1aa);
}
.av-lite .lite-similar__list { display: flex; flex-direction: column; gap: 10px; }
.av-lite .lite-similar__item {
    display: flex;
    align-items: center;
    gap: 12px;
    color: inherit;
    text-decoration: none;
    font-size: 0.92em;
    line-height: 1.3;
}
.av-lite .lite-similar__item img {
    width: 48px;
    height: 68px;
    flex-shrink: 0;
    object-fit: cover;
    border-radius: 6px;
}
.av-lite .lite-similar__item:nth-child(n+6) { display: none; }
.av-lite .lite-similar__item:hover span { color: var(--accent, #d8c8a8); }

.av-lite .modern-tabs { margin-bottom: 16px; }

/* ---------- ПЛАНШЕТ / ТЕЛЕФОН ---------- */
@media (max-width: 992px) {
    .av-lite .hero-content { padding: 20px; }

    /* Одна колонка: «Об аниме» → «Похожие» → комментарии */
    .av-lite .anime-content-left { display: contents; }
    .av-lite .lite-about { order: 1; }
    .av-lite .anime-sidebar-right { order: 2; position: static; }
    .av-lite .anime-content-left > .modern-tabs-container { order: 3; margin-top: 4px; min-width: 0; }

    /* Похожие — горизонтальная лента постеров */
    .av-lite .lite-similar { padding: 12px 0 16px 16px; }
    .av-lite .lite-similar.is-collapsed { padding-bottom: 12px; }
    .av-lite .lite-similar__head { padding-right: 16px; }
    .av-lite .lite-similar__list {
        flex-direction: row;
        gap: 10px;
        overflow-x: auto;
        padding-right: 16px;
        scroll-snap-type: x proximity;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }
    .av-lite .lite-similar__list::-webkit-scrollbar { display: none; }
    .av-lite .lite-similar__item,
    .av-lite .lite-similar__item:nth-child(n+6) {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        width: 104px;
        flex-shrink: 0;
        gap: 6px;
        font-size: 12px;
        scroll-snap-align: start;
    }
    .av-lite .lite-similar__item img { width: 104px; height: 148px; border-radius: 8px; }
    .av-lite .lite-similar__item span {
        display: -webkit-box;
        -webkit-line-clamp: 2;
        line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
}

@media (max-width: 768px) {
    /* Компактная шапка: постер сбоку, кнопки во всю ширину под ним */
    .av-lite .hero-content {
        display: grid;
        grid-template-columns: 104px minmax(0, 1fr);
        grid-template-rows: auto auto auto auto auto 1fr auto;
        column-gap: 14px;
        row-gap: 0;
        padding: 16px;
        align-items: start;
    }
    .av-lite .hero-poster {
        grid-column: 1;
        grid-row: 1 / 7;
        width: 104px;
        margin: 0;
        border-radius: 10px;
    }
    .av-lite .hero-poster .poster-overlay,
    .av-lite .hero-poster .poster-status-label { display: none; }
    .av-lite .hero-info { display: contents; }
    .av-lite .hero-info > * { grid-column: 2; }
    .av-lite .hero-title {
        grid-row: 1;
        font-size: 1.45em;
        text-align: left;
        margin: 0 0 4px;
    }
    .av-lite .hero-original-title {
        grid-row: 2;
        text-align: left;
        font-size: 0.85em;
        margin: 0 0 8px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    .av-lite .hero-ratings { grid-row: 3; margin: 0 0 8px; gap: 6px; }
    .av-lite .hero-ratings .hero-rating {
        width: auto;
        margin: 0;
        padding: 3px 8px;
        gap: 5px;
        font-size: 0.8em;
    }
    .av-lite .hero-ratings .hero-rating .score { font-size: 1.2em; }
    .av-lite .hero-meta-tags {
        grid-row: 4;
        justify-content: flex-start;
        gap: 4px;
        margin: 0 0 6px;
    }
    .av-lite .hero-tag { padding: 3px 7px; font-size: 0.75em; gap: 4px; }
    .av-lite .hero-tag__dot { width: 6px; height: 6px; }
    .av-lite .hero-next { grid-row: 5; margin: 2px 0 0; font-size: 0.78em; gap: 6px; flex-wrap: wrap; }
    .av-lite .hero-actions {
        grid-column: 1 / -1;
        grid-row: 7;
        margin-top: 14px;
        display: flex;
        flex-wrap: nowrap;
        justify-content: stretch;
        gap: 8px;
    }
    .av-lite .hero-watch-btn {
        flex: 1 1 auto;
        min-height: 44px;
        border-radius: 10px;
    }
    .av-lite .hero-actions__utility--user,
    .av-lite .hero-actions__utility--guest {
        display: flex;
        flex: 0 1 auto;
        gap: 8px;
        min-width: 0;
    }
    .av-lite .hero-icon-action {
        width: 44px;
        min-width: 44px;
        min-height: 44px;
        border-radius: 10px;
    }
    .av-lite .hero-icon-action .btn-text { display: none; }
    .av-lite .hero-watch-status__trigger,
    .av-lite .hero-watch-status--link { min-height: 44px; border-radius: 10px; }

    /* Плеер */
    .av-lite .player-source-switcher { padding: 8px 10px; gap: 6px; }
    .av-lite .player-source-btn { flex: 1 1 auto; padding: 6px 10px; font-size: 0.9em; }
    .av-lite .lite-watching { font-size: 12px; }

    .av-lite .anime-content-left { padding: 16px; border-radius: 12px; }
}

@media (max-width: 480px) {
    .av-lite .vidoza-ep-count-badge { display: none !important; }
    .av-lite .hero-tag--views { display: none; } /* всего просмотров — на узком экране не помещается */
}
