/* GcInsetList: one content edge, row padding and interaction contract.
   See docs/ui-kit/LIST_STACK.md. Opt-in; existing flush lists are unaffected.
   Tokens also live on context sidepage / sheet so mixed parents share the same hover edge. */
.gc-inset-list {
    --gc-inset-padding: var(--space-4);
    --gc-inset-row-padding: var(--gc-list-row-padding, var(--space-3));
    --gc-inset-row-min-height: var(--gc-btn-md-min-height);
    --gc-inset-hover-edge: calc(var(--gc-inset-padding) - var(--gc-inset-row-padding));
}
/* Rail / sidepage: Soho density — row h-9 (36), pad 8, hover edge 6. */
.gc-inset-list.gc-inset-list--rail,
.gc-context-sidepage,
.gc-modal-sidepanel,
.gc-context-rail {
    --gc-inset-row-padding: var(--space-2);
    --gc-inset-row-min-height: var(--gc-btn-md-min-height);
    --gc-inset-hover-edge: var(--space-1-5);
    --gc-inset-padding: calc(var(--gc-inset-hover-edge) + var(--gc-inset-row-padding));
}
.gc-inset-list {
    --gc-inset-gap: var(--space-1);
    display: flex;
    flex-direction: column;
    gap: var(--gc-inset-gap);
    min-width: 0;
    padding: var(--gc-inset-padding);
    overflow: visible;
    box-sizing: border-box;
}
.gc-inset-list__title {
    margin: 0 0 var(--space-2);
    color: var(--text-secondary);
    font-size: var(--font-size-12);
    font-weight: var(--font-weight-medium);
    line-height: 1.5;
}
.gc-inset-list .gc-inset-list__row,
.gc-inset-list.gc-inset-list--rail :is(
    .gc-interactive-row:not(.gc-open-list-tree-block__header):not(.event-info-join-lid-row),
    .catalog-nav-item,
    .event-info-community
) {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    position: relative;
    width: calc(100% + 2 * var(--gc-inset-row-padding));
    max-width: none;
    margin-inline: calc(-1 * var(--gc-inset-row-padding));
    padding: var(--gc-inset-row-padding);
    min-height: var(--gc-inset-row-min-height);
    border: 0;
    border-radius: var(--radius-12);
    background: transparent;
    color: var(--text-primary);
    text-decoration: none;
    text-align: start;
    font: inherit;
    box-sizing: border-box;
    transition: background-color var(--transition-fast);
}

/*
 * Join lid is a primary CTA, not an inset row: no bleed, padding stays inside the fill.
 * Otherwise rest title = --text-primary on Fill/Primary and hover «включает» отступы.
 */
.gc-inset-list.gc-inset-list--rail .event-info-join-stack__lid :is(
    a.gc-interactive-row,
    .gc-interactive-row
),
.gc-inset-list.gc-inset-list--rail .event-info-join-lid-row {
    width: 100%;
    max-width: none;
    margin-inline: 0;
    padding: var(--gc-list-row-padding) var(--space-4);
    min-height: var(--gc-inset-row-min-height, var(--gc-btn-md-min-height));
    background: transparent;
    color: inherit;
    border-radius: inherit;
}
.gc-inset-list.gc-inset-list--rail .event-info-join-stack__lid :is(.gc-list-title, .sidebar-community-chevron) {
    color: inherit;
}
.gc-inset-list.gc-inset-list--rail .event-info-join-stack__lid .gc-list-meta {
    color: color-mix(in srgb, var(--gc-btn-primary-fg) 78%, transparent);
}
@media (hover: hover) {
    @media (min-width: 1280px) and (hover: hover) and (pointer: fine) {
    .gc-inset-list.gc-inset-list--rail .event-info-join-stack__lid :is(
        a.gc-interactive-row,
        .gc-interactive-row
    ):hover {
        background: transparent;
        color: inherit;
    }
    }
}

/*
 * Composite transport/crew: bleed the tree-block like a row (LIST_STACK sidepage).
 * Header stays inside — own bleed/hover would be a second, narrower/wider surface.
 */
.gc-inset-list.gc-inset-list--rail .gc-open-list-tree-block {
    --gc-open-list-tree-row-padding: var(--gc-inset-row-padding);
    box-sizing: border-box;
    width: calc(100% + 2 * var(--gc-inset-row-padding));
    max-width: none;
    margin-inline: calc(-1 * var(--gc-inset-row-padding));
    overflow: visible;
}
.gc-inset-list__row:is(label, button, a) { cursor: pointer; }
@media (hover: hover) {
    @media (min-width: 1280px) and (hover: hover) and (pointer: fine) {

    .gc-inset-list.gc-inset-list--rail :is(a, button, .interactive):is(
        .gc-interactive-row:not(.gc-open-list-tree-block__header):not(.event-info-join-lid-row),
        .catalog-nav-item,
        .event-info-community
    ):hover {
        background: var(--gc-interactive-hover-bg, var(--surface-elevated));
    }
    }
    .gc-inset-list .gc-inset-list__row:is(label, button, a):hover {
        background: var(--gc-interactive-hover-bg, var(--surface-elevated));
    }
}
.gc-inset-list .gc-inset-list__row:focus-visible,
.gc-inset-list .gc-inset-list__row:has(input:focus-visible),
.gc-inset-list.gc-inset-list--rail :is(
    .gc-interactive-row:not(.gc-open-list-tree-block__header):not(.event-info-join-lid-row),
    .catalog-nav-item,
    .event-info-community
):focus-visible {
    outline: var(--gc-focus-outline);
    outline-offset: -2px;
}
.gc-inset-list__checkbox {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    overflow: hidden;
}
.gc-inset-list__check {
    display: grid;
    place-items: center;
    box-sizing: border-box;
    flex: 0 0 var(--gc-checkbox-size);
    width: var(--gc-checkbox-size);
    min-width: var(--gc-checkbox-size);
    height: var(--gc-checkbox-size);
    border: 1px solid var(--border-default);
    border-radius: var(--gc-checkbox-list-radius);
    color: transparent;
    align-self: center;
}
.gc-inset-list__row[data-selected] .gc-inset-list__check:not(.gc-inset-list__check--commit),
.event-loadout-weapon-card-pick.is-selected .gc-inset-list__check {
    background: var(--accent-link);
    border-color: var(--accent-link);
    color: var(--text-on-solid);
}
/* Commit: только глиф ✓, без квадрата-тоггла */
.gc-inset-list__check--commit {
    border: 0;
    background: transparent;
    color: var(--text-primary);
    width: auto;
    min-width: 0;
    height: auto;
    flex-basis: auto;
}
.gc-inset-list__row[data-selected] .gc-inset-list__check--commit {
    background: transparent;
    border-color: transparent;
    color: var(--text-primary);
}
.gc-inset-list .gc-inset-list__row .gc-list-content { flex: 1; min-width: 0; }
.gc-inset-list .gc-inset-list__row .gc-list-content .gc-list-meta {
    display: block;
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
    line-height: 1.5;
    margin-top: var(--space-1);
}
.gc-inset-list.gc-inset-list--rail {
    --gc-inset-gap: var(--space-2);
    /*
     * Inline: parent keeps --gc-inset-padding, row bleeds its padding → hover inset
     * = --gc-inset-hover-edge (space/1.5 = 6px). Block has no bleed, so padding-block
     * uses the same edge.
     */
    padding-inline: var(--gc-inset-padding);
    padding-block: var(--gc-inset-hover-edge);
}
/* Category kicker + rows: one list, no boxed group. Between clusters — related-group air. */
.gc-inset-list__cluster {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
    min-width: 0;
}
.gc-inset-list__cluster > .gc-inset-list__title {
    margin: 0;
}
.gc-inset-list:has(> .gc-inset-list__cluster),
.gc-inset-list.gc-inset-list--rail:has(> .gc-inset-list__cluster) {
    --gc-inset-gap: var(--space-3);
}
/* Stats and shot chips — content line, no second inset on top of --rail. */
.gc-inset-list.gc-inset-list--rail :is(.weapon-sidebar-stack--show-rail, .stage-show-rail-stack) > .gc-stat-list,
.gc-inset-list.gc-inset-list--rail .weapon-show-rail-shots,
.gc-inset-list.gc-inset-list--rail .gc-stage-sidebar-weapons {
    width: 100%;
    max-width: none;
    margin-inline: 0;
    padding: 0;
}
/* Price is static (no row-pad / bleed). Block-start = row-padding so copy sits like row text. */
.gc-inset-list.gc-inset-list--rail .event-info-price {
    width: 100%;
    max-width: none;
    margin-inline: 0;
    padding: var(--gc-inset-row-padding) 0 0;
}
/*
 * Adaptive event about: цена / люди / CTA — соседи в `.event-show-about-rail-body`
 * (gap space/4 = inter-group). Wrapper держит только однотипные строки
 * (орга + сообщество): иначе inter-gap протекает между аватарами.
 * Join CTA — sibling body, не child entities (иначе липнет к сообществу).
 * Desktop --rail: без своего padding — bleed строк от внешнего --rail.
 * Fallback card: ниже переопределяет padding-inline на entities.
 */
.event-show-about-rail-entities {
    display: flex;
    flex-direction: column;
    gap: 0;
    min-width: 0;
    width: 100%;
}
/*
 * Flush только у about мероприятия. Оружие и брифинг в той же обёртке
 * держат свой --rail: иначе статы и строки липнут к рамке карточки.
 */
.event-show-rail-fallback-about .gc-inset-list.gc-inset-list--rail:not(.weapon-show-sidebar-info-block):not(.stage-show-sidebar-info-block) {
    padding-inline: 0;
    padding-block: 0;
}
.event-show-rail-fallback-about .event-show-about-rail-entities {
    --gc-inset-row-padding: var(--gc-list-row-padding, var(--space-3));
    --gc-inset-hover-edge: var(--space-1-5);
    --gc-inset-padding: calc(var(--gc-inset-hover-edge) + var(--gc-inset-row-padding));
    display: flex;
    flex-direction: column;
    gap: 0;
    min-width: 0;
    width: 100%;
    box-sizing: border-box;
    padding-inline: var(--gc-inset-padding);
    padding-block-start: 0;
    padding-block-end: var(--gc-inset-hover-edge);
}
.event-show-rail-fallback-about .gc-inset-list.gc-inset-list--rail .event-show-about-rail-body > :is(
    .gc-interactive-row:not(.gc-open-list-tree-block__header),
    .gc-open-list-tree-block,
    .event-info-community
) {
    width: 100%;
    max-width: none;
    margin-inline: 0;
}
.event-show-rail-fallback-about .gc-inset-list.gc-inset-list--rail .event-show-about-rail-entities > :is(
    .gc-interactive-row,
    .event-info-community
),
.event-show-rail-fallback-about .gc-inset-list.gc-inset-list--rail .event-show-about-rail-entities .catalog-nav-item {
    width: calc(100% + (2 * var(--gc-inset-row-padding)));
    max-width: none;
    margin-inline: calc(-1 * var(--gc-inset-row-padding));
    padding: var(--gc-inset-row-padding);
    border-radius: var(--radius-12);
}
.event-show-rail-fallback-about .gc-inset-list.gc-inset-list--rail .event-info-price {
    padding: var(--space-2) var(--space-4);
}
/* Catalog rows and loadout rows use the same parent edge. */
.gc-inset-list--rail .profile-rail-people-list.catalog-nav,
.gc-inset-list--rail .profile-rail-people-rows {
    --catalog-nav-inset: 0px;
    padding: 0;
    margin: 0;
    width: 100%;
    overflow: visible;
}
/* Boxed selection: card chrome around the inset recipe. Storybook Selection; not the class modal. */
.gc-inset-list.gc-inset-list--boxed {
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-16);
    background: var(--surface-secondary);
    overflow: hidden;
}
/* Class picker: tab chrome bleeds the list-zone inset (styles.css underline recipe). */
.weapon-class-inset-selector {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0;
    overflow: visible;
}
.weapon-class-inset-selector:has(> .weapon-class-inset-selector__tabs) {
    overflow: visible;
}
.weapon-class-inset-selector__tabs {
    position: relative;
    z-index: 1;
    flex-shrink: 0;
    box-sizing: border-box;
    margin: 0;
    width: 100%;
    max-width: none;
    padding: var(--space-3) var(--gc-inset-padding, var(--space-4)) 0;
    align-self: stretch;
    background: var(--surface-primary);
}
.weapon-class-inset-selector > .gc-inset-list {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
}
/* Кикер ближе к своим строкам, чем к линии табов и к предыдущей группе. */
.weapon-class-inset-selector:has(> .weapon-class-inset-selector__tabs) > .gc-inset-list {
    padding-top: var(--space-2);
}
.weapon-class-inset-selector .gc-inset-list__cluster {
    gap: var(--space-2);
}
.weapon-class-inset-selector .gc-inset-list__cluster > .gc-inset-list__title + .gc-inset-list__row {
    padding-top: var(--gc-inset-row-padding);
}
/*
 * None-only (калькулятор): рамка на линии контента модала (zone padding),
 * без второго --rail и без negative bleed в шапку.
 */
.weapon-class-inset-selector:not(:has(> .weapon-class-inset-selector__tabs)):not(:has(.gc-inset-list__cluster)) {
    flex: 0 0 auto;
    min-height: 0;
    overflow: visible;
}
.weapon-class-inset-selector:not(:has(> .weapon-class-inset-selector__tabs)) > .gc-inset-list:not(:has(> .gc-inset-list__cluster)) {
    padding: 0;
    overflow: visible;
    flex: 0 0 auto;
}
/* None toggle: frame = ширина контента модала. С кластерами блид на --gc-inset-padding, не row. */
.weapon-class-inset-selector__none {
    margin: 0 0 var(--space-3);
    min-width: 0;
}
.weapon-class-inset-selector__none .gc-toggle-container.gc-toggle-inline,
.weapon-class-inset-selector__none .gc-toggle-container.gc-toggle-inline:has(.gc-toggle-meta) {
    width: 100%;
    max-width: none;
    margin-inline: 0;
    margin-block: 0;
    padding: var(--gc-inset-row-padding, var(--space-3));
    min-height: var(--gc-inset-row-min-height, var(--gc-btn-md-min-height));
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-12);
    background: transparent;
    gap: 0;
    box-sizing: border-box;
}
.gc-inset-list--rail:has(> .gc-inset-list__cluster) .weapon-class-inset-selector__none .gc-toggle-container.gc-toggle-inline,
.gc-inset-list--rail:has(> .gc-inset-list__cluster) .weapon-class-inset-selector__none .gc-toggle-container.gc-toggle-inline:has(.gc-toggle-meta) {
    width: calc(100% + 2 * var(--gc-inset-padding));
    margin-inline: calc(-1 * var(--gc-inset-padding));
}
.weapon-class-inset-selector__none .gc-toggle-title {
    font-size: var(--gc-list-title-font-size);
    line-height: var(--gc-list-title-line-height);
}
@media (hover: hover) {
    .weapon-class-inset-selector__none .gc-toggle-container.gc-toggle-inline:hover {
        background: var(--gc-interactive-hover-bg, var(--surface-elevated));
        box-shadow: none;
    }
}
/* Скролл на списке, не на body — иначе линия табов / поиска уже шапки на ширину scrollbar. */
.weapon-class-picker-modal .modal-body.modal-body--nested:has(> .gc-modal-content--list),
.epic-attach-events-modal .modal-body.modal-body--nested:has(> .gc-modal-content--list) {
    overflow: hidden;
}
.weapon-class-picker-modal .gc-modal-content--list,
.epic-attach-events-modal .gc-modal-content--list {
    overflow: hidden;
}
.weapon-class-inset-selector .gc-inset-list__row {
    align-items: center;
}
.weapon-class-inset-selector .gc-inset-list__check,
.weapon-class-inset-selector .gc-class-badge {
    align-self: center;
    margin-top: 0;
}
.weapon-class-inset-selector .gc-class-badge {
    flex: 0 0 auto;
}
@media (prefers-reduced-motion: reduce) { .gc-inset-list .gc-inset-list__row { transition: none; } }
