#bellDot{
  background:#ef4444;
}

#bellDot.allRead{
  background:#22c55e;
}

.notificationCenter{
  display:none;
  margin-top:20px;
  border-top:1px solid var(--line);
  padding-top:18px;
}

.notificationCenter.open{
  display:block;
}

.notificationCenter h3{
  color:var(--navy);
  margin-bottom:12px;
}

.notificationItem{
  display:grid;
  grid-template-columns:38px 1fr;
  gap:12px;
  background:#f8fbff;
  border:1px solid var(--line);
  border-radius:16px;
  padding:14px;
  margin-bottom:10px;
}

.notificationItem span{
  width:36px;
  height:36px;
  border-radius:50%;
  background:var(--blue);
  color:white;
  display:flex;
  align-items:center;
  justify-content:center;
}

.notificationItem h4{
  font-size:14px;
  color:var(--navy);
}

.notificationItem p{
  font-size:13px;
  color:var(--muted);
}

.notificationItem small{
  color:var(--blue);
  font-weight:800;
}

.notificationItem.unread{
  border-color:#ef4444;
  background:#fff7f7;
}/* MESSAGE DOT */

#profileMessageDot{
    position:absolute;
    top:-2px;
    right:-5px;

    width:10px;
    height:10px;

    border-radius:50%;
    background:#22c55e;

    border:2px solid white;

    animation:messagePulse 1.3s infinite;
}

/* HIDE WHEN READ */

#profileMessageDot.read{
    display:none;
}

@keyframes messagePulse{

    0%{
        transform:scale(1);
        box-shadow:0 0 0 0 rgba(34,197,94,.7);
    }

    70%{
        transform:scale(1.25);
        box-shadow:0 0 0 8px rgba(34,197,94,0);
    }

    100%{
        transform:scale(1);
        box-shadow:0 0 0 0 rgba(34,197,94,0);
    }

}.profileIcon{
  position:relative;
  display:inline-block;
  font-size:24px;
}

#profileMessageDot{
  position:absolute;
  top:-3px;
  right:-7px;
  width:11px;
  height:11px;
  border-radius:50%;
  background:#22c55e;
  border:2px solid #fff;
  animation:messagePulse 1.3s infinite;
}

#profileMessageDot.read{
  display:none;
}

@keyframes messagePulse{
  0%{
    transform:scale(1);
    box-shadow:0 0 0 0 rgba(34,197,94,.7);
  }
  70%{
    transform:scale(1.25);
    box-shadow:0 0 0 8px rgba(34,197,94,0);
  }
  100%{
    transform:scale(1);
    box-shadow:0 0 0 0 rgba(34,197,94,0);
  }
}/* PROFILE MESSAGE DOT */

.profileIcon{
    position:relative;
    display:inline-block;
    font-size:24px;
}

#profileMessageDot{
    position:absolute;
    top:-2px;
    right:-4px;

    width:10px;
    height:10px;

    border-radius:50%;
    background:#22c55e;
    border:2px solid #fff;

    animation:pulseGreen 1.2s infinite;
}

#profileMessageDot.read{
    display:none;
}

/* NEW BADGE */

#messagesBtn{
    display:flex;
    justify-content:space-between;
    align-items:center;
}

#messagesBadge{
    background:#22c55e;
    color:#fff;

    font-size:10px;
    font-weight:900;

    padding:4px 8px;

    border-radius:999px;

    animation:pulseGreen 1.2s infinite;
}

#messagesBadge.read{
    display:none;
}

@keyframes pulseGreen{

    0%,100%{
        transform:scale(1);
    }

    50%{
        transform:scale(1.12);
    }

}#favoriteRestaurantsBtn{
  display:flex;
  justify-content:space-between;
  align-items:center;
}

#favoritesBadge{
  background:#facc15;
  color:#13294b;
  font-size:10px;
  font-weight:900;
  padding:4px 8px;
  border-radius:999px;
}

#favoritesBadge.read{
  display:none;
}