/* ============================================
   HERMES EXACT COLOR OVERRIDE
   Source: Hermes Dashboard CSS variables
   ============================================ */

:root {
  --background: #041c1c;
  --background-base: #041c1c;
  --foreground: #ffe6cb;
  --foreground-base: #ffe6cb;
  --midground: #ffe6cb;
  --midground-base: #ffe6cb;
  --warm-glow: #ffbd3859;
  --color-accent: #ffac02;
  --color-accent-foreground: #041c1c;
}

html, body {
  background-color: #041c1c !important;
  color: #ffe6cb !important;
}

/* Override any white/light backgrounds */
body, [class*="bg-"], [class*="background"] {
  background-color: #041c1c !important;
}

/* Text colors */
* {
  color: inherit;
}

/* Specific element overrides */
.bg-background, .bg-background-base {
  background-color: #041c1c !important;
}

.text-foreground, .text-midground, .text-\[\#ffe6cb\], .text-\[var\(--midground\)\] {
  color: #ffe6cb !important;
}

.text-primary {
  color: #ffe6cb !important;
}

/* Orange accent for key highlights (#ffac02) */
.text-amber-500, .text-amber-300, .bg-amber- {
  color: #ffac02 !important;
}

/* Cards/surfaces */
.bg-card, .bg-card\/50, .card {
  background-color: rgba(255,255,255,0.03) !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
}

/* Borders */
.border, .border-border {
  border-color: rgba(255,255,255,0.08) !important;
}

/* Button hover glow - THE KEY HERMES EFFECT */
button:hover, .btn:hover, [role="button"]:hover {
  box-shadow: 0 0 20px rgba(255, 188, 56, 0.35), 0 0 40px rgba(255, 188, 56, 0.15) !important;
  border-color: rgba(255, 188, 56, 0.5) !important;
}

/* Specific amber glow color */
button:hover, .btn:hover {
  --tw-shadow-color: rgba(255, 188, 56, 0.35) !important;
}

/* Warm glow for highlights */
.shadow, [class*="shadow-"] {
  --tw-shadow-color: rgba(0,0,0,0.3) !important;
}

/* Override any light surfaces */
[class*="bg-white"], [class*="bg-gray"], [class*="bg-slate"] {
  background-color: rgba(255,255,255,0.04) !important;
}

/* Table rows */
tbody tr {
  background-color: rgba(255,255,255,0.02);
  border-bottom: 1px solid rgba(255,255,255,0.05);
}

tbody tr:hover {
  background-color: rgba(255,255,255,0.04);
}