/*
Theme Name: MyTube
Theme URI: https://example.com/
Author: Felix
Author URI: https://example.com/
Description: Minimal video tube theme
Version: 1.0
Text Domain: mytube
*/

/* ------- Reset (из BlankSlate, форматированный) ------- */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    font: inherit;
    vertical-align: baseline;
}

html {
    scroll-behavior: smooth;
}

body {
    line-height: 1;
}

a {
    text-decoration-skip-ink: auto;
}

a[href^="tel"] {
    color: inherit;
    text-decoration: none;
}

button {
    outline: 0;
}

ol, ul {
    list-style: none;
}

blockquote, q {
    quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
    content: '';
    content: none;
}

q {
    display: inline;
    font-style: italic;
}

q:before {
    content: '"';
    font-style: normal;
}

q:after {
    content: '"';
    font-style: normal;
}

textarea,
input[type="text"],
input[type="button"],
input[type="submit"],
input[type="reset"],
input[type="search"],
input[type="password"] {
    appearance: none;
    border-radius: 0;
}

input[type="search"] {
    appearance: textfield;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

th, td {
    padding: 2px;
}

big {
    font-size: 120%;
}

small, sup, sub {
    font-size: 80%;
}

sup {
    vertical-align: super;
}

sub {
    vertical-align: sub;
}

dd {
    margin-left: 20px;
}

kbd, tt {
    font-family: courier, monospace;
    font-size: 12px;
}

ins {
    text-decoration: underline;
}

del, strike, s {
    text-decoration: line-through;
}

dt {
    font-weight: bold;
}

address, cite, var {
    font-style: italic;
}

article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
    display: block;
}

* {
    box-sizing: border-box;
    -webkit-tap-highlight-color: transparent;
}

/* Utility classes from BlankSlate */
.sticky {}
.bypostauthor {}
.wp-caption {}
.wp-caption-text {}
.gallery-caption {}
.alignright {}
.alignleft {}
.aligncenter {}

.screen-reader-text {
    border: 0;
    clip: rect(1px,1px,1px,1px);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute !important;
    width: 1px;
    word-wrap: normal !important;
    word-break: normal;
}

.screen-reader-text:focus {
    background-color: #f7f7f7;
    border-radius: 3px;
    box-shadow: 0 0 2px 2px rgba(0,0,0,.6);
    clip: auto !important;
    clip-path: none;
    color: #007acc;
    display: block;
    font-size: 14px;
    font-weight: 700;
    height: auto;
    right: 5px;
    line-height: normal;
    padding: 15px 23px 14px;
    text-decoration: none;
    top: 5px;
    width: auto;
    z-index: 100000;
}

.skip-link {
    left: -9999rem;
    top: 2.5rem;
    z-index: 999999999;
    text-decoration: underline;
}

.skip-link:focus {
    display: block;
    left: 6px;
    top: 7px;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    line-height: normal;
    padding: 15px 23px 14px;
    z-index: 100000;
    right: auto;
}

/* ------- Global theme styles ------- */

body {
    background-color: #111;
    color: #eee;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

a {
    color: inherit;
}

a:hover {
    color: inherit;
}

/* Layout container: 90% width, max 1400px */
.layout-container {
    width: 90%;
    max-width: 1400px;
    margin: 0 auto;
}

/* Main content container */
.main-container {
    padding: 20px 0 40px;
}

/* ------- Header ------- */

.site-header {
    background-color: #181818;
    border-bottom: 1px solid #202020;
}

.header-inner {
    padding: 10px 0 6px;
}

.header-top {
    display: flex;
    align-items: center;
    gap: 14px;
}

/* Logo (text-based "MyTube") */
.header-logo .logo-link {
    text-decoration: none;
}

.logo-box {
    display: inline-flex;
    align-items: center;
    border-radius: 4px;
    overflow: hidden;
    font-weight: 700;
    font-size: 20px;
    letter-spacing: 0.5px;
}

.logo-my {
    background-color: #ff9900;
    color: #000;
    padding: 4px 6px 4px 8px;
}

.logo-tube {
    background-color: #fff;
    color: #000;
    padding: 4px 8px 4px 6px;
}

/* Search */
.header-search {
    flex: 1 1 auto;
}

.header-search-form {
    display: flex;
    align-items: center;
    gap: 6px;
}

.header-search-form input[type="search"] {
    flex: 1 1 auto;
    padding: 8px 10px;
    border-radius: 999px;
    border: 1px solid #333;
    background-color: #101010;
    color: #eee;
    font-size: 14px;
}

.header-search-form input[type="search"]::placeholder {
    color: #666;
}

.header-search-form button {
    padding: 8px 14px;
    border-radius: 999px;
    border: none;
    background-color: #333;
    color: #eee;
    font-size: 14px;
    cursor: pointer;
    white-space: nowrap;
}

.header-search-form button:hover {
    background-color: #444;
}

/* Premium button */
.header-cta {
    flex: 0 0 auto;
}

.btn-premium {
    display: inline-block;
    padding: 8px 14px;
    border-radius: 999px;
    background: linear-gradient(135deg, #ff9900, #ffcc33);
    color: #000;
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    border: none;
    cursor: pointer;
    white-space: nowrap;
}

.btn-premium:hover {
    filter: brightness(1.05);
}

/* Burger button (mobile) */
.header-burger {
    display: none;
    border: none;
    background: none;
    padding: 6px;
    margin-left: 4px;
    cursor: pointer;
}

.header-burger span {
    display: block;
    width: 20px;
    height: 2px;
    margin: 3px 0;
    background-color: #eee;
    transition: transform 0.2s ease, opacity 0.2s ease;
}

/* Nav */
.site-nav {
    margin-top: 8px;
    background-color: #151515;
    border-radius: 4px;
}

.main-menu {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding: 6px 10px;
}

.main-menu li a {
    text-decoration: none;
    font-size: 14px;
    color: #ddd;
    padding: 4px 8px;
    border-radius: 3px;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.main-menu li a:hover,
.main-menu li.current-menu-item > a {
    background-color: #ff9900;
    color: #000;
}

/* ------- Main page: video grid ------- */

.page-title {
    font-size: 22px;
    font-weight: 600;
    margin-bottom: 16px;
}

/* Generic grid for main & related */
.video-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    grid-gap: 16px;
}

/* Video card */
.video-card {
    background-color: #181818;
    border-radius: 4px;
    overflow: hidden;
    font-size: 14px;
    transition: transform 0.18s ease, box-shadow 0.18s ease, background-color 0.18s ease;
}

.video-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.5);
    background-color: #202020;
}

.video-link {
    color: inherit;
    text-decoration: none;
    display: block;
}

/* Превью 16:9 как 320x180 (масштабируется) */
.video-thumb {
    position: relative;
    width: 100%;
    /* 16:9 = 320x180 */
    aspect-ratio: 16 / 9;
    /* fallback для старых браузеров */
    padding-top: 56.25%;
    background-color: #000;
    overflow: hidden;
}

/* чтобы aspect-ratio работал поверх padding-хак */
.video-thumb::before {
    content: "";
    position: absolute;
    inset: 0;
}

/* Постер */
.video-thumb img.thumb-poster {
    position: absolute;
    inset: 0;
    max-width: 100%;
    max-height: 100%;
    margin: auto;
    object-fit: contain; /* вертикальные не режем, просто полосы */
    display: block;
    transition: opacity 0.2s ease;
}

/* Видео-превью поверх */
.video-thumb video.thumb-video {
    position: absolute;
    inset: 0;
    max-width: 100%;
    max-height: 100%;
    margin: auto;
    object-fit: contain;
    display: block;
    opacity: 0;
    transition: opacity 0.2s ease;
}

/* Duration badge */
.video-badge.video-duration {
    position: absolute;
    right: 6px;
    bottom: 6px;
    padding: 2px 6px;
    background: rgba(0, 0, 0, 0.75);
    color: #fff;
    font-size: 11px;
    border-radius: 2px;
}

/* Title & meta under thumb */
.video-title {
    margin: 8px 10px 4px;
    font-size: 14px;
    line-height: 1.35;
    color: #fff;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Строка с моделью и просмотрами – компактно слева */
.video-meta-line {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    padding: 0 10px 8px;
    font-size: 12px;
    color: #aaa;
}

/* имя модели */
.video-model {
    color: #eee;
    font-weight: 500;
    display: inline-flex;
    align-items: center;
}

/* кликабельная модель */
.video-model a,
.video-model-link {
    color: #ffcc33;
    text-decoration: none;
}

.video-model a:hover,
.video-model-link:hover {
    text-decoration: underline;
}

/* просмотры */
.video-views {
    color: #999;
}

/* Pagination */
.pagination {
    margin-top: 24px;
    text-align: center;
}

.pagination .page-numbers {
    display: inline-block;
    margin: 0 4px;
    padding: 4px 8px;
    border-radius: 3px;
    text-decoration: none;
    font-size: 14px;
    background-color: #181818;
    color: #ddd;
}

.pagination .page-numbers.current,
.pagination .page-numbers:hover {
    background-color: #ff9900;
    color: #000;
}

/* ------- Single video page ------- */

.video-page {
    display: flex;
    gap: 20px;
    align-items: flex-start;
    margin-top: 10px;
}

.video-main {
    flex: 2.2;
    min-width: 0;
}

.video-sidebar {
    flex: 1;
    min-width: 260px;
}

/* Player */
.video-player-wrapper {
    background-color: #000;
    border-radius: 4px;
    overflow: hidden;
    margin-bottom: 12px;
}

.video-main-player {
    width: 100%;
    height: auto;
    display: block;
    max-height: 70vh;
}

.video-player-placeholder {
    padding: 30px;
    text-align: center;
    font-size: 14px;
}

/* ----- TezFiles placeholder player ----- */
/* ----- TezFiles placeholder player ----- */

.tez-player-shell {
    position: relative;
    width: 100%;
    aspect-ratio: 16 / 9; /* Резервируем место без padding-top */
    background-color: #000;
    overflow: hidden;
    border-radius: 4px;
}

.tez-poster-wrap {
    position: absolute;
    inset: 0;
}

.tez-poster-img,
.tez-poster-fallback {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.tez-poster-fallback {
    background: radial-gradient(circle at center, #333 0, #000 60%);
}

/* Наша кнопка Play по центру */
.tez-play-btn {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    border: none;
    border-radius: 50%;
    width: 72px;
    height: 72px;
    padding: 0;
    background: rgba(0, 0, 0, 0.65);
    border: 2px solid rgba(255, 255, 255, 0.8);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.7);
    transition:
        background 0.2s ease,
        transform 0.2s ease,
        box-shadow 0.2s ease;
}

.tez-play-btn:hover {
    background: rgba(255, 153, 0, 0.9);
    transform: translate(-50%, -50%) scale(1.05);
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.8);
}

/* Стрелка рисуется треугольником, а не символом шрифта */
.tez-play-icon {
    position: relative;
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 14px 0 14px 24px; /* высота/ширина треугольника */
    border-color: transparent transparent transparent #ffffff;
    margin-left: 2px;
    font-size: 0;      /* скрываем символ &#9658; */
    line-height: 0;
}

/* Чуть меньше на мобилках, чтобы не перекрывала полэкрана */
@media (max-width: 768px) {
    .tez-play-btn {
        width: 60px;
        height: 60px;
        border-width: 1.5px;
    }

    .tez-play-icon {
        border-width: 12px 0 12px 20px;
    }
}

/* Hover-превью: видео сверху постера, по умолчанию скрыто */
.video-thumb video.thumb-video {
    position: absolute;
    inset: 0;
    max-width: 100%;
    max-height: 100%;
    margin: auto;
    object-fit: contain;
    display: block;
    opacity: 0;
    transition: opacity 0.2s ease;
}


/* Info under player */
.video-info-header {
    margin-bottom: 14px;
}

.video-main-title {
    font-size: 22px;
    font-weight: 600;
    margin-bottom: 6px;
    color: #fff;
}

.video-meta-main {
    margin-bottom: 6px;
}

.video-meta-main .video-model {
    font-size: 14px;
}

.video-meta-main .video-views {
    font-size: 13px;
}

.video-meta-secondary {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    font-size: 12px;
    color: #aaa;
    margin-bottom: 4px;
}

.video-meta-secondary strong {
    color: #eee;
}

/* Categories / tags inline */
.video-tax-block-inline {
    font-size: 13px;
    margin-top: 6px;
}

.video-tax-label {
    font-weight: 600;
    margin-right: 6px;
    color: #ccc;
}

.video-chip {
    display: inline-block;
    margin: 2px 5px 2px 0;
    padding: 3px 7px;
    font-size: 12px;
    border-radius: 999px;
    background-color: #262626;
    color: #eee;
    text-decoration: none;
    transition: background-color 0.15s ease, color 0.15s ease;
}

.video-chip:hover {
    background-color: #ff9900;
    color: #000;
}

.video-chip-tag {
    background-color: #202020;
}

/* Description */
.video-description-block {
    background-color: #181818;
    border-radius: 4px;
    padding: 12px 12px 14px;
    margin-bottom: 16px;
}

.video-description-block h2 {
    font-size: 16px;
    margin-bottom: 8px;
}

.video-description {
    font-size: 14px;
    color: #ddd;
    line-height: 1.45;
}

.video-description p {
    margin-bottom: 6px;
}

/* Bottom related grid */
.video-bottom-related {
    margin-top: 10px;
}

.section-title {
    font-size: 16px;
    margin-bottom: 10px;
}

/* reuse .video-grid, .video-card, etc */
.video-grid-related {
    margin-top: 4px;
}

/* Sidebar */
.sidebar-title {
    font-size: 16px;
    margin-bottom: 8px;
    color: #fff;
}

.sidebar-videos {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.video-card.video-card-related {
    font-size: 13px;
}

.video-card.video-card-related .video-thumb {
    aspect-ratio: 16 / 9;
}

.video-title-related {
    margin: 6px 8px 8px;
    font-size: 13px;
    line-height: 1.3;
}

/* Comments */
.video-comments-block {
    margin-top: 20px;
}

/* ------- Footer ------- */

.site-footer {
    background-color: #181818;
    border-top: 1px solid #202020;
    padding: 14px 0 18px;
    margin-top: 10px;
}

.footer-inner {
    display: flex;
    flex-direction: column;
    gap: 6px;
    font-size: 13px;
    color: #aaa;
}

.footer-links {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.footer-links a {
    text-decoration: none;
    color: #bbb;
    font-size: 13px;
}

.footer-links a:hover {
    color: #fff;
}

.footer-copy {
    font-size: 12px;
}

/* ===== Мобильная магия: иконки, поиск, премиум ===== */

/* Мобильный блок с иконками (поиск, VIP, бургер) */
.header-controls-mobile {
    margin-left: auto;
    align-items: center;
    gap: 8px;
    display: none; /* по умолчанию спрятано на десктопе */
}

.header-icon-btn {
    border: none;
    background: none;
    padding: 4px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

/* внешний вид кружочков-иконок */
.header-icon-btn .icon {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    border: 1px solid #555;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    position: relative; /* для псевдоэлементов лупы */
}

/* красивый search-икон (лупа) на чистом CSS */
.icon-search::before {
    content: "";
    width: 12px;
    height: 12px;
    border-radius: 50%;
    border: 2px solid #eee;
    box-sizing: border-box;
}

.icon-search::after {
    content: "";
    position: absolute;
    width: 8px;
    height: 2px;
    border-radius: 2px;
    background-color: #eee;
    transform: rotate(45deg);
    right: 4px;
    bottom: 5px;
}

/* VIP-ссылка рядом с иконкой поиска */
.header-vip-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 10px;
    border-radius: 999px;
    border: 1px solid #ffcc33;
    color: #ffcc33;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    text-decoration: none;
}

.header-vip-link:hover {
    background-color: #ffcc33;
    color: #000;
}


/* ------- Responsive ------- */

@media (max-width: 1100px) {
    .video-grid,
    .video-grid.video-grid-related {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    /* Хедер прилипает сверху на мобиле */
    .site-header {
        position: sticky;
        top: 0;
        z-index: 1000;
    }

    .header-inner {
        padding: 8px 0;
    }

    .header-top {
        display: flex;
        align-items: center;
        gap: 10px;
    }

    /* Лого слева, иконки справа */
    .header-logo {
        flex: 0 0 auto;
    }

    .header-controls-mobile {
        display: flex;
    }

    /* Спрятать большую поисковую строку и кнопку премиум по умолчанию */
    .header-search,
    .header-cta {
        display: none;
        width: 100%;
        margin-top: 8px;
    }

    /* Когда кликнули по иконке – показываем блок ниже полоски */
    .header-search.is-open,
    .header-cta.is-open {
        display: block;
    }

    .header-search-form {
        display: flex;
        align-items: center;
        gap: 6px;
    }

    .header-search-form input[type="search"] {
        flex: 1 1 auto;
    }

    /* Бургер только на мобиле */
    .header-burger {
        display: inline-flex;
        flex-direction: column;
        border: none;
        background: none;
        padding: 4px;
        cursor: pointer;
    }

    .site-nav {
        display: none;
        margin-top: 8px;
    }

    .site-nav.nav-open {
        display: block;
    }

    /* Контент страницы видео – вертикально */
    .video-page {
        flex-direction: column;
    }

    .video-sidebar {
        width: 100%;
        min-width: 0;
        margin-top: 16px;
    }
}

@media (max-width: 800px) {
    .video-grid,
    .video-grid.video-grid-related {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 520px) {
    .video-grid,
    .video-grid.video-grid-related {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }

    .header-cta {
        order: 3;
        margin-left: 0;
        margin-top: 4px;
    }
}

/* Model page */
.model-header {
    margin-bottom: 20px;
}

.model-title {
    font-size: 24px;
    font-weight: 600;
    margin-bottom: 8px;
}

.model-description {
    font-size: 14px;
    color: #ddd;
    line-height: 1.5;
}

/* Кликабельное имя модели */
.video-model a,
.video-model-link {
    color: #ffcc33;
    text-decoration: none;
}

.video-model a:hover,
.video-model-link:hover {
    text-decoration: underline;
}


/* ===== Comments – MyTube ===== */

.comments-area {
    margin-top: 24px;
}

.comments-title {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 12px;
}

/* Список комментариев */
.comment-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.mytube-comment-item {
    margin-bottom: 10px;
}

.mytube-comment-item .comment-body {
    display: flex;
    gap: 10px;
    background-color: #181818;
    border-radius: 4px;
    padding: 10px 12px;
}

.comment-avatar img {
    border-radius: 50%;
    display: block;
}

.comment-content-wrapper {
    flex: 1 1 auto;
    min-width: 0;
}

/* Шапка комментария: автор + дата */
.comment-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 6px;
    margin-bottom: 4px;
    font-size: 13px;
}

.comment-author .author-name {
    font-weight: 600;
    color: #fff;
}

.comment-date a {
    font-size: 12px;
    color: #888;
    text-decoration: none;
}

.comment-date a:hover {
    color: #ccc;
}

/* Текст комментария */
.comment-text {
    font-size: 14px;
    color: #ddd;
    line-height: 1.45;
    margin-bottom: 6px;
}

.comment-awaiting-moderation {
    font-size: 12px;
    color: #ffcc33;
    margin-bottom: 4px;
}

/* Низ: reply/edit */
.comment-footer {
    font-size: 12px;
    color: #aaa;
}

.comment-footer a {
    color: #ffcc33;
    text-decoration: none;
}

.comment-footer a:hover {
    text-decoration: underline;
}

/* Пагинация комментариев */
.comment-navigation {
    display: flex;
    justify-content: space-between;
    margin: 10px 0 14px;
    font-size: 13px;
}

.comment-navigation a {
    color: #ffcc33;
}

/* NO comments */
.no-comments {
    font-size: 13px;
    color: #888;
    margin-top: 8px;
}

/* ===== Comment form ===== */

.comment-respond {
    margin-top: 18px;
    background-color: #181818;
    border-radius: 4px;
    padding: 12px 12px 14px;
}

.comment-reply-title {
    font-size: 16px;
    font-weight: 600;
    margin-bottom: 8px;
}

.comment-notes,
.must-log-in,
.logged-in-as {
    font-size: 13px;
    color: #aaa;
    margin-bottom: 8px;
}

.must-log-in a,
.logged-in-as a {
    color: #ffcc33;
    text-decoration: none;
}

.must-log-in a:hover,
.logged-in-as a:hover {
    text-decoration: underline;
}

/* Поля формы */
.comment-form p {
    margin-bottom: 8px;
}

.comment-form label {
    display: block;
    font-size: 13px;
    color: #ccc;
    margin-bottom: 3px;
}

.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea {
    width: 100%;
    padding: 7px 9px;
    border-radius: 3px;
    border: 1px solid #333;
    background-color: #101010;
    color: #eee;
    font-size: 14px;
}

.comment-form input::placeholder,
.comment-form textarea::placeholder {
    color: #666;
}

.comment-form textarea {
    resize: vertical;
    min-height: 80px;
}

/* Кнопка отправки */
.comment-submit-btn {
    margin-top: 4px;
    padding: 8px 16px;
    border-radius: 999px;
    border: none;
    background: linear-gradient(135deg, #ff9900, #ffcc33);
    color: #000;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
}

.comment-submit-btn:hover {
    filter: brightness(1.05);
}

/* Чекбокс "запомнить меня" и т.п. */
.comment-form-cookies-consent {
    font-size: 12px;
    color: #aaa;
    display: flex;
    align-items: center;
    gap: 4px;
}

.comment-form-cookies-consent input[type="checkbox"] {
    width: auto;
    margin: 0;
}

/* Адаптив для комментариев */
@media (max-width: 600px) {
    .mytube-comment-item .comment-body {
        padding: 8px 9px;
    }

    .comment-avatar img {
        width: 36px;
        height: 36px;
    }

    .comment-meta {
        font-size: 12px;
    }

    .comment-text {
        font-size: 13px;
    }
}

/* --- Dropdown для подменю в главном меню --- */

/* Базовые li */
.main-menu > li {
    position: relative;
}

/* Вложенные списки (подменю) */
.main-menu li ul {
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 160px;
    background-color: #151515;
    border-radius: 4px;
    padding: 6px 0;
    margin-top: 4px;
    list-style: none;
    display: none;
    z-index: 1000;
}

/* Пункты внутри подменю */
.main-menu li ul li a {
    display: block;
    padding: 6px 10px;
    font-size: 13px;
    color: #ddd;
    border-radius: 0;
}

/* Hover по пункту подменю */
.main-menu li ul li a:hover {
    background-color: #ff9900;
    color: #000;
}

/* Показываем подменю при наведении (десктоп) */
.main-menu > li:hover > ul {
    display: block;
}

/* На мобиле подменю просто станет вложенным списком */
@media (max-width: 900px) {
    .main-menu li ul {
        position: static;
        background: transparent;
        padding-left: 12px;
        margin-top: 0;
        display: block;
    }

    .main-menu li ul li a {
        padding: 4px 0;
    }
}

/* --- Sticky footer: футер всегда внизу окна --- */

html, body {
    height: 100%;
}

body {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

/* Шапка не растягивается */
.site-header {
    flex-shrink: 0;
}

/* Основной контейнер тянется, выталкивая футер вниз */
.main-container {
    flex: 1 0 auto;
}

/* Футер прижимается к низу, если контента мало */
.site-footer {
    flex-shrink: 0;
    margin-top: auto;
}


/* ---------- Fix: компактный Up next в сайдбаре ---------- */

@media (min-width: 901px) {
    .video-sidebar .sidebar-videos {
        display: flex;
        flex-direction: column;
        gap: 8px;
        align-items: flex-start;
    }

    .video-sidebar .video-card.video-card-related {
        width: 100%;
        max-width: 320px;
    }

    .video-sidebar .video-title-related {
        margin: 6px 8px 8px;
        font-size: 13px;
        line-height: 1.3;
    }
}
/* Лоадер для TezFiles */
.tez-player-shell .tez-loader {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 40px;
    height: 40px;
    margin: -20px 0 0 -20px; /* центрируем без translate */
    border-radius: 50%;
    border: 3px solid rgba(255,255,255,0.2);
    border-top-color: #ffcc33;
    animation: tez-spin 0.7s linear infinite;
    z-index: 5;
    pointer-events: none;
    display: none;
}

/* показываем, когда идёт загрузка */
.tez-player-shell.is-loading .tez-loader {
    display: block;
}

/* слегка затемняем постер под лоадером */
.tez-player-shell.is-loading .tez-poster-img,
.tez-player-shell.is-loading .tez-poster-fallback {
    filter: brightness(0.6);
}

@keyframes tez-spin {
    from { transform: rotate(0deg); }
    to   { transform: rotate(360deg); }
}
@media (max-width: 900px) {
    .video-sidebar {
        display: none;
    }
}
