/**
 * ani-frontend.css
 *
 * フロントエンド投稿フォーム・一覧・単一ページ用の最小限のスタイル。
 * 「シンプルさ優先」の方針に合わせ、装飾は最小限にとどめています。
 * サイト（ADI2039）のテーマデザインに合わせて自由に上書き・調整してください。
 */

/* ---------- 投稿フォーム ---------- */
.ani-form-wrap {
	max-width: 720px;
	margin: 0 auto;
	padding: 24px;
	background: #fafafa;
	border: 1px solid #e0e0e0;
	border-radius: 8px;
	box-sizing: border-box;
}

.ani-novel-form .ani-field {
	margin-bottom: 18px;
}

.ani-novel-form label {
	display: block;
	font-weight: bold;
	margin-bottom: 6px;
}

.ani-novel-form input[type="text"],
.ani-novel-form textarea {
	width: 100%;
	padding: 10px;
	border: 1px solid #ccc;
	border-radius: 4px;
	font-size: 15px;
	box-sizing: border-box;
	font-family: inherit;
}

.ani-required {
	color: #d0392f;
}

.ani-submit-btn {
	background: #2c3e50;
	color: #fff;
	border: none;
	padding: 12px 28px;
	border-radius: 4px;
	font-size: 15px;
	cursor: pointer;
}

.ani-submit-btn:hover {
	background: #1a252f;
}

/* 下書き保存ボタン（公開ボタンとは視覚的に区別する） */
.ani-draft-btn {
	background: #fff;
	color: #2c3e50;
	border: 1px solid #2c3e50;
	padding: 12px 22px;
	border-radius: 4px;
	font-size: 15px;
	cursor: pointer;
	margin-left: 8px;
}

.ani-draft-btn:hover {
	background: #f0f0f0;
}

.ani-editing-label {
	font-weight: bold;
	color: #2c3e50;
	margin-bottom: 12px;
}

.ani-note-small {
	font-size: 12px;
	color: #777;
}

/* ---------- ログイン必須／権限なし案内 ---------- */
.ani-login-link {
	display: inline-block;
	background: #2c3e50;
	color: #fff !important;
	padding: 10px 24px;
	border-radius: 4px;
	text-decoration: none;
}

/* ---------- 通知メッセージ ---------- */
.ani-notice {
	padding: 12px 16px;
	border-radius: 4px;
	margin-bottom: 16px;
	font-size: 14px;
}

.ani-notice-error {
	background: #fdecea;
	color: #b3261e;
	border: 1px solid #f5c2c0;
}

.ani-notice-limit {
	background: #fff4e5;
	color: #8a5a00;
	border: 1px solid #ffe0b2;
}

.ani-notice-success {
	background: #eaf7ea;
	color: #1e6b1e;
	border: 1px solid #c3e6c3;
}

.ani-limit-notice {
	text-align: center;
}

.ani-remaining-time {
	font-size: 18px;
	font-weight: bold;
	color: #8a5a00;
}

/* ---------- 一覧（アーカイブ）ページ ---------- */
.ani-archive-wrap {
	max-width: 900px;
	margin: 0 auto;
	padding: 24px;
}

.ani-novel-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.ani-novel-item {
	margin-bottom: 24px;
	border-bottom: 1px solid #eee;
	padding-bottom: 24px;
}

.ani-novel-card {
	display: flex;
	gap: 16px;
	align-items: flex-start;
}

.ani-novel-thumb img {
	width: 140px;
	height: auto;
	border-radius: 4px;
	display: block;
}

.ani-novel-title {
	margin: 0 0 6px;
	font-size: 20px;
}

.ani-novel-meta {
	font-size: 13px;
	color: #888;
	margin: 0 0 8px;
}

.ani-pagination {
	display: flex;
	justify-content: space-between;
	margin-top: 24px;
}

.ani-pagination a {
	color: #2c3e50;
	text-decoration: none;
	font-weight: bold;
}

/* ---------- マイページ ---------- */
.ani-mypage-wrap {
	max-width: 900px;
	margin: 0 auto;
	padding: 24px;
}

.ani-mypage-title {
	margin-bottom: 8px;
}

.ani-new-post-btn {
	display: inline-block;
	background: #2c3e50;
	color: #fff !important;
	padding: 10px 20px;
	border-radius: 4px;
	text-decoration: none;
	margin-bottom: 20px;
}

.ani-mypage-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.ani-mypage-item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 12px;
	padding: 14px 16px;
	border: 1px solid #e0e0e0;
	border-radius: 6px;
	margin-bottom: 12px;
	background: #fff;
}

.ani-mypage-item-main {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
}

.ani-status-badge {
	font-size: 12px;
	padding: 3px 10px;
	border-radius: 12px;
	font-weight: bold;
}

.ani-status-publish {
	background: #eaf7ea;
	color: #1e6b1e;
}

.ani-status-draft {
	background: #f0f0f0;
	color: #666;
}

.ani-mypage-item-title {
	font-weight: bold;
	font-size: 15px;
}

.ani-mypage-item-title a {
	color: #2c3e50;
	text-decoration: none;
}

.ani-mypage-item-date {
	font-size: 12px;
	color: #999;
}

.ani-mypage-item-actions {
	display: flex;
	gap: 8px;
	align-items: center;
}

.ani-edit-btn {
	display: inline-block;
	padding: 6px 16px;
	border: 1px solid #2c3e50;
	color: #2c3e50 !important;
	border-radius: 4px;
	text-decoration: none;
	font-size: 13px;
}

.ani-edit-btn:hover {
	background: #f0f0f0;
}

.ani-delete-form {
	margin: 0;
}

.ani-delete-btn {
	padding: 6px 16px;
	border: 1px solid #d0392f;
	background: #fff;
	color: #d0392f;
	border-radius: 4px;
	font-size: 13px;
	cursor: pointer;
}

.ani-delete-btn:hover {
	background: #fdecea;
}

/* ---------- 単一ページ ---------- */
.ani-single-novel {
	max-width: 760px;
	margin: 0 auto;
	padding: 24px;
}

.ani-single-title {
	margin-bottom: 6px;
}

.ani-single-meta {
	color: #888;
	font-size: 13px;
	margin-bottom: 20px;
}

.ani-single-thumb img {
	max-width: 100%;
	border-radius: 6px;
	margin-bottom: 20px;
}

/*
 * 本文の余白について:
 * white-space: pre-wrap は使用しない。
 * WordPress標準の the_content() は改行のある文章を自動的に <p> や <br> に
 * 変換して段落として表示するため（wpautop機能）、pre-wrap を併用すると
 * 「改行そのものの表示」と「段落タグによる余白」が二重にかかってしまい、
 * 空白が異常に広がる原因になる。そのため通常のnormalを指定している。
 * 段落間の間隔は下記 .ani-single-content p の margin で調整する。
 */
.ani-single-content {
	line-height: 1.9;
	font-size: 16px;
	white-space: normal;
}

/* 本文中の段落の上下マージンを適度な値に固定し、空行の連続による余白の暴走を防ぐ */
.ani-single-content p {
	margin: 0 0 1.2em;
}

/* 空の段落（<p>&nbsp;</p> など、空行が連続した場合にWordPressが生成することがある）を
   非表示にして、不要な余白が積み重なるのを防ぐ */
.ani-single-content p:empty,
.ani-single-content p:has(> br:only-child) {
	display: none;
}

.ani-creation-note {
	margin-top: 32px;
	padding: 16px 20px;
	background: #f5f5f5;
	border-left: 4px solid #2c3e50;
	border-radius: 4px;
}

.ani-creation-note-title {
	margin: 0 0 8px;
	font-size: 15px;
}

.ani-creation-note-body {
	font-size: 14px;
	color: #444;
	line-height: 1.7;
}