@import url('https://fonts.googleapis.com/css2?family=Syne:wght@400;500;600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@400;500;600;700&display=swap');

:root {
    --font-primary: 'Outfit', sans-serif;
    --font-secondary: 'Syne', sans-serif;
}

:root {
    color-scheme: light dark;

    --sidebar-width: 285px;
    --navbar-height: 74px;
}

:root {
    --zindex-notifications:10;
    --zindex-nav:9;
    --zindex-elements-front:8;
    --zindex-elements-back:7;
}
:root {
  --bg-nav: #171718;
  --bg-hover: rgba(255, 255, 255, 0.05);

  --accent: #487ffa !important;
  /* azul elétrico */
  --accent-glow: rgba(59, 130, 246, 0.25);
  --accent-dim: rgba(59, 130, 246, 0.12);



  --border: rgba(255, 255, 255, 0.07) !important;
  --border-accent: rgba(59, 130, 246, 0.35);

  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;

  --color-input-dark: #232330;

  --nav-h: var(--navbar-height);

  --transition: 0.2s ease;

  
  --text-primary: #171718;
  --text-secondary: #8b909e;
  --text-muted: #26262b;

  --color-black: #111318;
  --color-dark: #26262b;
  --color-dark-soft: #81818a;
  --color-white: #ffffff;
  --color-warning: #ffbd59;
  --color-error: #f8341b;
  --color-sucess: #10b981;
  --color-purple: #7625ac;
  --color-nexa: #487ffa;
  --color-graylight:#e1e6ee;
  --color-gray:#e4ebee;
}