/* Tokens Quarks — docs/quarks.styles.css */
:root {
  --primary: #004a98;
  --secondary: #a25eb5;
  --border: #e0e0e0;
  --background: #ffffff;
  --background-muted: #f8f8f8;
  --background-accent: #f0f0f0;
  --foreground: #1d1d1b;
  --white: #ffffff;
  --chart-1: #004a98;
  --chart-2: #a25eb5;
  /* Status — tema claro (mais vivos / legíveis) */
  --status-normal: #2aaa00;
  --status-lento: #e6b800;
  --status-muito-lento: #ff7a1a;
  --status-timeout: #ff3b30;
  --status-erro: #e11d48;
  --status-off: #9e9e9e;
  --gradient: linear-gradient(90deg, var(--primary) 0%, var(--secondary) 100%);
}

.dark {
  --primary: #a25eb5;
  --secondary: #004a98;
  --border: #3f3f3f;
  --background: #181818;
  --background-muted: #191919;
  --background-accent: #212124;
  --foreground: #ededed;
  --white: #ffffff;
  --chart-1: #a25eb5;
  --chart-2: #004a98;
  /* Status — tema escuro */
  --status-normal: #2e7d32;
  --status-lento: #c9a227;
  --status-muito-lento: #c45c26;
  --status-timeout: #c62828;
  --status-erro: #b71c1c;
  --status-off: #6b6b6b;
  --gradient: linear-gradient(90deg, var(--secondary) 0%, var(--primary) 100%);
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  padding: 0;
  min-height: 100%;
  min-height: 100dvh;
  background: var(--background);
  color: var(--foreground);
  font-family: "Poppins", sans-serif;
  font-size: 13px;
  overflow-x: hidden;
  -webkit-text-size-adjust: 100%;
}

@media (min-width: 768px) {
  html { font-size: 14px; }
}

@media (min-width: 1024px) {
  html { font-size: 15px; }
}