/* Grid texture */
.grid-texture {
  position: fixed;
  inset: 0;
  background-image:
    linear-gradient(rgba(59, 130, 246, 0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(59, 130, 246, 0.04) 1px, transparent 1px);
  background-size: 28px 28px;
  pointer-events: none;
  z-index: 0;
}

/* LED pulse */
.led-pulse {
  box-shadow: 0 0 6px #3b82f6;
  animation: pulse-blue 2s infinite;
}
@keyframes pulse-blue {
  0%, 100% { opacity: 1; box-shadow: 0 0 6px #3b82f6; }
  50%       { opacity: 0.5; box-shadow: 0 0 12px #3b82f6; }
}

/* Tab buttons */
.tab-btn {
  padding: 8px 20px;
  font-size: 0.875rem;
  font-weight: 500;
  color: #64748b;
  border-bottom: 2px solid transparent;
  background: transparent;
  cursor: pointer;
  transition: all 0.2s;
}
.tab-btn:hover { color: #e2e8f0; }
.tab-btn.active {
  color: #e2e8f0;
  border-bottom-color: #3b82f6;
}

/* KPI card */
.kpi-card {
  background: #0f172a;
  border: 1px solid #1e293b;
  border-radius: 8px;
  padding: 10px 12px;
  text-align: center;
}
.kpi-label {
  font-size: 0.6875rem;
  color: #475569;
  letter-spacing: 0.4px;
  margin-bottom: 3px;
}
.kpi-value {
  font-size: 1rem;
  font-weight: 700;
  color: #e2e8f0;
}
.kpi-value.up   { color: #ef4444; text-shadow: 0 0 10px #ef444455; }
.kpi-value.down { color: #22c55e; }
.kpi-value.warn { color: #f59e0b; }
.kpi-value.blue { color: #60a5fa; }

/* Profit/Loss badge */
.pnl-badge {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  font-size: 0.75rem;
  font-weight: 600;
  padding: 2px 7px;
  border-radius: 4px;
}
.pnl-badge.up   { background: #2d0f0f; color: #ef4444; border: 1px solid #ef444430; }
.pnl-badge.down { background: #052e16; color: #22c55e; border: 1px solid #22c55e30; }
.pnl-badge.flat { background: #1e293b; color: #94a3b8; border: 1px solid #334155; }

/* Progress bar */
.progress-track {
  background: #1e293b;
  border-radius: 99px;
  height: 5px;
  margin-top: 6px;
}
.progress-fill {
  height: 5px;
  border-radius: 99px;
  background: linear-gradient(90deg, #1d4ed8, #60a5fa);
  box-shadow: 0 0 6px #3b82f660;
}

/* Chart containers */
.chart-card {
  background: #0f172a;
  border: 1px solid #1e293b;
  border-radius: 10px;
  padding: 16px;
}
.chart-title {
  font-size: 0.75rem;
  color: #64748b;
  letter-spacing: 0.5px;
  margin-bottom: 8px;
}

/* Tables */
.data-table { width: 100%; border-collapse: collapse; font-size: 0.8125rem; }
.data-table th {
  color: #475569;
  font-weight: 500;
  font-size: 0.6875rem;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  padding: 8px 12px;
  border-bottom: 1px solid #1e293b;
  text-align: left;
}
.data-table td {
  padding: 9px 12px;
  border-bottom: 1px solid #0f172a;
  color: #94a3b8;
}
.data-table tr:hover td { background: #0f172a; }

/* Custom scrollbar */
::-webkit-scrollbar       { width: 5px; height: 5px; }
::-webkit-scrollbar-track  { background: #0f172a; }
::-webkit-scrollbar-thumb  { background: #334155; border-radius: 99px; }