/* ==========================================================================
   ThePublicRecord.ca — Live coverage strip
   Self-hosted fonts (no external CDN). Based on the Hamilton Herald spec,
   with the status dot changed to a red pulsating dot.

   Deploy: upload this folder so the files resolve at /live-bar/…
   If you deploy under a different path, update the four font URLs below.
   ========================================================================== */

@font-face { font-family:'Archivo'; font-style:normal; font-weight:500; font-display:swap;
  src:url('/live-bar/fonts/archivo-500.woff2') format('woff2'); }
@font-face { font-family:'Archivo'; font-style:normal; font-weight:600; font-display:swap;
  src:url('/live-bar/fonts/archivo-600.woff2') format('woff2'); }
@font-face { font-family:'Archivo'; font-style:normal; font-weight:700; font-display:swap;
  src:url('/live-bar/fonts/archivo-700.woff2') format('woff2'); }
@font-face { font-family:'IBM Plex Mono'; font-style:normal; font-weight:500; font-display:swap;
  src:url('/live-bar/fonts/ibm-plex-mono-500.woff2') format('woff2'); }

.tpr-live-strip {
  --tpr-live-bg:#1D5FBF;    /* strip colour (Hamilton Herald blue — swap to your brand if desired) */
  --tpr-live-fg:#ffffff;
  --tpr-live-dot:#FF3B30;   /* pulsating status dot */
  background:var(--tpr-live-bg); color:var(--tpr-live-fg);
  padding:11px 40px; display:flex; align-items:center; gap:12px; text-decoration:none;
  font-family:'Archivo',"Helvetica Neue",Arial,system-ui,sans-serif;
}
/* When no liveblog is active the strip carries [hidden] (JS mode) or isn't rendered (server mode). */
.tpr-live-strip[hidden]{ display:none; }

.tpr-live-strip .tpr-dot{
  position:relative; width:8px; height:8px; border-radius:50%;
  background:var(--tpr-live-dot); flex-shrink:0; box-shadow:0 0 7px rgba(255,59,48,.85);
}
.tpr-live-strip .tpr-dot::after{
  content:""; position:absolute; inset:0; border-radius:50%;
  background:var(--tpr-live-dot); animation:tpr-live-ping 1.6s cubic-bezier(0,0,.2,1) infinite;
}
@keyframes tpr-live-ping{
  0%   { transform:scale(1); opacity:.6; }
  70%  { transform:scale(3); opacity:0; }
  100% { transform:scale(3); opacity:0; }
}

.tpr-live-strip .tpr-label{ font:700 12px/1 'Archivo',sans-serif; letter-spacing:.12em; flex-shrink:0; }
.tpr-live-strip .tpr-headline{ font:500 14px/1.15 'Archivo',sans-serif; min-width:0; }
.tpr-live-strip .tpr-follow{
  font:600 13px/1 'Archivo',sans-serif; text-decoration:underline; text-underline-offset:2px;
  margin-left:8px; white-space:nowrap; flex-shrink:0;
}
.tpr-live-strip .tpr-updated{
  font:500 12px/1 'IBM Plex Mono',ui-monospace,monospace;
  margin-left:auto; white-space:nowrap; flex-shrink:0; letter-spacing:.02em;
}

.tpr-live-strip:focus-visible{ outline:2px solid #fff; outline-offset:-3px; }

@media (max-width:720px){
  .tpr-live-strip{ flex-wrap:wrap; padding:11px 20px; gap:8px 12px; }
  .tpr-live-strip .tpr-headline{ flex-basis:100%; order:4; line-height:1.35; }
}
@media (prefers-reduced-motion:reduce){
  .tpr-live-strip .tpr-dot::after{ animation:none; opacity:0; }
}
