.bsx-wl-row br,
.bsx-wl-row p {
    display: none;
}


.notif-wrapper {
    display: flex;
    gap: 20px;
    align-items: flex-center;
    width: 100%;
}

.notif-panel--left   { flex: 0 0 220px; }
.notif-panel--middle { flex: 1; min-width: 0; }
.notif-panel--right  { flex: 2; min-width: 0; }

.notif-controls {
    display: flex;
    flex-direction: column;
    gap: 10px;
    color: #030204;
    
}
.notif-controls input,
.notif-controls select {
    width: 80%;
    align-self:center;
    padding-left: 20px;
    padding: 1px 5px;
    border: 1px solid #f1eee7  ;
    border-radius: 5px;
    box-sizing: border-box;
    background:#bbb;
    color: #030204;
    font-size:1.1rem;
    line-height:1.2rem;
}

.notif-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
/*    align-content: flex-start; */
}
    
.notif-card {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    max-height:90px;
/*   justify-content:flex-start; */
/*   align-content: flex; */
/*   padding: 10px 12px; */
    border: 1px solid #888;
    border-radius: 7px;
    margin-bottom: 0px;
    cursor: pointer;
    transition: background 0.15s;
}

.notif-card:hover      { background: #1A1A1A ; scale: 1.03; border-color: #edcb81 ;}
.notif-card.is-active  {
    border-left: 8px solid ;
    border-color: #edcb81;
    background: #030204;
}

.notif-header {
    display: flex;
    gap: 5px;
    flex-direction: row ;
    justify-content: space-between;
    flex-wrap: nowrap;
}

.notif-subject { max-width: 75%; font-weight: 600; color: #edcb81; font-size: 1.1rem; }
.notif-date    { width:25%; text-align: end; font-size: 0.8rem; color: #888; /* text-align:right; */ }

.notif-body    { font-size: 0.8rem; color: #666; }


.notif-detail {
    overflow-y: auto;
    padding: 8px;
    margin-right: 20px;
    border: 1px solid #edcb81;
    border-radius: 10px;
    min-height: auto;
    min-width: auto;
    font-size: 1.1rem;
}