/* Variáveis de tema claro */

:root {
  --background-color: #ffffff;
  --text-color: #000000;
  --text-color2: #002397;
  --text-color-dark2: #666666;
  --primary-color: #569aff;
  --secondary-color: #257cff;
  --dark-secondary-color: #1c86ee;
  --skills-bg: #f5f5f5;
  --skills-text: #333333;
  --navbar-bg: #ffffff;
  --navbar-text: #000000;
  --light-tertiary-color: #f8f8f8;

  --font-family: 'DM Sans', sans-serif;
  --navbar-bg: var(--primary-color);
  --navbar-text: var(--white);
  --background-color: var(--white);
  --text-color: var(--text-color);
}

/* Variáveis de tema escuro */
[data-theme="dark"] {
  --background-color: #000000;
  --text-color: #ffffff;
  --text-color2: #ffffff;
  --text-color-dark2: #d3d3d3;
  --primary-color: #ff6347;
  --secondary-color: #1e90ff;
  --dark-secondary-color: #1c86ee;
  --skills-bg: #333333;
  --skills-text: #ffffff;
  --navbar-bg: #222222;
  --navbar-text: #ffffff;
  --light-tertiary-color: #444444;
}

/* Adiciona a cor azul claro específica para h1, h2 e h3 no dark mode */
[data-theme="dark"] h1,
[data-theme="dark"] h2,
[data-theme="dark"] h3 {
  color: #87CEFA;
}