/* ════════════════════════════════════════════════════════════
   Grafana Dark Theme — CSS Custom Properties
   Colours taken directly from Grafana's dark theme source
   ════════════════════════════════════════════════════════════ */

:root {
  /* Canvas */
  --bg-canvas:       #1E273D;
  --bg-primary:      #1E273D;
  --bg-secondary:    #334268;

  /* Borders */
  --border-weak:     rgba(204, 204, 220, 0.07);
  --border-medium:   rgba(204, 204, 220, 0.15);
  --border-strong:   rgba(204, 204, 220, 0.25);
  --border-selected: #57b9f2;

  /* Text */
  --text-primary:    #ffffff;
  --text-secondary:  #d8dadd;
  --text-disabled:   #999ca3;
  --text-link:       #5794f2;

  /* Brand / action colours */
  --brand-primary:   #3d71d9;
  --brand-accent:    #1f60c4;

  /* Semantic colours — Grafana named palette */
  --c-green:         #73bf69;
  --c-green-light:   #96d98d;
  --c-green-dark:    #37872d;
  --c-red:           #f2495c;
  --c-red-dark:      #c4162a;
  --c-orange:        #ff9830;
  --c-orange-light:  #ffb357;
  --c-blue:          #5794f2;
  --c-blue-light:    #c0d8ff;
  --c-sky:           #81d4fa;
  --c-yellow:        #fade2a;

  /* Cell backgrounds (stat panel colorMode:"background") */
  --cell-green-bg:   #19401a;
  --cell-green-text: #73bf69;
  --cell-blue-bg:    #1c3562;
  --cell-blue-text:  #5794f2;
  --cell-gray-bg:    #2e2e2e;
  --cell-gray-text:  #9e9e9e;
  --cell-red-bg:     #471918;
  --cell-red-text:   #f2495c;

  /* Spacing */
  --gap:   8px;
  --r:     2px;   /* Grafana uses very small border-radius */
  --r-lg:  8px;

  /* Form label (Volkovlabs) */
  --label-bg: #1f60c4;
}

/* ── Reset ──────────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html { font-size: 14px; }

body {
  background: var(--bg-canvas);
  color: var(--text-primary);
  font-family: Inter, 'Roboto', 'Helvetica Neue', sans-serif;
  font-size: 14px;
  line-height: 1.5;
  min-height: 100vh;
}

a { color: var(--text-link); text-decoration: none; }
a:hover { text-decoration: underline; }

/* Scrollbar (optional cosmetic tweak) */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: var(--bg-secondary); }
::-webkit-scrollbar-thumb { background: #444; border-radius: 4px; }