@import url("https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,400;0,600;0,700;0,800;1,800&family=JetBrains+Mono:wght@400;600;800&display=swap");

body {
  font-family: "Plus Jakarta Sans", sans-serif;
}

code,
kbd,
pre,
.font-mono {
  font-family: "JetBrains Mono", monospace;
}

.btn-brutal {
  transition: all 0.15s ease-in-out;
}

.btn-brutal:hover {
  transform: translate(-2px, -2px);
  box-shadow: 6px 6px 0px 0px #0f172a;
}

.dark .btn-brutal:hover {
  box-shadow: 6px 6px 0px 0px #f8fafc;
}

.btn-brutal:active {
  transform: translate(2px, 2px);
  box-shadow: 2px 2px 0px 0px #0f172a;
}

.dark .btn-brutal:active {
  box-shadow: 2px 2px 0px 0px #34d399;
}

.card-brutal {
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease;
}

.card-brutal:hover {
  transform: translateY(-4px);
  box-shadow: 8px 8px 0px 0px #0f172a;
}

.dark .card-brutal:hover {
  box-shadow: 8px 8px 0px 0px #f8fafc;
}

::-webkit-scrollbar {
  width: 10px;
}

::-webkit-scrollbar-track {
  background: #f8fafc;
}

.dark ::-webkit-scrollbar-track {
  background: #0f172a;
}

::-webkit-scrollbar-thumb {
  background: #0f172a;
  border-radius: 4px;
}

.dark ::-webkit-scrollbar-thumb {
  background: #34d399;
}