/* 鷹フル お気に入り記事保存 — 仕様: ~/ai_wiki/taka-full/お気に入り記事保存機能-仕様.md */

/* ---------------------------------------------------------------------------
 * 記事ヘッダーの保存ボタン（.s-entry-header__meta に JS が <li> を差し込む）
 * ------------------------------------------------------------------------ */
.s-entry-header__meta-favorite {
	margin-left: auto;
}

.c-favorite-btn {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	height: 36px;
	padding: 0 6px;
	border: 0;
	background: none;
	cursor: pointer;
	color: #999;
	font-size: 13px;
	line-height: 1;
	transition: color .15s ease, transform .15s ease;
}

.c-favorite-btn:hover {
	color: #e0334c;
}

.c-favorite-btn:active {
	transform: scale(.94);
}

.c-favorite-btn svg {
	flex: 0 0 auto;
	width: 22px;
	height: 22px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.8;
	stroke-linejoin: round;
	stroke-linecap: round;
}

.c-favorite-btn__label {
	white-space: nowrap;
}

/* 保存済み。塗りつぶしで表す。 */
.c-favorite-btn.is-saved {
	color: #e0334c;
}

.c-favorite-btn.is-saved svg {
	fill: currentColor;
	stroke: currentColor;
}

/* 通信中は連打を視覚的にも止める。 */
.c-favorite-btn.is-busy {
	opacity: .4;
	pointer-events: none;
}

/* ---------------------------------------------------------------------------
 * マイページの「保存した記事」
 *
 * この一覧は the_content 経由で本文コンテナ .c-wp-post の中にのみ差し込まれる。
 * .c-wp-post は本文用のタイポグラフィを持っており（ul に list-style:disc＋インデント、
 * li に display:list-item、見出しに font-size:1.9rem、a に text-decoration:underline …）、
 * いずれも `.c-wp-post ul:not(…)` 等で単一クラスより詳細度が高い。素の
 * `.c-favorite-list` では負けて、bullet が出る・ボタンが行の下に落ちる・タイトルが
 * リンク下線付きで巨大化する、といった崩れになる（PC/SP 共通・実機で確認）。
 * そこで一覧側は全ルールを .c-wp-post スコープにし、必要な箇所は要素型やセクションを
 * 重ねてテーマの本文ルールを上回る詳細度にして打ち消す（!important は使わない）。
 * ------------------------------------------------------------------------ */
.c-wp-post .c-favorite-section {
	margin: 40px 0;
}

.c-wp-post .c-favorite-section__title {
	margin: 0 0 16px;
	font-size: 18px;
	line-height: 1.4;
	font-weight: bold;
}

/* .c-wp-post ul:not(.c-article-*__meta) (詳細度 0,0,2,1) を上回るため
   セクション＋要素型を重ねて 0,0,3,1 にする。 */
.c-wp-post .c-favorite-section ul.c-favorite-list {
	margin: 0;
	padding: 0;
	list-style: none;
}

/* .c-wp-post li:not(…) の display:list-item（0,0,2,2）を上回る（0,0,3,1）。 */
.c-wp-post .c-favorite-section li.c-favorite-list__item {
	display: flex;
	align-items: center;
	gap: 12px;
	margin: 0;
	padding: 12px 0;
	border-bottom: 1px solid #e5e5e5;
}

/* .c-wp-post a の text-decoration:underline（0,0,1,1）を上回る（0,0,2,1）。 */
.c-wp-post a.c-favorite-list__link {
	display: flex;
	align-items: center;
	gap: 12px;
	flex: 1;
	min-width: 0;
	color: inherit;
	text-decoration: none;
}

.c-wp-post .c-favorite-list__thumb {
	flex: 0 0 96px;
	width: 96px;
	height: 64px;
	margin: 0;
	overflow: hidden;
	background: #f0f0f0;
}

.c-wp-post .c-favorite-list__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

.c-wp-post .c-favorite-list__body {
	min-width: 0;
}

/* .c-wp-post h3（font-size:1.9rem・0,0,1,1）を上回る（0,0,2,0）。 */
.c-wp-post .c-favorite-list__title {
	margin: 0 0 4px;
	font-size: 14px;
	line-height: 1.5;
	font-weight: normal;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.c-wp-post .c-favorite-list__date {
	font-size: 12px;
	color: #888;
}

/* 一覧からの解除。ボタンの塗り状態は記事ページと共通クラスで扱う。 */
.c-wp-post .c-favorite-list__remove {
	flex: 0 0 auto;
}

.c-wp-post .c-favorite-message {
	padding: 24px 0;
	font-size: 14px;
	color: #666;
	text-align: center;
}

/* ---------------------------------------------------------------------------
 * トースト
 * ------------------------------------------------------------------------ */
.c-favorite-toast {
	position: fixed;
	left: 50%;
	bottom: 24px;
	z-index: 10000;
	max-width: calc(100% - 32px);
	padding: 12px 20px;
	border-radius: 4px;
	background: rgba(30, 30, 30, .92);
	color: #fff;
	font-size: 13px;
	line-height: 1.5;
	text-align: center;
	transform: translate(-50%, 8px);
	opacity: 0;
	transition: opacity .2s ease, transform .2s ease;
	pointer-events: none;
}

.c-favorite-toast.is-visible {
	transform: translate(-50%, 0);
	opacity: 1;
}
