/* ═══════════════════════════════════════════════════════════
   PULSAR — STAR WARS THEME
   ═══════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@400;600;900&family=Share+Tech+Mono&display=swap');

/* ── Variables ─────────────────────────────────────────────── */
:root {
  --sw-void:        #02040a;
  --sw-space:       #060c18;
  --sw-deep:        #090f20;
  --sw-panel:       #0b1428;
  --sw-panel-hi:    #0e1c38;
  --sw-border:      #162040;
  --sw-border-hi:   #1e3060;

  --sw-yellow:      #ffe81f;
  --sw-yellow-glow: rgba(255, 232, 31, 0.25);
  --sw-yellow-dim:  rgba(255, 232, 31, 0.08);

  --sw-blue:        #4db8ff;
  --sw-blue-glow:   rgba(77, 184, 255, 0.2);
  --sw-blue-dim:    rgba(77, 184, 255, 0.08);

  --sw-red:         #ff4757;
  --sw-red-glow:    rgba(255, 71, 87, 0.25);

  --sw-green:       #2ed573;
  --sw-green-glow:  rgba(46, 213, 115, 0.2);
  --sw-green-dim:   rgba(46, 213, 115, 0.08);

  --sw-purple:      #b48eff;
  --sw-purple-glow: rgba(180, 142, 255, 0.25);
  --sw-purple-dim:  rgba(180, 142, 255, 0.08);

  --sw-orange:      #ff9f43;

  --sw-text:        #a8c0d8;
  --sw-text-hi:     #d8eaf8;
  --sw-text-dim:    #3a5070;
  --sw-text-muted:  #1e2f45;

  --font-sw:    'Orbitron', sans-serif;
  --font-mono:  'Share Tech Mono', monospace;
}

/* ── Starfield ─────────────────────────────────────────────── */
html { background: var(--sw-void); }

body {
  background:
    radial-gradient(ellipse at 25% 80%, rgba(0,40,90,0.18) 0%, transparent 55%),
    radial-gradient(ellipse at 75% 15%, rgba(40,0,90,0.12) 0%, transparent 50%),
    radial-gradient(ellipse at 50% 50%, rgba(0,20,60,0.10) 0%, transparent 70%),
    var(--sw-space);
  background-attachment: fixed;
  color: var(--sw-text);
  font-family: var(--font-mono);
  min-height: 100vh;
  position: relative;
}

body::before {
  content: '';
  position: fixed;
  top: 0; left: 0;
  width: 1px; height: 1px;
  pointer-events: none;
  z-index: 0;
  box-shadow:
    /* bright */
    120px  80px 1px 1px rgba(255,255,255,.90),
    380px 220px 1px 1px rgba(255,255,255,.85),
    750px  45px 1px 1px rgba(255,255,255,.95),
   1100px 310px 1px 1px rgba(255,255,255,.80),
   1460px 130px 1px 1px rgba(255,255,255,.90),
   1780px 400px 1px 1px rgba(255,255,255,.85),
    560px 500px 1px 1px rgba(255,255,255,.80),
    950px 650px 1px 1px rgba(255,255,255,.90),
   1320px 580px 1px 1px rgba(255,255,255,.75),
    200px 720px 1px 1px rgba(255,255,255,.85),
    /* medium */
     60px 160px 1px 0px rgba(255,255,255,.60),
    230px 430px 1px 0px rgba(255,255,255,.55),
    490px 280px 1px 0px rgba(255,255,255,.65),
    670px 610px 1px 0px rgba(255,255,255,.50),
    840px 390px 1px 0px rgba(255,255,255,.60),
   1020px 140px 1px 0px rgba(255,255,255,.55),
   1190px 470px 1px 0px rgba(255,255,255,.60),
   1380px 250px 1px 0px rgba(255,255,255,.50),
   1600px 540px 1px 0px rgba(255,255,255,.65),
   1820px 200px 1px 0px rgba(255,255,255,.55),
    310px 560px 1px 0px rgba(255,255,255,.50),
    720px 730px 1px 0px rgba(255,255,255,.60),
   1050px 800px 1px 0px rgba(255,255,255,.55),
   1450px 690px 1px 0px rgba(255,255,255,.50),
   1700px 760px 1px 0px rgba(255,255,255,.60),
    /* dim */
     40px  50px 1px 0px rgba(255,255,255,.30),
    170px 340px 1px 0px rgba(255,255,255,.25),
    290px 190px 1px 0px rgba(255,255,255,.35),
    430px 640px 1px 0px rgba(255,255,255,.20),
    530px 100px 1px 0px rgba(255,255,255,.30),
    620px 450px 1px 0px rgba(255,255,255,.25),
    780px 250px 1px 0px rgba(255,255,255,.35),
    880px 520px 1px 0px rgba(255,255,255,.20),
    990px  70px 1px 0px rgba(255,255,255,.30),
   1080px 600px 1px 0px rgba(255,255,255,.25),
   1160px 370px 1px 0px rgba(255,255,255,.30),
   1260px  90px 1px 0px rgba(255,255,255,.35),
   1350px 640px 1px 0px rgba(255,255,255,.20),
   1520px 170px 1px 0px rgba(255,255,255,.25),
   1640px 440px 1px 0px rgba(255,255,255,.30),
   1730px 620px 1px 0px rgba(255,255,255,.25),
   1860px  80px 1px 0px rgba(255,255,255,.35),
    100px 850px 1px 0px rgba(255,255,255,.20),
    450px 780px 1px 0px rgba(255,255,255,.30),
    800px 870px 1px 0px rgba(255,255,255,.25),
   1200px 820px 1px 0px rgba(255,255,255,.20),
   1600px 900px 1px 0px rgba(255,255,255,.30),
    /* tiny blue-tinted */
    330px 340px 1px 0px rgba(150,200,255,.40),
    690px 180px 1px 0px rgba(150,200,255,.35),
   1010px 480px 1px 0px rgba(150,200,255,.40),
   1400px 330px 1px 0px rgba(150,200,255,.35),
   1750px 500px 1px 0px rgba(150,200,255,.40);
}

/* ── Base overrides ────────────────────────────────────────── */
* { box-sizing: border-box; }

body > * { position: relative; z-index: 1; }

h1, h2, h3, h4, h5, h6 { font-family: var(--font-sw); letter-spacing: .05em; }

.font-monospace, code, pre, .font-monospace * {
  font-family: var(--font-mono) !important;
}

/* ── Navbar ────────────────────────────────────────────────── */
.navbar {
  background: rgba(2, 4, 10, 0.92) !important;
  border-bottom: 1px solid var(--sw-border-hi) !important;
  box-shadow: 0 0 20px rgba(0,0,0,.8), 0 2px 0 var(--sw-yellow-glow);
  backdrop-filter: blur(8px);
}

.navbar-brand {
  font-family: var(--font-sw) !important;
  font-weight: 900;
  font-size: 1.2rem;
  letter-spacing: .15em;
  color: var(--sw-yellow) !important;
  text-shadow: 0 0 12px var(--sw-yellow), 0 0 30px rgba(255,232,31,.4);
  text-transform: uppercase;
}

.navbar-brand:hover {
  text-shadow: 0 0 18px var(--sw-yellow), 0 0 40px rgba(255,232,31,.6);
}

.nav-link {
  color: var(--sw-text) !important;
  font-family: var(--font-sw);
  font-size: .72rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  transition: color .2s, text-shadow .2s;
}

.nav-link:hover, .nav-link.active {
  color: var(--sw-blue) !important;
  text-shadow: 0 0 8px var(--sw-blue);
}

.nav-link.active {
  color: var(--sw-yellow) !important;
  text-shadow: 0 0 8px var(--sw-yellow-glow);
}

.navbar-text {
  font-family: var(--font-sw);
  font-size: .65rem;
  letter-spacing: .12em;
  color: var(--sw-text-dim) !important;
  text-transform: uppercase;
}

.dropdown-menu {
  background: rgba(6, 12, 24, 0.96) !important;
  border: 1px solid var(--sw-border-hi) !important;
  box-shadow: 0 8px 32px rgba(0,0,0,.8), 0 0 0 1px var(--sw-blue-dim);
  backdrop-filter: blur(12px);
}

.dropdown-item {
  color: var(--sw-text) !important;
  font-family: var(--font-sw);
  font-size: .72rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  transition: all .15s;
}

.dropdown-item:hover {
  background: var(--sw-blue-dim) !important;
  color: var(--sw-blue) !important;
}

.dropdown-item.active {
  background: var(--sw-yellow-dim) !important;
  color: var(--sw-yellow) !important;
}

/* ── Cards ─────────────────────────────────────────────────── */
.card {
  background: rgba(11, 20, 40, 0.85) !important;
  border: 1px solid var(--sw-border) !important;
  box-shadow: 0 4px 24px rgba(0,0,0,.6), inset 0 1px 0 rgba(77,184,255,.05);
  backdrop-filter: blur(4px);
  transition: border-color .2s, box-shadow .2s;
}

.card:hover {
  border-color: var(--sw-border-hi) !important;
}

.card-header {
  background: rgba(14, 28, 56, 0.9) !important;
  border-bottom: 1px solid var(--sw-border-hi) !important;
  font-family: var(--font-sw);
  font-size: .75rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--sw-text) !important;
}

.card-header .fw-semibold {
  color: var(--sw-text-hi);
}

/* ── List group ────────────────────────────────────────────── */
.list-group-item {
  background: transparent !important;
  border-color: var(--sw-border) !important;
  color: var(--sw-text);
  transition: background-color .15s;
}

.list-group-item:hover {
  background: var(--sw-blue-dim) !important;
}

/* ── Buttons ───────────────────────────────────────────────── */
.btn-outline-secondary {
  color: var(--sw-text-dim) !important;
  border-color: var(--sw-border-hi) !important;
}
.btn-outline-secondary:hover {
  background: var(--sw-border-hi) !important;
  color: var(--sw-text-hi) !important;
}

.btn-outline-info {
  color: var(--sw-blue) !important;
  border-color: var(--sw-blue) !important;
}
.btn-outline-info:hover {
  background: var(--sw-blue-dim) !important;
  box-shadow: 0 0 12px var(--sw-blue-glow);
}

.btn-outline-warning {
  color: var(--sw-yellow) !important;
  border-color: var(--sw-yellow) !important;
}
.btn-outline-warning:hover {
  background: var(--sw-yellow-dim) !important;
  box-shadow: 0 0 12px var(--sw-yellow-glow);
}

.btn-outline-danger {
  color: var(--sw-red) !important;
  border-color: var(--sw-red) !important;
}
.btn-outline-danger:hover {
  background: var(--sw-red-glow) !important;
  box-shadow: 0 0 12px var(--sw-red-glow);
}

.btn-link {
  color: var(--sw-text-dim) !important;
}
.btn-link:hover { color: var(--sw-text) !important; }

/* ── Badges ────────────────────────────────────────────────── */
.badge.bg-secondary {
  background: var(--sw-border-hi) !important;
  color: var(--sw-text) !important;
  font-family: var(--font-mono);
  font-weight: 400;
}

.badge.bg-success {
  background: rgba(46,213,115,.2) !important;
  color: var(--sw-green) !important;
  border: 1px solid rgba(46,213,115,.3);
}

.badge.bg-warning {
  background: rgba(255,232,31,.15) !important;
  color: var(--sw-yellow) !important;
  border: 1px solid rgba(255,232,31,.25);
}

.badge.bg-info {
  background: var(--sw-blue-dim) !important;
  color: var(--sw-blue) !important;
  border: 1px solid rgba(77,184,255,.25);
}

.badge.bg-danger {
  background: rgba(255,71,87,.2) !important;
  color: var(--sw-red) !important;
  border: 1px solid rgba(255,71,87,.3);
}

/* ── Tables ────────────────────────────────────────────────── */
.table {
  color: var(--sw-text) !important;
  border-color: var(--sw-border) !important;
}

.table > :not(caption) > * > * {
  background-color: transparent !important;
  border-color: var(--sw-border) !important;
  color: inherit;
}

.table-secondary th, thead.table-secondary th {
  background: rgba(14, 28, 56, 0.9) !important;
  color: var(--sw-text-dim) !important;
  font-family: var(--font-sw);
  font-size: .68rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  border-color: var(--sw-border-hi) !important;
}

.table-hover tbody tr:hover td {
  background: var(--sw-blue-dim) !important;
}

tr.host-row:hover td {
  background: var(--sw-blue-dim) !important;
}

.bg-black {
  background: var(--sw-void) !important;
}

/* ── Forms ─────────────────────────────────────────────────── */
.form-control {
  background: var(--sw-panel) !important;
  border: 1px solid var(--sw-border-hi) !important;
  color: var(--sw-text) !important;
  font-family: var(--font-mono);
}

.form-control:focus {
  background: var(--sw-panel-hi) !important;
  border-color: var(--sw-blue) !important;
  box-shadow: 0 0 0 3px var(--sw-blue-dim) !important;
  color: var(--sw-text-hi) !important;
}

.form-control::placeholder { color: var(--sw-text-dim) !important; }

/* ── Modals ────────────────────────────────────────────────── */
.modal-content {
  background: rgba(6, 12, 24, 0.97) !important;
  border: 1px solid var(--sw-border-hi) !important;
  box-shadow: 0 0 60px rgba(0,0,0,.9), 0 0 0 1px var(--sw-blue-dim);
  backdrop-filter: blur(16px);
}

.modal-header, .modal-footer {
  border-color: var(--sw-border-hi) !important;
}

.modal-title { font-family: var(--font-sw); letter-spacing: .1em; }

/* ── Alerts ────────────────────────────────────────────────── */
.alert-warning {
  background: rgba(255,232,31,.08) !important;
  border: 1px solid rgba(255,232,31,.2) !important;
  color: var(--sw-yellow) !important;
}

/* ── Text color overrides ──────────────────────────────────── */
.text-warning  { color: var(--sw-yellow) !important; }
.text-info     { color: var(--sw-blue) !important; }
.text-success  { color: var(--sw-green) !important; }
.text-danger   { color: var(--sw-red) !important; }
.text-primary  { color: var(--sw-blue) !important; }
.text-purple   { color: var(--sw-purple) !important; }
.text-secondary { color: var(--sw-text-dim) !important; }
.text-light    { color: var(--sw-text-hi) !important; }

/* ── Background overrides ──────────────────────────────────── */
.bg-dark    { background: var(--sw-panel) !important; }
.bg-success { background: rgba(46,213,115,.15) !important; }
.bg-warning { background: rgba(255,232,31,.12) !important; }
.bg-danger  { background: rgba(255,71,87,.15) !important; }
.bg-purple  { background: rgba(180,142,255,.15) !important; }

/* ── Badge color variants ──────────────────────────────────── */
.badge.bg-purple {
  background: rgba(180,142,255,.2) !important;
  color: var(--sw-purple) !important;
  border: 1px solid rgba(180,142,255,.3);
}

/* ── Border overrides ──────────────────────────────────────── */
.border-secondary { border-color: var(--sw-border) !important; }

/* ── Scrollbar ─────────────────────────────────────────────── */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: var(--sw-void); }
::-webkit-scrollbar-thumb { background: var(--sw-border-hi); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--sw-blue); }

/* ── Code / Pre ────────────────────────────────────────────── */
pre {
  background: rgba(2, 4, 10, 0.8) !important;
  border: 1px solid var(--sw-border-hi) !important;
  border-radius: 4px;
}

.hljs { background: transparent !important; }

/* ── Spinner ───────────────────────────────────────────────── */
.spinner-border { color: var(--sw-blue) !important; }

/* ── Misc ──────────────────────────────────────────────────── */
.toggle-btn { padding: .1rem .35rem; }

.navbar-toggler {
  border-color: var(--sw-border-hi) !important;
}

hr { border-color: var(--sw-border-hi) !important; }

/* Selection */
::selection {
  background: var(--sw-yellow-dim);
  color: var(--sw-yellow);
}
