/* ========================================
   NOTIFICACIONES IN-APP — Branding dinámico
   ======================================== */

/* Badge contador sobre la campana */
#notif-badge {
    background-color: var(--color-primary, #e74a3b) !important;
    color: #fff !important;
}

/* Header del dropdown */
#notif-dropdown .dropdown-header {
    background-color: var(--color-primary, #4e73df);
    color: #fff;
    font-weight: 600;
    letter-spacing: 0.04em;
    border-radius: 0;
}

/* Ícono de campana — adopta color primario en hover */
#notif-dropdown > a:hover .fa-bell,
#notif-dropdown > a:focus .fa-bell {
    color: var(--color-primary, #4e73df);
}

/* Item leído */
.notif-item {
    border-bottom: 1px solid rgba(0,0,0,.06);
    transition: background .15s;
}

.notif-item:hover {
    background-color: rgba(0,0,0,.03) !important;
}

/* Item no leído: fondo suave del color primario */
.notif-item.notif-unread {
    background-color: var(--notif-unread-bg, #f0f4ff);
}

/* Punto indicador de no leído */
.notif-dot {
    display: inline-block;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background-color: var(--color-primary, #4e73df);
    vertical-align: middle;
    margin-left: 4px;
    flex-shrink: 0;
}

/* Ícono circular del tipo */
.notif-icon-circle {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background-color: var(--notif-icon-bg, #f0f4ff);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

/* "Ver todas" link al pie */
#notif-dropdown .notif-footer {
    color: var(--color-primary, #4e73df);
    font-weight: 600;
    font-size: .78rem;
    text-align: center;
    padding: .5rem 1rem;
    display: block;
    border-top: 1px solid rgba(0,0,0,.06);
}

#notif-dropdown .notif-footer:hover {
    background-color: rgba(0,0,0,.03);
    text-decoration: none;
}

/* Lista completa (/notificaciones/) */
.notif-row-unread {
    background-color: var(--notif-unread-bg, #f0f4ff);
}

.notif-row-unread:hover,
.notif-row-read:hover {
    filter: brightness(.97);
}