/*
 * LL Mechanical — Global Styles
 * ============================================================
 * CSS resets, typography, and layout primitives shared across
 * all dashboards. Loaded after tokens.css in every page.
 *
 * DO NOT put dashboard-specific styles here.
 * Each dashboard's own styles.css handles its layout.
 * ============================================================
 */

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

html, body {
  height: 100%;
}

html {
  scroll-behavior: smooth;
}

/* --- Base typography --- */
body {
  font-family: var(--font-body);
  background: var(--bg-base);
  color: var(--text-primary);
  font-size: 14px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

button {
  font: inherit;
  cursor: pointer;
  border: none;
  background: none;
  color: inherit;
}

a {
  color: var(--copper);
  text-decoration: none;
  transition: color var(--transition);
}

a:hover {
  color: var(--copper-deep);
}

/* --- Utility classes --- */
.hidden   { display: none !important; }
.sr-only  { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); }

/* --- Status badge colors (used by all dashboards) --- */
.badge {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: var(--radius-sm);
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.badge-success  { background: var(--success-bg);  color: var(--success); }
.badge-warning  { background: var(--warning-bg);  color: var(--warning); }
.badge-danger   { background: var(--danger-bg);   color: var(--danger);  }
.badge-info     { background: var(--info-bg);     color: var(--text-secondary); }