@charset "UTF-8";

body { font-family: "Helvetica Neue", Arial, sans-serif; margin: 30px; color: #333; background: #f4f7f6; }
        .container { max-width: 900px; margin: 0 auto; background: white; padding: 25px; border-radius: 12px; box-shadow: 0 4px 20px rgba(0,0,0,0.08); }
        
        h1 { font-size: 1.5rem; border-left: 5px solid #007bff; padding-left: 15px; margin-bottom: 25px; }

        /* 全体操作ボタン */
        .global-actions { margin-bottom: 15px; display: flex; gap: 10px; }
        .btn-outline { background: white; color: #555; border: 1px solid #ccc; padding: 5px 12px; font-size: 13px; border-radius: 4px; cursor: pointer; }
        .btn-outline:hover { background: #f0f0f0; }

        /* グループセクション */
        .group-section { margin-bottom: 10px; border: 1px solid #e0e0e0; border-radius: 6px; overflow: hidden; }
        
        /* ヘッダー（開閉クリックエリア） */
        .group-header { 
            background: #f8f9fa; 
            padding: 12px 15px; 
            display: flex; 
            justify-content: space-between; 
            align-items: center; 
            cursor: pointer;
            user-select: none;
            transition: background 0.2s;
        }
        .group-header:hover { background: #edf2f7; }
        .group-title { font-weight: bold; display: flex; align-items: center; gap: 10px; }
        .arrow { transition: transform 0.3s; display: inline-block; }
        .group-section.open .arrow { transform: rotate(90deg); }

        /* リストの開閉制御 */
        .file-list-container { max-height: 0; overflow: hidden; transition: max-height 0.3s ease-out; background: white; }
        .group-section.open .file-list-container { max-height: 2000px; /* 十分な高さを確保 */ transition: max-height 0.5s ease-in; }

        .file-list { list-style: none; padding: 0; margin: 0; }
        .file-item { padding: 10px 40px; border-top: 1px solid #f0f0f0; display: flex; align-items: center; transition: background 0.2s; }
        .file-item:hover { background: #f9fbff; }
        .file-item label { cursor: pointer; width: 100%; display: flex; align-items: center; }
        .file-item input { margin-right: 15px; width: 18px; height: 18px; cursor: pointer; }

        /* フッター固定バー */
        .sticky-footer { position: sticky; bottom: 20px; background: #fff; padding: 15px 25px; border: 1px solid #007bff; border-radius: 50px; display: flex; justify-content: space-between; align-items: center; box-shadow: 0 10px 30px rgba(0,0,0,0.15); margin-top: 40px; z-index: 100; }
        .download-btn { padding: 12px 30px; cursor: pointer; background: #007bff; color: white; border: none; border-radius: 25px; font-weight: bold; font-size: 16px; box-shadow: 0 4px 12px rgba(0,123,255,0.3); }
        .download-btn:hover { background: #0056b3; transform: translateY(-1px); }
        .count-info { font-weight: bold; color: #007bff; }