/* ==========================================================================
   Lightning Drones — design tokens (§10.1)

   Option A: light staff app + portal on the confirmed #27a776 brand green, with
   the marketing site staying dark. Dense data tables, 42-row matrix forms and
   long findings lists read materially better on a light surface, and the PDF
   deliverables are light anyway.

   Severity colours are the single source of truth: mirror them in
   static/js/charts.js as SEVERITY_COLORS and in static/css/print.css.
   ========================================================================== */

:root {
  /* Brand — confirmed from the legacy public/css/newmain.css */
  --ld-primary:        #27a776;   /* the brand green */
  --ld-primary-dark:   #1e8259;
  --ld-primary-soft:   #e6f5ef;
  --ld-accent:         #27a776;

  /* Severity — used in badges, charts and the PDF. Single source of truth. */
  --ld-sev-none:       #6c757d;
  --ld-sev-low:        #0dcaf0;
  --ld-sev-medium:     #ffc107;
  --ld-sev-high:       #dc3545;

  /* Surfaces */
  --ld-bg:             #f6f8fb;
  --ld-surface:        #ffffff;
  --ld-border:         #e4e8ef;
  --ld-text:           #1c2434;
  --ld-text-muted:     #6b7688;

  /* Elevation — restrained; two levels only */
  --ld-shadow-sm:      0 1px 2px rgba(16, 24, 40, .05);
  --ld-shadow-md:      0 4px 16px rgba(16, 24, 40, .08);

  /* Geometry */
  --ld-radius:         10px;
  --ld-radius-lg:      14px;

  /* Motion — "smooth finish" means restrained and consistent, not decorative */
  --ld-transition:     180ms cubic-bezier(.4, 0, .2, 1);

  /* Layout */
  --ld-sidebar-w:      256px;
  --ld-sidebar-rail:   64px;
  --ld-content-max:    1440px;

  /* Bootstrap overrides */
  --bs-primary:        var(--ld-primary);
  --bs-body-color:     var(--ld-text);
  --bs-body-bg:        var(--ld-bg);
  --bs-border-color:   var(--ld-border);
  --bs-border-radius:  var(--ld-radius);
}

/* --- Dark marketing shell: the public site keeps its original treatment --- */
.ld-public {
  --ld-bg:             #000000;
  --ld-surface:        #1a1a1a;
  --ld-text:           #fafafa;
  --ld-text-muted:     #b5b5b5;
  --ld-border:         #2a2a2a;
}

/* --- Base ---------------------------------------------------------------- */
body {
  background: var(--ld-bg);
  color: var(--ld-text);
  /* Inter throughout the app shell: Cardo is a serif display face and is wrong
     for dense UI, and three families in a data application costs more than it
     gives (§10.1). */
  font-family: Inter, "Segoe UI", system-ui, -apple-system, sans-serif;
  font-size: 14px;
  line-height: 1.55;
}

/* Figures must align in every data column. */
.ld-num,
td.ld-num,
th.ld-num {
  font-variant-numeric: tabular-nums;
  text-align: right;
}

/* --- Severity badges ----------------------------------------------------- */
.ld-sev { border-radius: 999px; font-size: .75rem; font-weight: 600; padding: .2em .65em; }
.ld-sev--none   { background: var(--ld-sev-none);   color: #fff; }
.ld-sev--low    { background: var(--ld-sev-low);    color: #05343d; }
.ld-sev--medium { background: var(--ld-sev-medium); color: #3d2f00; }
.ld-sev--high   { background: var(--ld-sev-high);   color: #fff; }

/* --- Surfaces ------------------------------------------------------------ */
.ld-card {
  background: var(--ld-surface);
  border: 1px solid var(--ld-border);
  border-radius: var(--ld-radius);
  box-shadow: var(--ld-shadow-sm);
  transition: box-shadow var(--ld-transition);
}

.ld-card:hover { box-shadow: var(--ld-shadow-md); }

/* Respect a reduced-motion preference throughout (§10.6). */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: .01ms !important;
    transition-duration: .01ms !important;
  }
}