/* =========================
   VARIABLES
   ========================= */

:root {
  --accent-1: #f87171;
  --accent-2: #60a5fa;
  --accent-3: #34d399;
  --accent-4: #fbbf24;
  --accent-5: #a78bfa;
}

* { box-sizing: border-box; margin: 0; padding: 0; }

body {
  background: #1a1a1a;
  font-family: Arial, sans-serif;
  min-height: 100vh;
}

h1 {
display: none;
}

#org-chart {
  width: 100%;
}

/* Overriding Google Charts styles */
.google-visualization-orgchart-node {
  background: #2a2a2a !important;
  border: 1px solid #3a3a3a !important;
  border-radius: 8px !important;
  padding: 0 !important;
  min-width: 180px;
}

/* Overriding Google Charts connector lines */
.google-visualization-orgchart-lineleft,
.google-visualization-orgchart-lineright,
.google-visualization-orgchart-linebottom,
.google-visualization-orgchart-linetop,
.google-visualization-orgchart-linedrawing {
  border-color: #AAAAAA !important;
}

.org-root-node {
  background-color: #1A1A1A !important;
  border: none !important;
  box-shadow: none !important;
}

.node-card {
  padding: 12px 16px;
  color: #EBEBEB;
}

.node-name {
  font-size: 14px;
  font-weight: 600;
  color: #EBEBEB;
  margin-bottom: 2px;
}

.node-department {
  font-size: 12px;
  color: #aaa;
  margin-bottom: 6px;
}

.node-title {
  font-size: 11px;
  color: #888;
  margin-bottom: 8px;
  font-style: italic;
}

.node-meta {
  font-size: 11px;
  color: #888;
  line-height: 1.6;
  border-top: 1px solid #3a3a3a;
  padding-top: 6px;
  margin-top: 4px;
  text-align: left;
}

.node-meta span {
  display: block;
}

.node-inactive {
  opacity: .3;
}

.fa-at              { color: var(--accent-3); }
.fa-square-phone    { color: var(--accent-2); }
.fa-square-envelope { color: var(--accent-5); }