/* * ARC Download Center - Custom CSS
 * 配合 Tailwind CSS 使用的自定义样式补充
 */

/* 自定义滚动条样式 */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: transparent;
}

::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 4px;
}

/* 深色模式下的滚动条 */
.dark ::-webkit-scrollbar-thumb {
    background: #475569;
}

::-webkit-scrollbar-thumb:hover {
    background: #94a3b8;
}

/* 玻璃拟态 (Glassmorphism) 效果类 */
.glass {
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.5);
}

.dark .glass {
    background: rgba(30, 41, 59, 0.7);
    border: 1px solid rgba(255, 255, 255, 0.05);
}

/* 工具类：隐藏滚动条但保留滚动功能 (用于移动端分类栏) */
.hide-scroll::-webkit-scrollbar {
    display: none;
}
.hide-scroll {
    -ms-overflow-style: none; /* IE and Edge */
    scrollbar-width: none;    /* Firefox */
}

/* 骨架屏加载动画 (Shimmer Effect) */
.shimmer {
    background: linear-gradient(90deg, #f1f5f9 25%, #e2e8f0 50%, #f1f5f9 75%);
    background-size: 200% 100%;
    animation: shimmer 1.5s infinite;
}

.dark .shimmer {
    background: linear-gradient(90deg, #1e293b 25%, #334155 50%, #1e293b 75%);
}

@keyframes shimmer {
    0% { background-position: 200% 0; }
    100% { background-position: -200% 0; }
}

/* Toast 提示动画 */
.toast-enter {
    transform: translateY(10px);
    opacity: 0;
}
.toast-enter-active {
    transform: translateY(0);
    opacity: 1;
    transition: all 0.3s ease-out;
}
.toast-exit {
    transform: translateY(0);
    opacity: 1;
}
.toast-exit-active {
    transform: translateY(10px);
    opacity: 0;
    transition: all 0.3s ease-in;
}