/* EV Frame: 左サイドバー＋フレームレイアウト（トップ525以外）
   色・寸法はトップ525の .side-nav と同一トーンに合わせる */
.ev-frame-side{display:none;}

@media (min-width:1024px){
  body:not(.page-id-525) #content-in{
    display:flex;
    /* Cocoon標準の .content-in{flex-wrap:wrap;justify-content:space-between} を打ち消す。
       wrap のままだと #main の flex base size（basis:auto＝max-content）が大きい記事で
       サイドバーの下段に回り込み、sticky サイドバーが全幅の本文に重なってしまう（2026-11-11障害） */
    flex-wrap:nowrap;
    justify-content:flex-start;
    align-items:flex-start;
    gap:24px;
  }
  body:not(.page-id-525) #main{
    /* basis を 0% にして base size をコンテンツ幅から切り離す（wrap 耐性） */
    flex:1 1 0%;
    width:auto !important;
    max-width:none !important;
    min-width:0;
    float:none !important;
  }
  .ev-frame-side{
    display:block;
    flex:0 0 240px;
    width:240px;
    position:sticky;
    /* ヘッダー圧縮（64px）に合わせ、固定ヘッダーの下端＋12px に追随させる */
    top:76px;
    /* カスケードのパネルが本文側の要素より確実に上に出るよう、サイドバー自体の
       スタッキングを引き上げる（固定ヘッダーの検索UI 1003/1004 よりは下） */
    z-index:50;
  }
  body.admin-bar .ev-frame-side{top:108px;}

  /* デスクトップでも検索を使えるようにする（2026-11-11）：
     Cocoon のヘッダーには検索ボタンが無く、ev-header-buttons はモバイル幅のみ表示のため、
     検索ボタンと検索バーだけをデスクトップ幅でも有効化する（メニューボタンとドロワーは出さない）。
     ev-header-buttons 側の @media(min-width:1024px){display:none!important} を
     詳細度の高いセレクタ＋!important で上書きし、バーの見た目は同プラグインのモバイル用指定を複製する */
  body:not(.page-id-525) .evhb-btns{
    display:flex !important;
    position:fixed;
    /* ヘッダー圧縮（推奨セット 2026-11-11）でバナーが無くなったため、右端配置に戻す。
       縦位置は 64px ヘッダーの中央：（64−44）/2＝10px。右端は #header-in の左右パディング24px に揃える */
    top:10px;
    right:24px;
    left:auto;
    z-index:1003;
    gap:8px;
  }
  body.admin-bar:not(.page-id-525) .evhb-btns{top:42px;}
  body:not(.page-id-525) .evhb-btn{
    width:44px;
    height:44px;
    background:#fff;
    border:1px solid #d7e3ee;
    border-radius:0;
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    padding:0;
    -webkit-tap-highlight-color:transparent;
  }
  body:not(.page-id-525) .evhb-btn svg{
    width:22px;
    height:22px;
    stroke:#20303c;
    fill:none;
    stroke-width:2.2;
    stroke-linecap:round;
  }
  body:not(.page-id-525) #evhbMenuBtn{display:none !important;}
  body:not(.page-id-525) .evhb-search{
    display:block !important;
    position:fixed;
    top:0;
    left:0;
    right:0;
    z-index:1004;
    background:#fff;
    border-bottom:1px solid #d7e3ee;
    box-shadow:0 6px 14px rgba(20,70,124,.12);
    padding:8px 12px;
    transform:translateY(-110%);
    transition:transform .25s ease;
  }
  body.admin-bar:not(.page-id-525) .evhb-search{top:32px;}
  body:not(.page-id-525) .evhb-search.open{transform:translateY(0);}
  body:not(.page-id-525) .evhb-search form{display:flex;gap:8px;margin:0;align-items:center;}
  body:not(.page-id-525) .evhb-search input[type="search"]{
    flex:1;
    height:44px;
    border:1px solid #b9cbdd;
    border-radius:0;
    padding:0 12px;
    font-size:16px;
    min-width:0;
    background:#fff;
    -webkit-appearance:none;
    appearance:none;
  }
  body:not(.page-id-525) .evhb-search button[type="submit"]{
    height:44px;
    padding:0 16px;
    background:#14467c;
    color:#fff;
    border:0;
    border-radius:0;
    font-weight:700;
    font-size:15px;
    cursor:pointer;
    flex:none;
  }
  body:not(.page-id-525) .evhb-search .evhb-sclose{
    width:44px;
    height:44px;
    background:#fff;
    border:1px solid #d7e3ee;
    border-radius:0;
    font-size:17px;
    color:#20303c;
    cursor:pointer;
    flex:none;
    line-height:1;
  }
}

/* Cocoonの右サイドバーは全ページで非表示（525はテーマ側で非表示済み） */
body:not(.page-id-525) #sidebar{display:none !important;}

/* 記事ページの日付は「更新日」だけに統一（2026-11-11 ユーザー決定・再確認）
   Cocoon の .date-tags は記事ヘッダー（.article-header）内に1つだけ出力され、次の2パターンがある:
   A) 更新日（.post-update）と公開日（.post-date）が併記される → 公開日側を隠し、更新日だけを残す
   B) 公開日と更新日が同日で .post-date 1要素に集約される（time に updated クラス付きで、
      表示日は更新日と同日）→ ::before ラベル「公開日：」を「更新日：」に付け替え、アイコンも更新日側（fa-history）に揃える
   post 523 側の競合ルール（.post-date の display:inline-flex!important と「公開日：」ラベル）より
   詳細度を高くして上書きする。マークアップと構造化データには触れず、画面表示だけの変更。
   body.single-post でスコープするため固定ページ・車種ページ・トップ525には効かない */
body.single-post .article-header .date-tags:has(> .post-update) .post-date{display:none !important;}
body.single-post .article-header .date-tags .post-date .entry-date.updated::before{content:"更新日：";}
body.single-post .article-header .date-tags .post-date .fa-clock-o::before{content:"\f1da";}

/* 固定ページ（車種ページ・ガイドページ・記事一覧 等）のヘッダー日付も「更新日」だけに統一
   （2026-11-11 ユーザー指示：全ページで最終更新日だけ表示し、登録日は出さない）
   固定ページには post 523 側のラベル付けルール（body.single-post 限定）が効かず、
   パターンAでは公開日と更新日が両方出ていた。記事ページと同じ見た目に揃える:
   A) .post-update がある → 公開日側を隠し、残る更新日に「更新日：」ラベルを付ける
   B) 同日で .post-date に集約 → ラベル「更新日：」を付け、アイコンも fa-history に揃える
   ev-frame はトップ525に読み込まれないが、525 は .article-header 自体が非表示なので対象外でよい。
   マークアップと構造化データには触れず、画面表示だけの変更。 */
body.page .article-header .date-tags:has(> .post-update) .post-date{display:none !important;}
body.page .article-header .date-tags .post-update time::before{content:"更新日：";font-weight:700;}
body.page .article-header .date-tags .post-date .entry-date.updated::before{content:"更新日：";font-weight:700;}
body.page .article-header .date-tags .post-date .fa-clock-o::before{content:"\f1da";}

.evf-side-nav{
  background:#f3f7ff;
  border:1px solid #e2e9f2;
  padding:18px 16px;
  font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",sans-serif;
}
.evf-side-group{margin:0 0 18px;}
.evf-side-group:last-child{margin-bottom:0;}
.evf-side-group h3{
  font-size:13px;
  letter-spacing:.06em;
  color:#71808a;
  margin:0 0 6px;
  padding:0 10px;
  font-weight:700;
}
.evf-side-group a{
  display:block;
  padding:8px 10px;
  font-size:14px;
  font-weight:700;
  color:#3d474c;
  text-decoration:none;
  line-height:1.5;
}
.evf-side-group a:hover{background:#fff;color:#004fd6;}

/* サイドバー階層カスケード（メーカー・車種ページ）2026-11-11 v2
   構造は tools_tmp/build_cascade_menu.py が生成。トップ525の .side-nav 側と同一設計。
   - パネルは完全不透明・トランジション無し（開閉は即時）。透け／残像／二重表示を防ぐため。
   - パネルに overflow を付けると下の層がクリップされるため付けない。
   - 開くパネルは常に1つだけ：排他制御は JS 側（mouseenter で他を即閉じ）。 */
.evf-side-nav .evc{list-style:none;margin:0;padding:0;}
.evf-side-nav .evc-root{position:relative;}
.evf-side-nav .evc-rootbtn{
  display:flex;align-items:center;width:100%;
  padding:8px 10px;font:inherit;font-size:14px;font-weight:700;color:#3d474c;
  background:none;border:0;cursor:pointer;text-align:left;line-height:1.5;
}
.evf-side-nav .evc-rootbtn:hover,.evf-side-nav .evc-root.open .evc-rootbtn{background:#fff;color:#004fd6;}
.evf-side-nav .evc-arrow{margin-left:auto;color:#004fd6;font-weight:800;font-size:15px;}
.evf-side-nav .evc-panel{
  position:absolute;left:100%;top:0;z-index:200;
  background:#fff;border:1px solid #b9cbdd;box-shadow:0 12px 32px rgba(20,70,124,.22);
  padding:6px 0;min-width:204px;
  visibility:hidden;pointer-events:none;
}
.evf-side-nav .evc-panel--models{min-width:220px;}
/* 斜め移動でパネル左端をかすめてもホバーが切れにくいよう、左側に透明な回廊を持たせる */
.evf-side-nav .evc-panel::before{content:"";position:absolute;left:-48px;top:0;bottom:0;width:48px;}
.evf-side-nav .evc-panel--up{top:auto;bottom:0;}
.evf-side-nav .evc-list{list-style:none;margin:0;padding:0;}
.evf-side-nav .evc-node{position:relative;}
.evf-side-nav .evc-makerlink,.evf-side-nav .evc-nodelabel{
  display:flex;align-items:center;padding:7px 12px;font-size:13.5px;white-space:nowrap;cursor:pointer;
}
.evf-side-nav .evc-panel--models a{padding:7px 12px;font-size:13.5px;font-weight:600;white-space:nowrap;}
/* 表示制御は JS の .open クラスに一本化する（:hover で出すと、隣の項目をかすめた瞬間に
   両方のパネルが重なって見えるため）。:focus-within はキーボード操作用 */
.evf-side-nav .evc-root:focus-within>.evc-panel,.evf-side-nav .evc-root.open>.evc-panel,
.evf-side-nav .evc-node:focus-within>.evc-panel,.evf-side-nav .evc-node.open>.evc-panel{
  visibility:visible;pointer-events:auto;
}
.evf-side-nav .evc-badge{
  display:inline-block;margin-left:7px;padding:1px 5px;background:#e9a319;color:#1c2530;
  font-size:10px;font-weight:800;line-height:1.5;vertical-align:1px;
}

/* ===== モバイルリデザイン 第1弾（2026-11-11）: 共通基盤 =====
   対象はモバイル幅（≤1023px）のみ。PC表示は一切変えない。
   - ev-header-buttons の枠付き44px四角ボタンを、枠なし40pxアイコンに小型化
     （プラグイン側 <style> は wp_footer 出力で後勝ちするため !important で上書き）
   - 固定ページの日付ブロック（.date-tags）を圧縮（見出し直下・11.5px）
   ===== メニュー仕様変更（2026-11-11・ユーザー指示）=====
   - 下部固定バー（Cocoon .mobile-footer-menu-buttons）は全ページで廃止（非表示）。
     バー前提だった body の padding-bottom（64px＋セーフエリア）の逃げも同時に除去。
     トップ525の自前バー（.bottom-nav）とその逃げは 525 側（top_525.html）で対応。
   - メニューボタン（.evhb-menubtn）はヘッダーのロゴの左へ移動。ロゴと重ならないよう
     #header-in に左パディング 52px を確保する（ボタンは left:6px の 40px 幅）。
     検索ボタン（.evhb-btns）は従来どおり右上。 */
@media (max-width:1023px){
  body:not(.page-id-525) .evhb-btns{top:8px;right:6px;gap:2px;}
  body:not(.page-id-525) .evhb-btn{width:40px !important;height:40px !important;background:transparent !important;border:none !important;box-shadow:none !important;}
  body:not(.page-id-525) .evhb-btn svg{width:23px;height:23px;}
  body:not(.page-id-525) .evhb-menubtn{top:8px;left:6px;}
  body:not(.page-id-525) #header-in{padding-left:52px;}
  body.page .article-header .date-tags{font-size:11.5px;line-height:1.5;margin-top:6px;}
  body.page .article-header .date-tags .post-date,
  body.page .article-header .date-tags .post-update{font-size:11.5px;}
  /* time 要素と fa アイコンは Cocoon 側の個別指定（13.8px／行高32.6px）が残り、
     ブロックの高さ31pxの主因になっていたため、明示して潰す */
  body.page .article-header .date-tags time{font-size:11.5px;line-height:1.5;}
  body.page .article-header .date-tags .fa{font-size:11.5px;line-height:1;display:inline-block;width:12px;height:12px;overflow:hidden;vertical-align:-1px;}
  .mobile-footer-menu-buttons{display:none !important;}
}
@media (max-width:782px){
  /* 管理バー（46px）表示時はヘッダー帯も46px下がるため、ボタン位置も合わせる */
  body.admin-bar:not(.page-id-525) .evhb-btns{top:54px;}
  body.admin-bar:not(.page-id-525) .evhb-menubtn{top:54px;}
}
