{
  :root {
    /* Inverted color scheme */
    --body-background-color: #FFFFFF; /* White background */
    --body-text-color: #073b4c; /* Dark teal text */
    --card-background-color: #F5F8FA; /* Light gray card backgrounds for distinction */
    --card-border-color: #E1E8ED; /* Light border for cards */
    
    /* Navigation */
    --nav-background-color: #073b4c; /* Keep dark teal for nav */
    --nav-border-bottom-color: #00E676; /* Bright green accent */
    --nav-text-color: #FFFFFF; /* Keep white text for nav only */
    
    /* Status indicators */
    --up-border-left-color: #33C759; /* Green for "up" */
    --up-background-color: rgba(51, 199, 89, 0.1); /* Light green background */
    --up-text-color: #33C759; /* Green text */
    
    --degraded-border-left-color: #FF9500; /* Orange for "degraded" */
    --degraded-background-color: rgba(255, 149, 0, 0.1); /* Light orange background */
    --degraded-text-color: #FF9500; /* Orange text */
    
    --down-border-left-color: #FF3B30; /* Red for "down" */
    --down-background-color: rgba(255, 59, 48, 0.1); /* Light red background */
    --down-text-color: #FF3B30; /* Red text */
  }

  /* Graph colors */
  .graph-wrapper svg .fill-current {
    fill: #33C759 !important;
  }

  .graph-wrapper svg .stroke-current {
    stroke: #33C759 !important;
  }

  .graph path {
    stroke: #33C759 !important;
  }
}