/* =============================================
   Staff Table Mobile Responsive
   ============================================= */
@media (max-width: 768px) {
    /* Wrap the table */
    .responsive-staff-table {
        width: 100%;
        overflow: hidden;
    }

    .responsive-staff-table table,
    .responsive-staff-table thead,
    .responsive-staff-table tbody,
    .responsive-staff-table th,
    .responsive-staff-table td,
    .responsive-staff-table tr {
        display: block;
        width: 100%;
    }

    /* Hide the table headers on mobile */
    .responsive-staff-table thead {
        display: none;
    }

    /* Each row as a card */
    .responsive-staff-table tr {
        margin-bottom: 10px;
        padding: 4px;
        background: #f9f9f9;
        border-radius: 8px;
        box-shadow: 0 1px 3px rgba(0,0,0,0.05);
        border-left: 4px solid #0073aa; /* colored edge for emphasis */
    }

    /* Each cell stacked */
    .responsive-staff-table td {
        display: block;
        padding: 6px 0;
        text-align: left;
        font-size: 1rem;
        color: #333;
        border: none;
    }

    /* Alternate shading for better readability */
    .responsive-staff-table tr:nth-child(even) {
        background: #eef3f7;
    }
}