.notification-report-entry[data-badge-request-state] {
    --badge-notification-color: var(--blue-600);
    --badge-notification-background: var(--theme-blue-soft, #edf5ff);
    --badge-notification-border: var(--blue-500);
}

.notification-report-entry[data-badge-request-state="approved"] {
    --badge-notification-color: var(--theme-success, #176c46);
    --badge-notification-background: var(--theme-success-soft, #edf9f3);
    --badge-notification-border: var(--theme-success-border, #bcdecf);
}

.notification-report-entry[data-badge-request-state="rejected"] {
    --badge-notification-color: var(--theme-danger, #bd2e46);
    --badge-notification-background: var(--theme-danger-soft, #fff0f3);
    --badge-notification-border: var(--theme-danger-border, #f2c8d0);
}

.notification-report-entry[data-badge-request-state] .notification-report-heading small {
    color: var(--badge-notification-color);
}

.notification-report-entry[data-badge-request-state] .notification-report-icon {
    color: var(--badge-notification-color);
    background: var(--badge-notification-background);
    border-color: var(--badge-notification-border);
}

.notification-report-entry[data-badge-request-state] .notification-report-icon svg {
    width: 24px;
    height: 24px;
    stroke-width: 1.9;
}

.badge-notification-review {
    display: grid;
    gap: 8px;
    margin-top: 14px;
}

.badge-notification-review label {
    color: var(--slate-600);
    font-size: .75rem;
    line-height: 1.5;
}

.badge-notification-review select,
.badge-notification-review textarea {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    padding: 8px;
    color: var(--navy-900);
    background: var(--theme-surface, #fff);
    border: 1px solid var(--card-border);
    border-radius: 7px;
    font: inherit;
    font-size: .75rem;
}

.badge-notification-review textarea {
    resize: vertical;
}

.badge-notification-review :focus-visible {
    outline: 2px solid var(--blue-500);
    outline-offset: 2px;
}

.badge-notification-review button:disabled {
    cursor: not-allowed;
    opacity: .5;
}

.badge-notification-status {
    margin: 8px 0 0;
    font-size: .75rem;
    line-height: 1.5;
    color: var(--navy-900);
}

.notification-report-facts .notification-report-link {
    overflow-wrap: anywhere;
}

.badge-notification-badge-row {
    align-items: center;
}

.badge-notification-badge {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
}

.badge-notification-badge > span:last-child {
    min-width: 0;
}

.badge-request-art {
    display: grid;
    width: 40px;
    height: 40px;
    flex: 0 0 40px;
    background: var(--theme-raised, #f7f9fc);
    border: 1px solid var(--card-border);
    border-radius: 9px;
    place-items: center;
}

.badge-request-art img {
    display: block;
    width: 28px;
    height: 28px;
    object-fit: contain;
}

.badge-request-art:has(img[src$="/tiktok.svg"]) {
    background: #292f39;
}

@media screen and (forced-colors: none) {
    html:is([data-profile-theme="dark"], [data-theme="dark"]:where(:not([data-profile-theme="light"]))) .badge-request-art img[src$="/github.svg"] {
        filter: brightness(0) invert(.92);
    }

    html:is([data-profile-theme="dark"], [data-theme="dark"]:where(:not([data-profile-theme="light"]))) .badge-request-art img[src$="/discord.svg"] {
        filter: brightness(1.2);
    }
}

@media (forced-colors: active) {
    .badge-request-art {
        background: #fff;
        border-color: CanvasText;
        forced-color-adjust: none;
    }
}
