.notification-link {
    position: relative;
}

.notification-count {
    display: grid;
    place-items: center;
    min-width: 21px;
    height: 21px;
    padding: 0 5px;
    border-radius: 99px;
    background: var(--orange);
    color: #fff;
    font-size: .68rem;
}

.notification-card.unread {
    border-left: 5px solid var(--orange);
    background: #fffdf8;
}

.status.open {
    background: #fff0ce;
    color: #795600;
}

.status.resolved {
    background: #dff6e6;
    color: #17633a;
}

@media (max-width: 900px) {
    .mobile-nav {
        grid-template-columns: repeat(5, 1fr);
    }
}

@media (max-width: 600px) {
    .top-actions {
        gap: 5px;
    }

    .top-actions .button {
        padding-inline: 9px;
    }
}