.attendance-entry {
    display: grid;
    grid-template-columns: max-content 1fr max-content;
    column-gap: 16px;
    max-width: 632px;
    border-top: 1px solid #222F09;
    border-bottom: 1px solid #222F09;
    padding: 12px 16px;
    color: var(--teal);
    align-items: center;
}

.attendance-entry .attendee_checkbox {
    grid-column: 1;
    align-self: center;
}

.attendance-entry .attendance-info {
    grid-column: 2;
}

.attendance-entry .name {
    font-weight: 600;
    text-transform: uppercase;
    margin-bottom: 4px;
}

.attendance-entry .info {
    font-size: var(--secondary-font-size);
    letter-spacing: var(--secondary-letter-spacing);
    font-style: italic;
}

.attendance-entry .status {
    grid-column: 3;
    padding: 6px 12px;
    font-size: var(--secondary-font-size);
    text-align: center;
    border-radius: 5px;
    display: inline-block;  
    margin: 4px 0px;
    justify-self: end;
    width: auto;  
    font-weight: 600;
}

.attendance-entry .status.walk-in{
    color: var(--cyan-80);
    background-color: var(--cyan-30);  
}

.attendance-entry .status.enlisted{
    color: var(--green-80);
    background-color: var(--green-30);  
}