/* ========================================
   モック補足CSS
   動的コンテンツのダミー表示用
   ======================================== */

/* ログイン画面を非表示（モックでは常にログイン済み） */
#login-screen { display: none !important; }
/* .dashboard は flex レイアウトなので display: flex を維持 */

/* 動的コンテンツセクションを表示 */
.content-section { display: block !important; }
[style*="display: none"] { /* JSで表示されるセクション用 */ }

/* モック用：タスクリストテーブル */
.mock-table { width: 100%; border-collapse: collapse; }
.mock-table th {
    padding: 10px 12px; text-align: left;
    border-bottom: 2px solid #dee2e6;
    font-size: 12px; font-weight: 600; color: #6c757d;
    background: #f8f9fa;
}
.mock-table td {
    padding: 10px 12px; border-bottom: 1px solid #f1f3f5;
    font-size: 14px; color: #495057;
}
.mock-table tbody tr:hover { background: #f8f9fa; }

/* ステータスバッジ */
.status-badge {
    display: inline-block; padding: 3px 10px;
    border-radius: 12px; font-size: 12px; font-weight: 500;
}
.status-badge.status-todo { background: #e9ecef; color: #6c757d; }
.status-badge.status-inprogress { background: #e7f3ff; color: #007bff; }
.status-badge.status-review { background: #fef3c7; color: #f59e0b; }
.status-badge.status-done { background: #ecfdf5; color: #10b981; }
.status-badge.status-hold { background: #fee2e2; color: #dc2626; }

/* 優先度バッジ */
.priority-badge {
    display: inline-block; padding: 3px 10px;
    border-radius: 12px; font-size: 12px; font-weight: 500;
}
.priority-badge.priority-urgent { background: #fee2e2; color: #dc2626; }
.priority-badge.priority-high { background: #fef3c7; color: #d97706; }
.priority-badge.priority-medium { background: #e7f3ff; color: #3b82f6; }
.priority-badge.priority-low { background: #ecfdf5; color: #10b981; }

/* カラースウォッチ */
.color-swatch {
    display: inline-block; width: 24px; height: 24px;
    border-radius: 4px; vertical-align: middle;
    border: 1px solid rgba(0,0,0,0.1);
}

/* 進捗バー */
.mock-progress { background: #e9ecef; border-radius: 10px; height: 8px; overflow: hidden; }
.mock-progress-bar { height: 100%; border-radius: 10px; background: #007bff; }

/* ページネーション表示 */
.pagination-container { display: block !important; }

/* コメント */
.mock-comment {
    display: flex; gap: 12px; padding: 16px;
    border: 1px solid #e9ecef; border-radius: 8px;
    margin-bottom: 12px; background: #fff;
}
.mock-comment-avatar {
    width: 40px; height: 40px; border-radius: 50%;
    background: #6366f1; color: #fff;
    display: flex; align-items: center; justify-content: center;
    font-weight: 600; flex-shrink: 0;
}
.mock-comment-body { flex: 1; }
.mock-comment-header { display: flex; gap: 8px; margin-bottom: 6px; align-items: center; }
.mock-comment-author { font-weight: 600; font-size: 14px; }
.mock-comment-date { font-size: 12px; color: #6c757d; }
.mock-comment-text { font-size: 14px; color: #495057; line-height: 1.7; }

/* ダッシュボード追加バッジ */
.delay-badge { background: #fee2e2; color: #dc2626; padding: 2px 8px; border-radius: 10px; font-size: 12px; font-weight: 500; }
.progress-badge { background: #e7f3ff; color: #007bff; padding: 2px 8px; border-radius: 10px; font-size: 12px; font-weight: 500; }
.remaining-badge { background: #fef3c7; color: #f59e0b; padding: 2px 8px; border-radius: 10px; font-size: 12px; font-weight: 500; }

/* ボード ドラッグ&ドロップ視覚フィードバック */
.kanban-task.dragging { opacity: 0.5; }
.kanban-tasks.drag-over { background: #e7f3ff; border: 2px dashed #007bff; border-radius: 8px; }

/* 詳細ページ */
.mock-detail-row { display: flex; padding: 10px 0; border-bottom: 1px solid #f1f3f5; }
.mock-detail-label { width: 140px; font-weight: 600; font-size: 13px; color: #6c757d; }
.mock-detail-value { flex: 1; font-size: 14px; }

/* 連携ステータス */
.integration-status-enabled { display: inline-block; padding: 3px 10px; border-radius: 12px; background: #ecfdf5; color: #10b981; font-size: 12px; }
.integration-status-disabled { display: inline-block; padding: 3px 10px; border-radius: 12px; background: #e9ecef; color: #6c757d; font-size: 12px; }

/* セットアップガイド */
.mock-setup-guide { background: #f8f9fa; border-radius: 8px; padding: 20px; margin-top: 24px; }
.mock-setup-guide h3 { font-size: 16px; font-weight: 600; margin-bottom: 12px; }
.mock-setup-guide ol { padding-left: 20px; list-style: decimal; }
.mock-setup-guide li { padding: 6px 0; font-size: 14px; color: #495057; }

/* ログ統計 */
.mock-log-stats { display: flex; gap: 12px; margin-bottom: 16px; }
.mock-log-stats span { background: #f8f9fa; padding: 6px 12px; border-radius: 6px; font-size: 13px; color: #6c757d; }