:host,
:root {
    --bg-active-gradient: #F28522 !important;
    --borders-color: rgba(255, 255, 255, 0.05);
    --body-main: #000000;
    --bg-main-elements: #1e2329;
    --bg-main-layouts: #0a0a0c;
    --text-default: #94a3b8;
    --text-lighter: #ffffff !important;
    --text-active: #F28522 !important;
    --preloader-color: var(--bg-active-gradient);
    --shadow-nav-button: transparent !important;
}

.live-events-widget {
    background: linear-gradient(145deg, #0a0a0c 0%, #000000 100%) !important;
    border: 1px solid rgba(255, 255, 255, 0.05) !important;
    border-radius: 16px !important;
}

.events-cards-reduced:before {
    background: none !important;
}

.live-events-widget .coupon__placebet-btn,
.popular-bets__bet-btn {
    background: #F28522 !important;
    color: #ffffff !important;
    border-radius: 8px !important;
    font-weight: 800 !important;
    transition: all 0.3s ease;
}

.live-events-widget .coupon__placebet-btn:hover,
.popular-bets__bet-btn:hover {
    box-shadow: 0 4px 15px rgba(242, 133, 34, 0.3) !important;
    transform: translateY(-2px);
}

.discipline-icon {
    color: #94a3b8;
}

.grid-el-line__title use {
    fill: #F28522 !important;
}

.live-filters__item._active {
    background: rgba(242, 133, 34, 0.15) !important;
    color: #F28522 !important;
    border: 1px solid rgba(242, 133, 34, 0.5) !important;
    box-shadow: 0 0 10px rgba(242, 133, 34, 0.1) !important;
}

.live-events-widget .live-filters__stage .live-filters__item:hover {
    border-color: #F28522 !important;
}

.grid-el-event.grid-el-event-pro._no-video {
    background: rgba(30, 35, 41, 0.5) !important;
    backdrop-filter: blur(10px) !important;
    -webkit-backdrop-filter: blur(10px) !important;
    border: 1px solid rgba(255, 255, 255, 0.05) !important;
    border-radius: 12px !important;
    transition: all 0.3s ease;
}

.grid-el-event.grid-el-event-pro._no-video:hover {
    background: rgba(40, 46, 54, 0.6) !important;
    border-color: rgba(242, 133, 34, 0.3) !important;
}

.outcome.active .outcome__number,
.outcome.active .outcome__status {
    color: #ffffff;
}

.outcome.active {
    background: #F28522 !important;
}

button.btn.coupon__placebet-btn span {
    color: #ffffff !important;
}

/* Fix black gradient fade on horizontal scrolls to match lighter background */
.live-filters__stage::after,
.horizontal-scroll-container::after,
.tabs-container::after,
.sport-filters::after,
[class*="scroll"]::after,
[class*="filters"]::after,
.horizontal-menu-wrapper::after,
.scroll-fade::after,
.tabs-wrapper::after {
    background: linear-gradient(to right, transparent, rgb(30, 35, 41)) !important;
}

/* Mobile responsive fixes for Bet History widget overflowing */
@media (max-width: 576px) {
    /* Force button containers to wrap so they don't push the card off-screen */
    div[class*="actions"],
    div[class*="buttons"],
    div[class*="footer"],
    div[class*="group"] {
        flex-wrap: wrap !important;
    }

    /* Allow buttons to shrink or wrap their text */
    button {
        min-width: 0 !important;
        flex-shrink: 1 !important;
        white-space: normal !important;
        text-overflow: ellipsis !important;
        overflow: hidden !important;
    }

    /* Specific adjustment to ensure large text like Bet ID wraps safely */
    * {
        word-break: break-word !important;
        overflow-wrap: break-word !important;
    }
}