/* --- 1. Global & Accessibility --- */
* {
    box-sizing: border-box;
}

body {
    font-size: .85em;
    font-family: sans-serif;
    line-height: 1.4;
}

a:focus, input:focus, button:focus, select:focus {
    outline: 3px solid #B58231;
    outline-offset: 2px;
}
/* --- 2. Table Layout --- */
/* Page Header */
.page-header {
    border: 5px;
    border-style: solid;
    padding: 0px 15px 0px 15px;
}
/* Section Header for Table */
.table-container h2 {
    background-color: #004423;
    color: #ffffff;
    font-weight: bold;
    padding: 12px 15px;
    margin: 20px auto 0;
    text-align: center;
    max-width: 1100px;
    font-size: 1.3em;
}
/* Year Toggle Button */
.year-toggle-button {
    display: block;
    margin: 20px auto;
    padding: 12px 24px;
    font-size: 1em;
    background-color: #004423;
    color: #ffffff;
    border: 2px solid #000;
    cursor: pointer;
    font-weight: bold;
}

    .year-toggle-button:hover {
        background-color: #006633;
    }

    .year-toggle-button:focus {
        outline: 3px solid #B58231;
        outline-offset: 2px;
    }

.table {
    border: 1px solid #000;
    border-collapse: collapse; /* Tables look bad without collapse */
    width: 100%;
    max-width: 1100px;
    margin: 0 auto;
    background-color: #fff;
    table-layout: auto;
}

    .table h1, .table h2, .table h3 {
        font-size: 1em;
        margin: 0;
        padding: 0;
        display: inline;
        color: inherit;
    }

caption {
    display: table-caption;
    background-color: #996633; /* Copper */
    color: #ffffff;
    font-weight: bold;
    padding: 8px 5px;
    border: 1px solid #000;
    border-bottom: none; /* Prevents double border with the top of the table */
    width: 100%;
    text-align: center;
}

    caption h1 {
        font-size: 1.1em;
        margin: 0;
        color: #ffffff;
        display: block;
    }
/* tr replaces .row */
tr.row {
    display: table-row; /* Reset from flex to standard table behavior */
}
/* th and td replace .cell */
.cell, th, td {
    padding: 3px 5px;
    border-bottom: 1px solid #000;
    border-left: 1px solid #000;
    font-weight: normal; /* th is bold by default */
}
    /* Remove left border on the first column */
    .cell:first-child, th:first-child, td:first-child {
        border-left: none;
    }
/* Maintain your specific widths */
.major {
    width: 280px;
    min-width: 280px;
    white-space: nowrap;
}
/* tfoot styling to match header rows */
tfoot tr {
    background-color: #004423;
    color: #ffffff;
}

tfoot th, tfoot td {
    color: #ffffff;
    font-weight: bold;
}
/* --- 3. Colors & Contrast --- */
/* Page Header */
.page-header {
    font-weight: bold;
    background-color: #004423;
    color: #ffffff;
    border-color: #000000;
}
/* Standard rows */
.row td {
    color: #000;
}
/* Header/Total Rows */
.dkgreen, .ltgreen, .divTableHead {
    background-color: #004423;
    color: #ffffff !important; /* Ensure text is white */
}

.copper, #title {
    background-color: #996633;
    color: #ffffff !important;
}

    .dkgreen th, .dkgreen td,
    .copper th, .copper td,
    #title th, #title td {
        color: #ffffff;
    }

.total-row td, .total-row th {
    font-weight: bold;
}

.fixBB, .fixBB2 {
    font-weight: bold;
    border-bottom: none;
}
/* --- 4. Alignment Utilities --- */
/* Page Header */
.page-header {
    text-align: center;
    max-width: fit-content;
    margin-inline: auto;
}

.cell.left {
    text-align: left;
}

.cell.right {
    text-align: right;
}

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

.award-header {
    min-width: 100%;
    flex: none;
    text-align: center;
}

.major {
    min-width: 280px;
    white-space: nowrap;
}

.total-row .col1 {
    min-width: 280px;
    flex: none;
}

.total-row .data {
    width: calc(100% - 280px);
    display: flex;
}

.fixBB {
    border-bottom: 0;
}
/* --- 5. Responsive Design --- */
/* Horizontal Scroll for Small Screens */
@media (max-width: 768px) {
    /* container */
    .table-container {
        width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch; /* Smooth scrolling on iOS */
        margin-bottom: 1em;
    }

        .table-container h2 {
            margin: 10px auto 0;
            font-size: 1.1em;
        }

    .major {
        position: -webkit-sticky;
        position: sticky;
        left: 0;
        background-color: #fff; /* Prevents data from overlapping text */
        z-index: 2;
        border-right: 2px solid #000;
        min-width: 200px; /* Shrink the sidebar slightly on mobile */
        white-space: normal; /* Allow major names to wrap if they are long */
    }
}