/*
 * Lion2 Signal — Wave 2 game-control polish, immutable revision 1.
 *
 * Retires Lion1 raster controls from casino, slot, mini, token, Mingo,
 * Lotus, virtual-game and memo surfaces.  Product/provider thumbnails and
 * race-runner artwork remain content; controls use live text, Flaticon glyphs
 * and the reusable Signal key/medallion/frame parts.
 *
 * This file intentionally remains unlayered and high-specificity.  It is a
 * late compatibility boundary for historical mobile virtual-game rules that
 * still contain important orange/brown declarations.
 */

body.lion2-skin {
    --signal-game-control-ink: #080a0b;
    --signal-game-control-copy: #f0f1eb;
    --signal-game-control-muted: #aeb3b0;
    --signal-game-control-panel: #111516;
    --signal-game-control-panel-raised: #202526;
    --signal-game-control-line: #5f6667;
    --signal-game-control-line-soft: #343a3b;
    --signal-game-control-yellow: var(--signal-yellow-hot, #ffd316);
}

/* --------------------------------------------------------------------------
 * Provider/game cards: live Signal key instead of the old playc.png raster.
 * ----------------------------------------------------------------------- */

body.lion2-skin.lion-skin #ajax-content#ajax-content :is(
    #provider_list,
    #favorite_list,
    #mini_game_list,
    #lotus_game_list,
    #tokengame_list,
    #mingo_list
) .live-game-cont > .el-row > .hoverw {
    z-index: 5 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: linear-gradient(180deg, rgb(4 6 7 / 16%), rgb(4 6 7 / 70%)) !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transition: opacity .18s ease !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content :is(
    #provider_list,
    #favorite_list,
    #mini_game_list,
    #lotus_game_list,
    #tokengame_list,
    #mingo_list
) .live-game-cont:is(:hover, :focus-within) > .el-row > .hoverw {
    opacity: 1 !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content :is(
    #provider_list,
    #favorite_list,
    #mini_game_list,
    #lotus_game_list,
    #tokengame_list,
    #mingo_list
) .live-game-cont:is(.locked, .provider-locked, [aria-disabled='true']) > .el-row > .hoverw {
    display: none !important;
}

body.lion2-skin .signal-card-action {
    display: inline-flex;
    width: 92px;
    min-width: 92px;
    min-height: 40px;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 6px 12px;
    background-color: var(--signal-game-control-yellow);
    background-image: var(--signal-part-key-yellow);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%;
    color: var(--signal-game-control-ink);
    font-family: var(--signal-font-display);
    font-size: 12px;
    font-weight: 900;
    letter-spacing: .08em;
    line-height: 1;
    text-shadow: 0 1px rgb(255 255 255 / 26%);
    box-shadow: 0 5px 12px rgb(0 0 0 / 46%);
    transform: translateY(3px);
    transition: transform .18s ease, filter .18s ease;
}

body.lion2-skin .live-game-cont:is(:hover, :focus-within) .signal-card-action {
    filter: brightness(1.06) contrast(1.04);
    transform: translateY(0);
}

body.lion2-skin .signal-card-action > i {
    display: inline-flex;
    width: 18px;
    height: 18px;
    align-items: center;
    justify-content: center;
    font-size: 15px;
}

/* --------------------------------------------------------------------------
 * Money, destructive actions and the mini-game slip launcher.
 * ----------------------------------------------------------------------- */

body.lion2-skin .signal-money-medallion {
    display: inline-flex !important;
    box-sizing: border-box !important;
    flex: 0 0 auto !important;
    width: 40px !important;
    height: 40px !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 50% !important;
    background-color: #0b0e0f !important;
    background-image: var(--signal-part-medallion) !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
    color: var(--signal-game-control-yellow) !important;
    box-shadow: 0 3px 8px rgb(0 0 0 / 46%) !important;
    font-size: 19px !important;
    line-height: 1 !important;
}

body.lion2-skin .casino-modal-header h3 > .signal-money-medallion {
    grid-row: 1 / 3;
    width: 42px !important;
    height: 42px !important;
}

body.lion2-skin .signal-money-medallion--withdraw {
    color: #f0f1eb !important;
}

body.lion2-skin .signal-money-glyph {
    display: inline-flex !important;
    width: 18px !important;
    min-width: 18px !important;
    height: 18px !important;
    align-items: center !important;
    justify-content: center !important;
    color: var(--signal-game-control-yellow) !important;
    font-size: 15px !important;
    line-height: 1 !important;
    vertical-align: middle !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content .page.w_memo
    .memo-delete-button .signal-delete-glyph {
    display: inline-flex;
    width: 16px;
    height: 16px;
    align-items: center;
    justify-content: center;
    color: currentcolor;
    font-size: 13px;
    line-height: 1;
}

@media (width <= 980px) {
    body.lion2-skin.lion-skin #ajax-content#ajax-content
        #betslip-icon.signal-mini-slip-launcher {
        display: grid !important;
        grid-template-columns: 30px minmax(0, 1fr) !important;
        grid-template-rows: 1fr !important;
        width: 118px !important;
        min-width: 118px !important;
        height: 58px !important;
        min-height: 58px !important;
        padding: 7px 10px !important;
        border: 2px solid #686f70 !important;
        border-bottom: 4px solid var(--signal-game-control-yellow) !important;
        border-radius: 0 !important;
        background-color: #15191a !important;
        background-image: var(--signal-part-key-dark) !important;
        background-repeat: no-repeat !important;
        background-position: center !important;
        background-size: 100% 100% !important;
        color: var(--signal-game-control-copy) !important;
        box-shadow: 6px 6px 0 rgb(0 0 0 / 46%) !important;
    }

    body.lion2-skin #ajax-content #betslip-icon.signal-mini-slip-launcher > i {
        grid-row: 1;
        color: var(--signal-game-control-yellow) !important;
        font-size: 24px !important;
    }
}

/* --------------------------------------------------------------------------
 * Virtual game: live icon controls and a complete graphite/yellow late pass.
 * This closes high-specificity orange/brown desktop and mobile leaks.
 * ----------------------------------------------------------------------- */

body.lion2-skin.lion-skin #ajax-content#ajax-content .virtual-page {
    --virtual-lion-bg: #0b0e0f !important;
    --virtual-lion-panel: #111516 !important;
    --virtual-lion-row: #202526 !important;
    --virtual-lion-row-alt: #141819 !important;
    --virtual-lion-line: #596061 !important;
    --virtual-lion-line-strong: #777e7f !important;
    --virtual-lion-text: var(--signal-game-control-copy) !important;
    --virtual-lion-muted: var(--signal-game-control-muted) !important;
    background-color: #0b0e0f !important;
    background-image:
        linear-gradient(rgb(7 9 10 / 90%), rgb(7 9 10 / 96%)),
        var(--signal-part-concrete) !important;
    background-repeat: repeat !important;
    background-position: top left !important;
    background-size: auto !important;
    color: var(--signal-game-control-copy) !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content .virtual-page :is(
    .virtual-sport-tabs,
    .virtual-monitor-panel,
    .virtual-left-league,
    .virtual-history-tabs,
    .virtual-history-content
) {
    border: 1px solid var(--signal-game-control-line) !important;
    border-radius: 0 !important;
    background-color: var(--signal-game-control-panel) !important;
    background-image:
        linear-gradient(180deg, rgb(255 255 255 / 5%), rgb(0 0 0 / 26%)),
        var(--signal-part-concrete) !important;
    background-repeat: repeat !important;
    background-position: center !important;
    background-size: auto !important;
    color: var(--signal-game-control-copy) !important;
    box-shadow:
        inset 0 0 0 1px rgb(255 255 255 / 5%),
        0 4px 10px rgb(0 0 0 / 36%) !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content .virtual-page .virtual-sport-tabs {
    gap: 6px !important;
    margin: 8px 0 !important;
    padding: 7px !important;
    border-bottom: 4px solid var(--signal-game-control-yellow) !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content .virtual-page :is(
    .virtual-sport-tab,
    .virtual-monitor-tab,
    .virtual-history-tab
) {
    border: 1px solid #656c6d !important;
    border-radius: 0 !important;
    background-color: #1b1f20 !important;
    background-image: var(--signal-part-nav-dark) !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: 100% 100% !important;
    color: #d8dad5 !important;
    box-shadow: inset 0 1px rgb(255 255 255 / 8%) !important;
    text-shadow: 0 1px #000 !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content .virtual-page :is(
    .virtual-sport-tab,
    .virtual-monitor-tab,
    .virtual-history-tab
):is(:hover, :focus-visible) {
    border-color: var(--signal-game-control-yellow) !important;
    background-color: #2b3031 !important;
    background-image: var(--signal-part-nav-neutral) !important;
    color: #fff !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content .virtual-page :is(
    .virtual-sport-tab,
    .virtual-monitor-tab,
    .virtual-history-tab
).on {
    border-color: var(--signal-game-control-yellow) !important;
    background-color: var(--signal-game-control-yellow) !important;
    background-image: var(--signal-part-nav-active) !important;
    color: var(--signal-game-control-ink) !important;
    box-shadow:
        inset 0 -3px #b08c00,
        0 0 0 1px rgb(255 211 22 / 24%) !important;
    text-shadow: 0 1px rgb(255 255 255 / 22%) !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content .virtual-page
    .virtual-sport-icon {
    display: inline-flex !important;
    flex: 0 0 34px !important;
    width: 34px !important;
    height: 34px !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 50% !important;
    background-color: #0c0f10 !important;
    background-image: var(--signal-part-medallion) !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
    color: var(--signal-game-control-yellow) !important;
    font-size: 18px !important;
    line-height: 1 !important;
    filter: none !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content .virtual-page
    .virtual-sport-tab.on .virtual-sport-icon {
    color: #f4f4ed !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content .virtual-page
    .virtual-left-league-icon {
    display: inline-flex !important;
    flex: 0 0 38px !important;
    width: 38px !important;
    height: 38px !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 50% !important;
    background-color: #0c0f10 !important;
    background-image: var(--signal-part-medallion) !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
    color: var(--signal-game-control-yellow) !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content .virtual-page
    .signal-virtual-league-icon {
    display: inline-flex !important;
    width: 20px !important;
    min-width: 20px !important;
    height: 20px !important;
    align-items: center !important;
    justify-content: center !important;
    color: var(--signal-game-control-yellow) !important;
    font-size: 17px !important;
    line-height: 1 !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content .virtual-page :is(
    .virtual-video-panel,
    .virtual-game-item
) {
    border: 1px solid var(--signal-game-control-line) !important;
    border-radius: 0 !important;
    background: #080a0b !important;
    box-shadow:
        inset 0 0 0 1px rgb(255 255 255 / 5%),
        0 5px 12px rgb(0 0 0 / 42%) !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content .virtual-page
    .virtual-video-panel {
    border-top: 5px solid var(--signal-game-control-yellow) !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content .virtual-page
    .virtual-game-item {
    border-left: 4px solid var(--signal-game-control-yellow) !important;
    background: #121617 !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content .virtual-page :is(
    .virtual-league-info,
    .virtual-time-bar,
    .virtual-result-header,
    .virtual-result-row
) {
    border-color: var(--signal-game-control-line-soft) !important;
    background: #181d1e !important;
    color: var(--signal-game-control-muted) !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content .virtual-page
    .virtual-league-info {
    border-bottom: 1px solid var(--signal-game-control-line-soft) !important;
    background-image: linear-gradient(90deg, rgb(255 211 22 / 9%), transparent 58%) !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content .virtual-page
    .virtual-league-info .league-text {
    color: var(--signal-game-control-copy) !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content .virtual-page
    .virtual-time-bar .time-box {
    border: 1px solid var(--signal-game-control-line-soft) !important;
    border-radius: 0 !important;
    background: #080b0c !important;
    color: var(--signal-game-control-muted) !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content .virtual-page
    .virtual-time-bar .time-txt {
    color: var(--signal-game-control-yellow) !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content .virtual-page :is(
    .virtual-league-tab,
    .virtual-cart-pick,
    .virtual-cart-league
) {
    color: var(--signal-game-control-muted) !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content .virtual-page
    .virtual-league-tab:is(.on, :hover, :focus-visible) {
    color: var(--signal-game-control-yellow) !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content .virtual-page :is(
    .btn-virtual-bet,
    .btn-virtual-runner
) {
    border: 1px solid var(--signal-game-control-line-soft) !important;
    border-radius: 0 !important;
    background: #1b2021 !important;
    color: var(--signal-game-control-copy) !important;
    box-shadow: inset 0 1px rgb(255 255 255 / 4%) !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content .virtual-page :is(
    .btn-virtual-bet,
    .btn-virtual-runner
):is(.on, :hover, :focus-visible) {
    border-color: var(--signal-game-control-yellow) !important;
    background: var(--signal-game-control-yellow) !important;
    color: var(--signal-game-control-ink) !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content .virtual-page
    .btn-virtual-runner .runner-num {
    border: 1px solid var(--signal-game-control-line) !important;
    background: #272c2d !important;
    color: var(--signal-game-control-copy) !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content .virtual-page
    .btn-virtual-runner.on .runner-num {
    border-color: #080a0b !important;
    background: #080a0b !important;
    color: var(--signal-game-control-yellow) !important;
}

body.lion2-skin.lion-skin #ajax-content#ajax-content .virtual-page
    .virtual-result-row:nth-child(even) {
    background: #111516 !important;
}

body.lion2-skin.lion-skin :is(.right_content, #right_sidebar) :is(
    .virtual-cart-item,
    .virtual-cart-item .cart-inner
) {
    border-radius: 0 !important;
    background: #111516 !important;
    color: var(--signal-game-control-copy) !important;
}

body.lion2-skin.lion-skin :is(.right_content, #right_sidebar) :is(
    .virtual-cart-pick,
    #virtual_total_odd,
    #virtual_total_odd_amount
) {
    color: var(--signal-game-control-yellow) !important;
}

body.lion2-skin.lion-skin :is(.right_content, #right_sidebar)
    .virtual-cart-pick .cart-odds {
    border: 1px solid var(--signal-game-control-yellow) !important;
    border-radius: 0 !important;
    background: var(--signal-game-control-yellow) !important;
    color: var(--signal-game-control-ink) !important;
}

@media (width <= 980px) {
    body.lion2-skin.lion-skin #ajax-content#ajax-content .virtual-page
        .virtual-sport-tabs {
        gap: 6px !important;
        padding: 7px !important;
        border: 1px solid var(--signal-game-control-line) !important;
        border-bottom: 4px solid var(--signal-game-control-yellow) !important;
        border-radius: 0 !important;
        background-color: var(--signal-game-control-panel) !important;
        background-image: var(--signal-part-concrete) !important;
        box-shadow: 0 5px 12px rgb(0 0 0 / 38%) !important;
    }

    body.lion2-skin.lion-skin #ajax-content#ajax-content .virtual-page
        .virtual-sport-tab {
        flex: 0 0 92px !important;
        min-width: 92px !important;
        min-height: 72px !important;
        gap: 5px !important;
        padding: 6px !important;
        border: 1px solid #656c6d !important;
        border-radius: 0 !important;
        background-color: #1b1f20 !important;
        background-image: var(--signal-part-nav-dark) !important;
        color: #d8dad5 !important;
        box-shadow: inset 0 1px rgb(255 255 255 / 8%) !important;
    }

    body.lion2-skin.lion-skin #ajax-content#ajax-content .virtual-page
        .virtual-sport-tab.on {
        border-color: var(--signal-game-control-yellow) !important;
        background-color: var(--signal-game-control-yellow) !important;
        background-image: var(--signal-part-nav-active) !important;
        color: var(--signal-game-control-ink) !important;
        box-shadow: inset 0 -3px #b08c00 !important;
    }

    body.lion2-skin.lion-skin #ajax-content#ajax-content .virtual-page
        .virtual-sport-icon {
        flex-basis: 34px !important;
        width: 34px !important;
        height: 34px !important;
    }

    body.lion2-skin.lion-skin #ajax-content#ajax-content .virtual-page
        .virtual-monitor-panel {
        display: flex !important;
        border-radius: 0 !important;
        background-color: var(--signal-game-control-panel) !important;
        background-image: var(--signal-part-concrete) !important;
    }

    body.lion2-skin.lion-skin #ajax-content#ajax-content .virtual-page :is(
        .virtual-left-league,
        .virtual-history-tabs,
        .virtual-history-content
    ) {
        border-radius: 0 !important;
        background-color: var(--signal-game-control-panel) !important;
        background-image: var(--signal-part-concrete) !important;
        color: var(--signal-game-control-copy) !important;
    }
}

/* --------------------------------------------------------------------------
 * Closed-login guest chat: retain the SVG control, retire Lion1 chat rasters.
 * ----------------------------------------------------------------------- */

html body.lion-closed-login.lion2-skin #chat-widget-btn,
html body.lion-closed-login.lion2-skin #chat-widget-btn:is(:hover, .chat-active) {
    border: 1px solid var(--signal-game-control-yellow) !important;
    border-radius: 50% !important;
    background-color: #101415 !important;
    background-image: var(--signal-part-medallion) !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
    color: var(--signal-game-control-yellow) !important;
    box-shadow:
        0 5px 0 #050607,
        0 12px 24px rgb(0 0 0 / 52%) !important;
    filter: none !important;
}

html body.lion-closed-login.lion2-skin #chat-widget-btn:is(:hover, .chat-active) {
    color: #fff !important;
    transform: translateY(-2px) !important;
}

html body.lion-closed-login.lion2-skin #chat-widget-btn svg {
    display: block !important;
    width: 24px !important;
    height: 24px !important;
    color: currentcolor !important;
}

@media (hover: none) {
    body.lion2-skin.lion-skin #ajax-content#ajax-content :is(
        #provider_list,
        #favorite_list,
        #mini_game_list,
        #lotus_game_list,
        #tokengame_list,
        #mingo_list
    ) .live-game-cont:not(.locked, .provider-locked, [aria-disabled='true'])
        > .el-row > .hoverw {
        background: linear-gradient(180deg, transparent 52%, rgb(4 6 7 / 68%)) !important;
        opacity: .88 !important;
    }

    body.lion2-skin .signal-card-action {
        transform: none;
    }
}

@media (prefers-reduced-motion: reduce) {
    body.lion2-skin .signal-card-action,
    body.lion2-skin.lion-skin #ajax-content#ajax-content .live-game-cont .hoverw {
        transition: none !important;
    }
}
