/* ============================================================
   shared-nav.css — Unified nav + footer styles
   Matches dashboard (page.tsx / globals.css) exactly
   ============================================================ */

/* Nav bar — 52px, sticky, dark bg */
.fe-shared-nav {
  position: sticky; top: 0; z-index: 100;
  height: 52px;
  background: #0F172A;
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.dark .fe-shared-nav { background: #0a0e14; }

.fe-nav-inner {
  max-width: 1280px; margin: 0 auto;
  padding: 0 24px; height: 100%;
  display: flex; align-items: center; justify-content: space-between;
}

/* Left: logo + badge */
.fe-nav-left { display: flex; align-items: center; gap: 10px; }

.fe-nav-logo-link {
  display: flex; align-items: center; gap: 8px;
  text-decoration: none;
}
.fe-nav-logo-link svg { display: block; flex-shrink: 0; }

.fe-nav-brand {
  font-size: 15px; font-weight: 500;
  letter-spacing: -0.025em;
  color: #E2E8F0;
}

.fe-nav-badge {
  font-size: 10px; color: #94A3B8;
  background: rgba(255,255,255,.06);
  padding: 2px 8px; border-radius: 4px;
  font-family: 'SF Mono', 'Fira Code', monospace;
}

/* Right: lang + theme + CTA */
.fe-nav-right { display: flex; align-items: center; gap: 8px; }

.fe-nav-lang-group {
  display: flex; align-items: center; gap: 2px;
  background: rgba(255,255,255,.06);
  border-radius: 6px; padding: 2px;
}
.fe-nav-lang-btn {
  padding: 3px 8px; border-radius: 4px;
  font-size: 11px; font-weight: 500;
  color: #94A3B8; background: transparent;
  border: none; cursor: pointer;
  transition: all .15s;
}
.fe-nav-lang-btn:hover { color: #E2E8F0; }
.fe-nav-lang-btn.active {
  background: #0F172A; color: #E2E8F0;
}
.dark .fe-nav-lang-btn.active { background: #0a0e14; }

.fe-nav-theme {
  width: 32px; height: 32px; border-radius: 6px;
  border: 1px solid rgba(255,255,255,.1);
  background: transparent; color: #94A3B8;
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  font-size: 14px; transition: all .15s;
}
.fe-nav-theme:hover { color: #E2E8F0; border-color: rgba(255,255,255,.25); }

.fe-nav-cta {
  font-size: 11px; color: #94A3B8;
  border: 1px solid rgba(255,255,255,.1);
  padding: 5px 10px; border-radius: 6px;
  text-decoration: none; transition: all .15s;
}
.fe-nav-cta:hover { color: #E2E8F0; border-color: rgba(255,255,255,.25); }

/* Footer */
.fe-shared-footer {
  padding: 32px; text-align: center;
  background: #0F172A; color: #94A3B8; font-size: 13px;
}
.dark .fe-shared-footer { background: #0a0e14; }

.fe-footer-logo {
  display: inline-flex; align-items: center; gap: 8px;
  color: #E2E8F0;
  font-size: 15px; font-weight: 500;
  letter-spacing: -0.025em;
  margin-bottom: 8px;
}
.fe-footer-logo svg { display: inline-block; vertical-align: middle; }

.fe-footer-sub { color: #94A3B8; font-size: 13px; margin-bottom: 12px; }

.fe-footer-links {
  display: flex; justify-content: center; gap: 20px; margin-bottom: 12px;
}
.fe-footer-links a {
  color: #94A3B8; text-decoration: none; transition: color .15s;
}
.fe-footer-links a:hover { color: #E2E8F0; }

.fe-footer-copy { font-size: 12px; color: #64748B; }

/* Responsive */
@media (max-width: 600px) {
  .fe-nav-inner { padding: 0 12px; }
  .fe-nav-cta { display: none; }
  .fe-nav-badge { display: none; }
}