/* ═══════════════════════════════════════════════════════════
   SENTINEL PREMIUM — v5.0 Elite Intelligence UI
   Advanced animations · Enhanced tiles · Premium accents
   ═══════════════════════════════════════════════════════════ */

/* ── Enhanced Hero Tiles ── */
.hero-tile {
  position: relative;
}

/* Scanline/radar sweep effect on hero tiles */
.hero-tile::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(
    180deg,
    transparent 0%,
    rgba(56, 189, 248, 0.02) 50%,
    transparent 100%
  );
  border-radius: inherit;
  pointer-events: none;
  z-index: 0;
  animation: scanline 4s ease-in-out infinite;
  opacity: 0;
}

.hero-tile:hover::before {
  opacity: 1;
}

@keyframes scanline {
  0%   { transform: translateY(-100%); }
  100% { transform: translateY(100%); }
}

/* Enhanced tile value with number glow */
.hero-tile-value {
  position: relative;
  text-shadow: 0 0 40px rgba(56, 189, 248, 0.15);
  transition: text-shadow 0.3s ease;
}

#tile-suspects .hero-tile-value { text-shadow: 0 0 40px rgba(56, 189, 248, 0.2); }
#tile-review   .hero-tile-value { text-shadow: 0 0 40px rgba(251, 146, 60, 0.2); }
#tile-flights  .hero-tile-value { text-shadow: 0 0 40px rgba(167, 139, 250, 0.2); }
#tile-rules    .hero-tile-value { text-shadow: 0 0 40px rgba(52, 211, 153, 0.2); }

.hero-tile:hover .hero-tile-value {
  text-shadow: 0 0 60px rgba(56, 189, 248, 0.35);
}

/* Subtle top border accent per tile */
#tile-suspects::after { background: linear-gradient(90deg, transparent, var(--cyan), transparent); }
#tile-review::after   { background: linear-gradient(90deg, transparent, var(--amber), transparent); }
#tile-flights::after  { background: linear-gradient(90deg, transparent, var(--purple), transparent); }
#tile-rules::after    { background: linear-gradient(90deg, transparent, var(--emerald), transparent); }

.hero-tile::after {
  content: '';
  position: absolute;
  top: 0; left: 10%; right: 10%;
  height: 1px;
  opacity: 0.4;
  border-radius: 1px;
}

/* ── Confidence Tier Bar ── */
.confidence-tier-bar {
  display: flex;
  align-items: center;
  gap: 0;
  height: 4px;
  border-radius: 2px;
  overflow: hidden;
  margin-top: 6px;
  background: rgba(255, 255, 255, 0.06);
}

.conf-tier-segment {
  height: 100%;
  transition: width 0.8s cubic-bezier(0, 0, 0.2, 1);
  min-width: 0;
}

.conf-tier-high   { background: linear-gradient(90deg, #34d399, #38bdf8); }
.conf-tier-medium { background: linear-gradient(90deg, #fb923c, #f87171); }
.conf-tier-low    { background: rgba(255, 255, 255, 0.12); }

/* ── Animated Grid Overlay Enhancement ── */
.grid-overlay {
  animation: grid-pulse 8s ease-in-out infinite;
}

@keyframes grid-pulse {
  0%, 100% { opacity: 1; }
  50%       { opacity: 0.6; }
}

/* ── Premium Chart Cards ── */
.chart-card {
  position: relative;
  overflow: hidden;
}

.chart-card::after {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg,
    transparent 0%,
    rgba(56, 189, 248, 0.3) 30%,
    rgba(167, 139, 250, 0.3) 70%,
    transparent 100%
  );
}

/* ── Glass Card Premium ── */
.glass-card {
  position: relative;
}

.glass-card::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(
    135deg,
    rgba(255, 255, 255, 0.03) 0%,
    transparent 60%
  );
  pointer-events: none;
  z-index: 0;
}

/* ── Feed items — enhanced severity border ── */
.feed-item {
  position: relative;
  overflow: hidden;
}

.feed-item::before {
  content: '';
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 2px;
  border-radius: 2px;
  opacity: 0;
  transition: opacity 0.2s ease;
}

.feed-item:hover::before { opacity: 1; }
.feed-item.sev-high::before   { background: var(--red); }
.feed-item.sev-medium::before { background: var(--amber); }
.feed-item.sev-low::before    { background: var(--cyan); }

/* ── Rule Status Pill Enhancement ── */
.pill.live {
  background: linear-gradient(135deg, rgba(52,211,153,.15), rgba(56,189,248,.1));
  color: var(--emerald);
  border-color: var(--emerald-border);
  box-shadow: 0 0 8px rgba(52,211,153,0.1);
}

.pill.partial {
  background: linear-gradient(135deg, rgba(251,191,36,.15), rgba(251,146,60,.1));
  color: var(--yellow);
  border-color: rgba(251,191,36,.3);
}

.pill.needs-source {
  background: rgba(71,85,105,.15);
  color: var(--fg-3);
  border-color: rgba(71,85,105,.2);
}

/* ── Source card enhancements ── */
.source-card {
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.source-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.4);
}

/* NASDW card gets cyan glow */
#tile-nasdw {
  border-color: rgba(56, 189, 248, 0.15);
  box-shadow: 0 0 20px rgba(56, 189, 248, 0.05);
}
#tile-nasdw:hover {
  border-color: rgba(56, 189, 248, 0.25);
  box-shadow: 0 0 30px rgba(56, 189, 248, 0.1);
}

/* ── Enhanced Status Dots ── */
.status-dot.green {
  box-shadow: 0 0 8px var(--emerald);
}

.status-dot.red {
  box-shadow: 0 0 8px var(--red);
  animation: red-pulse 2s ease-in-out infinite;
}

@keyframes red-pulse {
  0%, 100% { box-shadow: 0 0 4px var(--red); }
  50%       { box-shadow: 0 0 12px var(--red); }
}

/* ── Intelligence ribbon on dashboard header ── */
.view-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.view-eyebrow::before {
  content: '';
  width: 4px; height: 4px;
  border-radius: 50%;
  background: var(--cyan);
  box-shadow: 0 0 6px var(--cyan);
  animation: pulse-ring 2s ease-out infinite;
  flex-shrink: 0;
}

/* ── Case card — severity left border ── */
.case-card {
  border-left-width: 3px;
}

.case-card.sev-high   { border-left-color: rgba(248, 113, 113, 0.4); }
.case-card.sev-medium { border-left-color: rgba(251, 146, 60, 0.4); }
.case-card.sev-low    { border-left-color: rgba(56, 189, 248, 0.3); }

.case-card:hover.sev-high   { border-left-color: var(--red); }
.case-card:hover.sev-medium { border-left-color: var(--amber); }
.case-card:hover.sev-low    { border-left-color: var(--cyan); }

/* ── NASDW verified indicator ── */
.nasdw-verified-badge {
  font-size: 9px;
  font-weight: 800;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  color: var(--emerald);
  background: rgba(52, 211, 153, 0.1);
  border: 1px solid rgba(52, 211, 153, 0.2);
  border-radius: 3px;
  padding: 1px 5px;
}

/* ── Navigation enhancement ── */
.nav-item.active {
  box-shadow: 0 0 15px rgba(56, 189, 248, 0.1);
}

.nav-badge {
  animation: badge-pulse 3s ease-in-out infinite;
}

@keyframes badge-pulse {
  0%, 100% { box-shadow: none; }
  50%       { box-shadow: 0 0 8px rgba(248, 113, 113, 0.4); }
}

/* ── Sidebar footer upgrade ── */
.sidebar-footer {
  position: relative;
}

.sidebar-footer::before {
  content: '';
  position: absolute;
  top: 0; left: 16px; right: 16px;
  height: 1px;
  background: linear-gradient(90deg,
    transparent,
    rgba(56, 189, 248, 0.2) 50%,
    transparent
  );
}

/* ── Amber/orange tile enhancement ── */
#tile-review {
  border-color: rgba(251, 146, 60, 0.1);
}
#tile-review:hover {
  border-color: rgba(251, 146, 60, 0.2);
}

/* ── Hero tile icon color inheritance ── */
#tile-suspects .hero-tile-icon { color: var(--cyan); border-color: var(--cyan-border); background: var(--cyan-dim); }
#tile-review   .hero-tile-icon { color: var(--amber); border-color: var(--amber-border); background: var(--amber-dim); }
#tile-flights  .hero-tile-icon { color: var(--purple); border-color: var(--purple-border); background: var(--purple-dim); }
#tile-rules    .hero-tile-icon { color: var(--emerald); border-color: var(--emerald-border); background: var(--emerald-dim); }

/* ── Orb intensity enhancement ── */
.orb-1 { opacity: 0.16; }
.orb-2 { opacity: 0.12; }
.orb-3 { opacity: 0.09; }

/* ── Program type color coding ── */
.program-item { border-left: 2px solid transparent; }
.program-item.type-gs   { border-left-color: rgba(248, 113, 113, 0.5); }
.program-item.type-gdp  { border-left-color: rgba(251, 146, 60, 0.5); }
.program-item.type-afp  { border-left-color: rgba(167, 139, 250, 0.5); }
.program-item.type-ctop { border-left-color: rgba(56, 189, 248, 0.5); }

.program-item-type { font-family: var(--font-mono); }