/* RxCloud CyberLab vNext Premium UI — Atlas harmonization layer */
/* ═══════════════════════════════════════════════════════════════
   Loads AFTER atlas.css. Aligns Atlas-specific components to the
   vNext signature (brighter electric cyan, premium glass, telemetry
   accents). PURE color / glass / glow — no layout, grid, positioning
   or D3 map geometry is touched here. Tokens come from rxcloud-vnext.css.
   ═══════════════════════════════════════════════════════════════ */

/* Re-tint the legacy accent variables to the vNext signature.
   Scoped to Atlas pages only (this file is loaded just for Atlas),
   so every remaining var(--accent*) usage shifts to the brighter cyan. */
:root{
  --accent:#1bd4f5;
  --accent-2:#6cf0ff;
  --accent-3:#19b8d8;
}

/* ── HEADER DENSITY — match the dashboard's compact pills so the
   Atlas 6 nav + 3 action pills don't crowd into one bright bar.
   atlas.css sets these to min-height:38px / padding:8px 14px / 0.82rem
   with same specificity; this file loads after, so !important wins. */
.atlas-header .atlas-nav-link.btn.btn-pill,
.atlas-header .atlas-action-btn.btn.btn-pill{
  padding:6px 12px !important;
  min-height:30px !important;
  font-size:0.78rem !important;
  letter-spacing:.1px !important;
  line-height:1.15 !important;
}
/* soften resting glow on the bright cyan ones (active nav + action btns)
   so a row of 9 pills reads as individual buttons, not one halo bar */
.atlas-header .atlas-nav-link.is-active,
.atlas-header .atlas-action-btn.btn-aqua{
  box-shadow:
    0 4px 12px rgba(20,210,250,.14),
    0 0 0 1px rgba(255,255,255,.10) inset !important;
}
@media (hover:hover){
  .atlas-header .atlas-nav-link.is-active:hover,
  .atlas-header .atlas-action-btn.btn-aqua:hover{
    transform:translateY(-1px) !important;
    box-shadow:
      0 10px 22px rgba(20,210,250,.26),
      0 0 22px rgba(20,210,250,.10),
      0 0 0 1px rgba(255,255,255,.18) inset !important;
  }
}
/* slightly tighter gap between pills (keeps the layout breathing room) */
.atlas-header .atlas-nav,
.atlas-header .atlas-actions{
  column-gap:6px !important;
  row-gap:6px !important;
}
/* trim the brand block too so the header height matches the dashboard */
.atlas-header .atlas-brand-link img{ width:28px !important; height:28px !important; }
.atlas-header .atlas-brand-link span{ font-size:0.98rem !important; }

/* very narrow viewports: extra-tight pills */
@media (max-width:1300px){
  .atlas-header .atlas-nav-link.btn.btn-pill,
  .atlas-header .atlas-action-btn.btn.btn-pill{
    padding:5px 10px !important;
    font-size:0.74rem !important;
  }
}

/* ── HERO CARD — vNext premium glass (overrides atlas.css !important) ── */
.atlas-hero-card{
  border-color:var(--rx-border-cyan) !important;
  background:
    radial-gradient(120% 95% at 92% 6%, rgba(20,210,250,.14), transparent 55%),
    radial-gradient(90% 90% at 8% 92%, rgba(13,160,220,.10), transparent 54%),
    linear-gradient(180deg, rgba(14,22,34,.62), rgba(9,15,24,.46)) !important;
  box-shadow:var(--rx-shadow-3, 0 30px 80px rgba(0,0,0,.58)), 0 0 36px rgba(20,210,250,.08) !important;
}
.atlas-hero-card h1 span{
  color:var(--rx-cyan-bright, #6cf0ff) !important;
  text-shadow:0 0 18px rgba(20,210,250,.32) !important;
}

/* ── PANEL TOP ACCENT — match the dashboard .card crest ── */
.card.atlas-panel::before{
  background:linear-gradient(90deg,
    transparent 8%,
    rgba(108,240,255,.55) 38%,
    rgba(108,240,255,.85) 50%,
    rgba(108,240,255,.55) 62%,
    transparent 92%) !important;
  opacity:.8 !important;
}

/* ── ACCENT BARS + KICKER DOT ── */
.atlas-panel h2::before,
.atlas-panel h3::before{
  background:var(--rx-grad-accent, linear-gradient(180deg,#6cf0ff,#0a8fb5)) !important;
  box-shadow:0 0 10px var(--rx-cyan, #1bd4f5), 0 0 20px rgba(20,210,250,.35) !important;
}
.atlas-kicker::before{
  background:var(--rx-cyan, #1bd4f5) !important;
  box-shadow:0 0 12px rgba(20,210,250,.9) !important;
}

/* ── LINKS ── */
.atlas-inline-link,
.atlas-mini-panel a,
.atlas-cluster-card a{ color:var(--rx-cyan, #1bd4f5) !important; }
.atlas-inline-link:hover{ text-decoration-color:rgba(27,212,245,.65) !important; }
.atlas-report-link{
  border-color:rgba(27,212,245,.30) !important;
  background:rgba(27,212,245,.12) !important;
  color:#cdf6ff !important;
}
.atlas-report-link:hover{
  border-color:rgba(27,212,245,.5) !important;
  background:rgba(27,212,245,.2) !important;
}

/* ── MAP — canvas border + tooltip/menu accents ── */
.atlas-map-canvas-wrap{ border-color:var(--rx-border-cyan) !important; }
.atlas-map-tooltip,
.atlas-map-context-menu{ border-color:rgba(27,212,245,.30) !important; }

/* map controls: active state uses the vNext bright gradient */
.atlas-map-mode-btn.is-active,
.atlas-map-filter-chip.is-active,
.atlas-map-action-btn:hover:not(:disabled),
.atlas-map-action-btn.is-active{
  border-color:rgba(27,212,245,.72) !important;
  background:linear-gradient(180deg, rgba(108,240,255,.96), rgba(27,212,245,.92)) !important;
  box-shadow:0 6px 18px rgba(20,210,250,.26), inset 0 0 0 1px rgba(255,255,255,.34) !important;
}

/* ── TABLES ── */
.atlas-table th{ color:#bdefff !important; }
.atlas-table tr:hover td{ background:rgba(27,212,245,.06) !important; }
.atlas-session-row:hover td{ background:rgba(27,212,245,.08) !important; }
.atlas-session-row.is-active td{
  background:linear-gradient(90deg, rgba(27,212,245,.16), rgba(27,212,245,.06)) !important;
  box-shadow:inset 0 0 0 1px rgba(27,212,245,.32) !important;
}

/* ── FEED / EXPLAIN / KEYFINDING hover accents ── */
.atlas-feed-item:hover{
  border-color:var(--rx-border-cyan) !important;
  box-shadow:0 6px 14px rgba(20,210,250,.08) !important;
}
.atlas-explain-item:hover{
  border-color:rgba(27,212,245,.24) !important;
  background:rgba(27,212,245,.05) !important;
}
.atlas-keyfinding{ border-color:rgba(27,212,245,.18) !important; }
.atlas-keyfinding:hover{
  border-color:rgba(27,212,245,.34) !important;
  box-shadow:0 8px 18px rgba(20,210,250,.08) !important;
}
.atlas-explain-exec{
  border-color:var(--rx-border-cyan) !important;
  background:
    radial-gradient(480px 180px at 8% 0%, rgba(20,210,250,.10), transparent 72%),
    rgba(9,21,34,.52) !important;
}

/* ── RISK FILLS / METERS ── */
.atlas-risk-fill{
  background:linear-gradient(90deg, var(--rx-cyan-deep,#0a8fb5), var(--rx-cyan,#1bd4f5) 50%, var(--rx-cyan-bright,#6cf0ff)) !important;
  box-shadow:0 0 14px rgba(20,210,250,.3) !important;
}
.atlas-risk-track,
.atlas-risk-meter-track{ border-color:rgba(27,212,245,.22) !important; }

/* ── TIMELINE — spine + node dots ── */
.atlas-timeline::before{
  background:linear-gradient(180deg, rgba(27,212,245,.12), rgba(27,212,245,.5), rgba(27,212,245,.08)) !important;
}
.atlas-timeline-time{ color:var(--rx-cyan-bright,#6cf0ff) !important; }
.atlas-timeline-body::before{
  background:var(--rx-cyan,#1bd4f5) !important;
  box-shadow:0 0 12px rgba(20,210,250,.7) !important;
}

/* ── SUBTLE CYAN EDGES on data cards ── */
.atlas-stat-card{ border-color:rgba(27,212,245,.16) !important; }

/* ── FOOTER — match header telemetry line ── */
.atlas-footer::before{
  background:linear-gradient(90deg,
    transparent, rgba(108,240,255,.5), rgba(27,212,245,.18), rgba(108,240,255,.5), transparent) !important;
}

/* ── ACCESSIBILITY ── */
@media (prefers-reduced-motion:reduce){
  .atlas-feed-item, .atlas-explain-item, .atlas-keyfinding{ transition:none !important; }
}
