/* ReeferGuard - overrides minimos sobre Tailwind CDN */

:root {
  --rg-bg: #0f172a;
  --rg-panel: #1e293b;
  --rg-text: #e2e8f0;
  --rg-muted: #64748b;
  --rg-ok: #22c55e;
  --rg-warn: #f59e0b;
  --rg-crit: #ef4444;
  --rg-info: #38bdf8;
}

html, body { height: 100%; }
body {
  background: var(--rg-bg);
  color: var(--rg-text);
  font-family: -apple-system, 'Segoe UI', Roboto, Ubuntu, sans-serif;
}

.rg-card {
  background: var(--rg-panel);
  border: 1px solid rgba(255,255,255,0.05);
  border-radius: 0.75rem;
}

.rg-badge {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 9999px;
  font-size: 11px;
  font-weight: 600;
  text-transform: uppercase;
}
.rg-badge-ok   { background: rgba(34,197,94,0.15);  color: var(--rg-ok); }
.rg-badge-warn { background: rgba(245,158,11,0.15); color: var(--rg-warn); }
.rg-badge-crit { background: rgba(239,68,68,0.15);  color: var(--rg-crit); }
.rg-badge-off  { background: rgba(100,116,139,0.2); color: var(--rg-muted); }

.rg-temp {
  font-variant-numeric: tabular-nums;
  font-weight: 700;
}

/* Toasts */
#rg-toasts {
  position: fixed; top: 1rem; right: 1rem; z-index: 50;
  display: flex; flex-direction: column; gap: 0.5rem;
}
.rg-toast {
  background: var(--rg-panel);
  color: var(--rg-text);
  padding: 10px 14px;
  border-radius: 8px;
  border-left: 4px solid var(--rg-info);
  box-shadow: 0 4px 12px rgba(0,0,0,0.3);
  min-width: 240px;
  animation: rg-slide-in 0.2s ease-out;
}
.rg-toast.ok   { border-left-color: var(--rg-ok); }
.rg-toast.warn { border-left-color: var(--rg-warn); }
.rg-toast.err  { border-left-color: var(--rg-crit); }

@keyframes rg-slide-in {
  from { transform: translateX(20px); opacity: 0; }
  to   { transform: translateX(0);    opacity: 1; }
}

/* Sparkline */
.rg-spark { height: 32px; width: 100%; }
.rg-spark path { fill: none; stroke: currentColor; stroke-width: 1.5; }