cc-switch/src/index.css

/* 引入 Tailwind v4 内建样式与工具 */
@import "tailwindcss";

/* 覆盖 Tailwind v4 默认的 dark 变体为“类选择器”模式 */
@custom-variant dark (&:where(.dark, .dark *));

/* 全局基础样式 */
* {
  box-sizing: border-box;
}

html {
  @apply font-sans antialiased;
  line-height: 1.5;
  /* 让原生控件与滚动条随主题切换配色 */
  color-scheme: light;
}

body {
  @apply m-0 p-0 bg-gray-50 text-gray-900 text-sm dark:bg-gray-950 dark:text-gray-100;
}

/* 暗色模式下启用暗色原生控件/滚动条配色 */
html.dark { color-scheme: dark; }

/* 滚动条样式 */
::-webkit-scrollbar {
  @apply w-1.5 h-1.5;
}

::-webkit-scrollbar-track {
  @apply bg-gray-100 dark:bg-gray-800;
}

::-webkit-scrollbar-thumb {
  @apply bg-gray-300 rounded dark:bg-gray-600;
}

::-webkit-scrollbar-thumb:hover {
  @apply bg-gray-400 dark:bg-gray-500;
}

/* 焦点样式 */
*:focus-visible {
  @apply outline-2 outline-blue-500 outline-offset-2;
}