.hover {
    width: 100%;
    border-collapse: separate;
    border-spacing: 0 1px; /* Very small vertical spacing */
    font-family: Arial, sans-serif;
}

.hover th {
    background: #ffffff;
    color: #1e6292;
    height: 22px;
    text-align: center;       /* Center heading text */
    font-size: 16px;
    font-weight: bold;
    padding-bottom: 3px;
    border-bottom: 2px solid #fbc02d;
}

.hover td {
    background: #1e6292;      /* Steel Blue row background */
    color: #ffffff;           /* White text for all rows */
    height: 22px;             /* Small row height */
    text-align: center;       /* Center cell text */
    padding: 0 8px;
    vertical-align: middle;
    border-bottom: none;
    font-size: 13px;
}

.hover td a {
    display: block;
    color: #ffffff;           /* Always white text by default */
    text-decoration: none;
    font-weight: normal;
    line-height: 0.5;         /* Very tight line spacing */
    padding: 3px 0;
    transition: background 0.3s, color 0.3s;
    text-align: center;       /* Center text in links */
}

/* Highlighted row, e.g. on click or via a class `highlight` */
.hover tr:hover td,
.hover tr.highlight td {
    background-color: #fbc02d; /* Yellow highlight */
    color: #222;               /* Dark text for contrast */
    font-weight: bold;
}

.hover tr:hover td a,
.hover tr.highlight td a {
    color: #222;               /* Dark text for links when highlighted */
}

.hover td a:hover {
    background: #fbc02d;       /* Yellow background on link hover */
    color: #222;               /* Dark text on link hover */
    font-weight: bold;
}