/* ===================================
   fileGo - 最小限CSS (Tailwind統合版)
   ================================== */

/* グローバルリセット */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* Tailwindで制御できない特殊なスタイルのみ保持 */
.hidden {
    display: none !important;
}

/* スムーススクロール */
html {
    scroll-behavior: smooth;
}

/* プログレスバーのアニメーション（Tailwindでは複雑） */
.progress-fill {
    height: 100%;
    background: linear-gradient(90deg, #5865F2, #57F287);
    transition: width 0.3s ease-out;
    width: 0%;
}

/* カスタムスクロールバー（ダークモード対応） */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

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

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

::-webkit-scrollbar-thumb:hover {
    background: #a0aec0;
}

.dark ::-webkit-scrollbar-thumb {
    background: #4a5568;
}

.dark ::-webkit-scrollbar-thumb:hover {
    background: #718096;
}

/* ローディングスケルトンアニメーション */
@keyframes skeleton-loading {
    0% {
        background-position: -200% 0;
    }
    100% {
        background-position: 200% 0;
    }
}

.skeleton {
    animation: skeleton-loading 1.5s ease-in-out infinite;
    background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
    background-size: 200% 100%;
}

.dark .skeleton {
    background: linear-gradient(90deg, #2d3748 25%, #1a202c 50%, #2d3748 75%);
    background-size: 200% 100%;
}

/* バウンスアニメーション（ドラッグ&ドロップ用） */
@keyframes bounce {
    0%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-10px);
    }
}

.animate-bounce {
    animation: bounce 2s infinite;
}

/* フェードインアニメーション */
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.fade-in {
    animation: fadeIn 0.3s ease-out;
}

.animate-fade-in {
    animation: fadeIn 0.5s ease-out;
}