/* ==================== 易算AI - 滚动条组件系统 ==================== */
/* 版本: 5.0.0 | 用途: 项目所有页面纵向滚动条样式的【唯一权威源】 */
/* 依赖: 无（完全独立，不依赖任何设计令牌或 CSS 变量） */
/* 视觉基准: 6px 细滚动条，淡主色 #1e9fff，默认半透明，hover 加深 */
/* 优先级: 全规则使用 !important，强制压制任何来源的滚动条样式 */
/* 维护规则: 严禁在其他 CSS / 模板内联 <style> 中重复定义滚动条相关规则 */

/* ==================== 全局滚动条（WebKit / Blink 内核） ==================== */
/* 适用浏览器: Chrome / Edge / Safari / Opera */
::-webkit-scrollbar {
    width: 6px !important;
    height: 6px !important;
    background: transparent !important;
}

::-webkit-scrollbar-track {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

::-webkit-scrollbar-thumb {
    background: rgba(30, 159, 255, 0.25) !important;
    border: none !important;
    border-radius: 9999px !important;
    box-shadow: none !important;
    transition: background 0.15s ease !important;
}

::-webkit-scrollbar-thumb:hover {
    background: rgba(30, 159, 255, 0.4) !important;
}

::-webkit-scrollbar-corner {
    background: transparent !important;
}

::-webkit-scrollbar-button {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
}

/* ==================== 全局滚动条（Firefox） ==================== */
html {
    scrollbar-color: rgba(30, 159, 255, 0.25) transparent !important;
    scrollbar-width: thin !important;
}

* {
    scrollbar-color: rgba(30, 159, 255, 0.25) transparent;
    scrollbar-width: thin;
}

/* ==================== 容器变体类 ==================== */
/* 隐藏滚动条 */
.scrollbar-hidden {
    -ms-overflow-style: none !important;
    scrollbar-width: none !important;
}

.scrollbar-hidden::-webkit-scrollbar {
    display: none !important;
    width: 0 !important;
    height: 0 !important;
}

/* ==================== 显式滚动容器变体（更醒目） ==================== */
/* 适用类名（已固化）: .content-area / .records-area / .scroll-container / .chat-scroll
   适用场景: 页面主滚动容器，需要默认可见、hover 加深的滚动条
   视觉基准: 8px 宽度，主色 #1e9fff @ 50%（默认）→ @ 70%（hover） */

.content-area::-webkit-scrollbar,
.records-area::-webkit-scrollbar,
.scroll-container::-webkit-scrollbar,
.chat-scroll::-webkit-scrollbar {
    width: 8px !important;
    height: 8px !important;
    background: transparent !important;
}

.content-area::-webkit-scrollbar-track,
.records-area::-webkit-scrollbar-track,
.scroll-container::-webkit-scrollbar-track,
.chat-scroll::-webkit-scrollbar-track {
    background: rgba(30, 159, 255, 0.04) !important;
    border-radius: 9999px !important;
}

.content-area::-webkit-scrollbar-thumb,
.records-area::-webkit-scrollbar-thumb,
.scroll-container::-webkit-scrollbar-thumb,
.chat-scroll::-webkit-scrollbar-thumb {
    background: rgba(30, 159, 255, 0.5) !important;
    border-radius: 9999px !important;
    transition: background 0.15s ease !important;
}

.content-area::-webkit-scrollbar-thumb:hover,
.records-area::-webkit-scrollbar-thumb:hover,
.scroll-container::-webkit-scrollbar-thumb:hover,
.chat-scroll::-webkit-scrollbar-thumb:hover {
    background: rgba(30, 159, 255, 0.7) !important;
}

.content-area,
.records-area,
.scroll-container,
.chat-scroll {
    scrollbar-color: rgba(30, 159, 255, 0.5) rgba(30, 159, 255, 0.04) !important;
    scrollbar-width: thin !important;
}

/* ==================== 通用变体修饰类 ==================== */
/* 细滚动条 (4px) */
.scrollbar-thin::-webkit-scrollbar {
    width: 4px !important;
    height: 4px !important;
}

/* 宽滚动条 (10px) */
.scrollbar-wide::-webkit-scrollbar {
    width: 10px !important;
    height: 10px !important;
}

/* 浅色主题（深色背景上使用） */
.scrollbar-light::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.4) !important;
}

.scrollbar-light::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, 0.6) !important;
}

/* 深色主题 */
.scrollbar-dark::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.3) !important;
}

.scrollbar-dark::-webkit-scrollbar-thumb:hover {
    background: rgba(0, 0, 0, 0.5) !important;
}

/* 主色强调（与 .content-area 等同） */
.scrollbar-primary::-webkit-scrollbar {
    width: 8px !important;
    height: 8px !important;
}

.scrollbar-primary::-webkit-scrollbar-thumb {
    background: rgba(30, 159, 255, 0.5) !important;
    border-radius: 9999px !important;
}

.scrollbar-primary::-webkit-scrollbar-thumb:hover {
    background: rgba(30, 159, 255, 0.7) !important;
}