/* Wire Ticker — News & Events Ticker Plugin
   Same design/animations as the original prototype, scoped under
   .wire-ticker-wrap so it never touches the theme's html/body. */

.wire-ticker-wrap{
  --ink:#0B0C0E;
  --paper:#F5F3EF;
  --wire-red:#E8402C;
  --signal-amber:#F2A93B;
  --slate:#8A8F98;
  --line:rgba(245,243,239,0.12);
  --card:#141519;

  background:var(--ink);
  color:var(--paper);
  font-family:'Inter',sans-serif;
  padding:56px 24px 48px;
  border-radius:4px;
  box-sizing:border-box;
}
.wire-ticker-wrap *{box-sizing:border-box;}

.wire-ticker-wrap .stage{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:48px;
}

.wire-ticker-wrap .masthead{
  width:100%;
  max-width:1100px;
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  border-bottom:1px solid var(--line);
  padding-bottom:20px;
}
.wire-ticker-wrap .masthead h1{
  font-family:'Space Grotesk',sans-serif;
  font-weight:700;
  font-size:clamp(28px,4vw,42px);
  letter-spacing:-0.02em;
  margin:0;
  display:flex;
  align-items:center;
  gap:12px;
  color:var(--paper);
}
.wire-ticker-wrap .masthead h1 .dot{
  width:10px;height:10px;border-radius:50%;
  background:var(--wire-red);
  box-shadow:0 0 0 0 rgba(232,64,44,0.6);
  animation:wt-pulse-dot 1.8s ease-out infinite;
}
@keyframes wt-pulse-dot{
  0%{box-shadow:0 0 0 0 rgba(232,64,44,0.55);}
  70%{box-shadow:0 0 0 10px rgba(232,64,44,0);}
  100%{box-shadow:0 0 0 0 rgba(232,64,44,0);}
}
.wire-ticker-wrap .masthead .meta{
  font-family:'IBM Plex Mono',monospace;
  font-size:12px;
  color:var(--slate);
  text-align:right;
  line-height:1.6;
}

.wire-ticker-wrap .grid{
  width:100%;
  max-width:1100px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:20px;
}
@media (max-width:880px){
  .wire-ticker-wrap .grid{grid-template-columns:1fr;}
}
.wire-ticker-wrap .grid.wt-single{grid-template-columns:1fr; max-width:420px;}

.wire-ticker-wrap .panel{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:2px;
  display:flex;
  flex-direction:column;
  overflow:hidden;
}
.wire-ticker-wrap .panel-head{
  padding:14px 16px;
  border-bottom:1px solid var(--line);
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.wire-ticker-wrap .panel-head .tag{
  font-family:'Space Grotesk',sans-serif;
  font-weight:600;
  font-size:13px;
  letter-spacing:0.06em;
  text-transform:uppercase;
}
.wire-ticker-wrap .panel-head .tag.breaking{color:var(--wire-red);}
.wire-ticker-wrap .panel-head .tag.events{color:var(--signal-amber);}
.wire-ticker-wrap .panel-head .tag.digest{color:var(--paper);}
.wire-ticker-wrap .panel-head .sub{
  font-family:'IBM Plex Mono',monospace;
  font-size:10px;
  color:var(--slate);
}

.wire-ticker-wrap .viewport{
  position:relative;
  height:340px;
  overflow:hidden;
}
.wire-ticker-wrap .viewport::before,
.wire-ticker-wrap .viewport::after{
  content:"";
  position:absolute;
  left:0;right:0;
  height:36px;
  z-index:2;
  pointer-events:none;
}
.wire-ticker-wrap .viewport::before{top:0;background:linear-gradient(var(--card),transparent);}
.wire-ticker-wrap .viewport::after{bottom:0;background:linear-gradient(transparent,var(--card));}

.wire-ticker-wrap .item{
  padding:14px 16px 14px 18px;
  border-bottom:1px solid var(--line);
  position:relative;
}
.wire-ticker-wrap .item::before{
  content:"";
  position:absolute;
  left:0;top:10px;bottom:10px;
  width:2px;
}
.wire-ticker-wrap .breaking-item::before{background:var(--wire-red);}
.wire-ticker-wrap .events-item::before{background:var(--signal-amber);}
.wire-ticker-wrap .digest-item::before{background:var(--slate);}

.wire-ticker-wrap .item .headline{
  font-family:'Space Grotesk',sans-serif;
  font-weight:600;
  font-size:14.5px;
  line-height:1.35;
  margin:0 0 6px;
  color:var(--paper);
}
.wire-ticker-wrap .item .headline a,
.wire-ticker-wrap .events-item .headline a{
  color:inherit;
  text-decoration:none;
}
.wire-ticker-wrap .item .headline a:hover,
.wire-ticker-wrap .events-item .headline a:hover{
  text-decoration:underline;
}
.wire-ticker-wrap .item .stamp{
  font-family:'IBM Plex Mono',monospace;
  font-size:10.5px;
  color:var(--slate);
  display:flex;
  gap:10px;
}

/* STYLE 1: BREAKING WIRE — continuous vertical marquee */
.wire-ticker-wrap .wire-track{
  display:flex;
  flex-direction:column;
  animation:wt-wire-scroll 18s linear infinite;
}
.wire-ticker-wrap .panel:hover .wire-track{animation-play-state:paused;}
@keyframes wt-wire-scroll{
  0%{transform:translateY(0);}
  100%{transform:translateY(-50%);}
}

/* STYLE 2: EVENTS — stacked slide-up carousel */
.wire-ticker-wrap .stack{
  position:relative;
  height:100%;
}
.wire-ticker-wrap .stack .events-item{
  position:absolute;
  top:0;left:0;right:0;
  padding:16px 18px 16px 20px;
  opacity:0;
  transform:translateY(28px);
  animation:wt-stack-cycle 12s ease-in-out infinite;
}
.wire-ticker-wrap .stack .events-item .date-chip{
  display:inline-block;
  font-family:'IBM Plex Mono',monospace;
  font-size:10px;
  letter-spacing:0.04em;
  color:var(--ink);
  background:var(--signal-amber);
  padding:3px 8px;
  border-radius:2px;
  margin-bottom:8px;
}
@keyframes wt-stack-cycle{
  0%{opacity:0; transform:translateY(28px);}
  6%{opacity:1; transform:translateY(0);}
  28%{opacity:1; transform:translateY(0);}
  34%{opacity:0; transform:translateY(-28px);}
  100%{opacity:0; transform:translateY(-28px);}
}

/* STYLE 3: DIGEST — quiet cross-fade drift */
.wire-ticker-wrap .digest-flow{
  display:flex;
  flex-direction:column;
  animation:wt-digest-drift 26s linear infinite;
}
.wire-ticker-wrap .panel:hover .digest-flow{animation-play-state:paused;}
@keyframes wt-digest-drift{
  0%{transform:translateY(0);}
  100%{transform:translateY(-50%);}
}
.wire-ticker-wrap .digest-item{opacity:0.92;}

@media (prefers-reduced-motion: reduce){
  .wire-ticker-wrap .wire-track,
  .wire-ticker-wrap .digest-flow{animation:none;}
  .wire-ticker-wrap .stack .events-item{animation:none; position:relative; opacity:1; transform:none; margin-bottom:2px;}
}

.wire-ticker-wrap .footer-note{
  max-width:1100px;
  width:100%;
  font-family:'IBM Plex Mono',monospace;
  font-size:11px;
  color:var(--slate);
  border-top:1px solid var(--line);
  padding-top:16px;
}

/* =====================================================================
   OVERLAY / POPUP MODE — the ticker floating over page content,
   closable, with a small tab to reopen it. Same panel styles/
   animations as the inline embed, just placed in a fixed container.
   ===================================================================== */

.wire-ticker-overlay{
  position:fixed;
  z-index:999999;
  width:380px;
  max-width:92vw;
  box-shadow:0 20px 60px rgba(0,0,0,0.45);
  border-radius:6px;
  overflow:hidden;
  opacity:0;
  transform:translateY(24px);
  pointer-events:none;
  transition:opacity .45s ease, transform .45s ease;
}
.wire-ticker-overlay.wt-visible{
  opacity:1;
  transform:translateY(0);
  pointer-events:auto;
}

.wire-ticker-overlay.wt-pos-bottom-right{right:20px; bottom:20px;}
.wire-ticker-overlay.wt-pos-bottom-left{left:20px; bottom:20px;}
.wire-ticker-overlay.wt-pos-top-right{right:20px; top:20px;}
.wire-ticker-overlay.wt-pos-top-left{left:20px; top:20px;}
.wire-ticker-overlay.wt-pos-bottom-bar{
  left:0; right:0; bottom:0; width:100%; max-width:100%;
  border-radius:0;
  transform:translateY(100%);
}
.wire-ticker-overlay.wt-pos-bottom-bar.wt-visible{transform:translateY(0);}

.wire-ticker-overlay .wire-ticker-wrap{
  padding:18px 18px 16px;
  border-radius:0;
}
.wire-ticker-overlay .wt-overlay-head{
  font-family:'Space Grotesk',sans-serif;
  font-weight:700;
  font-size:15px;
  letter-spacing:-0.01em;
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:14px;
  padding-right:20px;
}
.wire-ticker-overlay .wt-overlay-head .dot{
  width:8px;height:8px;border-radius:50%;
  background:var(--wire-red);
  animation:wt-pulse-dot 1.8s ease-out infinite;
}
.wire-ticker-overlay .wt-overlay-grid{
  display:flex;
  flex-direction:column;
  gap:14px;
  max-width:none;
}
.wire-ticker-overlay .viewport{height:220px;}
.wire-ticker-overlay.wt-pos-bottom-bar .wt-overlay-grid{
  flex-direction:row;
  max-width:1200px;
  margin:0 auto;
}
.wire-ticker-overlay.wt-pos-bottom-bar .viewport{height:150px;}

.wire-ticker-overlay .wt-close{
  position:absolute;
  top:10px;
  right:10px;
  z-index:3;
  width:26px;
  height:26px;
  border:none;
  border-radius:50%;
  background:rgba(245,243,239,0.08);
  color:var(--paper);
  font-size:18px;
  line-height:1;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
}
.wire-ticker-overlay .wt-close:hover{background:rgba(245,243,239,0.18);}

.wt-reopen-tab{
  position:fixed;
  z-index:999998;
  display:none;
  font-family:'Space Grotesk',sans-serif;
  font-weight:600;
  font-size:12.5px;
  letter-spacing:0.02em;
  color:var(--paper, #F5F3EF);
  background:var(--ink, #0B0C0E);
  border:1px solid var(--line, rgba(245,243,239,0.12));
  padding:10px 14px;
  border-radius:999px;
  cursor:pointer;
  box-shadow:0 8px 24px rgba(0,0,0,0.35);
}
.wt-reopen-tab.wt-show{display:block;}
.wt-reopen-tab.wt-pos-bottom-right{right:20px; bottom:20px;}
.wt-reopen-tab.wt-pos-bottom-left{left:20px; bottom:20px;}
.wt-reopen-tab.wt-pos-top-right{right:20px; top:20px;}
.wt-reopen-tab.wt-pos-top-left{left:20px; top:20px;}
.wt-reopen-tab.wt-pos-bottom-bar{left:20px; bottom:20px; border-radius:999px;}

@media (max-width:600px){
  .wire-ticker-overlay{width:92vw;}
  .wire-ticker-overlay.wt-pos-bottom-bar .wt-overlay-grid{flex-direction:column;}
}
