/* 全体の余白と行間を少しゆったり */
body {
    letter-spacing: 0.2px;
}

.page-header {
    gap: 1rem;
}

/* カード・テーブルの見た目アップ */
.card {
    border-radius: 1rem;
}

    .card .card-header {
        font-weight: 600;
    }

.table {
    --bs-table-bg: #fff;
}

.table-hover tbody tr:hover {
    background: #f7fafc;
}

/* 操作ボタンの並びをきれいに */
.action-bar {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}

/* フォーム要素の余白 */
.form-label {
    font-weight: 600;
}

.form-control, .form-select {
    border-radius: .7rem;
}

/* ページネーションの抑えめデザイン */
.pagination .page-link {
    border-radius: .5rem;
}

/* 小ぶりなセクション間の余白 */
.section {
    margin-bottom: 1.5rem;
}

/* ヘッダの影を少し強めに */
.navbar.shadow-sm {
    box-shadow: 0 0.5rem 1rem rgba(0,0,0,.05) !important;
}
/* ドロップゾーン */
.dropzone {
    border: 2px dashed rgba(0,0,0,.15);
    border-radius: 1rem;
    background: #f8fafc;
    transition: border-color .2s, background .2s;
}

    .dropzone.dragover {
        border-color: var(--bs-primary);
        background: #eef6ff;
    }

/* ファイル名表示 */
#fileName {
    min-height: 1.5rem;
}

/* 視覚的ラベルボタンの余白調整（Bootstrapに沿う） */
label[for="rateCsv"].btn {
    cursor: pointer;
}
/* === MasterSets 一覧の磨き === */
.card .table thead th {
    font-weight: 600;
}

.card .table tbody tr:hover {
    background: #f7fafc;
}

/* ヘッダ行を少し強調（theadが無い場合は .table-bordered を付与済） */
.card .table thead {
    background: #f9fbfd;
}

/* ソフトバッジ（必要なら使えるように） */
.badge-soft {
    background: rgba(0,0,0,.05);
    border: 1px solid rgba(0,0,0,.08);
    font-weight: 500;
    color: #495057;
}

/* テーブル内アイコンの行間調整 */
.table i.bi {
    vertical-align: -0.075em;
}
/* ------ sticky table header ------ */
/*.table-sticky thead th {
    position: sticky;
    top: 0;
    z-index: 2;*/ /* 見出しがボディより上に来るように */
/*background: #f8f9fa;*/ /* Bootswatch Flatly に馴染む薄グレー */
/*box-shadow: 0 1px 0 rgba(0,0,0,.05);
}*/

/*    .table-sticky thead th:first-child {
        left: 0;
        z-index: 3;
    }
*/
/* 価格列と操作列の幅を揃えて余白を作る */
.price-col {
    width: 120px;
}
/* 必要なら 110~140pxで微調整 */
.actions-col {
    width: 200px;
}
/* ボタン2個でも折り返さない幅に */

/* テーブル：ヘッダ固定（.table-sticky を付けたテーブルで有効） */
.table-sticky thead th {
    position: sticky;
    top: 0;
    z-index: 1;
    background: #fff; /* ヘッダの背景を不透明に */
    box-shadow: inset 0 -1px 0 rgba(0,0,0,.05); /* 罫線の見栄え補強 */
}

/* 列幅のガイド（必要に応じて微調整） */
.table-sticky col.price-col {
    width: 9rem; /* 単価/金額列：やや狭めで右寄せと相性良し */
}

.table-sticky col.actions-col {
    width: 12rem; /* 操作列：ボタン1-2個を想定 */
}

/* 文字の上下中央寄せ（align-middle と同じだが念のため） */
.table-sticky th,
.table-sticky td {
    vertical-align: middle;
}

/* カードの内側スクロール時のスクロールバー見やすさ（任意） */
.table-responsive {
    scrollbar-gutter: stable;
}

/* ====== 追加：数値列の統一スタイル（全画面共通） ====== */
td.num {
    text-align: right;
    padding-right: .75rem;
    font-variant-numeric: tabular-nums;
}

th.num-title {
    text-align: center;
}

.table-fixed {
    table-layout: fixed;
}

.stat {
    padding: .6rem .9rem;
}

.table th, .table td {
    padding-top: .5rem;
    padding-bottom: .5rem;
}

/* カード見出しの右側アクションを常に右端へ */
.card-header .header-actions {
    margin-left: auto; /* ← これで必ず右端へ */
    display: flex;
    align-items: center;
    gap: .5rem;
    white-space: nowrap; /* 折り返し防止 */
}

/* 折りたたみトグル（表示/非表示）を“濃い色の塗りボタン”に統一 */
.card-header .header-actions [data-bs-toggle="collapse"] {
    background-color: var(--bs-primary);
    color: #fff;
    border-color: var(--bs-primary);
    font-weight: 600;
}

.card-header .header-actions [data-bs-toggle="collapse"]:hover {
    filter: brightness(0.95);
    color: #fff;
}

.card-header .header-actions [data-bs-toggle="collapse"]:focus {
    outline: none;
    box-shadow: 0 0 0 .2rem rgba(13,110,253,.25); /* Bootstrap primaryのフォーカス風 */
}