/* =============================================
   INTELLIGENCENOTES.COM - Custom Publish CSS v10
   DEEP NIGHT SKY + BALANCED WIDE DESKTOP + CYBER NEON GRAPH
   Updated for Luiz H. S. Brandão - April 2026
   ============================================= */

:root {
  --background-primary: #020813;       /* Deep night sky blue */
  --background-secondary: #0a1425;
  --text-normal: #e6eef8;
  --text-muted: #a1b4d0;
  --text-accent: #60a5fa;              /* Lighter blue headers you liked */
  --interactive-accent: #60a5fa;
  --interactive-accent-hover: #93c5fd;
}

/* FORCE DEEP NIGHT SKY BACKGROUND */
html, body, .site-body, .publish-container, 
.markdown-preview-view, .markdown-rendered,
.site-main, .main-content {
  background-color: #020813 !important;
}

/* Header */
.site-header {
  background: rgba(2, 8, 19, 0.97) !important;
  backdrop-filter: blur(12px);
  border-bottom: 1px solid #1e2f55;
}

/* Text & headings */
body {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  line-height: 1.75;
  font-size: 17.8px;
  font-weight: 450;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

.site-title,
h1, h2, h3, h4,
a, .external-link {
  color: #60a5fa !important;
}

a:hover {
  color: #93c5fd !important;
}

h1, h2, h3, h4 {
  font-weight: 650;
  letter-spacing: -0.025em;
}

/* BALANCED DESKTOP TEXT COLUMN (exactly as you approved in v9) */
.markdown-preview-view {
  max-width: 1020px !important;
  margin: 0 auto;
  padding: 2rem 3rem !important;
}

@media (min-width: 1200px) {
  .markdown-preview-view {
    max-width: 1100px !important;
    padding: 2.5rem 3.5rem !important;
  }
}

@media (min-width: 1600px) {
  .markdown-preview-view {
    max-width: 1180px !important;
    padding: 3rem 4rem !important;
  }
}

/* Category cards hover */
.nav-folder-title:hover,
.nav-file-title:hover {
  color: #93c5fd !important;
  transform: translateX(4px);
}

/* =============================================
   YOUR CUSTOM ADDITIONS + FIXED CYBER NEON GRAPH
   ============================================= */

/* Sidebar */
.sidebar, .left-sidebar, .publish-sidebar, .nav-container,
.tree-container, .site-body-left-column, div[class*="sidebar"] {
  background-color: #020813 !important;
  color: #e2e8f0 !important;
}

.nav-folder-title, .nav-file-title,
.tree-item-self, .nav-file-title-content {
  background-color: transparent !important;
  color: #e2e8f0 !important;
}
.nav-folder-title:hover, .nav-file-title:hover,
.tree-item-self:hover {
  background-color: #16243a !important;
  color: #93c5fd !important;
}

/* GRAPH VIEW - CYBER NEON BLUE ACTIVE NODES + YELLOW LINES */
.graph-view-container {
  background-color: #020813 !important;
}
.graph-node { fill: #2d797d; }
.graph-node:hover { 
  fill: #22d3ee !important; 
}

/* STRONG OVERRIDE FOR CLICKED / ACTIVE NODES */
.graph-node.active,
.graph-node:focus,
.graph-node[aria-selected="true"],
.graph-node.selected,
.graph-node.is-active {
  fill: #22f0ff !important;           /* Cyber neon blue - bright electric glow */
}

/* Yellow connections (kept bright as you liked) */
.graph-link { 
  stroke: #facc15 !important;
  stroke-width: 2.1px; 
}
.graph-link.highlight, 
.graph-link.active { 
  stroke: #fff176 !important; 
}
.graph-node text {
  fill: #e2e8f0;
  font-size: 12px;
}

/* Site logo in header */
.site-title a {
  display: flex !important;
  align-items: center;
  gap: 12px;
  text-decoration: none;
}
.site-title a::before {
  content: "";
  display: block;
  width: 48px;
  height: 48px;
  background-image: url("./site-logo.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  flex-shrink: 0;
  filter: drop-shadow(0 2px 4px rgba(0,0,0,0.3));
}
@media (min-width: 768px) {
  .site-title a::before {
    width: 56px;
    height: 56px;
  }
}

/* Callouts */
.callout {
  background: rgba(255,255,255,0.04) !important;
  border: 1px solid rgba(255,255,255,0.15) !important;
  border-radius: 10px !important;
  margin: 24px 0 !important;
}
.callout-title {
  background: rgba(96, 165, 250, 0.15) !important;
  color: #ffffff !important;
  font-weight: 700 !important;
}
.callout-content {
  padding: 16px 20px !important;
}

/* Mobile */
@media (max-width: 768px) {
  body { font-size: 16.5px; }
  .markdown-preview-view { padding: 1.25rem 1.5rem !important; }
}

/* Hide default footer */
.site-footer {
  display: none;
}