/* Clean Tracker Styles - All HUDs follow this pattern */

.tracker-panel {
  width: 340px;
  background: linear-gradient(145deg, rgba(15, 25, 35, 0.95), rgba(25, 35, 45, 0.95));
  padding: 0;
  border-radius: 12px;
  border: 2px solid var(--tracker-border-color, rgba(0, 200, 255, 0.6));
  box-shadow: 0 4px 16px var(--tracker-shadow-color, rgba(0, 200, 255, 0.2));
  font-family: 'Courier New', monospace;
  font-size: 14px;
  font-weight: bold;
  z-index: 1000;
  user-select: none;
}

.tracker-panel.success {
  --tracker-border-color: rgba(0, 255, 100, 0.6);
  --tracker-shadow-color: rgba(0, 255, 100, 0.2);
}

.tracker-panel.accent {
  --tracker-border-color: rgba(0, 200, 255, 0.6);
  --tracker-shadow-color: rgba(0, 200, 255, 0.2);
}

.tracker-panel.info {
  --tracker-border-color: rgba(0, 255, 255, 0.6);
  --tracker-shadow-color: rgba(0, 255, 255, 0.2);
}

.tracker-panel.warning {
  --tracker-border-color: rgba(255, 149, 0, 0.6);
  --tracker-shadow-color: rgba(255, 149, 0, 0.2);
}

/* Header Styles */
.tracker-header-compact {
  display: flex;
  justify-content: space-between;
  padding: 8px 12px;
  background: rgba(20, 30, 40, 0.8);
  color: #ffffff;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
}

.header-label {
  font-size: 12px;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.7);
  flex: 1;
  text-align: center;
}

/* Metrics Section */
.tracker-metrics {
  display: flex;
  padding: 10px;
  justify-content: space-between;
}

.tracker-stat {
  flex: 1;
  text-align: center;
  padding: 4px 6px;
}

.tracker-stat-value {
  font-size: 22px;
  font-weight: bold;
}

.tracker-stat-value .decimal {
  font-size: 16px;
  opacity: 0.8;
}

.tracker-stat-label {
  font-size: 10px;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.6);
}

/* Status Colors */
.tracker-stat.success .tracker-stat-value {
  color: var(--color-success, #00ff64);
}

.tracker-stat.info .tracker-stat-value {
  color: var(--color-info, #00ffff);
}

.tracker-stat.accent .tracker-stat-value {
  color: var(--color-accent, #00c8ff);
}

.tracker-stat.warning .tracker-stat-value {
  color: var(--color-warning, #ff9500);
}

.tracker-stat.danger .tracker-stat-value {
  color: var(--color-danger, #ff3b30);
}

/* Warning Banner - DISABLED: causes container resize */
.tracker-warning,
.tracker-warning.visible,
.tracker-warning.show {
  display: none !important;
}

/* ============================================
   HUD POSITIONING - Managed by HUDController.js
   ============================================

   HUDController applies position:fixed inline styles.
   These CSS rules provide base styling only.

   Do NOT add positioning rules here - they will
   conflict with HUDController's inline styles.
   ============================================ */

/* Legacy dock container - hidden, replaced by HUDController */
.tracker-dock,
.hud-stack {
  display: none !important;
}

/* Individual HUD panels get position from HUDController */
/* Base styling only - no positioning */
.tracker-panel.cnc-tracker {
  pointer-events: auto;
}