div.process-notifications {
    position: fixed;
    right: 0;
    top: var(--topbar-height);
    box-shadow: 0 -2px 4px rgba(136, 136, 136, 0.5);
    width: 20em;
    z-index: 1000;
}

div.process-notification {
    padding: 0 0.5em;
    border: 1px solid var(--border-color);
}

div.process-notification-pending {
    color: white;
    background-color: #8886d4;
}

div.process-notification-success {
    color: white;
    background-color: #09ac00;
}

div.process-notification-failure {
    color: white;
    background-color: #ff0000;
}

div.process-notification-head {
    display: flex;
    align-items: center;
    height: 2.5em;
}

div.process-notification-head > span.icon:first-child {
    font-size: 150%;
    margin-right: 0.25em;
}

div.process-notification-head > div.spinner {
    width: 2em;
    height: 2em;
    margin-right: 0.25em;
}

span.process-notification-label {
    flex: 1 1 auto;
}

div.process-notification-detail {
    font-style: italic;
    font-size: 90%;
    padding: 0.25em;
}
