/**
 * Bootstrap5 切替に伴う自社CSS(k3.css等)との衝突調整
 *
 * Bootstrap 5の共通ヘッダーから k3.css より後で読み込む。
 * 「BS4では効いていた自社ルールが、BS5の新ルール(CSS変数・特異度変更)に
 * 負けるようになった箇所」だけをここで補正する。発見の経緯は
 * docs/bs5_migration_playbook.md の検証ログ参照。
 */

/* --- グローバルナビ ---------------------------------------------------- */
/* BS5 は .navbar-nav .nav-link.active/.show (0,3,0) に
   --bs-navbar-active-color(黒) を適用し、k3.css の
   .navbar-nav > li.active > a (0,2,2) の白文字が負ける */
.navbar {
    --bs-navbar-active-color: #ffffff;
}
.navbar-nav > li.active > a.nav-link {
    color: #ffffff;
}

/* --- モーダルの z-index ------------------------------------------------- */
/* カスタムビルド(bootstrap5-k3.css)が z-index を BS4 値(backdrop=1040/modal=1050)に
   固定したため、k3.css の .modal{z-index:1041} が BS4 時代と同じ意味で成立する。
   stock BS5(backdrop=1050)前提だった旧補正 .modal{z-index:1055} は撤去 */

/* --- form-group ---------------------------------------------------------- */
/* BS5 は .form-group を削除した。マークアップ側に mb-3 を足す方式は
   mb-3 の !important が「.form-inline .form-group{margin-bottom:0}」(BS4本体)や
   「#form-item-table .form-group{margin-bottom:0}」(k3.css)の打ち消しを破って
   BS4 の見た目を変えるため採用せず、BS4 相当のルールをここで復元する。
   (上書き側は特異度で従来どおり勝つ) */
.form-group {
    margin-bottom: 1rem;
}
@media (min-width: 576px) {
    .form-inline .form-group {
        margin-bottom: 0;
    }
}

/* --- label のデフォルト余白 ---------------------------------------------- */
/* BS5 Reboot は label の margin-bottom(.5rem) と inline-block を削除した。
   個別に .form-label を付与する方式は k3.css の自社定義
   label.form-label { font-size:0.9em; display:block; } と衝突して BS4 の
   見た目を変えてしまうため採用せず、BS4 Reboot 相当をここで復元する */
label {
    display: inline-block;
    margin-bottom: 0.5rem;
}

/* --- hr のBootstrap4互換 ---------------------------------------------- */
/* Bootstrap5のRebootはhrの余白を0にするため、旧form.cssの共通罫線が
   上部へ詰まり、SFA TOPのメニュー下の水平線が見えない位置になる。
   mb-0は従来どおり下余白だけを消せるよう、上下余白と罫線を復元する。 */
hr {
    box-sizing: content-box;
    height: 0;
    margin-top: 16px;
    margin-bottom: 16px;
    border: 0;
    border-top: 1px solid #eeeeee;
}
/* Bootstrap5の.mb-0適用時も、Bootstrap4と同じく上余白は残す。 */
hr.mb-0 {
    margin-top: 16px !important;
}

/* --- bootstrap-select -------------------------------------------------- */
/* BS4のcustom-selectと同じ上下三角の矢印を、同じ位置・サイズで表示する。 */
.form-select {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='4' height='5' viewBox='0 0 4 5'%3e%3cpath fill='%23343a40' d='M2 0L0 2h4zm0 5L0 3h4z'/%3e%3c/svg%3e");
    background-position: right 0.75rem center;
    background-size: 8px 10px;
}

select.form-control.form-select {
    padding-right: 3.6rem; /* BS5 .form-select 相当 */
}

/* BS5のform-selectを付けたselectをbootstrap-selectでラップすると、
   生成されたラッパーにもform-selectが引き継がれる。下矢印は内部の
   dropdown-toggleだけに任せ、ラッパー側の背景矢印は消す。 */
.bootstrap-select.form-select {
    background-image: none;
}

/* Bootstrap 4 の col-md-4 は flex-basis/max-width で3列を保っていたが、
   Bootstrap 5 は width 指定へ変わった。後から定義される .input-group の
   width:100% に負けないよう、グリッド列を兼ねる入力グループを旧仕様へ揃える。 */
@media (min-width: 768px) {
    .row > .input-group.col-md-4 {
        flex: 0 0 33.33333333%;
        max-width: 33.33333333%;
        width: 33.33333333%;
    }
}

/* --- striped table の互換 ------------------------------------------------ */
/* BS5はセルに、旧Bootstrap/k3.cssは行にストライプを描画する。
   通常のテーブルはセル影を止め、旧Bootstrapと同じ行背景だけを残す。 */
table.table-striped:not(.dataTable) > tbody > tr:nth-of-type(odd):not(:hover):not(.selected):not(.waiting-user) > * {
    box-shadow: none !important;
}
/* 旧DataTablesは行背景ではなくセルのinset影でストライプを描画する。
   BS5の既定値(0.05)をBS4/k3.cssの値(0.03)へ揃える。 */
table.dataTable.table-striped > tbody > tr.odd:not(:hover):not(.selected):not(.waiting-user) > * {
    box-shadow: rgba(0, 0, 0, 0.03) 0 0 0 9999px inset !important;
}
/* DataTablesでは旧Bootstrap4と同じく、行背景とセル影を二重に重ねない。 */
table.dataTable.table-striped > tbody > tr.odd:not(:hover):not(.selected):not(.waiting-user) {
    background-color: transparent !important;
}
/* --- テーブル罫線 ------------------------------------------------------ */
/* BS5のrebootでtable-borderedの左端だけ本文色を継承するため、
   FixedColumnsの境界が黒く見える。BS4と同じ罫線色に統一する。 */
table.table-bordered > :not(caption) > * > * {
    border-color: #dee2e6;
    border-width: 1px;
}
/* Bootstrap 4のtable-borderedは左端セルの左罫線を持たない。
   DataTablesのチェック列でも同じ幅にし、固定列のずれを防ぐ。 */
table.dataTable.table-bordered > :not(caption) > * > :first-child {
    border-left-width: 0;
}
/* Bootstrap 5 は各セルの下罫線を持つが、Bootstrap 4 の DataTables は
   上罫線だけで行を区切る。二重に高さを取らないよう旧仕様へ揃える。 */
table.dataTable.table-bordered > tbody > tr > * {
    border-bottom-width: 0;
}
/* BS5は横罫線を行(tr)に、縦罫線をセルに分けて持つため、trのborder-color
   が本文色(#333)を継承して黒線になる。BS4と同じく罫線をセルへ集約する。 */
table.table-bordered > :not(caption) > * {
    border-color: #dee2e6;
    border-width: 0;
}
table.table-bordered {
    border: 1px solid #dee2e6;
}

/* --- DataTables -------------------------------------------------------- */
/* BS5版DataTablesの件数セレクトはform-select-smになるため、
   BS4版の件数表示と同じ文字サイズ・高さに戻す。 */
.dataTables_length select.form-select-sm {
    font-size: 1.3rem;
    height: 3.2rem;
    padding: 0.6rem 1.2rem;
}

/* 選択中ページは、背景色と同じ色にならないよう白文字にする。 */
.dataTables_wrapper .pagination .page-item.active .page-link {
    color: #ffffff;
}

/* data-container="body" の一時コンテナにも selectpicker/form-select が残り、
   共通の width:100% で担当者候補メニューが画面幅まで拡大するのを防ぐ。 */
body > .bs-container.bootstrap-select.selectpicker {
    right: auto !important;
    width: auto !important;
}
body > .bs-container.bootstrap-select.selectpicker > .dropdown-menu {
    width: auto !important;
    max-width: calc(100vw - 20px);
}
/* --- ナビゲーション上のアカウント名 ------------------------------- */
/* BS5の.navbar-textが黒系の文字色を明示するため、旧ナビバー色を再指定する。 */
.navbar .navbar-text {
    color: #c4c4c4;
}

/* --- 旧Bootstrapバッジの色 ------------------------------------------ */
/* BS5では .badge-info/.badge-danger が廃止され、旧クラスを残す画面で
   背景色が消える。また text-bg-info の色もBS4と異なるため、共通で
   BS4時代の意味色に戻す。画面単位ではなく旧クラスを使う全画面に適用する。 */
.badge.badge-info {
    --bs-badge-bg: #5bc0de;
    background-color: #5bc0de !important;
    color: #ffffff !important;
}
.badge.badge-danger {
    --bs-badge-bg: #dc3545;
    background-color: #dc3545 !important;
    color: #ffffff !important;
}
.badge.badge-secondary {
    --bs-badge-bg: #8f8f8f;
    background-color: #8f8f8f !important;
    color: #ffffff !important;
}

/* 活用ヒントカルーセル: BS5の [data-bs-target] 白バーを、K3の丸ドットに戻す */
#slide_usage_hint.carousel .carousel-indicators {
    top: 250px;
    right: auto;
    bottom: auto;
    left: 50%;
    z-index: 15;
    display: block;
    width: 60%;
    margin: 0 0 0 -30%;
    padding-left: 0;
    list-style: none;
    text-align: center;
}
#slide_usage_hint.carousel .carousel-indicators [data-bs-target] {
    display: inline-block;
    box-sizing: content-box;
    flex: none;
    width: 11px;
    height: 11px;
    margin: 1px;
    padding: 0;
    text-indent: -999px;
    cursor: pointer;
    background-color: transparent;
    background-clip: border-box;
    border: 1px solid #ccc;
    border-top-width: 1px;
    border-bottom-width: 1px;
    border-radius: 10px;
    opacity: 1;
}
#slide_usage_hint.carousel .carousel-indicators .active {
    margin: 0;
    width: 13px;
    height: 13px;
    background-color: #ccc;
}

/*bs5ではbtn-checkにスタイルがデフォルトで当たっているためbs5-adjust.cssで表示されるようcssを上書き*/
div.btn-check,
label.btn-check {
    position: static;
/*clipは非推奨であるが、bootstrap5-k3.cssにデフォルトで記述されているため↓の記述で打ち消す処理をする*/
    clip: auto;
    pointer-events: auto;
}

/* BS5 は .form-check 内 input を margin-left:-1.5em で左 gutter に食い込ませる。
   .btn-check の padding で gutter が潰れると、チェックが枠外へ出て
   scroll-box の overflow-x:hidden で切れる。BS4 の form-check-inline 相当に戻す処理。 */
.form-check-inline .form-check-input {
    float: none;
    position: static;
    margin-top: 0;
    margin-left: 0;
    margin-right: 0.3125rem;
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
}

/*ma、sfaのトップページヘッダー箇所のプルダウンの選択項目箇所において、bs5だとbottomに余白が出るのを打ち消すcss*/
.dropdown-menu{
    --bs-dropdown-spacer: 0rem;
}

.form-check-inline:not(.btn-check) {
    padding-left: 0;
}

.navbar-toggler{
    border: 1px solid transparent;
}
.navbar-toggler:focus {
    box-shadow: none;
}

/* --- カスタムビルドへ移管した旧補正(撤去済み) ----------------------------- */
/* 以下は stock BS5 CDN 前提の補正だったが、bootstrap5-k3.css が変数で解決するため撤去:
   - リンク下線(a{text-decoration:none}) → $link-decoration:none
   - スクロール挙動(:root{scroll-behavior:auto}) → $enable-smooth-scroll:false
   - 負マージン(.mx-n2等の個別定義) → $enable-negative-margins:true で全ユーティリティ生成 */