/* Sports Betting Area - Clean and Simple */
.sports-content {
    display: none;
    position: fixed;
    top: 70px;
    left: 0;
    width: 100vw;
    height: calc(100vh - 70px);
    margin: 0;
    padding: 0;
    background: #000;
    z-index: 10;
    overflow: hidden;
    box-sizing: border-box;
    transition: left 0.3s ease, width 0.3s ease, top 0.3s ease, height 0.3s ease;
}

.sports-content.header-hidden {
    top: 0;
    height: 100vh;
}

.sports-content.active {
    display: block !important;
}

/* Remove any limitations from parent containers when sports is active */
.sports-content.active ~ .dashboard-main,
.sidebar.active ~ .dashboard-main:has(+ .sports-content.active),
body:has(.sports-content.active) .dashboard-main,
.dashboard-main:has(.sports-content.active) {
    padding: 0 !important;
    margin: 0 !important;
    margin-left: 0 !important;
    max-width: none !important;
    width: 100% !important;
}

/* Hide mobile bottom nav when sports is active */
.sports-content.active ~ .mobile-bottom-nav,
body:has(.sports-content.active) .mobile-bottom-nav {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    z-index: -1 !important;
}

/* Hide footer when sports is active */
.sports-content.active ~ .footer-container,
body:has(.sports-content.active) .footer-container,
.sports-content.active ~ footer,
body:has(.sports-content.active) footer {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
    z-index: -1 !important;
    height: 0 !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
    position: absolute !important;
    top: -9999px !important;
}

/* Ensure body and html don't have limitations */
body:has(.sports-content.active),
html:has(.sports-content.active) {
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
    position: fixed !important;
    width: 100% !important;
    height: 100% !important;
}

/* Keep header visible when sports is active */
body:has(.sports-content.active) .dashboard-header,
.sports-content.active ~ .dashboard-header {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    z-index: 10000 !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
}

/* Sports content positioned below header */
.sports-content.active {
    top: 70px !important;
    height: calc(100vh - 70px) !important;
    max-height: calc(100vh - 70px) !important;
    box-sizing: border-box !important;
    position: fixed !important;
}

.sports-content.active.header-hidden {
    top: 0 !important;
    height: 100vh !important;
    max-height: 100vh !important;
}

/* iOS Safari specific fixes */
@supports (-webkit-touch-callout: none) {
    body:has(.sports-content.active),
    html:has(.sports-content.active) {
        position: fixed !important;
        width: 100vw !important;
        height: 100vh !important;
        height: -webkit-fill-available !important;
        overflow: hidden !important;
        overscroll-behavior: none !important;
        -webkit-overflow-scrolling: touch !important;
        touch-action: none !important;
    }
    
    .sports-content.active {
        position: fixed !important;
        top: 70px !important;
        left: 0 !important;
        width: 100vw !important;
        height: calc(100vh - 70px) !important;
        max-height: calc(100vh - 70px) !important;
        box-sizing: border-box !important;
        z-index: 999 !important;
    }
    
    .sports-content.active.header-hidden {
        top: 0 !important;
        height: 100vh !important;
        max-height: 100vh !important;
    }
    
    .sports-content.active iframe {
        position: absolute !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        bottom: 0 !important;
        width: 100% !important;
        height: 100% !important;
        border: none !important;
        margin: 0 !important;
        padding: 0 !important;
        box-sizing: border-box !important;
    }
}

.sports-content {
    position: relative !important;
}

.sports-content iframe {
    width: 100% !important;
    height: 100% !important;
    border: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
    box-sizing: border-box !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
}