/* ============================================================
   P-FINDER — PC SHELL LAYER (デザイン案 PC版 準拠)
   ============================================================
   - pf-theme-light.css の後に読み込む (後勝ちで上書き)。
   - すべて @media (min-width:1100px) かつ body.pf-pc-shell スコープ。
     (body.pf-pc-shell は _pf_sidebar.html のスクリプトが付与 =
      _header.html を include するページのみ。login 等は対象外)
   - <1100px ではこのファイルは何もしない = モバイル表示は完全不変。
   - 構成 (1440px 基準):
       左上ロゴ (fixed, h64) / 左サイドバー (fixed, x20 w240 top84 bottom20)
       コンテンツ列 (max 980px, サイドバー右の残り幅で中央寄せ)
       フッター (オレンジ横グラデ帯・全幅)
   ============================================================ */

/* モバイル幅では PC 部品を常に隠す (デフォルト) */
.pf-pc-topbar,
.pf-pc-sidebar { display: none; }

@media (min-width: 1100px) {

  /* ==================== デザイン実測トークン上書き (PCスコープのみ) ====================
     カラーピッカー実測(.claude/pcdsg/PALETTE.md)に基づき、PCのブランド軸を
     デザイン確定値 #FD6710 へ。var(--pf-brand) 経由の全要素が自動で正値になる
     (モバイルは <1100px のため一切不変)。 */
  body.pf-pc-shell {
    --pf-brand:        #FD6710;
    --pf-brand-strong: #FD6710;
    --pf-brand-deep:   #E85D0A;
    --pf-brand-line:   rgba(253,103,16,0.30);
    --pf-brand-soft:   #FFF3E9;
    --pf-bg-base:      #F5F5F5;   /* デザインのページ背景 */
  }

  /* ==================== ページ骨格 ==================== */
  body.pf-pc-shell {
    /* 左: サイドバー幅240 + 余白(20+20) / 上: ロゴバー64 */
    padding-left: 280px;
    padding-top: 64px;
  }

  /* モバイルシェル (上部固定ヘッダ / AIナビ|ホーム タブ / 下部タブバー) を撤去 */
  body.pf-pc-shell .pf-header,
  body.pf-pc-shell .pf-toptabs,
  body.pf-pc-shell .pf-bottom-nav { display: none !important; }

  /* 下部タブバー分の余白はPCでは不要 */
  body.pf-pc-shell .pf-shell-page {
    padding-bottom: 56px;
  }

  /* ==================== 左上ロゴ ==================== */
  .pf-pc-topbar {
    display: flex;
    align-items: center;
    position: fixed;
    top: 0; left: 0; right: 0;
    height: 64px;
    padding: 0 40px;
    z-index: 130;
    background: var(--pf-bg-base);
  }
  .pf-pc-logo {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
  }
  .pf-pc-logo-mark {
    width: 28px;
    height: 28px;
    border-radius: 6px;
    background: #D9D9D9;   /* デザイン案準拠: グレー角丸プレースホルダ */
  }
  .pf-pc-logo-text {
    font-size: 17px;
    font-weight: 600;
    letter-spacing: 0.01em;
    color: var(--pf-text-1);
  }

  /* ==================== 左サイドバー ==================== */
  .pf-pc-sidebar {
    display: flex;
    flex-direction: column;
    position: fixed;
    left: 20px;
    top: 84px;
    bottom: 20px;
    width: 240px;
    background: var(--pf-bg-card);
    border: 1px solid var(--pf-brand);
    border-radius: 18px;
    padding: 40px 20px 24px;
    overflow-y: auto;
    overscroll-behavior: contain;
    z-index: 125;
  }
  .pf-pc-nav {
    display: flex;
    flex-direction: column;
    gap: 14px;
  }
  .pf-pc-item {
    display: flex;
    align-items: center;
    gap: 12px;
    height: 56px;
    padding: 0 20px;
    border-radius: 28px;
    color: var(--pf-brand);
    font-size: 15px;
    font-weight: 800;
    text-decoration: none;
    white-space: nowrap;
    transition: background var(--pf-dur-1, .15s) var(--pf-ease, ease);
  }
  .pf-pc-item svg { flex: 0 0 auto; }
  .pf-pc-item:hover { background: #FFDCC7; }                 /* parts: hover=淡オレンジピル(実測 #FFDCC7) */
  .pf-pc-item.is-active { background: #FD6710; color: #fff; }  /* parts: active=オレンジピル白字(実測 #FD6710) */

  .pf-pc-side-divider {
    margin-top: auto;          /* ユーザー欄を下端へ */
    border-top: 1px solid var(--pf-border-default);
    margin-bottom: 14px;
    padding-top: 0;
  }
  .pf-pc-userbox {
    display: flex;
    flex-direction: column;
    gap: 6px;
  }
  .pf-pc-user {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 4px 8px 12px;
  }
  .pf-pc-user-avatar {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #D9D9D9;
    color: #6B6B70;   /* 白だと薄灰地に同化(ratio1.4)。濃いグレーで可読に */
    font-size: 13px;
    font-weight: 800;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  .pf-pc-user-name {
    font-size: 15px;
    font-weight: 800;
    color: var(--pf-text-1);
  }
  .pf-pc-item-sub { height: 52px; }

  /* ==================== コンテンツ列 (max 980px) ==================== */
  body.pf-pc-shell .pf-shell-page .pf-main,
  body.pf-pc-shell .pf-shell-page .pf-container,
  body.pf-pc-shell .pf-main,
  body.pf-pc-shell main .pf-container {
    max-width: 980px;
    margin-left: auto;
    margin-right: auto;
  }
  /* AIナビ (.nearby-shell) はテーマCSSが 430px を !important 指定しているため
     より高い詳細度 + 後勝ちで 980px へ広げる */
  html body.pf-pc-shell .pf-shell-page .nearby-shell,
  html[data-pf-mode="simple"] body.pf-pc-shell .pf-shell-page .nearby-shell,
  body.ai-mode-noscroll.pf-pc-shell .pf-shell-page .nearby-shell {
    max-width: 980px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  /* ==================== フッター (オレンジ横グラデ帯・全幅) ==================== */
  /* body の padding-left を打ち消して帯は全幅に、内容はサイドバーを避ける */
  body.pf-pc-shell .pf-footer {
    margin-left: -280px;
    padding-left: 280px;
    background: linear-gradient(90deg, #F9B859 0%, #FD6811 100%) !important;  /* 実測フッター帯 */
    border-top: 0 !important;
    color: rgba(255, 255, 255, 0.94);
    margin-top: 48px;
  }
  body.pf-pc-shell .pf-footer .pf-container { max-width: 980px; }
  body.pf-pc-shell .pf-footer-head { color: #fff; }
  body.pf-pc-shell .pf-footer-col a { color: rgba(255, 255, 255, 0.88); }
  body.pf-pc-shell .pf-footer-col a:hover { color: #fff; }
  /* キーワードチップ: オレンジ帯の上は白文字×白地で判読不能(BUG-5)。
     白ピル(ほぼ不透明)×ダーク文字でコントラスト約12:1を確保。地色だけ
     僅かに帯へ馴染ませる。pf-pc-shell 配下のみ=モバイル(style.css既定)は不変。 */
  body.pf-pc-shell .pf-keyword-chips a {
    background: rgba(255, 255, 255, 0.92);
    border-color: rgba(255, 255, 255, 0.55);
    color: #303030;
  }
  body.pf-pc-shell .pf-keyword-chips a:hover {
    background: #fff;
    border-color: #fff;
    color: #C1410B;
  }
  body.pf-pc-shell .pf-footer-copy { color: rgba(255, 255, 255, 0.85); }
  body.pf-pc-shell .pf-data-freshness {
    background: rgba(255, 255, 255, 0.16);
    border-color: rgba(255, 255, 255, 0.35);
    color: rgba(255, 255, 255, 0.95);
  }

  /* ==================== 汎用PC部品 (各ページ共通) ==================== */
  /* セクション見出し横の「すべて見る ⟶」リンク等はページ側で流用 */
  body.pf-pc-shell .pf-pc-more-link {
    color: var(--pf-brand);
    font-weight: 800;
    text-decoration: none;
  }
  body.pf-pc-shell .pf-pc-more-link:hover { text-decoration: underline; }

  /* ==================== 条件パネル/グレーパネルの地をデザイン実測 #ECECEC に統一 ====================
     デザイン実測: 「条件を指定する」折りたたみバー・各グレーパネル = #ECECEC。
     一部ページが --pf-bg-elev(#F2F2F4) や #EDEDEF/#F5F5F7 になっていたのを PC のみ統一。
     (machrank は既に #ECECEC のため対象外。body.pf-pc-shell 接頭で specificity 勝ち) */
  body.pf-pc-shell .hr-filter-summary,
  body.pf-pc-shell .er-filter-summary,
  body.pf-pc-shell .pr-filter-summary,
  body.pf-pc-shell .ev-filter-panel,
  body.pf-pc-shell .ev-section,
  body.pf-pc-shell .ev-results-panel,
  body.pf-pc-shell .ev-spotlight-section {
    background: #ECECEC;
  }
}