/* Web版の製品テーマをCSS変数へ集約し、Materialの即時遷移後も同じ配色を使う。 */
body {
  --manual-primary: #911D30;
  --manual-accent: #b4404b;
  --manual-primary-soft: rgb(145 29 48 / 10%);
}

/* 共通ビルドの英語ページで、日本語ナビが英語へ変わる前の一瞬を見せない。 */
html.manual-language-pending body .md-sidebar--primary {
  visibility: hidden;
}

body[data-manual-theme="viewer"] {
  --manual-primary: #4652df;
  --manual-accent: #4652df;
  --manual-primary-soft: rgb(70 82 223 / 10%);
}

body .md-header,
body .md-tabs {
  background-color: var(--manual-primary);
}

/* 固定・追従する目次が最下部のフッターへ入り込まないよう、フッターを通常コンテンツより前に置く。 */
body .md-footer {
  position: relative;
  z-index: 2;
}

body .md-nav__link--active,
body .md-nav__link:focus,
body .md-nav__link:hover,
body .md-typeset a,
body .md-typeset a:hover {
  color: var(--manual-accent);
}

/* ASM Edgeの目次だけはMaterial標準のindigoを使わず、Edgeの赤テーマへ揃える。 */
body[data-manual-theme="edge"] .md-nav--secondary {
  border-left-color: var(--manual-primary) !important;
}

body[data-manual-theme="edge"] .md-nav--secondary .md-nav__link--active,
body[data-manual-theme="edge"] .md-nav--secondary .md-nav__link:focus,
body[data-manual-theme="edge"] .md-nav--secondary .md-nav__link:hover {
  color: var(--manual-accent) !important;
}

body .md-typeset .md-button {
  border-color: var(--manual-primary);
  color: var(--manual-primary);
}

body .md-typeset .md-button--primary,
body .md-tabs__link--active,
body .md-tabs__link:hover {
  background-color: var(--manual-primary);
  border-color: var(--manual-primary);
  color: #ffffff;
}

/* ホームの製品ボタンは、hover/focus時もカードの製品色を維持する。 */
body .md-typeset .manual-product-card .md-button--primary:hover,
body .md-typeset .manual-product-card .md-button--primary:focus-visible {
  background-color: var(--manual-card-accent) !important;
  border-color: var(--manual-card-accent) !important;
  color: #ffffff !important;
}

/* トップの主ボタンは共通のMaterial hover色を使わず、マニュアルのテーマ色を維持する。 */
body .md-typeset .manual-home-hero .manual-hero-actions .md-button--primary:hover,
body .md-typeset .manual-home-hero .manual-hero-actions .md-button--primary:focus-visible {
  background-color: var(--manual-accent) !important;
  border-color: var(--manual-accent) !important;
  color: #ffffff !important;
}

/* 枠線ボタンはhoverしても白地を保ち、枠線と文字だけをテーマ色へ切り替える。 */
body .md-typeset .manual-home-hero .manual-hero-actions .md-button:not(.md-button--primary):hover,
body .md-typeset .manual-home-hero .manual-hero-actions .md-button:not(.md-button--primary):focus-visible {
  background-color: #ffffff !important;
  border-color: var(--manual-accent) !important;
  color: var(--manual-accent) !important;
}

/* PDFダウンロードの主ボタンも、hover/focus時にEdgeの赤テーマを維持する。 */
body .md-typeset .manual-pdf-download .md-button--primary:hover,
body .md-typeset .manual-pdf-download .md-button--primary:focus-visible {
  background-color: var(--manual-accent) !important;
  border-color: var(--manual-accent) !important;
  color: #ffffff !important;
}

/* PDFダウンロードの枠線ボタンは、hover/focus時も赤い枠線と白い背景を維持する。 */
body .md-typeset .manual-pdf-download .md-button:not(.md-button--primary):hover,
body .md-typeset .manual-pdf-download .md-button:not(.md-button--primary):focus-visible {
  background-color: #ffffff !important;
  border-color: var(--manual-accent) !important;
  color: var(--manual-accent) !important;
}

/* ページ選択は背景と太字で示し、スクロール追従する目次マーカーと役割を分ける。 */
body .md-nav__item > .md-nav__link--active {
  position: relative;
  margin-left: 0.5rem;
  border-left: 0;
  border-radius: 0.25rem;
  background-color: var(--manual-primary-soft);
  color: var(--manual-primary);
  font-weight: 700;
}

body .md-nav__item > .manual-scroll-active {
  position: relative;
  margin-left: 0.5rem;
  border-left: 0;
  border-radius: 0.25rem;
  background-color: var(--manual-primary-soft);
  color: var(--manual-primary);
  font-weight: 700;
}

/* MkDocs標準の前項目表示を消し、スクロール追従マーカーだけを現在位置として見せる。 */
body .md-nav--primary .md-nav__item .md-nav__item > .md-nav__link--active:not(.manual-scroll-active) {
  background-color: transparent;
  color: inherit;
  font-weight: 400;
}

/* 固定される製品ページ行にはブラケットを置かず、現在位置との混同を防ぐ。 */
body .md-nav--primary > .md-nav__list > .md-nav__item--active > .md-nav__link--active::before {
  display: none;
}

/* ブラケットはリンクの外側に置き、テキスト列と重ならないようにする。 */
body .md-nav__item > .md-nav__link--active::before {
  position: absolute;
  top: 0.2rem;
  bottom: 0.2rem;
  left: -0.45rem;
  width: 0.25rem;
  border: 0.14rem solid var(--manual-primary);
  border-right: 0;
  border-radius: 0.25rem 0 0 0.25rem;
  content: "";
  pointer-events: none;
}

body .md-nav--primary .md-nav__item .md-nav__item > .md-nav__link--active:not(.manual-scroll-active)::before {
  display: none;
}

/* 言語切替は現在言語を左の選択中表示、切替先を右のリンクとして分離する。 */
body .manual-language-switch {
  display: flex;
  align-items: center;
  gap: 0.3rem;
  margin-left: auto;
  color: #ffffff;
}

/* 検索フォームと切替操作を詰めず、ヘッダー右側の境界を明確にする。 */
body .md-search {
  margin-right: 1rem;
}

body .manual-language-switch__current {
  display: inline-flex;
  align-items: baseline;
  gap: 0.28rem;
  border-radius: 0.3rem;
  background-color: #ffffff;
  box-shadow: 0 0.05rem 0.2rem rgb(0 0 0 / 18%);
  color: var(--manual-primary);
  line-height: 1;
  padding: 0.35rem 0.5rem 0.3rem;
}

body .manual-language-switch__current-code {
  font-size: 1rem;
  font-weight: 800;
  letter-spacing: 0.05em;
}

body .manual-language-switch__current-state {
  font-size: 0.58rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  white-space: nowrap;
}

body .manual-language-switch__separator {
  color: rgb(255 255 255 / 72%);
  font-size: 0.75rem;
  line-height: 1;
}

body .manual-language-switch__link {
  display: inline-flex;
  align-items: baseline;
  gap: 0.2rem;
  border: 0;
  border-bottom: 1px solid transparent;
  border-radius: 0;
  color: #ffffff;
  line-height: 1;
  padding: 0.35rem 0.1rem 0.28rem;
  text-decoration: none;
}

body .manual-language-switch__target-code {
  font-size: 0.8rem;
  font-weight: 800;
  letter-spacing: 0.04em;
}

body .manual-language-switch__target-action {
  font-size: 0.58rem;
  font-weight: 600;
  opacity: 0.88;
  white-space: nowrap;
}

body .manual-language-switch__target-arrow {
  font-size: 0.9rem;
  font-weight: 700;
}

body .md-nav__item > .manual-scroll-active::before {
  position: absolute;
  top: 0.2rem;
  bottom: 0.2rem;
  left: -0.45rem;
  width: 0.25rem;
  border: 0.14rem solid var(--manual-primary);
  border-right: 0;
  border-radius: 0.25rem 0 0 0.25rem;
  content: "";
  pointer-events: none;
}

body .manual-language-switch__link:focus,
body .manual-language-switch__link:hover {
  border-bottom-color: #ffffff;
  color: #ffffff;
}

@media (max-width: 40rem) {
  /* 狭いヘッダーでも現在言語の視認性を保ち、検索UIとの重なりを避ける。 */
  body .manual-language-switch {
    gap: 0.15rem;
  }

  body .manual-language-switch__current {
    gap: 0.18rem;
    padding: 0.28rem 0.32rem 0.24rem;
  }

  body .manual-language-switch__current-code {
    font-size: 0.85rem;
  }

  body .manual-language-switch__current-state {
    font-size: 0.5rem;
  }

  body .manual-language-switch__link {
    gap: 0.12rem;
    padding: 0.28rem 0.05rem 0.22rem;
  }

  body .manual-language-switch__target-code {
    font-size: 0.68rem;
  }

  body .manual-language-switch__target-action {
    font-size: 0.48rem;
  }

  body .manual-language-switch__target-arrow {
    font-size: 0.75rem;
  }
}

/* ホームの製品導線は、製品ごとの色を明示したカードグリッドで表示する。 */
body .manual-product-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
  margin: 1.5rem 0;
}

body .manual-product-card {
  border: 1px solid var(--manual-primary);
  border-radius: 0.35rem;
  box-shadow: 0 0.1rem 0.25rem rgb(0 0 0 / 10%);
  padding: 1.25rem;
}

body .manual-product-card--edge {
  --manual-card-primary: #911D30;
  --manual-card-accent: #b4404b;
  border-color: var(--manual-card-primary);
}

body .manual-product-card--viewer {
  --manual-card-primary: #4652df;
  --manual-card-accent: #4652df;
  border-color: var(--manual-card-primary);
}

body .manual-product-card h3 {
  color: var(--manual-card-primary);
  margin-top: 0;
}

body .manual-product-card .md-button {
  border-color: var(--manual-card-primary);
  color: var(--manual-card-primary);
}

body .manual-product-card .md-button--primary {
  background-color: var(--manual-card-primary);
  color: #ffffff;
}

/* Web版は、本文を読み始める前に目的と製品を選べるレイアウトへ整える。 */
body .md-content__inner {
  max-width: 78rem;
}

body .md-typeset h1 {
  color: #24262b;
  font-weight: 750;
  letter-spacing: -0.035em;
}

body .md-typeset h2 {
  margin-top: 2.7rem;
  font-weight: 720;
  letter-spacing: -0.02em;
}

body .manual-kicker {
  display: inline-block;
  color: var(--manual-primary);
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  line-height: 1.2;
  text-transform: uppercase;
}

body .manual-hero-lead {
  max-width: 42rem;
  color: #343740;
  font-size: clamp(1.05rem, 1.6vw, 1.35rem);
  line-height: 1.8;
}

body .manual-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.7rem;
  margin-top: 1.35rem;
}

body .manual-hero-actions .md-button {
  margin: 0;
}

/* PDFダウンロードを製品導線と分離し、トップページで見つけやすくする。 */
body .manual-pdf-download {
  margin: 1rem 0 2.2rem;
  border: 1px solid rgb(32 36 45 / 12%);
  border-radius: 0.65rem;
  background: #ffffff;
  padding: 1.1rem 1.25rem;
}

body .manual-pdf-download p:last-child {
  margin-bottom: 0;
}

body .manual-home-hero,
body .manual-product-hero,
body .manual-overview-hero {
  position: relative;
  display: grid;
  gap: clamp(1.5rem, 4vw, 4rem);
  margin: 1.5rem 0 2.5rem;
  overflow: hidden;
  border: 1px solid rgb(32 36 45 / 12%);
  border-radius: 1rem;
  background: linear-gradient(135deg, #ffffff 0%, rgb(245 246 249 / 92%) 100%);
  box-shadow: 0 1rem 2.5rem rgb(27 34 47 / 8%);
  padding: clamp(1.5rem, 4vw, 3rem);
}

body .manual-home-hero::before,
body .manual-product-hero::before,
body .manual-overview-hero::before {
  position: absolute;
  top: -8rem;
  right: -7rem;
  width: 20rem;
  height: 20rem;
  border-radius: 50%;
  background: var(--manual-primary-soft);
  content: "";
  pointer-events: none;
}

body .manual-home-hero,
body .manual-product-hero {
  grid-template-columns: minmax(0, 0.85fr) minmax(18rem, 1.15fr);
  align-items: center;
}

/* トップの構成図は資料プレビューとして本文幅で見せ、画像内の文字を読める大きさに保つ。 */
body .manual-home-hero {
  grid-template-columns: minmax(0, 1fr);
  gap: clamp(1.25rem, 3vw, 2.25rem);
}

body .manual-home-hero__copy {
  max-width: 52rem;
}

body .manual-home-hero__copy,
body .manual-product-hero__copy,
body .manual-home-hero__media,
body .manual-product-hero__media,
body .manual-overview-hero > * {
  position: relative;
  z-index: 1;
}

body .manual-home-hero__media,
body .manual-product-hero__media {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 13rem;
  border-radius: 0.75rem;
  background: rgb(255 255 255 / 74%);
  padding: 0.9rem;
}

/* 画像専用の行を設け、横長の構成図をカード内で可能な限り拡大する。 */
body .manual-home-hero__media {
  min-height: 0;
  width: 100%;
  padding: clamp(0.55rem, 1.4vw, 1rem);
}

body .manual-home-hero__media img,
body .manual-product-hero__media img {
  display: block;
  max-height: 20rem;
  width: 100%;
  object-fit: contain;
}

body .manual-home-hero__media img {
  max-height: none;
}

body .manual-product-hero--viewer {
  border-color: rgb(70 82 223 / 24%);
}

body .manual-product-hero--viewer::before {
  background: rgb(70 82 223 / 10%);
}

body .manual-product-points {
  display: grid;
  gap: 0.55rem;
  margin-top: 1.35rem;
}

/* ヒーローの機能一覧は導線の順番と混同しないよう、見出しとドットで示す。 */
body .manual-product-points__label {
  margin-bottom: 0.15rem;
  color: var(--manual-primary);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

body .manual-product-point {
  display: inline-flex;
  align-items: center;
  gap: 0.65rem;
  color: #343740;
  font-size: 0.86rem;
  font-weight: 650;
}

body .manual-product-point__marker {
  flex: 0 0 0.42rem;
  width: 0.42rem;
  height: 0.42rem;
  border-radius: 50%;
  background-color: var(--manual-primary);
  box-shadow: 0 0 0 0.24rem var(--manual-primary-soft);
}

body .manual-feature-card__number,
body .manual-link-card__number,
body .manual-route-card__number {
  color: var(--manual-primary);
  font-size: 0.7rem;
  font-weight: 850;
  letter-spacing: 0.08em;
}

body .manual-section-caption {
  margin: 0 0 0.75rem;
  color: var(--manual-primary);
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

body .manual-product-card {
  display: flex;
  flex-direction: column;
  min-height: 28rem;
  background: #ffffff;
  padding: 1.4rem;
  transition: box-shadow 160ms ease, transform 160ms ease;
}

body .manual-product-card:hover {
  box-shadow: 0 0.85rem 1.8rem rgb(27 34 47 / 14%);
  transform: translateY(-0.15rem);
}

body .manual-card-kicker {
  color: var(--manual-card-primary, var(--manual-primary));
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.12em;
}

body .manual-product-card h3 {
  font-size: 1.45rem;
  margin: 0.45rem 0 0.8rem;
}

body .manual-product-card__image {
  display: block;
  height: 10.5rem;
  width: 100%;
  border-radius: 0.5rem;
  background: #fafafa;
  object-fit: contain;
  padding: 0.5rem;
}

body .manual-product-card p:last-child {
  margin-top: auto;
}

body .manual-product-card .md-button {
  margin-top: 0.65rem;
}

/* Viewerのガイド導線とダウンロード導線をカード内で分けて表示する。 */
body .manual-product-card__actions {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
  margin-top: auto;
}

body .manual-product-card__actions .md-button {
  margin-top: 0;
  text-align: center;
  width: 100%;
}

/* Edgeテーマの共通・導入ページ内でも、Viewerのダウンロード導線はViewer色で表示する。 */
body .manual-install-download {
  --manual-primary: #4652df;
  --manual-accent: #4652df;
}

body .manual-link-grid,
body .manual-feature-grid,
body .manual-overview-route {
  display: grid;
  gap: 0.85rem;
  grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));
  margin: 1rem 0 2.2rem;
}

body .manual-link-card,
body .manual-feature-card,
body .manual-route-card {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 9.5rem;
  border: 1px solid rgb(32 36 45 / 12%);
  border-radius: 0.65rem;
  background: #ffffff;
  color: #2b2e35 !important;
  padding: 1.1rem;
  text-decoration: none;
  transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

body .manual-link-card:hover,
body .manual-link-card:focus-visible,
body .manual-feature-card:hover,
body .manual-feature-card:focus-visible,
body .manual-route-card:hover,
body .manual-route-card:focus-visible {
  border-color: var(--manual-primary);
  box-shadow: 0 0.65rem 1.3rem rgb(27 34 47 / 12%);
  color: #2b2e35 !important;
  outline: none;
  transform: translateY(-0.12rem);
}

body .manual-feature-grid--viewer .manual-feature-card:hover,
body .manual-feature-grid--viewer .manual-feature-card:focus-visible {
  border-color: #4652df;
}

body .manual-link-card h3,
body .manual-feature-card h3 {
  margin: 0.65rem 0 0.35rem;
  color: var(--manual-primary);
  font-size: 1rem;
}

body .manual-link-card p,
body .manual-feature-card p {
  margin: 0;
  color: #5e626d;
  font-size: 0.84rem;
  line-height: 1.65;
}

body .manual-link-card__arrow,
body .manual-feature-card__arrow,
body .manual-route-card__arrow {
  align-self: flex-end;
  margin-top: auto;
  color: var(--manual-primary);
  font-size: 1.1rem;
  font-weight: 800;
}

body .manual-overview-hero {
  display: block;
  margin-bottom: 2rem;
}

body .manual-overview-hero .manual-hero-lead {
  margin: 0.65rem 0 1.25rem;
}

body .manual-overview-route {
  margin-bottom: 0;
}

body .manual-route-card {
  min-height: auto;
  flex-direction: row;
  align-items: center;
  gap: 0.7rem;
  padding: 0.8rem 0.95rem;
}

body .manual-route-card__label {
  font-size: 0.88rem;
  font-weight: 700;
}

body .manual-route-card__arrow {
  margin-left: auto;
}

@media (max-width: 54rem) {
  body .manual-home-hero,
  body .manual-product-hero {
    grid-template-columns: 1fr;
  }

  body .manual-home-hero__media,
  body .manual-product-hero__media {
    min-height: 10rem;
  }
}

@media (max-width: 40rem) {
  body .md-content__inner {
    padding: 1rem 0.8rem 2.5rem;
  }

  body .manual-home-hero,
  body .manual-product-hero,
  body .manual-overview-hero {
    border-radius: 0.75rem;
    padding: 1.1rem;
  }

  body .manual-hero-actions .md-button {
    width: 100%;
    text-align: center;
  }

  body .manual-product-card {
    min-height: 0;
  }
}