/* NutriPanel — Clean Apple Health & MyFitnessPal Design System */
:root {
  color-scheme: dark;

  /* Superfícies & Fundo Neutro Estilo Apple */
  --canvas: #090a0d;
  --canvas-surface: #141519;
  --canvas-frosted: #18191e;
  --paper: #090a0d;
  
  --card: #141519;
  --card-hover: #191b21;
  --card-border: rgba(255, 255, 255, 0.08);
  --card-border-hover: rgba(255, 255, 255, 0.16);

  /* Linhas e separadores limpos (hairline) */
  --line: rgba(255, 255, 255, 0.08);
  --line-strong: rgba(255, 255, 255, 0.14);
  --hairline: rgba(255, 255, 255, 0.06);
  --divider-soft: rgba(255, 255, 255, 0.05);

  /* Tipografia & Contraste Legível */
  --ink: #f2f2f7;
  --ink-strong: #ffffff;
  --ink-2: #d1d1d6;
  --muted: #8e8e93;
  --muted-dark: #636366;

  /* Cores de Ação Estilo Apple / MyFitnessPal */
  --primary: #0a84ff;
  --primary-hover: #0071e3;
  --on-primary: #ffffff;

  /* Macronutrientes Semânticos (Apple Activity Palette) */
  --m-calories: #ff453a;
  --m-calories-text: #ff453a;
  --m-protein: #ff9f0a;
  --m-protein-text: #ff9f0a;
  --m-carbs: #30b0c7;
  --m-carbs-text: #30b0c7;
  --m-fat: #bf5af2;
  --m-fat-text: #bf5af2;
  --m-fiber: #30d158;
  --m-fiber-text: #30d158;

  /* Status e Sensores */
  --good: #30d158;
  --warning: #ff9f0a;
  --critical: #ff453a;
  --strava: #fc4c02;
  --mifitness: #ff6900;
  --okok: #0a84ff;

  /* Sombras Naturais com Offset Vertical (Sem halos artificiais de IA) */
  --shadow-1: 0 2px 8px rgba(0, 0, 0, 0.35);
  --shadow-2: 0 8px 24px rgba(0, 0, 0, 0.5);

  /* Raios de Borda Apple */
  --r-sm: 8px;
  --r-md: 12px;
  --r: 16px;
  --r-lg: 20px;
  --pill: 9999px;

  /* Micro-interação */
  --press: scale(0.98);

  /* Tipografia Limpa */
  --font-display: -apple-system, BlinkMacSystemFont, "SF Pro Display", "Plus Jakarta Sans", "Outfit", sans-serif;
  --font-body: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Plus Jakarta Sans", "Outfit", sans-serif;
  --font-mono: "JetBrains Mono", monospace;
}

* {
  box-sizing: border-box;
}

html, body {
  margin: 0;
  padding: 0;
  background-color: var(--canvas);
  color: var(--ink);
  font-family: var(--font-body);
  font-size: 15px;
  line-height: 1.5;
  letter-spacing: -0.015em;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

::selection {
  background: rgba(10, 132, 255, 0.3);
  color: #ffffff;
}

h1, h2, h3, h4 {
  font-family: var(--font-display);
  font-weight: 700;
  color: var(--ink-strong);
  letter-spacing: -0.025em;
  margin: 0;
}

button, input, select, textarea {
  font-family: inherit;
  color: inherit;
  letter-spacing: inherit;
}

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

:focus-visible {
  outline: 2px solid var(--primary);
  outline-offset: 2px;
}