/* timer pill patch */
.count-timer{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:6px 10px;
  border:1px solid rgba(255,255,255,0.14);
  border-radius:999px;
  background:rgba(0,0,0,0.18);
  font-size:12px;
  letter-spacing:.3px;
  color:rgba(255,255,255,0.92);
  white-space:nowrap;
}
.count-row .count-timer{
  border-color:rgba(77,178,255,0.40);
  box-shadow:0 0 0 3px rgba(77,178,255,0.10);
}
.count-row.active{
  border-color:rgba(60,220,140,0.45);
  box-shadow:0 0 0 3px rgba(60,220,140,0.12);
}
.count-row.active .count-timer{
  border-color:rgba(60,220,140,0.45);
  box-shadow:0 0 0 3px rgba(60,220,140,0.12);
}
#buffTimer{
  border-color:rgba(77,178,255,0.40);
  box-shadow:0 0 0 3px rgba(77,178,255,0.10);
}

/* TZ pill (legacy) - no longer used (moved into header) */
.tz-pill{display:none;}

/* Menu anchored under pill */
.tz-menu{
  position:fixed;
  z-index:9999;
  min-width:220px;
  border:1px solid rgba(255,255,255,0.12);
  border-radius:14px;
  background:rgba(0,0,0,0.22);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  overflow:hidden;
  box-shadow:0 18px 60px rgba(0,0,0,.55);
}
.tz-item{
  padding:10px 12px;
  font-size:12px;
  color:rgba(255,255,255,0.92);
  border-top:1px solid rgba(255,255,255,0.08);
}
.tz-item:first-child{ border-top:none; }
.tz-item:hover{
  background:rgba(255,255,255,0.06);
  cursor:pointer;
}

/* Alliance schedule: single-layer slot pills */
html body .times.times--rows,
html body .times--rows{
  display:flex !important;
  flex-direction:column !important;
  gap:8px !important;
  margin:0 !important;
  padding:0 !important;
}

/* Better spacing between event header and first pill row */
html body .event .event-name{
  margin: 0 0 10px 0 !important;
}

html body .times--rows .slot-row{
  display:block !important;
  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  outline:0 !important;
  filter:none !important;
}

html body .times--rows .slot-pill{
  width:100% !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:12px !important;

  padding:8px 10px !important;
  border-radius:999px !important;
  overflow:hidden !important;

  border:1px solid rgba(77,178,255,.45) !important;
  background:transparent !important;
  background-image:none !important;
  background-clip:padding-box !important;

  box-shadow:none !important;
  -webkit-box-shadow:none !important;
  outline:0 !important;
  filter:none !important;
  transform:none !important;
  backdrop-filter:none !important;
  -webkit-backdrop-filter:none !important;

  position:relative !important;
  isolation:isolate !important;
}

html body .times--rows .slot-pill::before,
html body .times--rows .slot-pill::after{
  content:none !important;
  display:none !important;
}

html body .times--rows .slot-pill .slot-left,
html body .times--rows .slot-pill .slot-right{
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
  min-width:0 !important;

  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  outline:0 !important;
}

html body .times--rows .slot-pill .slot-left{
  flex:1 1 auto !important;
  max-width:56% !important;
}

html body .times--rows .slot-pill .slot-right{
  flex:0 0 auto !important;
  max-width:44% !important;
  justify-content:flex-end !important;
}

html body .times--rows .slot-pill .slot-time-text,
html body .times--rows .slot-pill .slot-status-text{
  font-size:13px !important;
  line-height:1.15 !important;
  letter-spacing:0 !important;

  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;

  margin:0 !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}

html body .times--rows .slot-pill .mini-dot{
  width:8px !important;
  height:8px !important;
  border-radius:999px !important;
  flex:0 0 auto !important;

  background:rgba(77,178,255,.95) !important;
  box-shadow:none !important;
  border:0 !important;
}

/* Slot colors */
html body .times--rows .slot-pill.slot-1{ border-color: rgba(77,178,255,.45) !important; }
html body .times--rows .slot-pill.slot-1 .mini-dot{ background: rgba(77,178,255,.95) !important; }

html body .times--rows .slot-pill.slot-2{ border-color: rgba(176,124,255,.58) !important; }
html body .times--rows .slot-pill.slot-2 .mini-dot{ background: rgba(176,124,255,.95) !important; }

html body .times--rows .slot-pill.slot-3{ border-color: rgba(255,176,32,.62) !important; }
html body .times--rows .slot-pill.slot-3 .mini-dot{ background: rgba(255,176,32,.95) !important; }

/* Active state overrides slot colors */
html body .times--rows .slot-pill.is-active{
  border-color: rgba(90,255,190,.60) !important;
  background: transparent !important;
}
html body .times--rows .slot-pill.is-active .mini-dot{
  background: rgba(90,255,190,.95) !important;
}

html body .times--rows .slot-pill.is-unknown{ opacity:.88 !important; }

@media (max-width: 520px){
  html body .times--rows{
    gap:6px !important;
  }
  html body .event .event-name{
    margin-bottom: 9px !important;
  }
  html body .times--rows .slot-pill{
    padding:6px 9px !important;
  }
  html body .times--rows .slot-pill .slot-time-text,
  html body .times--rows .slot-pill .slot-status-text{
    font-size:12.5px !important;
  }
}
