/* beyond-feed additions on top of bb.css, which stays a verbatim copy of bb-admin's
   globals.css. Keep this file small; anything reusable belongs in bb-admin first. */

/* A row that arrived since the last refresh: the sidebar's emerald accent bar and a
   mint wash that fades out, so new messages are noticed without reading timestamps. */
@keyframes bf-arrive {
  from {
    background: var(--bb-em22);
  }
  to {
    background: transparent;
  }
}
.bb tr.bf-new {
  box-shadow: inset 3px 0 0 var(--bb-emerald);
  animation: bf-arrive 6s ease-out;
}
@media (prefers-reduced-motion: reduce) {
  .bb tr.bf-new {
    animation: none;
    background: var(--bb-em12);
  }
}

/* Race list: one compact row per meeting, a button per race coloured by its status
   (.pill kinds). The 1px gap over the border colour draws the lines between rows. */
.bb .bf-meetings {
  display: grid;
  gap: 1px;
  background: var(--bb-border);
}
.bb .bf-meeting {
  display: grid;
  grid-template-columns: minmax(0, 280px) 1fr auto;
  align-items: center;
  gap: 12px;
  padding: 9px 14px;
  background: var(--bb-panel);
}
.bb .bf-race {
  min-width: 28px;
  height: 26px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  border-radius: 6px;
  text-decoration: none;
}
.bb .bf-race:hover {
  filter: brightness(1.15);
  outline: 1px solid currentColor;
}
.bb .bf-edit {
  width: 28px;
  height: 28px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 6px;
  color: var(--bb-dim);
  border: 1px solid var(--bb-border);
  background: var(--bb-low);
}
.bb .bf-edit:hover {
  color: var(--bb-text);
}
.bb .bf-flag {
  border-radius: 3px;
  box-shadow: 0 0 0 1px var(--bb-border);
  flex-shrink: 0;
}