/* locked.css — General Manager + pages lockées */

/* fallback pumpkin si :root pas encore set */
.gmPage {
    --pumpkin: var(--pumpkin, #FF5F19);
}

    /* ===== Anti overlay / anti superposition (GM uniquement) =====
   Ça neutralise les pseudo-éléments qui ajoutent des couches au-dessus.
   Si ton global.css a un ::before sur main/app/drawer, ça le coupe ici.
*/
    .gmPage::before,
    .gmPage::after,
    .gmPage .gmActionsCard::after,
    .gmPage .gmDetail::after,
    .gmPage .gmList::before,
    .gmPage .gmList::after {
        content: none !important;
    }

.gmPage {
    isolation: isolate; /* évite des layers externes */
}

    /* base */
    .gmPage, .gmPage * {
        box-sizing: border-box;
    }

.gmPage {
    padding: 0 14px 18px;
    overflow-x: hidden;
}

.headerRow {
    margin: 10px 0 12px;
}

.kicker {
    font-weight: 900;
    letter-spacing: .2px;
    color: var(--pumpkin);
}

/* ===== Actions card ===== */
.gmActionsCard {
    border-radius: 18px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(255,255,255,.06);
    box-shadow: var(--shadow);
    padding: 12px;
    position: relative;
    overflow: hidden;
}

    .gmActionsCard::before {
        content: "";
        position: absolute;
        inset: 0;
        background: radial-gradient(340px 220px at 20% 10%, rgba(110,231,255,.14), transparent 60%);
        pointer-events: none;
    }

.gmActionsTop {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.gmActionsTitle {
    font-weight: 900;
    font-size: 18px;
    color: rgba(255,255,255,.96);
}

.gmActionsSub {
    margin-top: 4px;
    font-weight: 800;
    font-size: 12px;
    color: rgba(255,255,255,.70);
}

.gmClose {
    width: 36px;
    height: 36px;
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(0,0,0,.20);
    color: rgba(255,255,255,.92);
    font-weight: 900;
}

.gmPrimary {
    position: relative;
    z-index: 1;
    margin-top: 10px;
    width: 100%;
    height: 44px;
    border-radius: 14px;
    border: 0;
    background: rgba(0,0,0,.88);
    color: rgba(255,255,255,.95);
    font-weight: 900;
}

/* ===== Event ===== */
.gmEvent {
    position: relative;
    z-index: 1;
    margin-top: 10px;
    border-radius: 16px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(0,0,0,.22);
    padding: 10px;
}

.gmEventTitle {
    font-weight: 900;
    color: rgba(255,255,255,.92);
    margin-bottom: 8px;
}

.gmEventRow {
    display: grid;
    gap: 10px;
}

.gmEventRow--one {
    grid-template-columns: 1fr;
}

.gmLbl {
    font-weight: 900;
    font-size: 12px;
    color: rgba(255,255,255,.70);
    margin-bottom: 6px;
}

.gmSelect {
    width: 100%;
    height: 44px;
    border-radius: 14px;
    padding: 0 12px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(255,255,255,.06);
    color: rgba(255,255,255,.92);
    font-weight: 900;
    outline: none;
}

/* ===== Block heading ===== */
.gmBlock {
    position: relative;
    z-index: 1;
    margin-top: 10px;
}

.gmBlockHead {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
    padding: 0 2px;
}

.gmBlockTitle {
    font-weight: 900;
    color: rgba(255,255,255,.96);
}

.gmBlockSub {
    font-weight: 800;
    font-size: 12px;
    color: rgba(255,255,255,.60);
}

/* ===== Carousel ===== */
.gmCarousel {
    margin-top: 8px;
    display: flex;
    gap: 10px;
    overflow-x: auto;
    padding-bottom: 6px;
    scroll-snap-type: x mandatory;
}

    .gmCarousel::-webkit-scrollbar {
        height: 6px;
    }

    .gmCarousel::-webkit-scrollbar-thumb {
        background: rgba(255,255,255,.18);
        border-radius: 999px;
    }

.gmPlayerCard {
    min-width: 260px;
    scroll-snap-align: start;
    border-radius: 18px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(255,255,255,.06);
    box-shadow: var(--shadow);
    padding: 12px;
    text-align: left;
    position: relative;
    overflow: hidden;
}

    .gmPlayerCard::before {
        content: "";
        position: absolute;
        inset: 0;
        background: radial-gradient(260px 150px at 20% 10%, rgba(110,231,255,.10), transparent 60%);
        pointer-events: none;
    }

    .gmPlayerCard.is-active {
        border-color: rgba(110,231,255,.35);
        background: rgba(110,231,255,.08);
    }

.gmPlayerTop {
    position: relative;
    z-index: 1;
    display: grid;
    grid-template-columns: 44px 1fr 36px;
    gap: 10px;
    align-items: center;
}

.gmAvatar {
    width: 44px;
    height: 44px;
    border-radius: 14px;
    object-fit: cover;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(0,0,0,.20);
}

.gmName {
    font-weight: 900;
    color: rgba(255,255,255,.96);
    line-height: 1.1;
}

.gmSub {
    margin-top: 3px;
    font-weight: 800;
    font-size: 12px;
    color: rgba(255,255,255,.70);
}

.gmFav {
    width: 36px;
    height: 36px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(0,0,0,.18);
    color: rgba(255,255,255,.72);
    font-weight: 900;
}

    .gmFav.is-on {
        color: rgba(255,255,255,.95);
        border-color: rgba(255,95,25,.30);
        background: rgba(255,95,25,.16);
    }

.gmPills {
    position: relative;
    z-index: 1;
    display: flex;
    gap: 8px;
    margin-top: 10px;
}

.gmPill {
    padding: 6px 10px;
    border-radius: 999px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(0,0,0,.16);
    color: rgba(255,255,255,.90);
    font-weight: 900;
    font-size: 12px;
}

/* + / - */
.gmPickRow {
    position: relative;
    z-index: 1;
    margin-top: 10px;
    display: flex;
    justify-content: flex-start;
}

.gmPickBtnSmall {
    height: 38px;
    padding: 0 14px;
    border-radius: 14px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(0,0,0,.22);
    color: rgba(255,255,255,.92);
    font-weight: 900;
}

    .gmPickBtnSmall.is-on {
        border-color: rgba(255,95,25,.30);
        background: rgba(255,95,25,.16);
    }

/* ===== Detail (Radar only) ===== */
.gmDetail {
    position: relative;
    z-index: 1;
    margin-top: 10px;
    border-radius: 18px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(255,255,255,.06);
    box-shadow: var(--shadow);
    padding: 12px;
    overflow: hidden;
}

    .gmDetail::before {
        content: "";
        position: absolute;
        inset: 0;
        background: radial-gradient(320px 200px at 22% 10%, rgba(110,231,255,.10), transparent 65%);
        pointer-events: none;
    }

.gmDetailHead {
    position: relative;
    z-index: 1;
    margin-bottom: 10px;
}

.gmDetailTitle {
    font-weight: 900;
    color: rgba(255,255,255,.96);
}

.gmDetailSub {
    margin-top: 4px;
    font-weight: 900;
    color: rgba(255,255,255,.92);
}

.gmRadarBox {
    position: relative;
    z-index: 1;
    border-radius: 16px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(0,0,0,.18);
    padding: 10px;
}

.gmRadarSub {
    margin-top: 2px;
    font-weight: 800;
    font-size: 12px;
    color: rgba(255,255,255,.65);
}

.gmRadarCanvasHost {
    margin-top: 10px;
    height: 260px;
    border-radius: 16px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(0,0,0,.14);
    padding: 10px;
}

    .gmRadarCanvasHost canvas {
        width: 100% !important;
        height: 100% !important;
        display: block;
    }

/* orange action */
.gmPickBtn {
    margin-top: 10px;
    background: rgba(255,95,25,.90);
    color: rgba(255,255,255,.96);
}

/* ===== List championnats VERTICALE ===== */
.gmList {
    margin-top: 12px;
}

.gmListTitle {
    margin: 8px 2px 10px;
    font-weight: 900;
    letter-spacing: .2px;
    color: rgba(255,255,255,.92);
}

/* ✅ vertical + scroll Y */
.gmListScroll {
    display: flex;
    flex-direction: column; /* <<< vertical */
    gap: 12px;
    overflow-y: auto; /* <<< scroll vertical */
    overflow-x: hidden;
    padding: 2px 6px 6px 2px;
    scrollbar-width: thin;
    scrollbar-color: rgba(255,255,255,.25) transparent;
}

    .gmListScroll::-webkit-scrollbar {
        width: 6px;
    }

    .gmListScroll::-webkit-scrollbar-thumb {
        background: rgba(255,255,255,.20);
        border-radius: 999px;
    }

.gmListScroll--compactY {
    max-height: 170px; /* ~ 3 items visibles selon padding */
}

.gmChip {
    width: 100%;
    padding: 14px 14px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border: 1px solid rgba(255,255,255,.10);
    background: rgba(255,255,255,.06);
    color: rgba(255,255,255,.92);
    opacity: .70;
}

.gmChipText {
    min-width: 0;
}

.gmChipName {
    font-weight: 900;
    color: rgba(255,255,255,.92);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.gmChipMeta {
    margin-top: 4px;
    font-weight: 800;
    font-size: 12px;
    color: rgba(255,255,255,.70);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.gmChipDate {
    font-weight: 900;
    font-size: 18px;
    color: rgba(255,255,255,.92);
}