/* ========== 絞り込み・並び替えコントロール ========== */
.gc-controls{background:#f5f7fa;border:1px solid #e8e8e8;border-radius:8px;margin-bottom:16px;overflow:hidden}

/* 折りたたみヘッダー */
.gc-toggle{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;cursor:pointer;user-select:none;transition:background .15s}
.gc-toggle:hover{background:#eef1f5}
.gc-toggle-label{font-size:.82rem;font-weight:600;color:#888;display:flex;align-items:center;gap:6px}
.gc-toggle-label::before{content:"";display:inline-block;width:3px;height:14px;background:#E8350F;border-radius:2px}
.gc-toggle-arrow{font-size:.7rem;color:#aaa;transition:transform .2s}
.gc-controls.open .gc-toggle-arrow{transform:rotate(180deg)}

/* 折りたたみ本体 — DOM上に存在しつつ非表示（Google bot対策） */
.gc-body{max-height:0;overflow:hidden;transition:max-height .25s ease-out;padding:0 16px}
.gc-controls.open .gc-body{max-height:200px;padding:0 16px 14px}

/* フィルター・ソート共通 */
.gc-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:8px}
.gc-label{font-size:.78rem;color:#999;font-weight:600;white-space:nowrap}

/* フィルターボタン */
.gc-filter-group{display:flex;flex-wrap:wrap;gap:5px}
.gc-filter-btn{background:#fff;border:1px solid #d8d8d8;border-radius:16px;padding:4px 12px;font-size:.75rem;color:#777;cursor:pointer;transition:all .15s;font-weight:600;line-height:1.4}
.gc-filter-btn:hover{border-color:#E8350F;color:#E8350F}
.gc-filter-btn.active{background:#E8350F;color:#fff;border-color:#E8350F}
.gc-filter-btn.protected{opacity:.5;cursor:default}
.gc-filter-btn.protected:hover{border-color:#d8d8d8;color:#777}
.gc-filter-btn.protected.active{background:#E8350F;color:#fff;border-color:#E8350F;opacity:1}

/* ソートボタン */
.gc-sort-group{display:flex;flex-wrap:wrap;gap:5px}
.gc-sort-btn{background:#fff;border:1px solid #d8d8d8;border-radius:4px;padding:4px 10px;font-size:.75rem;color:#777;cursor:pointer;transition:all .15s;font-weight:600;display:flex;align-items:center;gap:3px;line-height:1.4}
.gc-sort-btn:hover{border-color:#1a1a2e;color:#1a1a2e}
.gc-sort-btn.active{background:#1a1a2e;color:#fff;border-color:#1a1a2e}
.gc-sort-btn .arrow{font-size:.6rem;opacity:.5}
.gc-sort-btn.active .arrow{opacity:1}

/* テーブルヘッダーソートインジケーター */
th[data-sortable]{cursor:pointer;user-select:none;position:relative;transition:background .15s,color .15s}
th[data-sortable]:hover{background:#E8350F !important;color:#fff !important}
th[data-sortable]::after{content:" ⇅";font-size:.65rem;opacity:.35}
th[data-sortable]:hover::after{opacity:.9}
th[data-sortable].sort-asc::after{content:" ↑";opacity:.8}
th[data-sortable].sort-desc::after{content:" ↓";opacity:.8}

/* 公式サイトリンク行（比較表最下行） */
.official-link-row td{background:#fafafa !important;padding:8px 10px !important}
.official-link{font-size:.72rem;color:#999;text-decoration:none;border-bottom:1px dotted #ccc;transition:color .15s}
.official-link:hover{color:#E8350F;border-bottom-color:#E8350F;text-decoration:none}
.official-link-aff{font-size:.78rem;color:#E8350F;font-weight:700;text-decoration:none;border-bottom:1px solid #E8350F;transition:opacity .15s}
.official-link-aff:hover{opacity:.7;text-decoration:none}

/* レスポンシブ */
@media(max-width:600px){
  .gc-toggle{padding:8px 12px}
  .gc-body{padding:0 12px}
  .gc-controls.open .gc-body{padding:0 12px 10px}
  .gc-filter-btn,.gc-sort-btn{padding:3px 8px;font-size:.7rem}
}
