.jobs-board #jobs-list {
    display: grid;
    gap: .82rem;
}

.jobs-board #jobs-list > .job-listing-card {
    border-radius: 8px !important;
    margin-bottom: 0 !important;
}

html[data-theme="dark"] .jobs-board #jobs-list > .job-listing-card {
    background:
        radial-gradient(circle at 0% 0%, rgba(139, 214, 63, .105), transparent 15rem),
        linear-gradient(145deg, rgba(255, 255, 255, .052), rgba(255, 255, 255, .017) 54%, rgba(139, 214, 63, .025)),
        #151b14 !important;
    border: 1px solid rgba(139, 214, 63, .16) !important;
    border-left: 2px solid rgba(139, 214, 63, .56) !important;
    box-shadow: 0 16px 42px rgba(0, 0, 0, .30), inset 0 1px 0 rgba(255, 255, 255, .045) !important;
    color: #d7dfd0 !important;
}

html[data-theme="dark"] .jobs-board #jobs-list > .job-listing-card:hover,
html[data-theme="dark"] .jobs-board #jobs-list > .job-listing-card:focus-within {
    background:
        radial-gradient(circle at 0% 0%, rgba(139, 214, 63, .15), transparent 16rem),
        linear-gradient(145deg, rgba(255, 255, 255, .066), rgba(255, 255, 255, .021) 56%, rgba(139, 214, 63, .035)),
        #182016 !important;
    border-color: rgba(139, 214, 63, .34) !important;
    border-left-color: #8bd63f !important;
    box-shadow: 0 20px 52px rgba(0, 0, 0, .38), 0 0 30px rgba(139, 214, 63, .10), inset 0 1px 0 rgba(255, 255, 255, .06) !important;
}

html[data-theme="dark"] .jobs-board #jobs-list .job-listing-title {
    color: #e3e3e3 !important;
    font-weight: 900 !important;
}

html[data-theme="dark"] .jobs-board #jobs-list .job-listing-title:hover,
html[data-theme="dark"] .jobs-board #jobs-list .job-listing-title:focus {
    color: #d9ff9f !important;
}

html[data-theme="dark"] .jobs-board #jobs-list .job-listing-company,
html[data-theme="dark"] .jobs-board #jobs-list .job-listing-company a {
    color: #aeb8a7 !important;
}

html[data-theme="dark"] .jobs-board #jobs-list .job-listing-meta,
html[data-theme="dark"] .jobs-board #jobs-list .job-listing-description {
    color: #97a290 !important;
}

html[data-theme="dark"] .jobs-board #jobs-list .job-listing-meta i {
    color: #8bd63f !important;
}

html[data-theme="dark"] .jobs-board #jobs-list .job-listing-logo {
    background: linear-gradient(180deg, rgba(139, 214, 63, .20), rgba(139, 214, 63, .08)) !important;
    border-color: rgba(139, 214, 63, .24) !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 10px 24px rgba(139, 214, 63, .08) !important;
    color: #d9ff9f !important;
}

.job-listing-logo img,
.company-mark img {
    border-radius: inherit;
    display: block;
    height: 100%;
    object-fit: cover;
    width: 100%;
}

html[data-theme="dark"] .jobs-board #jobs-list .job-pill,
html[data-theme="dark"] .jobs-board #jobs-list .job-status-marker {
    background: rgba(139, 214, 63, .105) !important;
    border-color: rgba(139, 214, 63, .22) !important;
    color: #bfe88b !important;
}

html[data-theme="dark"] .jobs-board #jobs-list .job-pill.primary {
    background: rgba(139, 214, 63, .18) !important;
    border-color: rgba(139, 214, 63, .36) !important;
    color: #d9ff9f !important;
}

html[data-theme="dark"] .jobs-board #jobs-list .job-listing-actions .btn-mjk {
    background: #82d72f !important;
    border-color: #82d72f !important;
    color: #0b1209 !important;
    box-shadow: 0 10px 24px rgba(130, 215, 47, .18) !important;
}

html[data-theme="dark"] .jobs-board #jobs-list .job-action-btn {
    background: rgba(255, 255, 255, .045) !important;
    border-color: rgba(139, 214, 63, .18) !important;
    color: #c9d7c0 !important;
}

html[data-theme="dark"] .jobs-board #jobs-list .job-action-btn:hover,
html[data-theme="dark"] .jobs-board #jobs-list .job-action-btn:focus,
html[data-theme="dark"] .jobs-board #jobs-list .job-action-btn.is-saved {
    background: rgba(139, 214, 63, .14) !important;
    border-color: rgba(139, 214, 63, .34) !important;
    color: #d9ff9f !important;
}

html[data-theme="dark"] .jobs-board #jobs-list > .job-listing-card.is-expired,
html[data-theme="dark"] .jobs-board #jobs-list > .job-listing-card.is-filled {
    background:
        linear-gradient(145deg, rgba(255, 255, 255, .036), rgba(255, 255, 255, .014)),
        #151914 !important;
    border-color: rgba(255, 255, 255, .10) !important;
    border-left-color: rgba(151, 162, 144, .48) !important;
}

@media (max-width: 767.98px) {
    .jobs-board #jobs-list {
        gap: .72rem;
    }
}
