/* Ayato Network テーマ 追加スタイル(app.cssの補完) */

/* ハニーポット(スパム対策)を確実に非表示 */
input[name="ayato_hp"] {
	display: none !important;
}

/* Squareカード入力欄のコンテナ(ダーク背景上でカード欄を見やすく) */
#card-container {
	min-height: 44px;
	background: #ffffff;
	border: 1px solid #3f3f46;
	border-radius: 0.5rem;
	padding: 0.5rem 0.75rem;
}

/* 会員登録 確認画面: 利用規約スクロールボックス
   (Tailwindのpreflightでリスト装飾がリセットされるため個別に指定) */
.ayato-terms-scroll {
	height: 200px;
	overflow-y: auto;
	background: #18181b;       /* zinc-900 */
	border: 1px solid #27272a; /* zinc-800 */
	border-radius: 0.5rem;
	padding: 0.875rem 1rem;
	font-size: 12px;
	line-height: 1.8;
	color: #d4d4d8;            /* zinc-300 */
}
.ayato-terms-scroll p { margin: 0 0 0.6em; }
.ayato-terms-scroll p:last-child { margin-bottom: 0; }
.ayato-terms-scroll strong { color: #fafafa; font-weight: 700; }
.ayato-terms-scroll ul,
.ayato-terms-scroll ol { padding-left: 1.3em; margin: 0 0 0.6em; }
.ayato-terms-scroll ul { list-style: disc; }
.ayato-terms-scroll ol { list-style: decimal; }
.ayato-terms-scroll li { margin-bottom: 0.35em; }

/* リーガル文書(利用規約・重要事項説明・特商法・プライバシーポリシー)の本文
   ayato_legal_format() が出力する見出し/段落の体裁。文言は変えず可読性だけを整える */
.ayato-legal-body .ayato-legal-p {
	margin: 0 0 1.15em;
	line-height: 1.95;
}
.ayato-legal-body .ayato-legal-p:last-child { margin-bottom: 0; }
.ayato-legal-body .ayato-legal-h {
	margin: 2.4em 0 0.9em;
	padding-left: 0.65em;
	border-left: 3px solid #f59e0b; /* amber-500 */
	font-size: 1rem;
	font-weight: 700;
	line-height: 1.55;
	color: #fafafa;
	scroll-margin-top: 5rem;
}
.ayato-legal-body > .ayato-legal-h:first-child { margin-top: 0; }

/* 箇条書き(1. / 1．/（1）/ ・)のぶら下げインデント:
   折り返した2行目以降が番号の直後(本文の書き出し位置)に揃う。
   番号側は white-space:pre で「2. 」の後続スペース幅まで原文どおり保持する */
.ayato-legal-li {
	display: flex;
	align-items: baseline;
}
.ayato-legal-li .ayato-legal-num {
	flex: 0 0 auto;
	white-space: pre;
}
.ayato-legal-li .ayato-legal-txt {
	flex: 1 1 auto;
	min-width: 0;
}

/* 申込確認画面のスクロールボックス内は行間・余白を詰める */
.ayato-terms-scroll .ayato-legal-p { margin: 0 0 0.7em; line-height: 1.8; }
.ayato-terms-scroll .ayato-legal-h {
	margin: 1.4em 0 0.5em;
	padding-left: 0.5em;
	border-left: 2px solid #f59e0b;
	font-size: 12px;
	font-weight: 700;
	line-height: 1.6;
	color: #fafafa;
}
.ayato-terms-scroll .ayato-legal-title { margin: 0 0 0.8em; }
.ayato-terms-scroll .ayato-legal-title + .ayato-legal-h { margin-top: 0; }

/* 都道府県タイル(会員登録・マイページ): スマホでのタップを確実にする
   - touch-action: manipulation … ダブルタップズーム判定によるタップ遅延・取りこぼしを防ぐ
   - tap-highlight … タップした瞬間にアンバーのハイライトを出し、反応を分かりやすくする */
[data-branch-select],
#branch-map-toggle {
	touch-action: manipulation;
	-webkit-tap-highlight-color: rgba(245, 158, 11, 0.3);
}

/* モバイルメニュー展開中の背景オーバーレイ
   ヘッダー(z-50)内に置いた fixed 要素のため、ページ本文より上・
   ヘッダーバーとメニューより下になるよう「ヘッダー内の」重なり順で制御する。
   背後のページをぼかし+暗転してメニューと背景を見分けやすくする。
   タップでメニューを閉じる */
.ayato-menu-backdrop {
	position: fixed;
	inset: 0;
	z-index: 1; /* ヘッダー内: バー/メニュー(z-index:2)より下 */
	background: rgba(0, 0, 0, 0.6);
	-webkit-backdrop-filter: blur(5px);
	backdrop-filter: blur(5px);
}
/* ヘッダーバーとメニュー本体はオーバーレイより上に出す */
#header-nav > :not(.ayato-menu-backdrop) {
	position: relative;
	z-index: 2;
}

/* WordPress管理バー表示時のヘッダー位置補正(管理者のみ) */
body.admin-bar .sticky.top-0 {
	top: 32px;
}
@media screen and (max-width: 782px) {
	body.admin-bar .sticky.top-0 {
		top: 46px;
	}
}

/* datetime-local など日本語UIで高さが揃わない入力の補正 */
input[type="datetime-local"] {
	min-height: 38px;
}

/* レスポンシブ表示切替ユーティリティ
   (コンパイル済みapp.cssに md:block / md:hidden が含まれていないため補完。
    ヒーロー画像のPC/SP出し分けと追従CTAバナーで使用) */
@media (min-width: 768px) {
	.md\:block {
		display: block;
	}
	.md\:hidden {
		display: none;
	}
	/* トップページの特徴カード3枚を均等3列に */
	.md\:grid-cols-3 {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

/* 申請ボタン等のラベル折り返し防止(コンパイル済みCSSに未収録のため補完) */
.whitespace-nowrap {
	white-space: nowrap;
}

/* sm:(640px以上)で幅を内容に合わせる。ボタンが横並びで潰れるのを防ぐ */
@media (min-width: 40rem) {
	.sm\:w-auto {
		width: auto;
	}
}

/* ============================================================
   新デザイン フッター(全ページ共通)
   lp.css(トップのみ読込)のフッター定義を全ページで使えるよう転記
   ============================================================ */
footer.lp-footer {
	background: #060708;
	border-top: 1px solid #242629;
	padding: 45px max(5vw, 30px) 25px;
	margin-top: auto;
}
footer.lp-footer .to-top {
	text-align: right;
	color: #ffd900;
	margin-bottom: 30px;
	font-size: 11px;
	display: block;
}
footer.lp-footer .footer-grid {
	display: grid;
	grid-template-columns: 2fr 1fr 1.3fr 1fr;
	gap: 50px;
}
footer.lp-footer .footer-grid h3 {
	font-size: 19px;
	color: #f5f5f5;
	font-weight: 700;
	line-height: 1.5;
	margin: 0;
}
footer.lp-footer .footer-grid h4 {
	color: #ddd;
	font-size: 13px;
	font-weight: 700;
	margin: 0;
}
footer.lp-footer .footer-grid p,
footer.lp-footer .footer-grid a {
	color: #8f9091;
	text-align: left;
	background: none;
	border: 0;
	margin: 8px 0;
	padding: 0;
	font-size: 10px;
	line-height: 1.8;
	display: block;
	text-decoration: none;
}
footer.lp-footer .footer-grid a:hover {
	color: #ffd900;
}
footer.lp-footer .footer-legal-note {
	color: #5f6163;
	margin: 35px 0 0;
	font-size: 9px;
	line-height: 1.8;
}
footer.lp-footer .copyright {
	color: #5f6163;
	margin-top: 14px;
	font-size: 9px;
}
@media (max-width: 900px) {
	footer.lp-footer .footer-grid {
		grid-template-columns: 1fr 1fr;
		gap: 30px;
	}
}
@media (max-width: 560px) {
	footer.lp-footer .footer-grid {
		grid-template-columns: 1fr;
	}
}


/* ============================================================
   2026-08-27 動作確認による修正
   ============================================================ */

/* [No.9] リーガル文書中の長いURLがスマホで画面外へはみ出す対策。
   本文に含まれる Square のURL(58文字)が改行されず、
   iPhone標準幅(375px)で+33px、iPhone SE(320px)で+88pxはみ出していた。 */
.ayato-legal-body,
.ayato-legal-body .ayato-legal-p,
.ayato-legal-body .ayato-legal-txt,
.ayato-terms-scroll {
	overflow-wrap: anywhere;
	word-break: normal;
}

/* [No.3] iOS Safari は font-size が16px未満の入力欄にフォーカスすると
   画面を自動拡大し、そのまま戻らない。スマホ幅では16pxを保証する。
   (PC表示は従来どおりのサイズを維持するためスマホ幅のみ適用) */
@media (max-width: 767px) {
	input[type="text"],
	input[type="email"],
	input[type="tel"],
	input[type="password"],
	input[type="number"],
	input[type="search"],
	input[type="url"],
	input[type="date"],
	input[type="datetime-local"],
	textarea,
	select {
		font-size: 16px;
	}
}

/* [No.7] iOSのアドレスバー分のズレ対策(Tailwindの min-h-screen 相当) */
@supports (min-height: 100dvh) {
	.min-h-screen { min-height: 100dvh }
}

/* [新規] 情報提供・告知申請の申請ボタンが iPhone SE(320px)で
   +49px はみ出していた。狭い画面ではラベルの折り返しを許可する。 */
@media (max-width: 360px) {
	[data-apply-submit] {
		white-space: normal;
		padding-left: 1rem;
		padding-right: 1rem;
	}
	[data-apply-submit] span { white-space: normal }
}

/* [No.6] モバイルメニュー展開中の背景スクロール固定(iOS対応)
   main.js が body へ position:fixed を付与する際に使用する */
body.ayato-menu-open {
	position: fixed;
	left: 0;
	right: 0;
	width: 100%;
	overflow: hidden;
}