@tailwind base;
@tailwind components;
@tailwind utilities;
@import url("../styles/theme.css");
body {
  font-family: "Inter", sans-serif;
}
@layer utilities {
  .flex-center {
    @apply flex justify-center items-center;
  }
  .flex-between {
    @apply flex justify-between items-center;
  }
  .flex-start {
    @apply flex justify-start items-center;
  }
  .card-wrapper {
    @apply bg-light-900 dark:dark-gradient shadow-light-100 dark:shadow-dark-100;
  }
  .btn {
    @apply bg-light-800 dark:bg-dark-300 !important;
  }
  .btn-secondary {
    @apply bg-light-800 dark:bg-dark-400 !important;
  }
  .btn-tertiary {
    @apply bg-light-700 dark:bg-dark-300 !important;
  }
  .markdown {
    @apply max-w-full prose dark:prose-p:text-light-700 dark:prose-ol:text-light-700 dark:prose-ul:text-light-500 dark:prose-strong:text-white dark:prose-headings:text-white prose-headings:text-dark-400 prose-h1:text-dark-300 prose-h2:text-dark-300 prose-p:text-dark-500 prose-ul:text-dark-500 prose-ol:text-dark-500;
  }
  .primary-gradient {
    background: linear-gradient(129deg, #ff7000 0%, #e2995f 100%);
  }
  .dark-gradient {
    background: linear-gradient(
      232deg,
      rgba(23, 28, 35, 0.41) 0%,
      rgba(19, 22, 28, 0.7) 100%
    );
  }
  .tab {
    @apply min-h-full dark:bg-dark-400 bg-light-800 text-light-500 dark:data-[state=active]:bg-dark-300 data-[state=active]:bg-primary-100 data-[state=active]:text-primary-500 !important;
  }
}
.no-focus {
  @apply focus-visible:ring-0 focus-visible:ring-transparent focus-visible:ring-offset-0 !important;
}
.active-theme {
  filter: invert(53%) sepia(98%) saturate(3332%) hue-rotate(0deg)
    brightness(104%) contrast(106%) !important;
}
.light-gradient {
  background: linear-gradient(
    132deg,
    rgba(247, 249, 255, 0.5) 0%,
    rgba(229, 237, 255, 0.25) 100%
  );
}
.primary-text-gradient {
  background: linear-gradient(129deg, #ff7000 0%, #e2995f 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.custom-scrollbar::-webkit-scrollbar {
  width: 3px;
  height: 3px;
  border-radius: 2px;
}
.custom-scrollbar::-webkit-scrollbar-track {
  background: #ffffff;
}
.custom-scrollbar::-webkit-scrollbar-thumb {
  background: #888;
  border-radius: 50px;
}
.custom-scrollbar::-webkit-scrollbar-thumb:hover {
  background: #555;
}
/* Markdown Start */
.markdown a {
  color: #1da1f2;
}
.markdown a,
code {
  /* These are technically the same, but use both */
  overflow-wrap: break-word;
  word-wrap: break-word;
  -ms-word-break: break-all;
  /* This is the dangerous one in WebKit, as it breaks things whereve
word-break: break-all;
/* Instead use this non-standard one: */
  word-break: break-word;
  /* Adds a hyphen where the word breaks, if supported (No Blink) *
-ms-hyphens: auto;
-moz-hyphens: auto;
-webkit-hyphens: auto;
hyphens: auto;
padding: 2px;
color: #ff7000 !important;
}
.markdown pre {
display: grid;
width: 100%;
}
.markdown pre code {
width: 100%;
display: block;
overflow-x: auto;
color: inherit !important;
}
/* Markdown End */
  /* Clerk */
  .cl-internal-b3fm6y {
    background: linear-gradient(129deg, #ff7000 0%, #e2995f 100%);
  }
  .hash-span {
    margin-top: -140px;
    padding-bottom: 140px;
    display: block;
  }
  /* Hide scrollbar for Chrome, Safari and Opera */
  .no-scrollbar::-webkit-scrollbar {
    display: none;
  }
  /* Hide scrollbar for IE, Edge and Firefox */
  .no-scrollbar {
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none; /* Firefox */
  }
}
