/*
 Theme Name: GPA Divi Child
 Theme URI: https://www.elegantthemes.com/gallery/divi/
 Description: Divi Child Theme
 Author: Elegant Themes
 Author URI: https://www.elegantthemes.com
 Template: Divi
 Version: 1.0.0
*/
 
/* =Theme customization starts here
------------------------------------------------------- */
.table-container {
    max-width: 800px;
    margin: 20px auto;
    padding: 10px;
    background-color: #f9f9f9;
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}
/* ------------------------------------------------------- */
#member-dcs-table th {
    background-color: #0F1171;
    color: white;
    cursor: pointer;
}
#member-dcs-table table, #member-dcs-table th, #member-dcs-table td {
	border: 2px solid #d6d6d6; /* Sets border width for table, headers, and cells */
	border-collapse: collapse;
}
#member-dcs-table th, #member-dcs-table td {
    padding: 5px 10px;
    border-bottom: 1px solid #ddd;
}
#member-dcs-table th {
    background-color: #0F1171;
    color: white;
    cursor: pointer;
}
#member-dcs-table .child-rows td {
    padding-left: 40px !important; /* Adjust padding value as needed */
}
#member-dcs-table .child-rows tr:nth-child(even) {
    background-color: #c8c8c8; /* Alternating row colors */
}

/* ------------------------------------------------------- */

/* Table styling */
#scores-table {
    width: 100%;
    border-collapse: collapse;
    margin: 20px 0;
    font-size: 14px;
    text-align: center;
}
#scores-table table, #scores-table th, #scores-table td {
	border: 2px solid #d6d6d6; /* Sets border width for table, headers, and cells */
	border-collapse: collapse;
}
#scores-table th, #scores-table td {
    padding: 5px 10px;
    border-bottom: 1px solid #ddd;
}
#scores-table th {
    background-color: #0F1171;
    color: white;
    cursor: pointer;
}
#scores-table th.sort-asc::after {
    content: " ▲";
    font-size: 12px;
}
#scores-table th.sort-desc::after {
    content: " ▼";
    font-size: 12px;
}
/* Alternating row colors */
#scores-table tr:nth-child(even) {
    background-color: #f2f2f2;
}
/* Hover effect */
#scores-table tr:hover {
    background-color: #e9e9e9;
}

/* Responsive design */
@media screen and (max-width: 768px) {
    #scores-table thead {
        display: none;
    }

    #scores-table, #scores-table tbody, #scores-table tr, #scores-table td {
        display: block;
        width: 100%;
    }

    #scores-table tr {
        margin-bottom: 15px;
    }

    #scores-table td {
        text-align: right;
        padding-left: 50%;
        position: relative;
    }

    #scores-table td::before {
        content: attr(data-label);
        position: absolute;
        left: 0;
        width: 45%;
        padding-left: 15px;
        font-weight: bold;
        text-align: left;
    }
}