/* =====================================================================
   STALKERX — GAME SHOW  (scope: body.zx.zx-games-show)  · needs zx-theme.css + zx-article.css
   ===================================================================== */

/* kill leftover global radii on this page's block containers */
.zx-games-show .mod-rating,
.zx-games-show .system-requirements-item,
.zx-games-show .mod-download-links-item-torrent,
.zx-games-show .game-video-player,
.zx-games-show .game-video-play-btn,
.zx-games-show .mod-game-badge { border-radius: 0 !important; }

/* download button in hero */
.zx-games-show .zx-game-hero-actions { display: flex; gap: 12px; margin-top: 26px; flex-wrap: wrap; }
.zx-games-show .mod-download-links { display: flex; gap: 12px; flex-wrap: wrap; margin: 8px 0; }
.zx-games-show .mod-download-links-item-torrent {
    font-family: var(--font-mono); font-size: 13px; letter-spacing: 1.5px; text-transform: uppercase; font-weight: 600;
    background: var(--zx-amber); color: #10130f; text-decoration: none; padding: 14px 28px; transition: all .2s;
    display: inline-flex; align-items: center; gap: 10px; border: none;
}
.zx-games-show .mod-download-links-item-torrent img { width: 18px; height: 18px; filter: brightness(0); } /* dark icon on amber */
.zx-games-show .mod-download-links-item-torrent:hover { background: transparent; color: var(--zx-amber); box-shadow: inset 0 0 0 1.5px var(--zx-amber); }
.zx-games-show .mod-download-links-item-torrent:hover img { filter: brightness(0) saturate(100%) invert(72%) sepia(45%) saturate(700%) hue-rotate(2deg) brightness(95%); }
.zx-games-show .mod-download-links-item--disabled { opacity: .4; pointer-events: none; }

/* game badge in hero eyebrow row */
.zx-games-show .zx-game-badge {
    display: inline-flex; align-items: center; gap: 8px; margin-top: 16px;
    font-family: var(--font-mono); font-size: 12px; letter-spacing: 1.5px; text-transform: uppercase; font-weight: 600;
    color: var(--zx-amber); padding: 7px 14px; border: 1px solid var(--zx-line-2); background: rgba(232,178,58,.06);
}
.zx-games-show .zx-game-badge i { color: var(--zx-amber); }

/* body wrap */
.zx-games-show .zx-game-wrap { max-width: 1000px; margin: 0 auto; padding: 48px 20px 0; }

/* ── rating stars ── */
.zx-games-show .mod-rating { margin: 40px 0; padding: 24px; border: 1px solid var(--zx-line-2); background: var(--zx-bg-2); text-align: center; }
.zx-games-show .mod-rating-title { font-family: var(--font-mono); font-size: 13px; letter-spacing: 2px; text-transform: uppercase; color: var(--zx-amber-dim); margin-bottom: 14px; }
.zx-games-show .bod-rating-starts { display: inline-flex; gap: 6px; }
.zx-games-show .zx-star { background: none; border: 0; padding: 0; line-height: 0; cursor: pointer; }
.zx-games-show .zx-star-glyph { display: block; width: 24px; height: 24px; fill: none; stroke: var(--zx-amber-dim, rgba(232, 178, 58, .35)); stroke-width: 7; stroke-linejoin: miter; transition: fill .15s, stroke .15s, transform .15s; }
.zx-games-show .zx-star.is-filled .zx-star-glyph { fill: var(--zx-amber); stroke: var(--zx-amber); }
.zx-games-show .zx-star:hover .zx-star-glyph { transform: scale(1.15); }
.zx-games-show .zx-star:focus-visible { outline: 1px solid var(--zx-amber); outline-offset: 3px; }

/* ── system requirements accordion ── */
.zx-games-show .system-requirements-wrap { margin: 40px 0; display: flex; flex-direction: column; gap: 12px; }
.zx-games-show .system-requirements-item { border: 1px solid var(--zx-line-2); background: var(--zx-bg-2); transition: border-color .2s; }
.zx-games-show .system-requirements-item:hover { background: var(--zx-bg-2) !important; }
.zx-games-show .system-requirements-title:hover { background: transparent !important; }
.zx-games-show .system-requirements-title {
    font-family: var(--font-mono); font-size: 13px; letter-spacing: 1.5px; text-transform: uppercase; color: var(--zx-text);
    padding: 18px 20px; cursor: pointer; display: flex; align-items: center; gap: 12px; transition: color .2s; user-select: none;
    border-radius: 0;
}
.zx-games-show .system-requirements-title i { color: var(--zx-amber); }
.zx-games-show .system-requirements-title::after { content: "+"; margin-left: auto; font-size: 18px; color: var(--zx-amber-dim); transition: color .2s; }
.zx-games-show .system-requirements-item:hover .system-requirements-title,
.zx-games-show .system-requirements-title:hover { color: var(--zx-amber); }
.zx-games-show .system-requirements-item:hover .system-requirements-title::after { color: var(--zx-amber); }
.zx-games-show .system-requirements-text {
    display: none; padding: 0 20px 20px; font-size: 14.5px; line-height: 1.7; color: rgba(217,222,212,.75);
    border-top: 1px solid var(--zx-line);
}
.zx-games-show .system-requirements-text.active { display: block; padding-top: 16px; }
.zx-games-show .system-requirements-item:has(.active) .system-requirements-title::after { content: "−"; }
/* padding-left держим 20px: маркер списка рисуется в style.css через ::before c left:-16px,
   и при padding:0 жёлтые точки уезжали за левый край блока (у модов такого переопределения нет). */
.zx-games-show .system-requirements-text ul { list-style: none; margin: 0; padding-left: 20px; }
.zx-games-show .system-requirements-text li { margin-bottom: 9px; }
.zx-games-show .system-requirements-text strong { color: var(--zx-text); }

/* ===================== TRAILER VIDEO PLAYER ===================== */
.zx-games-show .game-video-wrap { margin: 34px 0 8px; }
.zx-games-show .game-video-label {
    font-family: var(--font-mono); font-size: 12px; letter-spacing: 2px; text-transform: uppercase; color: var(--zx-amber-dim);
    display: inline-flex; align-items: center; gap: 8px; margin-bottom: 12px;
}
.zx-games-show .game-video-label i { color: var(--zx-amber); }
.zx-games-show .game-video-player { position: relative; background: #000; overflow: hidden; border: 1px solid var(--zx-line-2); }
.zx-games-show .game-video-player video { width: 100%; height: auto; display: block; cursor: pointer; }

.zx-games-show .game-video-overlay { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; pointer-events: none; }
.zx-games-show .game-video-play-btn {
    width: 74px; height: 74px; border: 1.5px solid var(--zx-amber); background: rgba(10,13,12,.55);
    color: var(--zx-amber); font-size: 24px; display: flex; align-items: center; justify-content: center;
    cursor: pointer; pointer-events: auto; transition: all .2s; clip-path: polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px);
}
.zx-games-show .game-video-play-btn .fa-play { padding-left: 4px; }
.zx-games-show .game-video-play-btn:hover { background: var(--zx-amber); color: #10130f; }
.zx-games-show .game-video-play-btn.hidden { opacity: 0; pointer-events: none; }

.zx-games-show .game-video-controls {
    position: absolute; bottom: 0; left: 0; right: 0; display: flex; align-items: center; gap: 12px;
    padding: 12px 14px; background: linear-gradient(to top, rgba(0,0,0,.82), transparent);
    opacity: 0; transition: opacity .2s;
}
.zx-games-show .game-video-player:hover .game-video-controls,
.zx-games-show .game-video-player.is-paused .game-video-controls { opacity: 1; }
.zx-games-show .game-video-ctrl-btn { background: none; border: none; color: rgba(230,235,225,.82); font-size: 15px; cursor: pointer; transition: color .15s; padding: 4px; }
.zx-games-show .game-video-ctrl-btn:hover { color: var(--zx-amber); }
.zx-games-show .game-video-progress-wrap { flex: 1; padding: 8px 0; cursor: pointer; }
.zx-games-show .game-video-progress-track { height: 3px; background: rgba(200,210,190,.2); transition: height .15s; }
.zx-games-show .game-video-progress-wrap:hover .game-video-progress-track { height: 5px; }
.zx-games-show .game-video-progress-fill { height: 100%; width: 0%; background: var(--zx-amber); }
.zx-games-show .game-video-time { font-family: var(--font-mono); font-size: 11px; color: var(--zx-faint); white-space: nowrap; }

/* admin edit/delete (parity with mods) */
.zx-games-show .mod-edit-delete-btns { display: flex; gap: 12px; margin: 30px 0; flex-wrap: wrap; }

@media (max-width: 620px) {
    .zx-games-show .game-video-play-btn { width: 58px; height: 58px; font-size: 19px; }
}
