/* 6LG site-wide component system. Command Center nav is the default visual language. */

html,
body {
  background: var(--site-bg);
}

body {
  color: var(--site-text);
  font-family: var(--site-font-ui);
  background:
    radial-gradient(circle at 42% 0%, rgba(155,255,0,.10), transparent 24%),
    radial-gradient(circle at 86% 58%, rgba(155,255,0,.055), transparent 24%),
    linear-gradient(180deg, var(--site-bg), #010202 78%);
}

.cb-theme-command-center {
  color: var(--site-text);
  font-family: var(--site-font-ui);
}

h1,h2,h3,h4,h5,h6,
strong,b,
.brand-title,
.eyebrow,
.nav-link,
.btn,
.topbar h1,
.status-chip,
.sidebar-label,
th,
.stat-row strong,
.ops-nav a,
.ops-btn,
.ops-card h3 {
  font-family: var(--site-font-display) !important;
  letter-spacing: .07em;
  text-transform: uppercase;
}

p,
small,
.panel,
.sidebar-copy,
.ops-card,
.ops-main,
.ops-profile,
.ops-nav small,
.daily-row,
.rival,
.pilot-row,
.hero-title p {
  font-family: var(--site-font-ui) !important;
}

/* Global panels/cards */
.sidebar-card,
.panel,
.slot-card,
.rsvp-modal-card,
.rsvp-modal,
.map-shell,
.inset-panel,
.ops-card {
  border-color: rgba(155,255,0,.16) !important;
  background:
    linear-gradient(180deg, rgba(8,15,10,.92), rgba(3,6,5,.95)) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.025),
    0 12px 28px rgba(0,0,0,.28) !important;
}

/* Global sidebar */
.sidebar {
  background:
    radial-gradient(circle at 45% 8%, rgba(155,255,0,.12), transparent 28%),
    linear-gradient(180deg, rgba(5,10,7,.98), rgba(2,4,3,.99)) !important;
  border-right: 1px solid rgba(155,255,0,.22) !important;
  box-shadow:
    inset -1px 0 0 rgba(255,255,255,.04),
    18px 0 40px rgba(0,0,0,.32) !important;
}

.brand {
  border: 1px solid rgba(155,255,0,.16) !important;
  background:
    linear-gradient(135deg, rgba(155,255,0,.08), rgba(0,0,0,.10)) !important;
  clip-path: polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,0 100%);
  padding: 12px !important;
}

.brand-logo,
.topbar-logo {
  filter: drop-shadow(0 0 14px rgba(155,255,0,.32));
}

.eyebrow {
  color: var(--site-accent) !important;
}

.brand-title {
  color: var(--site-text) !important;
}

/* Command Center default nav */
.nav {
  display: grid;
  gap: 12px !important;
}

.nav-link {
  position: relative;
  display: grid;
  align-items: center;
  min-height: 58px;
  padding: 0 34px 0 18px !important;
  border: 1px solid rgba(155,255,0,.14) !important;
  border-radius: 0 !important;
  clip-path: polygon(
    0 0,
    calc(100% - 16px) 0,
    100% 16px,
    100% 100%,
    16px 100%,
    0 calc(100% - 16px)
  );
  background:
    linear-gradient(180deg, rgba(14,20,16,.80), rgba(4,7,6,.92)),
    radial-gradient(circle at 18% 50%, rgba(155,255,0,.07), transparent 28%) !important;
  color: var(--site-text) !important;
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: .06em;
  font-weight: 800 !important;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.03),
    inset 0 -16px 24px rgba(0,0,0,.36),
    0 12px 18px rgba(0,0,0,.24) !important;
  overflow: hidden;
  transition:
    transform .12s ease,
    border-color .14s ease,
    box-shadow .14s ease,
    background .14s ease;
}

.nav-link::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 4px;
  background: rgba(155,255,0,.38);
  box-shadow: 0 0 12px rgba(155,255,0,.26);
  transition: width .14s ease, box-shadow .14s ease;
}

.nav-link::after {
  content: "›";
  position: absolute;
  right: 13px;
  top: 50%;
  transform: translateY(-52%);
  font-size: 24px;
  color: #f2f7ee;
  opacity: .84;
}

.nav-link:hover,
.nav-link.is-active {
  transform: translateX(4px);
  color: #fff !important;
  border-color: rgba(155,255,0,.65) !important;
  background:
    linear-gradient(180deg, rgba(38,82,18,.48), rgba(5,10,6,.94)),
    radial-gradient(circle at 18% 50%, rgba(155,255,0,.28), transparent 38%) !important;
  box-shadow:
    inset 0 0 0 1px rgba(220,255,170,.10),
    inset 0 0 22px rgba(155,255,0,.10),
    0 0 22px rgba(155,255,0,.14),
    0 12px 20px rgba(0,0,0,.34) !important;
}

.nav-link:hover::before,
.nav-link.is-active::before {
  width: 8px;
  background: var(--site-accent);
  box-shadow:
    0 0 14px var(--site-accent),
    0 0 24px rgba(155,255,0,.28);
}

/* Global buttons */
.btn,
.ops-btn {
  border-radius: 0 !important;
  clip-path: polygon(
    0 0,
    calc(100% - 10px) 0,
    100% 10px,
    100% 100%,
    10px 100%,
    0 calc(100% - 10px)
  );
  font-family: var(--site-font-display) !important;
}

.btn-primary,
.btn-secondary,
.ops-btn.primary {
  background: linear-gradient(135deg,#9bff00,#4f9700) !important;
  color: #071006 !important;
  border-color: rgba(155,255,0,.44) !important;
  box-shadow: 0 0 18px rgba(155,255,0,.18);
}

.btn-ghost {
  border-color: rgba(155,255,0,.22) !important;
  color: var(--site-text) !important;
}

/* Forms */
input,
select,
textarea {
  border-color: rgba(155,255,0,.18) !important;
  background: rgba(2,5,4,.82) !important;
  color: var(--site-text) !important;
}

th,
.panel-subtitle,
.sidebar-copy,
.muted,
.slot-role,
.pilot-meta {
  color: var(--site-muted) !important;
}

/* Page topbar */
.topbar {
  border-bottom: 1px solid rgba(155,255,0,.18) !important;
}