/* ==========================================================================
   🌿 mulch2.live Forest Design System for Homepage Dashboard
   ========================================================================== */

:root {
  --theme-bg-canvas: #1E2933;
  --theme-bg-card: #2A3844;
  --theme-bg-card-hover: #344452;
  --theme-border: #3E5161;
  --theme-accent-sage: #749C75;
  --theme-accent-terracotta: #C76743;
  --theme-accent-ochre: #EAA43B;
  --theme-text-primary: #EAF0EC;
  --theme-text-muted: #9DAEB9;
}

body {
  background-color: var(--theme-bg-canvas) !important;
  color: var(--theme-text-primary) !important;
}

/* Service & Widget Cards */
.service-card, .widget-card, div[class*="rounded-lg"] {
  background-color: var(--theme-bg-card) !important;
  border: 1px solid var(--theme-border) !important;
  transition: transform 0.15s ease, border-color 0.2s ease, box-shadow 0.2s ease !important;
  border-radius: 12px !important;
}

.service-card:hover, div[class*="rounded-lg"]:hover {
  background-color: var(--theme-bg-card-hover) !important;
  border-color: var(--theme-accent-sage) !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.35) !important;
  transform: translateY(-2px);
}

/* Status dots & Accents */
.status-online, div[class*="bg-emerald-"], div[class*="bg-green-"] {
  background-color: var(--theme-accent-sage) !important;
  box-shadow: 0 0 8px rgba(116, 156, 117, 0.6) !important;
}

/* Header & Typography */
h1, h2, h3, .text-xl, .text-lg {
  color: var(--theme-text-primary) !important;
  letter-spacing: -0.01em;
}

.text-muted, .text-gray-400 {
  color: var(--theme-text-muted) !important;
}