/* 業務画面の共通スタイル。Bootstrap 5 の上に最小限だけ足す。 */

body { font-size: 0.925rem; }

.table-sticky thead th {
    position: sticky;
    top: 0;
    z-index: 2;
    background-color: var(--bs-body-bg);
    box-shadow: inset 0 -1px 0 var(--bs-border-color);
}

/* 選択件数バー。スクロールしても常に見えるようにする */
.selection-bar {
    position: sticky;
    top: 0;
    z-index: 3;
}

.amount { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.nowrap { white-space: nowrap; }

/*
  長い企業名などで列が広がるのを防ぐ。
  幅の上限を決め、はみ出した分はセル内で横スクロールさせる。
  スクロールバーは出さない（行の高さが変わって表が読みにくくなるため）。
*/
.cell-clip {
    max-width: 9rem;
    overflow-x: auto;
    white-space: nowrap;
    scrollbar-width: none;
    -ms-overflow-style: none;
}
.cell-clip::-webkit-scrollbar { display: none; }
.cell-clip-sm { max-width: 6.5rem; }
.cell-clip-lg { max-width: 12rem; }

/* 補足のある入力ラベル。注記をラベルの右に1行で並べる */
.label-with-note { white-space: nowrap; }
.label-note {
    font-size: 0.8125rem;
    font-weight: 400;
    color: var(--bs-secondary-color);
}

/*
  請求書・見積書・受け書の操作列。
  状態と日時を1行目、ボタンを2行目に置いて横幅を抑える。
*/
.doc-col { width: 1%; white-space: nowrap; }
.doc-meta {
    font-size: 0.75rem;
    line-height: 1.1;
    color: var(--bs-secondary-color);
    margin-bottom: 2px;
    white-space: nowrap;
}
.doc-col .btn { --bs-btn-padding-x: 0.4rem; --bs-btn-font-size: 0.75rem; }

.row-error { background-color: var(--bs-danger-bg-subtle) !important; }
.row-warning { background-color: var(--bs-warning-bg-subtle) !important; }

/* 3層データ（取り込み元 / 補正 / 最終）の比較表 */
.layer-source { color: var(--bs-secondary-color); }
.layer-adjusted { color: var(--bs-primary); font-weight: 600; }
.layer-final { font-weight: 600; }

.loading-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.55);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index: 2000;
}

.preview-frame { width: 100%; height: 80vh; border: 1px solid var(--bs-border-color); }

.wrap-pre { white-space: pre-wrap; word-break: break-word; }

/* ------------------------------------------------------------------
   ドキュメント表示（操作説明書・各種資料）
   ------------------------------------------------------------------ */

.doc-card { transition: box-shadow .15s ease, transform .15s ease; }
.doc-card:hover {
    box-shadow: var(--bs-box-shadow);
    transform: translateY(-1px);
}

/* 目次はスクロールしても追従させる */
.doc-toc { position: sticky; top: 1rem; }
.doc-toc-body { max-height: 60vh; overflow-y: auto; }
.doc-toc .nav-link { color: var(--bs-body-color); border-radius: .25rem; }
.doc-toc .nav-link:hover { background-color: var(--bs-tertiary-bg); }
.doc-toc-l1 { font-weight: 600; }
.doc-toc-l2 { padding-left: 1rem !important; }
.doc-toc-l3 { padding-left: 2rem !important; font-size: .9em; }

.doc-body { font-size: .95rem; line-height: 1.85; }
.doc-body > :first-child { margin-top: 0; }

.doc-body h1 {
    font-size: 1.6rem;
    font-weight: 700;
    padding-bottom: .4rem;
    border-bottom: 2px solid var(--bs-border-color);
    margin-bottom: 1.2rem;
}
.doc-body h2 {
    font-size: 1.25rem;
    font-weight: 700;
    margin-top: 2.2rem;
    padding-bottom: .3rem;
    border-bottom: 1px solid var(--bs-border-color);
}
.doc-body h3 {
    font-size: 1.05rem;
    font-weight: 600;
    margin-top: 1.6rem;
}
.doc-body h4 { font-size: .98rem; font-weight: 600; margin-top: 1.2rem; }

/* 目次から飛んだときに見出しがヘッダーへ隠れないようにする */
.doc-heading { scroll-margin-top: 1rem; }

.doc-body p { margin-bottom: .9rem; }
.doc-body ul, .doc-body ol { margin-bottom: .9rem; padding-left: 1.4rem; }
.doc-body li { margin-bottom: .25rem; }

.doc-body table { font-size: .9rem; }
.doc-body thead th { background-color: var(--bs-tertiary-bg); white-space: nowrap; }
.doc-body td, .doc-body th { vertical-align: top; }

.doc-body code {
    background-color: var(--bs-tertiary-bg);
    padding: .1rem .35rem;
    border-radius: .25rem;
    color: var(--bs-code-color);
    word-break: break-word;
}
.doc-body pre {
    background-color: var(--bs-tertiary-bg);
    border: 1px solid var(--bs-border-color);
    border-radius: .375rem;
    padding: .9rem 1rem;
    overflow-x: auto;
    font-size: .85rem;
    line-height: 1.6;
}
.doc-body pre code { background: none; padding: 0; }

.doc-body blockquote {
    border-left: 4px solid var(--bs-primary);
    background-color: var(--bs-tertiary-bg);
    padding: .7rem 1rem;
    margin: 1rem 0;
    border-radius: 0 .375rem .375rem 0;
}
.doc-body blockquote > :last-child { margin-bottom: 0; }

.doc-body hr { margin: 2rem 0; opacity: .2; }

/* Mermaid の図。
   幅に合わせて縮小すると文字が読めなくなるため、原寸で描画して横スクロールさせる。 */
.doc-body pre.mermaid {
    background: none;
    border: none;
    padding: 1rem 0;
    overflow-x: auto;
    text-align: left;
}
.doc-body pre.mermaid svg {
    /* mermaid は svg に width="100%" を付けるため、原寸にするには width も上書きする */
    max-width: none !important;
    width: auto !important;
    height: auto;
}

/* 印刷時は目次とナビを省く */
@media print {
    .navbar, .doc-toc, .btn { display: none !important; }
    .card { border: none !important; }
    .doc-body { font-size: 10.5pt; }
    .doc-body pre { white-space: pre-wrap; word-break: break-word; }
    .doc-body pre.mermaid svg { max-width: 100% !important; }
    a[href]::after { content: none !important; }
}

/*
  入力補助の候補一覧（取引先・請求先など）。
  入力欄の真下に重ねて出す。件数が多いときはこの中だけスクロールさせる。
*/
[data-suggest] {
    position: relative;
}

.suggest-list {
    position: absolute;
    z-index: 1080;
    top: 100%;
    left: 0;
    right: 0;
    max-height: 15rem;
    overflow-y: auto;
    margin-top: 2px;
    padding: 0;
    background-color: var(--bs-body-bg, #fff);
    border: 1px solid var(--bs-border-color, #dee2e6);
    border-radius: 0.375rem;
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
}

.suggest-item {
    display: block;
    width: 100%;
    padding: 0.3rem 0.6rem;
    border: 0;
    background: none;
    text-align: left;
    font-size: 0.875rem;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.suggest-item:hover,
.suggest-item.is-active {
    background-color: var(--bs-primary-bg-subtle, #cfe2ff);
}

/* 補正理由。値のすぐ下に小さく出す */
.adjust-reason {
    line-height: 1.3;
    word-break: break-word;
}
