/* frontend.css - Front-end styles for notifications display */ 

.onp-notification-item {
    color: var(--gray-1);
    padding: 2rem;
    font-style: normal;
    margin-bottom: 1rem;
    margin-top: 1rem;
}

.onp-notification-item__title {
    font-family: var(--font-geogrotesque);
    font-size: 1.25rem;
    text-transform: uppercase;
    font-weight: 500;
    line-height: 140%;
    min-height: 3rem;
    display: flex;
    align-items: center;
    background-size: 3rem;
    padding-left: 3.2rem;

}

.title-critical {
    background: url(../assets/images/icon-critical.svg) no-repeat center left;
}

.title-warning {
    background: url(../assets/images/icon-warning.svg) no-repeat center left;
}

.onp-notification-item__content {
    font-family: var(--font-new-gothic);
    font-size: 1rem;
    line-height: 150%;
    font-weight: 400;
}

.type-critical {
    border: .125rem solid var(--rmk-red);
    background-color: var(--rmk-red-light);
}

.type-warning {
    border: .125rem solid var(--rmk-orange);
    background-color: var(--rmk-alert-bg);
}