.home-layout {
    grid-template-columns: 1fr 3fr;
    gap: var(--pico-spacing);
}

.job-deadline {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    white-space: nowrap;
    gap: var(--pico-spacing);
}

@media (max-width: 576px) {
    .desktop-only { display: none; }
    .mobile-only { display: flex !important; }
    .home-layout { grid-template-columns: 1fr; }
    .job-row { flex-direction: column; }
    .job-deadline { flex-direction: row; align-items: center; gap: var(--pico-spacing); white-space: normal; }
}
@media (min-width: 577px) {
    .mobile-only { display: none !important; }
}

dialog#filter-dialog {
    width: 100%;
    max-width: 100%;
    height: 100%;
    max-height: 100%;
    margin: 0;
    border: none;
    border-radius: 0;
    padding: var(--pico-spacing);
    overflow-y: auto;
}
dialog#filter-dialog::backdrop {
    background: rgba(0, 0, 0, 0.5);
}

datalist,
datalist option {
    all: unset;
    appearance: auto;
    background: field;
    color: fieldtext;
}