/*
 * Basketball Freak Transaction Database
 *
 * すべてのセレクタを .bf-txn 配下に限定する。既存サイトへ影響させない。
 * .bf-sal（Salary DB由来のデザイントークン）が読み込まれていれば流用し、
 * 無くても単体で成立するよう既定値を持つ。
 * スマホ優先。320pxで横に溢れない。表・カードは横スクロールさせない。
 */

.bf-txn {
	--txn-ink:    var(--bf-sal-ink,    #16161a);
	--txn-ink-2:  var(--bf-sal-ink-2,  #4a4a55);
	--txn-ink-3:  var(--bf-sal-ink-3,  #6d6d7a);
	--txn-bg:     var(--bf-sal-bg,     #ffffff);
	--txn-bg-2:   var(--bf-sal-bg-2,   #f6f6f8);
	--txn-bg-3:   var(--bf-sal-bg-3,   #eeeef2);
	--txn-line:   var(--bf-sal-line,   #dcdce3);
	--txn-accent: var(--bf-sal-accent, #17408B);
	--txn-red:    #C8102E;
	--txn-radius: 10px;
	font-size: 14px;
	line-height: 1.7;
}

.bf-txn *, .bf-txn *::before, .bf-txn *::after { box-sizing: border-box; }

.bf-txn-hero__eyebrow { margin: 0; font-size: 11px; font-weight: 700; letter-spacing: .12em; color: var(--txn-accent); }
.bf-txn-hero__title { margin: 4px 0; font-size: 22px; line-height: 1.25; text-wrap: balance; }
.bf-txn-hero__tag { margin: 0 0 8px; font-size: 12px; font-weight: 700; color: var(--txn-ink-3); }
.bf-txn-lead { margin: 0 0 18px; color: var(--txn-ink-2); }

/* ---------- 検索フォーム ---------- */

.bf-txn-search {
	border: 1px solid var(--txn-line);
	border-radius: var(--txn-radius);
	background: var(--txn-bg-2);
	padding: 14px;
	margin: 0 0 16px;
}

.bf-txn-search__row { display: flex; flex-direction: column; gap: 6px; margin: 0 0 10px; }
.bf-txn-search__row--filters { flex-direction: row; flex-wrap: wrap; align-items: flex-end; gap: 10px; }
.bf-txn-search__label { font-size: 12px; font-weight: 700; color: var(--txn-ink-2); }

.bf-txn-search__input {
	min-height: 44px;
	padding: 0 12px;
	border: 1px solid var(--txn-line);
	border-radius: 8px;
	background: var(--txn-bg);
	color: var(--txn-ink);
	font: inherit;
	font-size: 14px;
}

.bf-txn-search__sub { display: flex; flex-direction: column; gap: 4px; font-size: 11px; font-weight: 700; color: var(--txn-ink-3); }

.bf-txn-search__select {
	min-height: 44px;
	padding: 0 10px;
	border: 1px solid var(--txn-line);
	border-radius: 8px;
	background: var(--txn-bg);
	color: var(--txn-ink);
	font: inherit;
	font-size: 13px;
}

.bf-txn-search__go {
	min-height: 44px;
	padding: 0 20px;
	border: none;
	border-radius: 8px;
	background: var(--txn-accent);
	color: #fff;
	font: inherit;
	font-weight: 700;
	font-size: 13px;
	cursor: pointer;
}
.bf-txn-search__go:hover { opacity: .9; }

.bf-txn-chips { display: flex; flex-wrap: wrap; gap: 6px; }

.bf-txn-chip {
	display: inline-flex;
	align-items: center;
	min-height: 36px;
	padding: 0 14px;
	border: 1px solid var(--txn-line);
	border-radius: 999px;
	background: var(--txn-bg);
	color: var(--txn-ink-2);
	font-size: 12.5px;
	font-weight: 700;
	text-decoration: none;
}
.bf-txn-chip.is-on { background: var(--txn-accent); border-color: var(--txn-accent); color: #fff; }
.bf-txn-chip:hover { text-decoration: none; }

.bf-txn-count { margin: 0 0 10px; font-size: 12px; color: var(--txn-ink-3); }
.bf-txn-empty { padding: 24px; text-align: center; color: var(--txn-ink-3); border: 1px dashed var(--txn-line); border-radius: var(--txn-radius); }

/* ---------- 一覧 ---------- */

.bf-txn-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }

.bf-txn-row {
	border: 1px solid var(--txn-line);
	border-left: 6px solid var(--txn-accent);
	border-radius: var(--txn-radius);
	background: var(--txn-bg);
	padding: 12px 14px;
}

.bf-txn-row__head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 6px; }
.bf-txn-row__date { font-size: 11.5px; color: var(--txn-ink-3); font-variant-numeric: tabular-nums; }

.bf-txn-row__type {
	display: inline-flex;
	align-items: center;
	padding: 2px 10px;
	border-radius: 999px;
	background: var(--txn-bg-3);
	color: var(--txn-ink-2);
	font-size: 11px;
	font-weight: 700;
}
.bf-txn-row__type--trade { background: #eef2fb; color: var(--txn-accent); }
.bf-txn-row__type--signing,
.bf-txn-row__type--resign,
.bf-txn-row__type--extension,
.bf-txn-row__type--two_way,
.bf-txn-row__type--ten_day,
.bf-txn-row__type--exhibit_10 { background: #fbeef0; color: var(--txn-red); }

.bf-txn-row__status { font-size: 11px; color: #c97a00; font-weight: 700; }

.bf-txn-row__headline { margin: 0 0 8px; font-weight: 700; font-size: 14.5px; }

.bf-txn-row__teams { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 8px; }

.bf-txn-teamchip {
	display: inline-flex;
	align-items: center;
	min-height: 30px;
	padding: 0 10px;
	border-radius: 999px;
	border: 1px solid var(--txn-line);
	background: var(--txn-bg-2);
	color: var(--txn-accent);
	font-size: 12px;
	font-weight: 700;
	text-decoration: none;
}
.bf-txn-teamchip:hover { background: var(--txn-bg-3); text-decoration: none; }
.bf-txn-teamchip--plain { color: var(--txn-ink-2); cursor: default; }

.bf-txn-row__assets { list-style: none; margin: 0 0 8px; padding: 0; display: flex; flex-direction: column; gap: 4px; }

.bf-txn-asset {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 10px;
	padding: 6px 10px;
	border-radius: 8px;
	background: var(--txn-bg-2);
	font-size: 12.5px;
}

.bf-txn-asset__type { font-weight: 700; color: var(--txn-ink-3); font-size: 11px; }
.bf-txn-asset__label { font-weight: 700; }
.bf-txn-asset__flow { color: var(--txn-ink-3); font-variant-numeric: tabular-nums; }
.bf-txn-asset__contract { color: var(--txn-accent); font-weight: 700; margin-left: auto; }

.bf-txn-row__notes { margin: 0 0 8px; font-size: 12px; color: var(--txn-ink-3); }

.bf-txn-row__links { margin: 0; }
.bf-txn-row__link {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	min-height: 36px;
	font-size: 12.5px;
	font-weight: 700;
	color: var(--txn-accent);
	text-decoration: none;
}
.bf-txn-row__link:hover { text-decoration: underline; }

/* ---------- ページ送り ---------- */

.bf-txn-pager { display: flex; flex-wrap: wrap; gap: 6px; margin: 16px 0; }
.bf-txn-pager__a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	min-height: 40px;
	border: 1px solid var(--txn-line);
	border-radius: 8px;
	color: var(--txn-ink-2);
	text-decoration: none;
	font-size: 13px;
	font-weight: 700;
}
.bf-txn-pager__a.is-on { background: var(--txn-accent); border-color: var(--txn-accent); color: #fff; }

/* ---------- 免責 ---------- */

.bf-txn-disc {
	margin: 24px 0 0;
	padding: 12px 14px;
	border-top: 1px solid var(--txn-line);
	font-size: 11.5px;
	color: var(--txn-ink-3);
	line-height: 1.8;
}

/* ---------- Team Hub 連携（class-bf-hub-* 側で使う） ---------- */

.bf-hub-txn { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.bf-hub-txn__row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	padding: 8px 10px;
	border: 1px solid var(--bf-sal-line, #dcdce3);
	border-radius: 8px;
	font-size: 12.5px;
}
.bf-hub-txn__date { color: var(--bf-sal-ink-3, #6d6d7a); font-variant-numeric: tabular-nums; }
.bf-hub-txn__type {
	padding: 1px 8px;
	border-radius: 999px;
	background: var(--bf-sal-bg-3, #eeeef2);
	font-size: 10.5px;
	font-weight: 700;
}
.bf-hub-txn__headline { font-weight: 700; flex: 1 1 auto; min-width: 0; }

/* ---------- 320px 以下の保険 ---------- */

@media (max-width: 340px) {
	.bf-txn-search__row--filters { flex-direction: column; align-items: stretch; }
	.bf-txn-asset__contract { margin-left: 0; }
}

/* ---------- 広い画面 ---------- */

@media (min-width: 900px) {
	.bf-txn-list { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
}