:root {
  --color-navy-900: #101322;
  --color-navy-800: #171B2D;

  --color-gold-500: #D1AD65;
  --color-gold-400: #EDC974;
  --color-gold-600: #AA8F5D;

  --color-ivory-50: #FAF9F6;
  --color-graphite-800: #252936;
  --color-gray-600: #686A73;

  --color-background: var(--color-ivory-50);
  --color-surface-dark: var(--color-navy-900);
  --color-surface-darker: var(--color-navy-800);
  --color-text-primary: var(--color-graphite-800);
  --color-text-secondary: var(--color-gray-600);
  --color-accent: var(--color-gold-500);
}

/* Background utilities */
.bg-surface-dark { background-color: var(--color-surface-dark) !important; }
.bg-surface-darker { background-color: var(--color-surface-darker) !important; }
.bg-background { background-color: var(--color-background) !important; }
.bg-accent { background-color: var(--color-accent) !important; }

/* Text utilities */
.text-primary { color: var(--color-text-primary) !important; }
.text-secondary { color: var(--color-text-secondary) !important; }
.text-accent { color: var(--color-accent) !important; }
.text-ivory { color: var(--color-ivory-50) !important; }

/* Border utilities */
.border-accent { border-color: var(--color-accent) !important; }
.border-accent-dark { border-color: var(--color-gold-600) !important; }
.border-neutral-light { border-color: rgba(37, 41, 54, 0.15) !important; }
.border-surface-dark { border-color: var(--color-surface-dark) !important; }

/* Hover utilities */
.hover\:bg-accent-hover:hover { background-color: var(--color-gold-400) !important; }
.hover\:bg-surface-darker-hover:hover { background-color: var(--color-surface-darker) !important; }
.hover\:text-accent-hover:hover { color: var(--color-gold-400) !important; }
.hover\:border-accent-hover:hover { border-color: var(--color-gold-400) !important; }

/* Special Gradient Adaptations for dark mode */
.bg-gradient-to-b.lg\:from-black\/70 {
  background-image: linear-gradient(to bottom, rgba(16, 19, 34, 0.7), transparent) !important;
}
.bg-gradient-to-t.from-black\/45 {
  background-image: linear-gradient(to top, rgba(16, 19, 34, 0.45), transparent, rgba(16, 19, 34, 0.2)) !important;
}
.bg-gradient-to-t.from-black\/80 {
  background-image: linear-gradient(to top, rgba(16, 19, 34, 0.8), rgba(16, 19, 34, 0.3), transparent) !important;
}

/* SVG and Icon interactions */
.stroke-accent { stroke: var(--color-accent) !important; }
.fill-accent { fill: var(--color-accent) !important; }

/* Override JS-injected background classes */
.bg-black { background-color: var(--color-surface-dark) !important; }