.elgadwl {
    max-width: 100%;
    width: 98%;
    margin: 10px auto;
    background: #f8f9fa;
    border-radius: 10px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    padding: 3px;
}

.box-title {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #8c52ff;
    color: white;
    border-radius: 8px;
    padding: 15px;
    flex-wrap: wrap;
}

.boxstitle {
    font-size: 20px;
    margin: 0;
    flex: 1;
    text-align: right;
}
/* ✅ تصميم الجداول */
.matches-table {
    display: none;
    background: white;
    padding: 15px;
    margin-top: 10px;
    border-radius: 8px;
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
}

.matches-table.active {
    display: block !important;
}
#allmatch {
    width: 98%;
    margin: auto;
}
/* ✅ التصميم المتجاوب (Responsive) */
@media (max-width: 768px) {
    .box-title {
        flex-direction: column;
        text-align: center;
    }

    .boxstitle {
        text-align: center;
        margin-bottom: 10px;
    }
    .nav-tabs li {
        width: 100%;
        text-align: center;
    }

    .nav-tabs li a {
        width: 170px;
        font-size: 16px;
    }
}
@media (max-width: 646px) {
    .nav-tabs li a {
        width: 107px;
        font-size: 10px;
    }
}

@media (max-width: 388px) {
    .nav-tabs li a {
        width: 74px;
        font-size: 11px;
        padding: 5px;
    }
}
@media only screen and (max-width: 600px)  {
    #tbmatch, #articles {
        width: 100%;
    }
    .watch-btn {width: 90%!important;}
}


/* ------------------------------------------------------- */
/* table style */
table {width: 100%;border-collapse: collapse}
        th, td {padding: 8px;text-align: center;}
        th {background-color: #f2f2f2;}
        .match-status, .watch-btn {padding: 5px 10px;color: #fff;border: none;border-radius: 5px;font-size: 14px;text-decoration: none;display: inline-block;margin: 5px 0;}
        .not-started {background-color: #808080;}
        .soon {background-color: #28a745;}
        .live {background-color: #dc3545;}
        .finished {background-color: #444444; color: white;}
        .ongoing {background-color: #dc3545;}
        .extended {background-color: #dc3545; color: white;} /* اللون الجديد لأشواط إضافية */
        .watch-btn {background-color: #8c52ff;color:#fff;border:solid 1px #fff;width: 50%;}
        tr {background-color: #ECEEF2;font-weight: bold;border-bottom: 8pt solid #fff;}
		tr:hover{background: #e1e1e0;}
        tr span{font-size:12px;}
		td div {font-size: 12px;}
		.brcolor {
   		 width: 100%;
    		height: 6px;
		}
        td{width: 20%;}
        #matchinfo{width: 60%;}
/* ---------------------------------------------- */