@import 'tailwindcss';

@layer components {
  .test-loading {
    @apply w-20 h-20 bg-gray-300 rounded-full animate-spin;
  }
}
:root {
  --scrollbar-color: #ffbf00;
  --primary-color: #ffc107;
  --secondary-color: #ffa000;
}
#root {
  width: 100%;
  height: 100%;
}
#ai-bot-root {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: -100px;
  z-index: 9999;
  pointer-events: none;
}

.scrollbar {
  scrollbar-width: thin;
  scrollbar-color: var(--scrollbar-color) #fff;
}

.scrollbar::-webkit-scrollbar {
  height: 4px;
  width: 4px;
}

.scrollbar::-webkit-scrollbar-thumb {
  background-color: var(--scrollbar-color);
  border-radius: 10px;
}

.scrollbar::-webkit-scrollbar-track {
  background: #fff;
}

.ant-select-outlined.ant-select-multiple .ant-select-selection-item {
  background: var(--secondary-color);
  color: white;
  svg {
    color: white;
  }
}
.ant-select-selection-item {
  color: var(--primary-color);
}
.ant-select {
  .ant-select-arrow {
    display: none !important;
  }
}
.ant-picker-input {
  .ant-picker-suffix,
  .ant-picker-clear {
    color: var(--primary-color);
  }
}