/* =========================================
   UI Kit - Communities Cards
   База — как a.gc-card (cards.css): --ui-border, hover фон + --border-tertiary.
   В .catalog-main .gc-cards-grid — как плитки мероприятий (events-list.css).
   ========================================= */

.gc-community-card {
    display: block;
    box-sizing: border-box;
    width: 100%;
    background: var(--gc-event-card-surface, var(--surface-secondary));
    border: 1px solid var(--gc-card-glow-rest-border, var(--border-subtle));
    border-radius: var(--radius-16);
    padding: var(--space-4);
    transition: var(--gc-card-glow-transition, border-color var(--transition-fast) var(--ease-in-out));
    text-decoration: none;
    color: inherit;
    cursor: pointer;
}

.gc-community-card:focus:not(:focus-visible) {
    outline: none;
}

.gc-community-card:focus-visible {
    outline: var(--gc-focus-outline);
    outline-offset: var(--gc-focus-outline-offset);
}

.gc-community-card--disabled {
    cursor: default;
    opacity: 0.6;
}

@media (min-width: 1280px) and (hover: hover) and (pointer: fine) {
    .gc-community-card--disabled:hover {
        background: var(--gc-event-card-surface, var(--surface-secondary));
        border-color: var(--gc-card-glow-rest-border, var(--border-subtle));
        box-shadow: var(--gc-card-glow-rest-shadow, none);
    }
}

.gc-community-card--disabled:focus-visible {
    background: var(--gc-event-card-surface, var(--surface-secondary));
    border-color: var(--gc-card-glow-rest-border, var(--border-subtle));
    box-shadow: var(--gc-card-glow-rest-shadow, none);
}

/* Catalog surface hover — subscriptions.css `.gc-card-glow-shell--channel-index` */

/* Каталог каналов — Surface/Secondary + glow rest-border, как event/hub плитки */
.catalog-main .gc-cards-grid > .gc-community-card {
    min-width: 0;
    overflow: hidden;
    background: var(--gc-event-card-surface, var(--surface-secondary));
    border-color: var(--gc-card-glow-rest-border, var(--border-subtle));
    padding: var(--space-2-5);
}

@media (min-width: 1280px) and (hover: hover) and (pointer: fine) {
    .catalog-main .gc-cards-grid > .gc-community-card--disabled:hover {
        background: var(--gc-event-card-surface, var(--surface-secondary));
        border-color: var(--gc-card-glow-rest-border, var(--border-subtle));
        box-shadow: var(--gc-card-glow-rest-shadow, none);
    }
}

.catalog-main .gc-cards-grid > .gc-community-card--disabled:focus-visible {
    background: var(--gc-event-card-surface, var(--surface-secondary));
    border-color: var(--gc-card-glow-rest-border, var(--border-subtle));
    box-shadow: var(--gc-card-glow-rest-shadow, none);
}

/* Сетка каналов: плитки, не растянутые полки. minmax(min(100%, 280px)) — не шире колонки.
   Строка тянется по самой высокой карточке, slug садится к низу. */
.catalog-main .gc-cards-grid:has(> .gc-community-card) {
    grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr));
    gap: var(--space-4);
    align-items: stretch;
}

.catalog-main .gc-cards-grid > .gc-community-card {
    display: flex;
    flex-direction: column;
    height: 100%;
}

.catalog-main .gc-cards-grid .gc-community-card-content {
    flex: 1 1 auto;
    align-items: stretch;
    min-height: 0;
}

.catalog-main .gc-cards-grid .gc-community-card-avatar {
    align-self: center;
}

.catalog-main .gc-cards-grid .gc-community-card-meta {
    margin-top: auto;
}

/* На адаптиве — карточки у края экрана без боковых линий (как /events) */
@media (max-width: 991.98px) {
    .catalog-main .gc-cards-grid > .gc-community-card {
        /* border-left: none;
        border-right: none; */
    }
}

/* Контент карточки */
.gc-community-card-content {
    display: flex;
    align-items: center;
    gap: var(--space-4);
}

.catalog-main .gc-cards-grid .gc-community-card-content {
    gap: var(--space-2-5);
}

/* Информационный блок */
.gc-community-card-info {
    display: flex;
    flex-direction: column;
    gap: var(--space-product-2);
    flex: 1;
    min-width: 0;
}

/* Slug + privacy в одну строку, slug обрезается */
.gc-community-card-meta {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    min-width: 0;
}

/* Аватар */
.gc-community-card-avatar {
    width: 56px;
    height: 56px;
    aspect-ratio: 1;
    border-radius: var(--radius-8);
    overflow: hidden;
    flex: 0 0 auto;
}

.catalog-main .gc-cards-grid .gc-community-card-avatar {
    width: 48px;
    height: 48px;
}

.gc-community-card-avatar img,
.gc-community-card-avatar .gc-img-slot,
.gc-community-card-avatar .gc-list-avatar-fallback {
    border-radius: inherit;
}

.gc-community-card-avatar img,
.gc-community-card-avatar .gc-img-slot {
    display: block;
    width: 100%;
    height: 100%;
    max-width: 100%;
}

.gc-community-card-avatar img,
.gc-community-card-avatar .gc-img-slot__media {
    object-fit: cover;
}

.gc-community-card-avatar-placeholder {
    width: 100%;
    height: 100%;
    background: var(--surface-control);
    border: 1px solid var(--border-subtle);
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--font-size-24);
    font-weight: 600;
    color: var(--text-secondary);
}

.catalog-main .gc-cards-grid .gc-community-card-avatar-placeholder {
    font-size: var(--font-size-20);
}

/* Заголовок */
.gc-community-card-title {
    margin: 0;
    font-size: var(--font-size-15);
    font-weight: 600;
    line-height: 1.3;
    color: var(--text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.catalog-main .gc-cards-grid .gc-community-card-title {
    font-size: var(--font-size-14);
    font-weight: 500;
    line-height: calc(24 / 14);
    color: var(--text-primary);
}

/* Slug */
.gc-community-card-slug {
    font-size: var(--font-size-14);
    color: var(--text-secondary);
    margin: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    flex: 1;
    min-width: 0;
}

.catalog-main .gc-cards-grid .gc-community-card-slug {
    color: var(--text-secondary);
}

/* Описание */
.gc-community-card-description {
    font-size: var(--font-size-14);
    color: var(--text-secondary);
    margin: 0;
    line-height: 1.4;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

/* Метка приватности (каталог / «мои каналы») */
.gc-community-card-privacy {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    /* Как у .gc-community-card-slug: inherit тянул базовый кегль страницы, не строку slug */
    font-size: var(--font-size-14);
    color: var(--text-secondary);
    margin: 0;
    flex-shrink: 0;
    white-space: nowrap;
}

.catalog-main .gc-cards-grid .gc-community-card-privacy {
    color: var(--text-secondary);
}

.gc-community-card-privacy i {
    font-size: var(--font-size-14);
    line-height: 1;
}

/* Статистика */
.gc-community-card-stats {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    font-size: var(--font-size-14);
    color: var(--text-secondary);
}

.gc-community-card-stats i {
    font-size: var(--font-size-14);
    line-height: 1;
}

.gc-community-card-divider {
    opacity: 0.5;
}

/* Адаптивность */
@media (max-width: 768px) {
    .gc-community-card {
        padding: var(--space-2);
    }

    .catalog-main .gc-cards-grid > .gc-community-card {
        padding: var(--space-2-5);
    }

    .gc-community-card-avatar {
        width: 48px;
        height: 48px;
    }

    .catalog-main .gc-cards-grid .gc-community-card-avatar {
        width: 44px;
        height: 44px;
    }

    .gc-community-card-avatar-placeholder {
        font-size: var(--font-size-20);
    }

    .catalog-main .gc-cards-grid .gc-community-card-avatar-placeholder {
        font-size: var(--font-size-18);
    }
}

/* Каталог каналов: вертикальный стек карточек (не грид, не flat open-list). */
.gc-channel-index-row.gc-interactive-row {
    align-items: flex-start;
    width: 100%;
    margin: 0;
    box-sizing: border-box;
    background: var(--surface-secondary);
    border: 1px solid var(--gc-card-glow-rest-border, var(--border-subtle));
    border-radius: var(--radius-16);
    box-shadow: var(--gc-card-glow-rest-shadow, none);
    transition: var(--gc-card-glow-transition, border-color var(--transition-fast) var(--ease-in-out));
    color: inherit;
    text-decoration: none;
}

.gc-channel-index-row.gc-interactive-row:focus {
    outline: none;
}

.gc-channel-index-row.gc-interactive-row:focus-visible {
    outline: var(--gc-focus-outline);
    outline-offset: var(--gc-focus-outline-offset);
    color: inherit;
    text-decoration: none;
}

.gc-channel-index-row--disabled {
    cursor: default;
    opacity: 0.6;
    pointer-events: none;
}

@media (min-width: 1280px) and (hover: hover) and (pointer: fine) {
    .gc-channel-index-row--disabled:hover {
        background: var(--surface-secondary);
        border-color: var(--gc-card-glow-rest-border, var(--border-subtle));
        box-shadow: var(--gc-card-glow-rest-shadow, none);
    }
}

.gc-channel-index-row__meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    min-width: 0;
    margin: 0;
}

.gc-channel-index-row__meta > span + span::before {
    content: "·";
    margin-inline: var(--space-1);
}

.gc-channel-index-row__meta > span:not(.gc-channel-index-row__privacy) {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gc-channel-index-row__privacy {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    flex-shrink: 0;
    white-space: nowrap;
}

.gc-channel-index-row__privacy i {
    font-size: var(--font-size-14);
    line-height: 1;
}

.gc-channel-index-row__description {
    margin: 0;
    font-size: var(--font-size-14);
    font-weight: 400;
    line-height: calc(20 / 14);
    color: var(--text-secondary);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    white-space: normal;
}


/* Каталог каналов: nav в context rail — inset/фон в layout-utilities.css (.gc-context-rail .catalog-nav). */

/* Лента / разделы канала: карточка канала flush в chrome; закреп + предстоящие — модули catalog-nav. */
.channels-show-context-rail .channel-sidebar-card {
    background: transparent;
    border: none;
    border-radius: 0;
}

.channels-show-context-rail .channel-sidebar-card-cover {
    height: auto;
    aspect-ratio: var(--gc-event-index-card-cover-aspect);
}

.channels-show-rail-fallback .channel-sidebar-card-cover:not(.channel-sidebar-card-cover--feed-mobile),
.channel-sidebar-card--feed-mobile .channel-sidebar-card-cover--feed-mobile {
    height: auto;
    aspect-ratio: var(--gc-event-index-card-cover-aspect);
}

.channels-show-context-rail .channel-sidebar-card-cover > *,
.channels-show-rail-fallback .channel-sidebar-card-cover:not(.channel-sidebar-card-cover--feed-mobile) > *,
.channel-sidebar-card--feed-mobile .channel-sidebar-card-cover--feed-mobile > * {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

.channel-sidebar-card-cover .gc-briefing-img {
    object-fit: cover;
}

.channels-show-context-rail .channel-sidebar-card,
.channels-show-rail-fallback .channel-sidebar-card:not(.channel-sidebar-card--feed-mobile) {
    --channel-sidebar-avatar-size: 88px;
}

.channels-show-context-rail .channel-sidebar-card-avatar img,
.channels-show-context-rail .channel-sidebar-card-avatar-placeholder,
.channels-show-context-rail .channel-sidebar-card-avatar .gc-img-slot,
.channels-show-rail-fallback .channel-sidebar-card:not(.channel-sidebar-card--feed-mobile) .channel-sidebar-card-avatar img,
.channels-show-rail-fallback .channel-sidebar-card:not(.channel-sidebar-card--feed-mobile) .channel-sidebar-card-avatar-placeholder,
.channels-show-rail-fallback .channel-sidebar-card:not(.channel-sidebar-card--feed-mobile) .channel-sidebar-card-avatar .gc-img-slot {
    border-color: var(--surface-primary);
}

.channel-context-rail-stack {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

.channel-context-rail-stack:has(> .channel-upcoming-list) {
    gap: 0;
}

.channel-context-rail-stack:has(> .channel-upcoming-list) > .channel-sidebar-card .channel-sidebar-card-body {
    padding-bottom: var(--space-2);
}

.channels-show-context-rail .channel-context-rail-stack {
    padding-bottom: var(--space-4);
}

.channels-show-context-rail .channel-context-rail-stack > :not(.channel-sidebar-card),
.channels-show-rail-fallback .channel-context-rail-stack > :not(.channel-sidebar-card) {
    margin-inline: 0;
}

.channel-upcoming-list {
    min-width: 0;
}

.channel-upcoming-list .channel-upcoming-panel-content {
    gap: 0;
}

.channel-upcoming-track {
    display: contents;
}

/* Mobile hero: the same 42% slides and 16:9 media as the event loadout. */
.channel-feed-mobile-rail .channel-sidebar-card-upcoming {
    margin-top: var(--space-3);
}

.channel-feed-mobile-rail .channel-upcoming-list .channel-upcoming-panel-content {
    padding: 0;
    gap: var(--space-2);
}

.channel-feed-mobile-rail .channel-upcoming-panel-content > .gc-list-group-header {
    margin: 0;
    padding: 0;
    font-size: var(--font-size-14);
    font-weight: 500;
    line-height: 20px;
}

.channel-feed-mobile-rail .channel-upcoming-track {
    display: flex;
    align-items: stretch;
    gap: var(--space-2);
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    overscroll-behavior-x: contain;
    touch-action: pan-x pan-y;
    scrollbar-width: none;
    padding-block: 0 var(--space-1);
}

.channel-feed-mobile-rail .channel-upcoming-track::-webkit-scrollbar {
    display: none;
}

.channel-feed-mobile-rail .channel-upcoming-track > .channel-upcoming-event-link {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    flex: 0 0 42%;
    min-width: 7.5rem;
    gap: var(--space-2);
    padding: 0;
    scroll-snap-align: start;
    border-radius: var(--radius-12);
}

.channel-feed-mobile-rail .channel-upcoming-track > .channel-upcoming-event-link .channel-upcoming-event-link__preview {
    width: 100%;
    min-width: 0;
    max-width: none;
    height: auto;
    min-height: 0;
    max-height: none;
    aspect-ratio: var(--gc-event-index-card-cover-aspect);
    border-radius: var(--radius-12);
}

.channel-feed-mobile-rail .channel-upcoming-track .gc-list-content {
    padding: 0;
    gap: var(--space-1);
}

.channel-feed-mobile-rail .channel-upcoming-track .channel-upcoming-event-link__preview.gc-list-media-icon {
    background: var(--surface-control);
    border: 1px solid var(--border-subtle);
    box-sizing: border-box;
}

.channel-feed-mobile-rail .channel-upcoming-track .gc-list-title {
    margin: 0;
    font-size: var(--font-size-14);
    font-weight: 500;
    line-height: 20px;
    white-space: normal;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
}

.channel-feed-mobile-rail .channel-upcoming-track .gc-list-meta {
    margin: 0;
    font-size: var(--font-size-12);
    line-height: 16px;
    color: var(--text-secondary);
}

.channel-feed-mobile-rail .channel-upcoming-track .channel-upcoming-event-link__chev,
.channel-feed-mobile-rail .channel-upcoming-track > .channel-upcoming-event-link::before {
    display: none;
}

.channel-context-rail-stack > .channel-upcoming-list .channel-upcoming-panel-content {
    padding-block-start: 0;
}

.channel-upcoming-event-link {
    --gc-list-media-size: var(--gc-list-media-size-lg);
    --channel-upcoming-preview-width: calc(var(--gc-list-media-size) * 16 / 9);
    position: relative;
}

.channel-upcoming-event-link .channel-upcoming-event-link__preview.gc-list-media-square,
.channel-upcoming-event-link .channel-upcoming-event-link__preview.gc-list-media-icon {
    width: var(--channel-upcoming-preview-width);
    min-width: var(--channel-upcoming-preview-width);
    max-width: var(--channel-upcoming-preview-width);
    height: var(--gc-list-media-size);
    min-height: var(--gc-list-media-size);
    max-height: var(--gc-list-media-size);
}

.channel-upcoming-panel-content > .gc-list-group-header {
    padding-block: var(--space-1);
}

.channel-upcoming-panel-content > .gc-list-group-header .gc-skeleton-text {
    margin-bottom: 0;
}

.channel-upcoming-event-link + .channel-upcoming-event-link::before {
    content: "";
    position: absolute;
    top: 0;
    right: var(--gc-list-row-padding);
    left: calc(
        var(--gc-list-row-padding)
        + var(--channel-upcoming-preview-width)
        + var(--gc-list-row-padding)
    );
    height: 1px;
    background: var(--border-subtle);
    pointer-events: none;
}

@media (min-width: 1280px) and (hover: hover) and (pointer: fine) {

.channel-upcoming-event-link:is(:hover, :focus-visible)::before,

.channel-upcoming-event-link:is(:hover, :focus-visible) + .channel-upcoming-event-link::before {
    opacity: 0;
}
}

.channel-upcoming-event-link:is( :focus-visible)::before,

.channel-upcoming-event-link:is( :focus-visible) + .channel-upcoming-event-link::before {
    opacity: 0;
}

.channel-upcoming-event-link__preview .gc-img-slot__media,
.channel-upcoming-event-link__preview img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/*
 * Превью обложки в «Ближайшие»: chromatic outline 10% на фото
 * (better-ui image outlines; icon-frame без outline).
 */
.channel-upcoming-event-link__preview.gc-list-media-square:has(.gc-img-slot__media, img) {
    outline: 1px solid color-mix(in srgb, var(--fill-emphasis) 10%, transparent);
}

@media (min-width: 992px) {
    body.inertia-shell .channel-feed-mobile-rail {
        display: none !important;
    }

    .channel-feed-mobile-rail .channel-sidebar-card-upcoming {
        display: none;
    }
}

@media (max-width: 991.98px) {
    .gc-until-layout-rail.channels-show-rail-fallback {
        display: none !important;
    }
}

/* Categories are the only horizontal filter row in the catalog. */
.channels-index-type-cloud {
    display: block;
    width: 100%;
    min-width: 0;
}

.channels-index-type-cloud__chips.gc-chip-group {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    gap: var(--space-2);
    row-gap: var(--space-2);
}

.channels-index-type-cloud .gc-chip {
    background: transparent;
    border-color: var(--border-default);
    color: var(--text-primary);
    box-shadow: none;
}

.channels-index-type-cloud .gc-chip[aria-pressed="true"],
.channels-index-type-cloud .gc-chip[aria-current="page"] {
    background: var(--fill-primary);
    color: var(--text-on-fill-primary);
    border-color: var(--fill-primary);
}

@media (hover: hover) and (pointer: fine) {
    .channels-index-type-cloud a.gc-chip:hover:not([aria-pressed="true"]):not([aria-current="page"]) {
        background: var(--surface-interaction-control-hover);
        border-color: var(--border-default);
        color: var(--text-primary);
    }
}

.channels-index-type-cloud a.gc-chip:active {
    transform: scale(0.96);
}

.channels-index-type-cloud .gc-skeleton-events-index-rail-chip {
    /* Паритет kit `.gc-chip` min-height */
    height: 28px;
    border-radius: var(--radius-full);
    flex-shrink: 0;
}

@media (max-width: 991.98px) {
    .channels-index-type-cloud__chips.gc-chip-group {
        flex-wrap: nowrap;
        overflow-x: auto;
        scrollbar-width: none;
        padding-block: var(--space-1);
        scroll-padding-inline: var(--space-1);
        padding-inline-end: var(--space-4);
        mask-image: linear-gradient(to right, black calc(100% - var(--space-4)), transparent);
    }

    .channels-index-type-cloud__chips::-webkit-scrollbar {
        display: none;
    }

    .channels-index-type-cloud .gc-chip,
    .channels-index-type-cloud .gc-skeleton-events-index-rail-chip {
        flex-shrink: 0;
        min-height: var(--space-product-40);
    }
}

/* =========================================
   Профиль стрелка в канале — /channels/.../shooters/{id}
   Шапка как gc-profile-identity, статистика — мозаика profile-nastr-strip--rail.
   ========================================= */

.channel-shooter {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
    min-width: 0;
}

.channel-shooter .profile-nastr-strip--rail {
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-16);
    overflow: hidden;
}

.channel-shooter .gc-panel.gc-panel--secondary {
    border: 1px solid var(--border-subtle);
}

.channel-shooter .profile-nastr-strip--rail .profile-hit-zone-cell {
    padding: var(--space-3) var(--space-4);
}

.channel-shooter .profile-nastr-strip--rail > .profile-hit-zone-cell:last-child:nth-child(odd) {
    grid-column: 1 / -1;
}

.channel-shooter-stat__label {
    justify-content: space-between;
}

.channel-shooter-method-list {
    margin: 0;
    padding-left: var(--space-4);
}

.channel-tags {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-1);
    margin-block: 0;
}

