/* Status dots — Esteja tooltip instead of the browser help cursor/native tooltip. */
.esteja-status-dot{
  position:relative;
  cursor:default!important;
  outline:none;
}
.esteja-status-dot::after{
  content:attr(data-esteja-tooltip);
  position:absolute;
  top:calc(100% + 9px);
  left:50%;
  z-index:90;
  max-width:260px;
  padding:7px 10px;
  border:1px solid #e3e7ef;
  border-radius:9px;
  background:#fff;
  box-shadow:0 8px 22px rgba(29,35,50,.12);
  color:#53627a;
  font-family:var(--font-ui);
  font-size:12px;
  font-weight:500;
  line-height:1.3;
  white-space:nowrap;
  opacity:0;
  pointer-events:none;
  transform:translate(-50%,-3px);
  transition:opacity .14s ease,transform .14s ease;
}
.esteja-status-dot::before{
  content:"";
  position:absolute;
  top:calc(100% + 5px);
  left:50%;
  z-index:91;
  width:8px;
  height:8px;
  border-left:1px solid #e3e7ef;
  border-top:1px solid #e3e7ef;
  background:#fff;
  opacity:0;
  pointer-events:none;
  transform:translateX(-50%) rotate(45deg);
  transition:opacity .14s ease;
}
.esteja-status-dot:hover::after,.esteja-status-dot:focus-visible::after,.esteja-status-dot:hover::before,.esteja-status-dot:focus-visible::before{
  opacity:1;
}
.esteja-status-dot:hover::after,.esteja-status-dot:focus-visible::after{
  transform:translate(-50%,0);
}
.esteja-status-dot:focus-visible{
  box-shadow:0 0 0 4px rgba(124,87,255,.12);
}
@media(max-width:600px){
  .esteja-status-dot::after{max-width:210px;white-space:normal;text-align:center}
}
/* Header icon buttons (eye, bell): anchor the tooltip to the button's right edge so it opens leftward instead of overflowing the viewport. */
#privacy.esteja-status-dot::after,#notification-button.esteja-status-dot::after{
  left:auto;
  right:0;
  width:max-content;
  white-space:normal;
  z-index:200;
  transform:translate(0,-3px);
}
#privacy.esteja-status-dot:hover::after,#privacy.esteja-status-dot:focus-visible::after,#notification-button.esteja-status-dot:hover::after,#notification-button.esteja-status-dot:focus-visible::after{
  transform:translate(0,0);
}
#privacy.esteja-status-dot::before,#notification-button.esteja-status-dot::before{
  z-index:201;
}
/* These are real <button> elements,so the site's generic button:focus-visible outline (style.css) outranks the shared .esteja-status-dot{outline:none} by specificity and still shows through. Suppress it here so only the light violet ring (.esteja-status-dot:focus-visible box-shadow, already matching the button's own border-radius) remains. */
#privacy.esteja-status-dot:focus-visible,#notification-button.esteja-status-dot:focus-visible{
  outline:none;
}