/* Global */
:root{
  --primary:#0D47A1;
  --bg:#F5F7FA;
  --card:#FFFFFF;
  --text:#0f172a;
  --muted:#64748b;
  --neon-green:#00E676;
  --neon-orange:#FF9100;
}

html,body{height:100%;}
body{
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
  background: var(--bg);
  color:var(--text);
}

h1,h2,h3,h4,h5,h6{
  color: var(--primary);
}

/* Navbar */
.navbar-brand{
  font-weight:800;
  letter-spacing:.2px;
}

.navbar{
  background: var(--primary) !important;
}

.navbar .navbar-brand,
.navbar .nav-link{
color:#000000 !important;
}

.navbar .nav-link{
  opacity:.92;
  font-weight:600;
}

.navbar .nav-link:hover,
.navbar .nav-link:focus{
  opacity:1;
}

.navbar .navbar-toggler{
  border-color: rgba(255,255,255,.35);
}

.navbar .navbar-toggler-icon{
  filter: invert(1);
}

.brand-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:34px;
  height:34px;
  border-radius:10px;
  background: rgba(255,255,255,.14);
  color:#fff;
  margin-right:10px;
  font-weight:800;
}

/* Home layout */
.ad-box{
  border:1px dashed rgba(13, 71, 161, .28);
  border-radius:16px;
  background:var(--card);
  padding:14px;
  min-height:160px;
}

.ad-box .ad-label{
  font-size:12px;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:.08em;
}

/* Neon buttons */
.neon-btn{
  position:relative;
  border-radius:14px;
  padding:12px 16px;
  font-weight:800;
  letter-spacing:.2px;
  border:1px solid transparent;
  transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}

.neon-btn:active{transform: translateY(1px);}

.neon-green{
  background: rgba(0, 230, 118, .12);
  color:#064e2c;
  border-color: rgba(0, 230, 118, .65);
  box-shadow: 0 0 18px rgba(0, 230, 118, .22);
}

.neon-orange{
  background: rgba(255, 145, 0, .14);
  color:#7c2d12;
  border-color: rgba(255, 145, 0, .70);
  box-shadow: 0 0 18px rgba(255, 145, 0, .22);
}

.neon-selected.neon-green{
  box-shadow: 0 0 28px rgba(0, 230, 118, .55);
  animation: neonPulseGreen 1.8s ease-in-out infinite;
}

.neon-selected.neon-orange{
  box-shadow: 0 0 28px rgba(255, 145, 0, .55);
  animation: neonPulseOrange 1.8s ease-in-out infinite;
}

@keyframes neonPulseGreen{
  0%,100%{ box-shadow: 0 0 20px rgba(0, 230, 118, .35), 0 0 44px rgba(0, 230, 118, .16); }
  50%{ box-shadow: 0 0 28px rgba(0, 230, 118, .75), 0 0 70px rgba(0, 230, 118, .24); }
}

@keyframes neonPulseOrange{
  0%,100%{ box-shadow: 0 0 20px rgba(255, 145, 0, .35), 0 0 44px rgba(255, 145, 0, .16); }
  50%{ box-shadow: 0 0 28px rgba(255, 145, 0, .75), 0 0 70px rgba(255, 145, 0, .24); }
}

/* Cards */
.card{
  border:1px solid rgba(13, 71, 161, .10);
  border-radius:16px;
  background: var(--card);
  box-shadow: 0 10px 30px rgba(15, 23, 42, .06);
}

.card-header{
  background:var(--card);
  border-bottom:1px solid rgba(13, 71, 161, .10);
  border-top-left-radius:16px;
  border-top-right-radius:16px;
}

.metric-pill{
  display:inline-flex;
  gap:8px;
  align-items:center;
  padding:8px 10px;
  border-radius:999px;
  background: rgba(13, 71, 161, .08);
  color: var(--text);
  font-weight:700;
  font-size:13px;
}

.small-muted{color:var(--muted); font-size:13px;}

/* Buttons */
.btn-primary{
  --bs-btn-bg: var(--primary);
  --bs-btn-border-color: var(--primary);
  --bs-btn-hover-bg: #0B3D8D;
  --bs-btn-hover-border-color: #0B3D8D;
  --bs-btn-active-bg: #083170;
  --bs-btn-active-border-color: #083170;
}

.btn-outline-primary{
  --bs-btn-color: var(--primary);
  --bs-btn-border-color: rgba(13, 71, 161, .35);
  --bs-btn-hover-bg: var(--primary);
  --bs-btn-hover-border-color: var(--primary);
}

.footer{
  background:#071B3A;
  color:#e2e8f0;
}

.footer a{color:#e2e8f0; text-decoration:none;}
.footer a:hover{text-decoration:underline;}

/* Accessibility */
:focus-visible{
  outline: 3px solid rgba(13, 71, 161, .35);
  outline-offset: 2px;
}
