@import 'tailwindcss';
@import './assets/styles.css';
@import './index.css';
@import '@kevisual/components/theme/wind-theme.css';

h1 {
  @apply text-2xl font-bold;
}
h2 {
  @apply text-xl font-bold;
}
h3 {
  @apply text-lg font-bold;
}
@utility card {
  @apply bg-white shadow-md rounded-lg p-4;
}
@utility card-title {
  @apply text-lg font-bold;
}
@utility card-subtitle {
  @apply text-sm ;
}
@utility card-description {
  @apply break-words;
}
@utility card-code {
  @apply bg-gray-100 p-2;
}
@utility card-body {
  @apply p-2;
}
@utility card-key {
  @apply text-xs;
}
@utility card-footer {
  @apply text-sm text-gray-500;
}
@utility btn {
  @apply bg-blue-500 text-white font-bold py-2 px-4 rounded-sm;
}

@utility layout-menu {
  @apply bg-secondary p-2 text-white flex justify-between h-12;
  -webkit-app-region: drag;
}
@utility no-drag {
  -webkit-app-region: no-drag;
}
@utility bg-custom-blue {
  background-color: #3490dc;
}

@utility scrollbar-hidden {
  &::-webkit-scrollbar {
    display: none;
  }
}

.cm-editor {
  @apply h-full;
}
.cm-scroller {
  @apply scrollbar;
}
#for-message {
  z-index: 9999 !important;
}