/**
 * Renewal /fit モード別テーマCSS
 *
 * 移植元: tmp/mock/app.js の modesData.fit（themeColor, indicatorColor 等）。
 * [data-renewal-layout] 配下かつ [data-mode="fit"] スコープに限定する
 * （tmp/front_layout_unification_plan.md 5章 CSSスコープ規約）。
 */

/* サブナビのヘッダー（インジケーター・タイトル）: fitページ表示時 */
[data-renewal-layout] nav[data-mode="fit"] #nav-indicator {
	background-color: #2563eb;
}

/* CTAボタン（front_nav_items type=button, design=primary/secondary）: fitページ表示時 */
[data-renewal-layout] nav[data-mode="fit"] .nav-cta-btn[data-design="primary"] {
	background: linear-gradient(to right, #2563eb, #4338ca);
	color: #fff;
	box-shadow: 0 4px 6px -1px rgba(37, 99, 235, 0.2);
}
[data-renewal-layout] nav[data-mode="fit"] .nav-cta-btn[data-design="primary"]:hover {
	background: linear-gradient(to right, #3b82f6, #6366f1);
}
[data-renewal-layout] nav[data-mode="fit"] .nav-cta-btn[data-design="secondary"] {
	background-color: #fff;
	color: #1d4ed8;
	border: 1px solid #bfdbfe;
}
[data-renewal-layout] nav[data-mode="fit"] .nav-cta-btn[data-design="secondary"]:hover {
	background-color: #eff6ff;
}

/* ページトップへ戻るボタン: fitモードのアクセントカラー（nav-indicatorと同色）を適用 */
[data-renewal-layout][data-renewal-mode="fit"] .pagetop {
	background-color: #2563eb;
	border: 2px solid #fff;
}
[data-renewal-layout][data-renewal-mode="fit"] .pagetop:hover {
	background-color: #1d4ed8;
}