/* ============================================================
   shohan-navchrome.css — 遷移フラッシュ対策(領域別 初回ペイント下地) batch5 v2
   ------------------------------------------------------------
   ★ CSSのみ・JS無改変。app-nav(サイドバー)を持つシェルにのみリンク
     (register/forgot/login 等サイドバー無しページには付けない=誤発火防止)。
   仕組み: モジュール間ナビは実ナビ(文書リロード)で紺サイドバーは app-nav.js が
     JS後描画。新文書の初回ペイントで地色/テーマ色が紺サイドバー領域に出て
     navy→地色→navy のチラつき。body.sh-root は静的=初回ペイントで存在するので、
     紺サイドバー幅ぶんだけ navy の「帯」を background-image で重ね、常に紺を保つ。
   ★ 重要:
     - shorthand(background) は使わず background-image のみ。これで mt-on の
       テーマ地色(module-theme.css:9 body.mt-on{background:var(--mt-page)!important})の
       background-COLOR を壊さず、コンテンツ領域はテーマ色のまま、左の帯だけ紺にする。
     - セレクタは `html body.sh-root`(特異度 0,1,2)で body.mt-on(0,1,1)に勝たせる。
     - 帯の右側は transparent ＝ 背景色(テーマ色 or 地色)が透ける。
   ============================================================ */
@media (min-width: 768px) and (max-width: 1023px) {
  html body.sh-root {
    min-height: 100vh;
    background-image: linear-gradient(to right,
      var(--sh-side-bg, #0F2451) 0, var(--sh-side-bg, #0F2451) 76px,
      transparent 76px) !important;
    background-attachment: fixed !important;
    background-repeat: no-repeat !important;
  }
}
@media (min-width: 1024px) {
  html body.sh-root {
    min-height: 100vh;
    background-image: linear-gradient(to right,
      var(--sh-side-bg, #0F2451) 0, var(--sh-side-bg, #0F2451) var(--sh-sidebar-w, 240px),
      transparent var(--sh-sidebar-w, 240px)) !important;
    background-attachment: fixed !important;
    background-repeat: no-repeat !important;
  }
  /* PC折畳(76px)= app-nav が mount 前に html.sh-nav-collapsed-pre 付与 */
  html.sh-nav-collapsed-pre body.sh-root,
  html body.sh-nav-collapsed.sh-root {
    background-image: linear-gradient(to right,
      var(--sh-side-bg, #0F2451) 0, var(--sh-side-bg, #0F2451) 76px,
      transparent 76px) !important;
    background-attachment: fixed !important;
    background-repeat: no-repeat !important;
  }
}