/* Westland theme: dusk over a dark plain, blueprint grid, amber accents */
@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@500;700&family=Inter:wght@400;500;600&display=swap');

:root {
  --wl-bg: #0e0c0a;
  --wl-card: rgba(28, 24, 20, 0.72);
  --wl-card-hover: rgba(40, 33, 26, 0.85);
  --wl-line: rgba(255, 214, 170, 0.08);
  --wl-amber: #f59e0b;
  --wl-ember: #ea580c;
  --wl-text: #f5ede3;
  --wl-muted: #a8998a;
}

body {
  font-family: 'Inter', system-ui, sans-serif !important;
  color: var(--wl-text);
  background:
    radial-gradient(1100px 520px at 50% -12%, rgba(245, 158, 11, 0.22), transparent 65%),
    radial-gradient(800px 420px at 100% 110%, rgba(234, 88, 12, 0.14), transparent 60%),
    linear-gradient(var(--wl-line) 1px, transparent 1px) 0 0 / 44px 44px,
    linear-gradient(90deg, var(--wl-line) 1px, transparent 1px) 0 0 / 44px 44px,
    var(--wl-bg) !important;
  background-attachment: fixed !important;
}
#page_wrapper, #page_container { background: transparent !important; }

/* Top bar */
#information-widgets {
  background: rgba(20, 17, 14, 0.6);
  border: 1px solid rgba(245, 158, 11, 0.15);
  border-radius: 12px;
  backdrop-filter: blur(6px);
}
#information-widgets .greeting, #information-widgets [class*="text-4xl"], #information-widgets [class*="text-xl"] {
  font-family: 'JetBrains Mono', monospace !important;
  font-weight: 700;
  letter-spacing: -0.01em;
}

/* Section headings: mono, amber, with a rule */
.service-group-name {
  font-family: 'JetBrains Mono', monospace !important;
  font-size: 0.8rem !important;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--wl-amber) !important;
}
.service-group-icon { color: var(--wl-amber) !important; }

/* Cards */
.service-card {
  background: var(--wl-card) !important;
  border: 1px solid rgba(255, 214, 170, 0.07);
  border-radius: 10px !important;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.03) inset, 0 8px 24px -16px rgba(0, 0, 0, 0.8);
  transition: transform 0.15s ease, border-color 0.15s ease, background 0.15s ease;
}
.service-card:hover {
  transform: translateY(-2px);
  background: var(--wl-card-hover) !important;
  border-color: rgba(245, 158, 11, 0.5);
}
.service-name { font-weight: 600; color: var(--wl-text) !important; }
.service-description { color: var(--wl-muted) !important; line-height: 1.35; }

/* Widget value blocks inside cards */
.service-block {
  background: rgba(245, 158, 11, 0.06) !important;
  border-radius: 6px;
}

/* Chart lines/fills take the accent */
.service-card .recharts-area-curve, .service-card .recharts-line-curve { stroke: var(--wl-amber) !important; }
.service-card .recharts-area-area { fill: rgba(245, 158, 11, 0.18) !important; }

/* Status dots */
.status-dot, [class*="bg-emerald-500"] { box-shadow: 0 0 8px rgba(16, 185, 129, 0.6); }

/* Links and focus */
a:focus-visible { outline: 2px solid var(--wl-amber); outline-offset: 2px; }
::selection { background: rgba(245, 158, 11, 0.35); }