/*
 * 事務局コンソール・会員ページ共通の土台。
 * 専用HTML（templates/app.php）でのみ読み込むため、テーマのスタイルとは干渉しない。
 */
:root {
	--c-bg: #f3f5f8;
	--c-surface: #ffffff;
	--c-sunken: #f7f8fa;
	--c-text: #17212e;
	--c-muted: #667285;
	--c-line: #e2e6ec;
	--c-line-strong: #cfd6df;
	--c-primary: #1f4fa3;
	--c-primary-weak: #e8effb;
	--c-navy: #0f2440;
	--c-green: #177245;
	--c-green-weak: #e4f4ea;
	--c-red: #c0322b;
	--c-red-weak: #fdecea;
	--c-amber: #a45a06;
	--c-amber-weak: #fdf1dc;
	--c-purple: #5b3cc4;
	--c-purple-weak: #efeafd;
	--radius: 10px;
	--radius-sm: 6px;
	--shadow: 0 1px 2px rgba(16, 24, 40, .06), 0 1px 3px rgba(16, 24, 40, .08);
	--shadow-lg: 0 12px 32px rgba(16, 24, 40, .18);
	--font: "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Noto Sans JP", "Yu Gothic UI", "Yu Gothic", Meiryo, system-ui, sans-serif;
	--mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
	margin: 0;
	background: var(--c-bg);
	color: var(--c-text);
	font-family: var(--font);
	font-size: 15px;
	line-height: 1.65;
	-webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4, p, ul, ol, dl, dd, figure { margin: 0; }
ul, ol { padding: 0; list-style: none; }
a { color: var(--c-primary); text-decoration: none; }
a:hover { text-decoration: underline; }
img, svg { max-width: 100%; }
button, input, select, textarea { font: inherit; color: inherit; }
code { font-family: var(--mono); font-size: .92em; padding: 1px 5px; border-radius: 4px; background: var(--c-sunken); }
:focus-visible { outline: 3px solid rgba(31, 79, 163, .35); outline-offset: 2px; }

/* 入力 */
.input {
	width: 100%;
	min-height: 40px;
	padding: 8px 12px;
	border: 1px solid var(--c-line-strong);
	border-radius: var(--radius-sm);
	background: var(--c-surface);
	transition: border-color .15s, box-shadow .15s;
}
.input:focus { border-color: var(--c-primary); box-shadow: 0 0 0 3px rgba(31, 79, 163, .15); outline: none; }
.input:disabled { background: var(--c-sunken); color: var(--c-muted); }
textarea.input { min-height: 80px; resize: vertical; }
select.input { padding-right: 32px; appearance: none; background: var(--c-surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23667285' stroke-width='1.6'/%3E%3C/svg%3E") no-repeat right 12px center; }
.input--sm { min-height: 30px; padding: 3px 28px 3px 8px; font-size: 13px; width: auto; }

/* ボタン */
.btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 6px;
	min-height: 40px; padding: 8px 16px;
	border: 1px solid var(--c-line-strong); border-radius: var(--radius-sm);
	background: var(--c-surface); color: var(--c-text);
	font-weight: 600; font-size: 14px; line-height: 1.2; white-space: nowrap;
	cursor: pointer; text-decoration: none !important;
	transition: background .15s, border-color .15s, transform .05s;
}
.btn:hover { background: var(--c-sunken); }
.btn:active { transform: translateY(1px); }
.btn:disabled { opacity: .5; cursor: default; transform: none; }
.btn--primary { background: var(--c-primary); border-color: var(--c-primary); color: #fff; }
.btn--primary:hover { background: #1a4389; }
.btn--danger { background: var(--c-red); border-color: var(--c-red); color: #fff; }
.btn--danger:hover { background: #a42a24; }
.btn--ok { background: var(--c-green); border-color: var(--c-green); color: #fff; }
.btn--sm { min-height: 32px; padding: 5px 12px; font-size: 13px; }
.btn--lg { min-height: 48px; padding: 10px 22px; font-size: 16px; }
.link { padding: 0; border: 0; background: none; color: var(--c-primary); font-weight: 600; cursor: pointer; }
.link:hover { text-decoration: underline; }
.link--danger { color: var(--c-red); }

.muted { color: var(--c-muted); }
.small { font-size: 13px; }
.strong { font-weight: 700; }
.warn { color: var(--c-amber); }
.grow { flex: 1; }
.pre { white-space: pre-wrap; }
.mono { font-family: var(--mono); font-size: 13px; }