/* Generated Brand CSS Variables - Athletic Dark */
/* High-performance athletic aesthetic with dark theme */

:root {
  /* Core Colors */
  --brand-primary: #ffffff;
  --brand-secondary: #a3a3a3;
  --brand-accent: #f59e0b;
  --brand-bg: #0a0a0a;
  --brand-card-bg: #171717;
  --brand-card-bg-hover: #262626;
  --brand-border: #404040;

  /* Typography */
  --brand-font-primary: 'IBM Plex Mono', monospace;
  --brand-font-secondary: 'IBM Plex Sans', sans-serif;
  --brand-letter-spacing: 0.5px;

  /* Layout */
  --brand-border-width: 1px;
  --brand-border-radius: 4px;
  --brand-spacing: 1rem;

  /* Training Type Colors */
  --intensity-rest: #525252;
  --intensity-zone2: #10b981;
  --intensity-high: #ef4444;
  --intensity-strength: #f59e0b;
  --intensity-technique: #a855f7;
  --intensity-race: #f59e0b;

  /* Semantic Colors */
  --color-success: #10b981;
  --color-error: #ef4444;
  --color-warning: #f59e0b;
  --color-info: #3b82f6;
}

/* Force dark background */
body {
  background-color: var(--brand-bg) !important;
  color: var(--brand-primary) !important;
  font-family: var(--brand-font-secondary) !important;
}

/* Override any light backgrounds */
.bg-white,
.bg-gray-50,
.bg-gray-100 {
  background-color: var(--brand-card-bg) !important;
}

/* Card styling */
.bg-neutral-900,
.bg-neutral-800 {
  background-color: var(--brand-card-bg) !important;
  border-color: var(--brand-border) !important;
}

/* Header override */
header {
  background-color: var(--brand-bg) !important;
  border-bottom-color: var(--brand-border) !important;
}

/* Make sure text is readable */
.text-neutral-200,
.text-neutral-300,
.text-white {
  color: var(--brand-primary) !important;
}

.text-neutral-400,
.text-neutral-500 {
  color: var(--brand-secondary) !important;
}

/* Accent color overrides */
.text-amber-400,
.text-amber-500 {
  color: var(--brand-accent) !important;
}

.bg-amber-500,
.bg-amber-600 {
  background-color: var(--brand-accent) !important;
}

/* Border styling */
.border-neutral-700,
.border-neutral-800,
.border-gray-700 {
  border-color: var(--brand-border) !important;
}

/* Ensure proper contrast */
a {
  color: var(--brand-accent);
}

a:hover {
  color: #fbbf24;
}