.betslip {
            width: 100%;
            max-width: 400px;
            background: #283352;
            border-radius: 16px;
            overflow: hidden;
            color:#fff;
            max-height:664px;
        }
        
        .betslip .header {
            background: #283352;
            color: white;
            padding: 20px;
            text-align: center;
            position: relative;
        }
        
        .betslip .header h2 {
            font-size: 24px;
            margin-bottom: 15px;
            font-weight: 700;
        }
        
        .betslip .tabs {
            display: flex;
            background: rgba(255, 255, 255, 0.1);
            border-radius: 8px;
            overflow: hidden;
        }
        
        .betslip .tab {
            flex: 1;
            padding: 10px;
            background: none;
            border: none;
            color: rgba(255, 255, 255, 0.7);
            font-weight: 600;
            cursor: pointer;
            transition: all 0.3s ease;
        }
        
        .betslip .tab.active {
            background: rgba(255, 255, 255, 0.2);
            color: white;
        }
        
        .betslip .bet-item {
            padding: 15px;
            position: relative;
        }
        
        .betslip .match-info {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 10px;
            color:#fff;
        }
        
        .betslip .match {
            font-weight: 600;
            color: #fff;
        }
        
        .betslip .close-btn {
            background: #ff4757;
            color: white;
            border: none;
            width: 24px;
            height: 24px;
            border-radius: 50%;
            display: flex;
            align-items: center;
            justify-content: center;
            cursor: pointer;
            transition: all 0.2s ease;
        }
        
        .betslip .close-btn:hover {
            background: #ff2e43;
            transform: scale(1.1);
        }
        
        .betslip .odd-info {
            display: flex;
            align-items: center;
            background:  #283352;
            padding: 10px;
            border-radius: 8px;
        }
        
        .betslip .odd-value {
            background: #38425F;
            color: white;
            padding: 8px 12px;
            border-radius: 6px;
            font-weight: 700;
            margin-right: 10px;
            min-width: 60px;
            text-align: center;
            color:#9399A8;
        }
        
        .betslip .team {
            font-weight: 600;
            color: #ffffffff;
            flex-grow: 1;
        }
        
        .betslip .bet-type {
            color: #fffbfbff;
            font-size: 14px;
        }
        
        .betslip hr {
            border: none;
            height: 1px;
            background: #eee;
            margin: 5px 0;
        }
        
        .betslip .total-odds {
            display: flex;
            justify-content: space-between;
            padding: 15px;
            background:  #283352;
            font-weight: 400;
            font-size: 12px;
        }
        
        .betslip .total-odds span {
            color: #fdfdfdff;
            font-weight: 700;
        }
        
        .betslip input[type="number"] {
            width: 90%;
            margin:auto;
            border-radius:14px;
            padding: 15px;
            border: none;
            border-bottom: 1px solid #eee;
            font-size: 16px;
            outline: none;
            display:flex;
        }
        
        .betslip input[type="number"]:focus {
            background: #f8f9fa;
        }
        
        .betslip .payout-buttons {
            display: flex;
            padding: 15px;
            gap: 10px;
        }
        
        .betslip .payout-buttons button {
            flex: 1;
            padding: 12px;
            background: #38425F;
            color:#9399A8;
            border: none;
            border-radius: 8px;
            font-weight: 600;
            cursor: pointer;
            transition: all 0.2s ease;
        }
        
        .betslip .payout-buttons button:hover {
            background: #2c3e85;
            transform: translateY(-2px);
        }
        
        .betslip .bet-actions {
            display: flex;
            padding: 0 15px 15px;
            gap: 10px;
        }
        
        .betslip .sign-in-bet {
            flex: 3;
            padding: 15px;
            background:linear-gradient(to right, #3B82F6 , #06B6D4) !important;
            color: white;
            border: none;
            border-radius: 8px;
            font-weight: 700;
            font-size: 16px;
            cursor: pointer;
            transition: all 0.3s ease;
        }
        
        .betslip .sign-in-bet:hover {
            background: linear-gradient(90deg, #2c3e85, #3d4f9e);
            transform: translateY(-2px);
            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
        }
        
        .betslip .delete-all {
            flex: 1;
            padding: 15px;
            background: #ff4757;
            color: white;
            border: none;
            border-radius: 8px;
            font-weight: 700;
            cursor: pointer;
            transition: all 0.3s ease;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        
        .betslip .delete-all:hover {
            background: #ff2e43;
            transform: translateY(-2px);
            box-shadow: 0 5px 15px rgba(255, 71, 87, 0.3);
        }
        
        .betslip .empty-state {
            padding: 30px 15px;
            text-align: center;
            color: #666;
        }
        
        .betslip .empty-state i {
            font-size: 48px;
            margin-bottom: 15px;
            color: #ccc;
        }
        
        .betslip .empty-state p {
            font-size: 16px;
        }
        
        .betslip .tab-content {
            display: none;
        }
        
        .betslip .tab-content.active {
            display: block;
        }
        
        .betslip .possible-winnings {
            display: flex;
            justify-content: space-between;
            padding: 10px 15px;
            background: #283352;
            font-weight: 600;
            color: #fbfffbff;
        }
        
        .betslip .system-info {
            display:none !important;
            background: #f3e5f5;
            padding: 10px 15px;
            font-size: 14px;
            color: #4a148c;
            display: flex;
            align-items: center;
            gap: 8px;
        }


.tabtabtable{background: #000000ff;}
.highlights-container .box-betting-row .box-001 {transition:background-color 0.5s;}
.highlights-container .box-betting-row .box-001:hover,
.highlights-container .box-betting-row .box:hover,
.highlights-container .box:hover,
.highlights-container .goal-button-1:hover {background:linear-gradient(to right, #338AF1, #11ABDC);}
.highlights-container .page-btn {padding:6px 12px;border:none;background-color:#505050;color:#fff;
cursor:pointer;
border-radius:4px;
transition:background-color 0.2s;}
.highlights-container .page-btn.active {background-color:#007bff;}
.highlights-container .page-btn:hover:not(.active):not(.disabled) {background-color:#ddd;}
.highlights-container .tab,.highlights-container .subtab {
font-size:16px;
border-radius:6px;
padding:8px 12px;
margin:10px;
color:#ffffffff;
cursor:pointer;
box-shadow: 0 1px 3px rgba(0,0,0,0.1);
transition:all 0.2s ease-in-out;}
.highlights-container .tab span,.highlights-container .tab strong {
display:block;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}
.highlights-container .tab:hover,.highlights-container .subtab:hover,
.highlights-container .tab.active,.highlights-container .subtab.active {
background: linear-gradient(to right, #338AF1, #11ABDC);
border:none;
color:#ffffffff;
}
.highlights-container{
max-width:none;
width:94% !important;
padding:20px;
margin:auto !important;
border-radius:6px;
box-shadow:0 2px 8px rgba(0, 0, 0, 0.05);
color:white;
}
.highlights-container .odds-button,
.highlights-container .odds-button:hover{
background:linear-gradient(to right, #338AF1, #11ABDC);
padding:8px;
border-radius:5px;
transition:background-color 0.3s ease;
color:#fff;
width:100%;
margin:0px 3px;
}
.highlights-container .odds-cell {
color:white;
font-weight:700;
border-radius:4px;
cursor:pointer;
transition:background-color 0.3s ease;
}
.highlights-container section.sub-wrapper {
padding:12px 0;
background:#202a39;
}
.highlights-container section.sub-wrapper .inner-content {
display:flex;
justify-content:space-between;
align-items:center;
}
.highlights-container section.sub-wrapper .left-side h3 {
font-size:24px;
color:#fff;
font-weight:600;
}
.highlights-container section.sub-wrapper .left-side h3 span {color: #1db954;}
.highlights-container section.sub-wrapper .right-side span {font-size:18px;color:#fff;font-weight:500;}
.highlights-container td.time-cell + td {width:60%;margin: 10px 0;text-align: center;}
.highlights-container .x-by-x {text-align:center !important;}
.highlights-container #pagination {display:flex;justify-content:center;margin-top:20px;gap:6px;}
#live{width:70%;margin:0 auto;padding:0 auto;}
.highlights-container .sports-subtabs{display:flex;}
.highlights-container .subtags{display:flex;}
#table-brg-bet td{background:#000000ff;}
    #live{width:100%;overflow:auto;padding:0px 10px;}
    .sports-subtabs{overflow:auto;}
    .table-wrapper{overflow:auto;}
    .table-wrapper table{overflow:auto;}
.odds-button{text-align: center;}

.highlights-container .subtags{overflow:auto;}

  .scroller::-webkit-scrollbar {
    width: 8px;
    background-color: transparent;
  }
  .scroller::-webkit-scrollbar-track {
    background: transparent;
  }
  .scroller::-webkit-scrollbar-thumb {
    background-color: #0066cc; /* blue thumb */
    border-radius: 4px;
  }
  .scroller::-webkit-scrollbar-thumb:hover {
    background-color: #005bb5;
  }
.odds-cell{
        margin: auto;
    text-align: center;
    align-items: center
}

@media (max-width: 768px){
    #live{width:100%;overflow:auto;}
    .sports-subtabs{overflow:auto;}
    .table-wrapper{overflow:auto;}
    .table-wrapper table{overflow:auto;}
}



/* betslip css here */
.betting-site-content-wrapper{
  display: grid;
  grid-template-columns: 3fr 1fr; /* Creates two equal-width columns */
  gap: 20px; /* Adds space between columns */
  background:#1A2436;
  padding:15px 20px;
  max-width:1380px;
  margin:auto;
}

.all-odds-content-handler{
    padding:70px 0px;
    margin:auto;
    background:#1A2436;
}


@media screen and (max-width:769px){
  .betting-site-content-wrapper{
grid-template-columns:1fr !important;
  }
}


/* Sports subtabs container styling */
.sports-subtabs {
    display: flex;
    overflow-x: auto;
    white-space: nowrap;
    padding: 10px 0;
    border-bottom: 1px solid #38425F;
    margin-bottom: 10px;
    max-width: 100%;
}

.sports-subtabs .subtab {
    padding: 8px 15px;
    margin: 0 5px;
    cursor: pointer;
    border-radius: 4px;
    background-color: #38425F;
    border: 1px solid #38425F;
    min-width: auto;
    flex-shrink: 0;
    color: #9399A8;
    font-weight: 600;
}

.sports-subtabs .subtab.active {
    background: linear-gradient(to right, #338AF1, #11ABDC);
    color: white;
    border-color: transparent;
}

/* Subtags container styling */
.subtags {
    display: flex;
    overflow-x: auto;
    white-space: nowrap;
    padding: 10px 0;
    border-bottom: 1px solid #38425F;
    margin-bottom: 15px;
    max-width: 100%;
}

.subtags .tab {
    padding: 6px 12px;
    margin: 0 4px;
    cursor: pointer;
    border-radius: 4px;
    background-color: #38425F;
    border: 1px solid #38425F;
    min-width: auto;
    flex-shrink: 0;
    font-size: 14px;
    color: #9399A8;
    font-weight: 600;
}

.subtags .tab.active {
    background: linear-gradient(to right, #338AF1, #11ABDC);
    color: white;
    border-color: transparent;
}

/* Hide scrollbar but keep functionality */
.sports-subtabs::-webkit-scrollbar,
.subtags::-webkit-scrollbar {
    height: 4px;
}

.sports-subtabs::-webkit-scrollbar-track,
.subtags::-webkit-scrollbar-track {
    background: #1A2436;
}

.sports-subtabs::-webkit-scrollbar-thumb,
.subtags::-webkit-scrollbar-thumb {
    background: #338AF1;
    border-radius: 2px;
}

.sports-subtabs::-webkit-scrollbar-thumb:hover,
.subtags::-webkit-scrollbar-thumb:hover {
    background: #11ABDC;
}

/* Limit the maximum width of tabs */
.sports-subtabs .subtab {
    max-width: 120px;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: center;
}

.subtags .tab {
    max-width: 140px;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: center;
}

/* Ensure the highlights container doesn't overflow */
.highlights-container {
    max-width: 100%;
    overflow: hidden;
}

/* Make sure the table doesn't cause horizontal overflow */
.table-wrapper {
    overflow-x: auto;
    max-width: 100%;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .sports-subtabs .subtab {
        padding: 6px 10px;
        font-size: 14px;
        max-width: 100px;
    }
    
    .subtags .tab {
        padding: 5px 8px;
        font-size: 12px;
        max-width: 110px;
    }
    
    .betting-site-content-wrapper {
        grid-template-columns: 1fr;
        gap: 15px;
        padding: 10px;
    }
    
    #live {
        width: 100%;
        padding: 0 5px;
    }
}

.subtags-container  .tab{
    height:135px;
}


/* Responsive styles for 1080px and below */
@media screen and (max-width: 1020px) {
  .betting-site-content-wrapper {
    position: relative;
    padding-bottom: 60px; /* Space for toggle button */
  }
  
  .betslip {
    position: fixed;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 0;
    overflow: hidden;
    transition: height 0.3s ease;
    z-index: 1000;
    border-radius: 10px 10px 0 0;
  }
  
  .betslip.active {
    height: 100vh; /* Show 60% of viewport height when active */
    overflow: scroll;
    padding-top:15px;
  }
  
  /* Betslip toggle button */
  .betslip-toggle {
    position: fixed;
    bottom: 20px;
    right: 20px;
            width: 83px;
        height: 83px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    z-index: 1001;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
    background-color: #007bff;
  }
  
  .betslip-toggle span {
            color: #fff;
        font-weight: 500;
  }
  
  /* Adjust table for smaller screens */
  .table-wrapper {
    overflow-x: auto;
  }
  
  #table-brg-bet {
    min-width: 800px; /* Allow horizontal scrolling on small screens */
  }
  
  /* Adjust header for mobile */
  .header-main-page {
    display: none;;
  }
}


.match-team-name{
       line-height: 24px;
    padding: 10px 0px;
}

.center-this{text-align: center;}