:root {
  /* Identidade oficial da marca */
  --color-primary: #fb6529;
  --color-primary-dark: #d9490f;
  --color-primary-soft: #ffe1d1;
  --color-secondary: #163b5e;
  --color-secondary-light: #24578a;
  --color-secondary-soft: #dde6ee;
  /* Para texto (links, abas ativas etc.) sobre o fundo da própria página —
     precisa clarear no dark mode, senão fica azul-marinho em cima de quase
     preto. Já --color-secondary continua marinho nos dois temas quando é
     usado como FUNDO (painéis, cards), o que é o efeito certo ali. */
  --color-secondary-text: #163b5e;
  --color-success: #047857;
  --color-danger: #dc2626;
  --color-warning: #fb6529;
  /* Tinta escura fixa para texto sobre laranja/âmbar — não muda no dark
     mode, porque o fundo do acento continua claro nos dois temas. */
  --color-ink-on-accent: #182620;

  /* Tons pastel rotativos para ícones de categoria (grade de serviços) */
  --tint-a-bg: #dde6ee;
  --tint-a-fg: #163b5e;
  --tint-b-bg: #ffe1d1;
  --tint-b-fg: #d9490f;
  --tint-c-bg: #fde0d9;
  --tint-c-fg: #c23b1f;
  --tint-d-bg: #e2f0d9;
  --tint-d-fg: #3f7d1f;

  /* Tema claro (padrão) */
  --color-bg: #fdf6ea;
  --color-surface: #ffffff;
  --color-text: #182620;
  --color-text-muted: #6e7b73;
  --color-border: #ece2cc;

  /* Espaçamento */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;

  /* Raio e sombra */
  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 22px;
  --radius-pill: 999px;
  --shadow-sm: 0 2px 6px rgba(15, 26, 43, 0.08);
  --shadow-md: 0 8px 24px rgba(15, 26, 43, 0.12);

  /* Tipografia */
  --font-family-base: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}

:root[data-theme="dark"] {
  --color-bg: #0f1a2b;
  --color-surface: #17233a;
  --color-text: #f3efe4;
  --color-text-muted: #a3aec2;
  --color-border: #2a3854;
  --color-primary-soft: #4a2311;
  --color-secondary-soft: #1b3450;
  --color-secondary-text: #7fabd6;
  --tint-a-bg: #1b3450;
  --tint-a-fg: #7fabd6;
  --tint-b-bg: #4a2311;
  --tint-b-fg: #ff9d6e;
  --tint-c-bg: #451f16;
  --tint-c-fg: #ff8a6b;
  --tint-d-bg: #23361a;
  --tint-d-fg: #94d76a;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --color-bg: #0f1a2b;
    --color-surface: #17233a;
    --color-text: #f3efe4;
    --color-text-muted: #a3aec2;
    --color-border: #2a3854;
    --color-primary-soft: #4a2311;
    --color-secondary-soft: #1b3450;
    --color-secondary-text: #7fabd6;
    --tint-a-bg: #1b3450;
    --tint-a-fg: #7fabd6;
    --tint-b-bg: #4a2311;
    --tint-b-fg: #ff9d6e;
    --tint-c-bg: #451f16;
    --tint-c-fg: #ff8a6b;
    --tint-d-bg: #23361a;
    --tint-d-fg: #94d76a;
  }
}