/* 林霏精准复习助手 — 自定义样式
   框架文档 17.2 节 — 颜色体系：所有颜色值对齐文档定义
   框架文档 17.3 节 — 组件复用：color-dot 颜色圆点
*/

/* ── 页面基础 ────────────────────────────────────────── */
body {
    background-color: #F9FAFB;  /* bg-gray-50 */
    min-height: 100vh;
}

/* ── 颜色圆点组件（框架文档 17.3 color-dot） ──────── */
.color-dot {
    display: inline-block;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    flex-shrink: 0;
}
.color-dot.blue      { background-color: #3B82F6; }  /* blue-500 */
.color-dot.yellow    { background-color: #EAB308; }  /* yellow-500 */
.color-dot.orange    { background-color: #F97316; }  /* orange-500 */
.color-dot.red       { background-color: #EF4444; }  /* red-500 */
.color-dot.green     { background-color: #86EFAC; }  /* green-300 — 浅绿（观察期） */
.color-dot.dark-green{ background-color: #22C55E; }  /* green-500 — 深绿（已掌握） */
.color-dot.gray      { background-color: #9CA3AF; }  /* gray-400 — 待归类 */

/* ── 颜色文字类（旧兼容，保留 class 名但色值替换） ── */
.color-blue { color: #3B82F6; }
.color-gray { color: #9CA3AF; }
.color-red { color: #EF4444; }
.color-orange { color: #F97316; }
.color-yellow { color: #EAB308; }
.color-light-green { color: #86EFAC; }
.color-dark-green { color: #22C55E; }

/* ── 知识树 ──────────────────────────────────────────── */
.tree-node {
    padding: 6px 0;
    cursor: pointer;
}
.tree-node:hover {
    background-color: #F3F4F6;  /* bg-gray-100 */
    border-radius: 6px;
}
.tree-children {
    padding-left: 24px;
}

/* ── 加载动画 ────────────────────────────────────────── */
@keyframes spin {
    to { transform: rotate(360deg); }
}
.animate-spin {
    animation: spin 1s linear infinite;
}

/* ── 滚动条 ──────────────────────────────────────────── */
::-webkit-scrollbar {
    width: 6px;
}
::-webkit-scrollbar-track {
    background: transparent;
}
::-webkit-scrollbar-thumb {
    background-color: #D1D5DB;  /* gray-300 */
    border-radius: 3px;
}