/* =====================================================================
   会員システム（/app/）専用スタイル
   - 公開・会員ページ: サイトの style.css の上に重ねる（.app-*, .hf-*）
   - 管理画面: 単独で使う（body.adm, .adm-*）
   ===================================================================== */

/* ---------- 公開・会員ページ共通 ---------- */
.app-area { padding-bottom: 30px; }
.app-area h1 { word-break: break-word; }
.app-muted { color: #777; font-size: 0.92em; }
.app-center { text-align: center; }
.app-left { text-align: left !important; }
.app-mt { margin-top: 12px; }
.app-prewrap { white-space: pre-wrap; }
.app-inline-form { display: inline; }
.app-link-btn { background: none; border: 0; padding: 0; color: #1a70ae; text-decoration: underline; cursor: pointer; font: inherit; }
.app-link-btn:hover { color: #67c5ff; }

.app-card { background: #fff; border: 1px solid #e3e3e3; border-radius: 6px; padding: 18px 22px 20px; margin: 0 30px 20px 20px; }
.app-card h2 { margin: 0 0 12px 0 !important; }
/* 枠の見出しの右にボタン（押すものは見出しの行に。下に置くと枠の高さで位置がずれる） */
.app-card-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 10px; flex-wrap: wrap; }
.app-card-head h2 { flex: 1 1 auto; }
.app-card-narrow { max-width: 560px; }
.app-card-muted { background: #fafafa; }
.app-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0; }
.app-grid .app-card { margin-right: 20px; }
.app-grid .app-card:nth-child(2n) { margin-left: 0; margin-right: 30px; }

.app-flash { margin: 10px 30px 14px 20px; padding: 12px 16px; border-radius: 4px; border: 1px solid; white-space: pre-line; line-height: 1.6; }
.app-flash-info { background: #eef6fc; border-color: #b7d7ef; color: #1b4f7a; }
.app-flash-error { background: #fdeeee; border-color: #f0b6b6; color: #8a1f1f; }

.app-form { margin-top: 8px; }
.app-label { display: block; font-weight: bold; margin: 10px 0 6px; }
.app-input { width: 100%; box-sizing: border-box; font: inherit; font-size: 16px; padding: 10px 12px; border: 1px solid #c9c9c9; border-radius: 4px; background: #fff; color: #333; }
.app-input:focus { outline: 2px solid #67c5ff; outline-offset: 1px; border-color: #1a70ae; }
.app-input-auto { width: auto; min-width: 180px; }
.app-readonly { background: #f3f4f6; border: 1px solid #e3e3e3; border-radius: 6px; padding: 12px 14px; margin: 0 0 10px; }
.app-readonly .app-dl { margin-bottom: 0 !important; }
.app-btn-quiet { opacity: 0.8; }
.app-links { margin: 14px 0 0 !important; text-align: center; font-size: 0.95em; }
.app-links a { color: #1a70ae; text-decoration: underline; }
.app-actions { margin-top: 18px; text-align: center; display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; align-items: center; }
.app-actions.app-left { justify-content: flex-start; margin-left: 20px; margin-right: 30px; } /* 本文（h1・枠）と左端をそろえる */
/* 見出しの行の右にボタン（連絡の「問い合わせ」）。枠の見出し（.app-card-head）と同じ置き方。h1 の下線は h1 のまま */
.app-page-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin: 15px 30px 15px 20px; }
.app-page-head h1 { flex: 1 1 auto; margin: 0; }
.app-btn { font: inherit; font-size: 1em; cursor: pointer; margin-bottom: 0 !important; padding: 0.55em 1.4em !important; border-width: 2px; }
.btn-flat.app-btn { border: 2px solid #1a70ae; }
.app-btn-lg { font-size: 1.1em; padding: 0.7em 2em !important; }
.app-btn:disabled { opacity: 0.6; cursor: wait; }
.app-help { max-width: 46em; margin-top: 18px; font-size: 0.92em; color: #666; line-height: 1.7; }
/* 文章の部品（docs/UI_RULES.md）。説明文は46文字ぶんの幅で折り返す */
.app-card .article-text, .hf-help { max-width: 46em; }
.app-notes, .app-steps { max-width: 46em; margin: 6px 0 12px !important; padding-left: 1.4em !important; line-height: 1.8; }
.app-notes { list-style: disc; color: #555; font-size: 0.95em; }
.app-steps { list-style: decimal; }
.app-notes li, .app-steps li { margin: 3px 0; padding: 0; border: 0; }
.app-help p { margin: 0 0 6px 0 !important; }
.app-done-mark { width: 64px; height: 64px; line-height: 64px; border-radius: 50%; background: #1a70ae; color: #fff; font-size: 2em; text-align: center; margin: 6px auto 14px; }

.app-list { list-style: none; margin: 0 !important; padding: 0 !important; }
.app-list li { padding: 8px 0; border-bottom: 1px dashed #e3e3e3; line-height: 1.6; }
.app-list li:last-child { border-bottom: 0; }
.app-list-lg li { padding: 12px 0; font-size: 1.05em; }
.app-file-list { list-style: none; margin: 0 0 1.5em !important; padding: 0 !important; }
.app-file-list li { padding: 10px 12px; margin: 6px 0; border: 1px solid #e3e3e3; border-radius: 6px; background: #fafafa; line-height: 1.6; }
.app-file-list li a { font-weight: bold; word-break: break-all; }
.app-file-list .app-muted { margin-left: 8px; white-space: nowrap; }
.app-unread { font-weight: bold; }
.app-badge { display: inline-block; font-size: 0.78em; padding: 1px 8px; border-radius: 10px; background: #e94e4e; color: #fff; vertical-align: middle; margin-left: 4px; }
.app-badge-ok { background: #4e9e6a; }
.app-table { width: 100%; border-collapse: collapse; }
.app-table th, .app-table td { border-bottom: 1px solid #e3e3e3; padding: 8px 10px; text-align: left; vertical-align: top; }
.app-table thead th { background: #f4f7fa; font-weight: bold; }

/* 事務局との連絡: 種類の印と絞り込み */
.app-kind { display: inline-block; font-size: 0.78em; padding: 1px 7px; border-radius: 3px; background: #eef1f4; color: #555; margin-right: 4px; vertical-align: middle; white-space: nowrap; }
.app-contact-kinds { display: inline-flex; gap: 6px; margin-left: 10px; }
.app-contact-kinds a { font-size: 0.9em; padding: 4px 10px; border: 1px solid #c9c9c9; border-radius: 14px; text-decoration: none; color: #333; background: #fff; }
.app-contact-kinds a.app-on { background: #1a70ae; border-color: #1a70ae; color: #fff; }
.app-msg .app-file-list { margin-bottom: 0 !important; }

/* サイトCSSの記事用マージン（左50px/右30px）はカード内では打ち消す */
.app-card .article-text, .app-card .topicsss, .app-card .notice-box, .app-card .member-section, .app-card .box-light, .app-card ul, .app-card ol,
.hf-form .member-section, .hf-section .hf-note, .app-area > .notice-box, .app-area > .member-section, .app-area > .box-light, .app-area > .box-danger { margin-left: 0; margin-right: 0; width: auto; }
.app-card .article-text { font-size: 1em; margin-bottom: 10px; }
.app-card .topicsss dt { width: 28%; }
.app-card .topicsss dd { margin-left: 30%; word-break: break-all; }
.app-area > .notice-box, .app-area > .member-section, .app-area > .box-light, .app-area > .box-danger { margin: 10px 30px 16px 20px; }

/* 見出し＋値の一覧（会員ページの登録内容など） */
.app-dl { display: grid; grid-template-columns: max-content 1fr; gap: 6px 16px; margin: 0 0 14px 0 !important; line-height: 1.6; }
.app-dl dt { font-weight: bold; color: #444; }
.app-dl dd { margin: 0; word-break: break-all; }
@media screen and (max-width: 480px) { .app-dl { grid-template-columns: 1fr; gap: 0; } .app-dl dt { margin-top: 8px; font-size: 0.9em; } }

/* 会員ページの「次にやること」の帯（管理画面の黄色の帯と同じ考え方: やることがあるときだけ出す。docs/UI_RULES.md 10章） */
.app-band { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin: 10px 30px 14px 20px; padding: 12px 16px; border-radius: 6px; border: 1px solid #f59e0b; background: #fffbeb; line-height: 1.6; }
.app-band-block { display: block; }                    /* 中に一覧があるとき（請求書の未入金） */
.app-band .app-list li { border-bottom-color: #f3e3b3; }
.app-band-sub { margin-left: 10px; color: #666; font-size: 0.92em; }
.app-band-note { margin-top: 6px; font-size: 0.95em; white-space: pre-line; }
.app-inline { display: inline-flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.app-btn-sm { font-size: 0.92em; padding: 0.4em 1.1em !important; }
/* 下の小さなリンク（パスワード・全端末ログアウト・退会）と、別の会員への切り替え */
.app-foot-row { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin: 0 30px 10px 20px; font-size: 0.95em; }
/* 下の控えめなボタン（パスワード・全端末ログアウト・退会）。押せるものはボタンにする（Tak: リンクだと選べるか分からない） */
.app-foot-links { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; margin: 6px 30px 0 20px; font-size: 0.95em; color: #777; }
/* 入力画面のボタンは画面の下に固定（docs/UI_RULES.md 8章「編集中にスクロールする画面」） */
.app-actions-sticky { position: sticky; bottom: 0; z-index: 5; background: rgba(255,255,255,0.96); margin: 18px 0 0; padding: 12px 0; border-top: 1px solid #e3e3e3; }

/* 会員ページの上部バー */
/* 会員ページの右上: 名前とログアウトだけ（メニューはサイトの黒いナビバーに差し込む。layouts/members.php） */
.app-userbar { display: flex; justify-content: flex-end; align-items: center; gap: 14px; margin: 6px 30px 0 20px; font-size: 0.9em; color: #555; }
.app-userbar-name { font-weight: bold; }
.app-members .primary_nav a.app-on span { background-color: #2c95b5; } /* 黒いバーの「会員ページ」を点灯 */
.app-members .global-nav__item.app-on a { font-weight: bold; }
/* 会員ページのタブ（登録内容／連絡／フォーム／請求書）。管理画面のタブ（.adm-tabs）と同じ見た目 */
.app-tabs { display: flex; gap: 4px; flex-wrap: wrap; margin: 4px 30px 14px 20px; border-bottom: 1px solid #d9dee4; }
.app-tabs a { padding: 8px 14px; text-decoration: none; color: #4b5563; border-bottom: 3px solid transparent; margin-bottom: -1px; }
.app-tabs a.active { color: #23629d; border-bottom-color: #23629d; font-weight: 600; }

/* ---------- フォーム（hf-*） ---------- */
.hf-form { margin: 0 30px 0 20px; }
/* 普段は使わない欄を畳む（問い合わせの「返信先を変える」） */
.hf-trap { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; } /* 迷惑な送信よけの見えない欄（人は触らない） */
.hf-fold { margin: 14px 0 4px; }
.hf-fold > summary { cursor: pointer; color: #1a70ae; font-size: 0.95em; }
.hf-description { margin-left: 20px !important; }
.hf-section { background: #fff; border: 1px solid #e3e3e3; border-radius: 6px; padding: 6px 22px 16px; margin-bottom: 18px; }
.hf-section[hidden] { display: none; }
.hf-section-title { margin: 14px 0 10px 0 !important; }
.hf-section-desc { margin: 0 0 10px 0 !important; }
.hf-heading { margin: 22px 0 8px 0 !important; }
.hf-note { margin: 10px 0 14px; }
.hf-field { margin: 16px 0 6px; padding: 10px 12px 12px; border-left: 3px solid #e3e3e3; }
.hf-field[hidden] { display: none; }
.hf-field.hf-error { border-left-color: #e94e4e; background: #fff7f7; }
.hf-label { font-weight: bold; margin-bottom: 4px; line-height: 1.5; }
.hf-required { display: inline-block; font-size: 0.75em; font-weight: normal; color: #fff; background: #e94e4e; padding: 1px 7px; border-radius: 3px; vertical-align: middle; }
.hf-optional { display: inline-block; font-size: 0.75em; font-weight: normal; color: #666; background: #eee; padding: 1px 7px; border-radius: 3px; vertical-align: middle; }
.hf-help { font-size: 0.9em; color: #666; margin: 2px 0 8px; line-height: 1.6; }
.hf-input input[type="text"], .hf-input input[type="email"], .hf-input input[type="tel"], .hf-input input[type="url"], .hf-input input[type="number"],
.hf-input input[type="date"], .hf-input input[type="time"], .hf-input input[type="datetime-local"], .hf-input select, .hf-input textarea {
    font: inherit; font-size: 16px; padding: 9px 11px; border: 1px solid #c9c9c9; border-radius: 4px; background: #fff; color: #333; max-width: 100%; box-sizing: border-box;
}
.hf-input input[type="text"], .hf-input input[type="email"], .hf-input input[type="url"], .hf-input textarea { width: 100%; }
.hf-input input[type="tel"], .hf-input input[type="number"], .hf-input input[type="date"], .hf-input input[type="time"], .hf-input input[type="datetime-local"] { width: auto; min-width: 200px; }
.hf-input select { min-width: 220px; }
.hf-input input:focus, .hf-input select:focus, .hf-input textarea:focus { outline: 2px solid #67c5ff; outline-offset: 1px; }
.hf-input input[readonly] { background: #f3f3f3; color: #555; }
.hf-unit { margin-left: 6px; }
.hf-choices { display: flex; flex-direction: column; gap: 4px; }
.hf-choices-scroll { max-height: 260px; overflow-y: auto; border: 1px solid #e3e3e3; padding: 8px; border-radius: 4px; }
.hf-choice { display: flex; align-items: flex-start; gap: 8px; padding: 7px 8px; border-radius: 4px; cursor: pointer; line-height: 1.5; }
.hf-choice:hover { background: #f4f7fa; }
.hf-choice input { margin-top: 5px; width: 18px; height: 18px; flex: 0 0 18px; }
.hf-other { margin: 4px 0 4px 34px; width: calc(100% - 34px) !important; }
.hf-other:disabled { background: #f3f3f3; }
.hf-rating { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.hf-rating-item { display: inline-flex; align-items: center; gap: 4px; padding: 6px 10px; border: 1px solid #c9c9c9; border-radius: 4px; cursor: pointer; }
.hf-rating-item:has(input:checked) { background: #1a70ae; color: #fff; border-color: #1a70ae; }
.hf-likert { width: 100%; border-collapse: collapse; }
.hf-likert th, .hf-likert td { border: 1px solid #e3e3e3; padding: 8px; text-align: center; }
.hf-likert th[scope="row"] { text-align: left; }
.hf-likert input { width: 18px; height: 18px; }
.hf-error-msg { color: #c62828; font-size: 0.92em; margin-top: 6px; }
.hf-hp { position: absolute; left: -9999px; top: -9999px; height: 0; overflow: hidden; }
.hf-footer { margin: 10px 0 20px; }
.hf-required-note { text-align: center; }
.hf-confirm { width: 100%; border-collapse: collapse; background: #fff; }
.hf-confirm th, .hf-confirm td { border: 1px solid #e3e3e3; padding: 10px 12px; text-align: left; vertical-align: top; line-height: 1.6; }
.hf-confirm th { width: 32%; background: #f4f7fa; font-weight: bold; }

@media screen and (max-width: 768px) {
    .app-card { margin: 0 0 16px 0; padding: 14px 14px 16px; }
    .app-grid { grid-template-columns: 1fr; }
    .app-grid .app-card, .app-grid .app-card:nth-child(2n) { margin: 0 0 16px 0; }
    .app-flash, .app-userbar, .app-tabs, .app-page-head, .app-actions.app-left { margin-left: 0; margin-right: 0; }
    .hf-form { margin: 0; }
    .hf-description { margin-left: 0 !important; }
    .hf-section { padding: 4px 12px 12px; }
    .hf-field { padding: 8px 8px 10px; }
    .hf-input input[type="tel"], .hf-input input[type="date"], .hf-input input[type="time"], .hf-input input[type="datetime-local"], .hf-input select { width: 100%; }
    .hf-input input[type="number"] { width: 9em; min-width: 0; }
    .app-area > .notice-box, .app-area > .member-section, .app-area > .box-light, .app-area > .box-danger { margin-left: 0; margin-right: 0; }
    .app-card .topicsss dt { float: none; width: 100%; padding-bottom: 0; }
    .app-card .topicsss dd { margin-left: 0; padding-bottom: 8px; }
    .hf-confirm th { width: 36%; font-size: 0.9em; }
    .app-actions { flex-direction: column; }
    .app-actions .app-btn { width: 100%; box-sizing: border-box; text-align: center; }
    .app-actions.app-left { flex-direction: row; }
    .app-actions.app-left .app-btn { width: auto; }
}

/* =====================================================================
   管理画面
   色はサイト（style.css）に合わせる: ナビの濃いグレー #4a4849・ホバーの青緑 #2c95b5・ボタンの青 #1a70ae・見出しや枠の紺 #23629d
   ===================================================================== */
body.adm { margin: 0; background: #f0f4f8; color: #222; font: 15px/1.6 -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans JP", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif; }
.adm *, .adm *:before, .adm *:after { box-sizing: border-box; }
/* 管理画面のリンク色。:where() で詳細度を下げ、ボタン（.adm-btn）やヘッダー（.adm-nav a）の色に勝たないようにする */
.adm :where(a) { color: #23629d; }
.adm h1 { font-size: 1.45em; margin: 0 0 14px; line-height: 1.3; }
.adm h2 { font-size: 1.05em; margin: 0 0 10px; padding-bottom: 6px; border-bottom: 1px solid #e6e9ed; }
.adm code { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 0.92em; background: #f0f2f5; padding: 1px 5px; border-radius: 3px; }
.adm-code { word-break: break-all; }
.adm-muted { color: #6b7280; }
.adm-small { font-size: 0.86em; }
.adm-nowrap { white-space: nowrap; }
.adm-mt { margin-top: 10px; }
.adm-prewrap { white-space: pre-wrap; line-height: 1.7; }
.adm-text-danger { color: var(--adm-red-text); }
.adm-req { font-size: 0.75em; color: #fff; background: #e94e4e; padding: 1px 6px; border-radius: 3px; vertical-align: middle; }

/* 左メニュー（たためる）。並びとアイコンは Admin\Menu、アイコンの形は layouts/_icons.php。
   たたむとアイコンだけの細い帯になり、そのまま移動できる（項目名はマウスを載せると出る）。狭い画面では上のバー＋ハンバーガー */
/* アイコンの定義（_icons.php）は画面に出さない */
.adm-icon-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
/* 線画のアイコン。色は文字色に合わせる */
.adm-ic { width: 18px; height: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.adm-side { position: fixed; left: 0; top: 0; bottom: 0; width: 214px; background: #4a4849; color: #fff; z-index: 30; display: flex; flex-direction: column; overflow-y: auto; overflow-x: hidden; transition: width 0.15s; }
.adm-side-top { display: flex; align-items: center; gap: 6px; padding: 12px 10px 12px 16px; border-bottom: 1px solid rgba(255,255,255,0.15); min-height: 52px; }
.adm-brand { color: #fff; text-decoration: none; font-weight: bold; flex: 1; font-size: 0.95em; white-space: nowrap; }
.adm-brand:hover { color: #fff; }
.adm-brand span { font-weight: normal; opacity: 0.75; margin-left: 2px; }
.adm-env-badge { display: inline-block; background: #f59e0b; color: #1f2937; font-size: 0.72em; font-weight: bold; padding: 1px 7px; border-radius: 3px; margin-left: 6px; vertical-align: middle; }
/* テスト・ローカルは本番と見分けがつくよう茶色のまま */
.adm-env-test .adm-side, .adm-env-local .adm-side { background: #4b3a1f; }
.adm-side-toggle, .adm-side-logout { background: none; border: 0; color: rgba(255,255,255,0.75); border-radius: 6px; cursor: pointer; display: flex; align-items: center; }
.adm-side-toggle { width: 30px; height: 30px; justify-content: center; padding: 0; }
.adm-side-toggle:hover, .adm-side-logout:hover { background: rgba(255,255,255,0.12); color: #fff; }
.adm-nav { display: flex; flex-direction: column; padding: 6px 0 12px; flex: 1; }
.adm-nav-group, .adm-nav-fold { display: flex; flex-direction: column; margin-top: 10px; }
.adm-nav-head { font-size: 0.72em; letter-spacing: 0.06em; color: rgba(255,255,255,0.62); padding: 6px 16px 2px; display: flex; align-items: center; gap: 6px; }
.adm-nav-head .adm-ic { display: none; } /* 開いているときはまとまりの名前を文字で出す */
.adm-nav-fold summary { cursor: pointer; list-style: none; }
.adm-nav-fold summary::-webkit-details-marker { display: none; }
.adm-nav-fold summary .adm-nav-label::after { content: " ▾"; font-size: 0.9em; }
.adm-nav-fold[open] summary .adm-nav-label::after { content: " ▴"; }
.adm-nav-item { color: #fff; text-decoration: none; padding: 8px 16px; font-size: 0.92em; display: flex; align-items: center; gap: 10px; transition: background 0.2s; white-space: nowrap; }
.adm-nav-item .adm-ic { opacity: 0.85; }
.adm-nav-item:hover { color: #fff; background: rgba(255,255,255,0.1); }
.adm-nav-item.active { color: #fff; background: #2c95b5; }
.adm-nav-item.active .adm-ic { opacity: 1; }
.adm-side-user { margin-top: auto; padding: 12px 16px 0; border-top: 1px solid rgba(255,255,255,0.15); font-size: 0.84em; color: #e6e6e6; display: flex; flex-direction: column; gap: 4px; }
.adm-side-logout { gap: 8px; padding: 4px 0; font-size: 1em; color: #e6e6e6; }
.adm-side-logout .adm-ic { width: 16px; height: 16px; }
.adm-nav-toggle { display: none; background: none; border: 1px solid rgba(255,255,255,0.5); color: #fff; font-size: 1.2em; padding: 2px 10px; border-radius: 4px; }
.adm-body { margin-left: 214px; min-height: 100vh; display: flex; flex-direction: column; }
.adm-main { flex: 1; max-width: 1320px; width: 100%; padding: 22px 28px 40px; }
.adm-footer { text-align: center; color: #9aa3ad; font-size: 0.8em; padding: 20px; }
/* たたんだ状態: アイコンだけ。まとまりの名前は細い線で区切る */
html.adm-side-closed .adm-side { width: 52px; }
html.adm-side-closed .adm-side-top { padding: 11px 0; justify-content: center; }
html.adm-side-closed .adm-brand, html.adm-side-closed .adm-nav-label { display: none; }
html.adm-side-closed .adm-nav-item { justify-content: center; padding: 10px 0; }
html.adm-side-closed .adm-nav-group, html.adm-side-closed .adm-nav-fold { margin: 6px 10px 0; padding-top: 6px; border-top: 1px solid rgba(255,255,255,0.15); }
html.adm-side-closed .adm-nav-group .adm-nav-head { display: none; }
html.adm-side-closed .adm-nav-group .adm-nav-item, html.adm-side-closed .adm-nav-fold .adm-nav-item { margin: 0 -10px; }
html.adm-side-closed .adm-nav-fold .adm-nav-head { justify-content: center; padding: 8px 0; font-size: 1em; }
html.adm-side-closed .adm-nav-fold .adm-nav-head .adm-ic { display: block; }
html.adm-side-closed .adm-side-user { padding: 10px 0 0; align-items: center; }
html.adm-side-closed .adm-side-logout { padding: 8px; }
html.adm-side-closed .adm-body { margin-left: 52px; }
/* 請求・一斉連絡・フォームの作り直しで足した部品（docs/UI_RULES.md 9章） */
.adm-card-form { max-width: 820px; }
.adm-card-form h2 { margin-top: 18px; }
.adm-card-form h2:first-of-type { margin-top: 0; }
.adm-ml { margin-left: 8px; }
.adm-right { text-align: right; }
/* 入金の進み具合（<progress>。値で決まる幅を style="" なしで出す） */
.adm-prog { width: 110px; height: 8px; vertical-align: middle; margin-right: 6px; appearance: none; -webkit-appearance: none; border: 0; border-radius: 4px; overflow: hidden; background: #e5e7eb; }
.adm-prog::-webkit-progress-bar { background: #e5e7eb; border-radius: 4px; }
.adm-prog::-webkit-progress-value { background: var(--adm-green); border-radius: 4px; }
.adm-prog::-moz-progress-bar { background: var(--adm-green); border-radius: 4px; }
/* 選択肢の一覧（宛先・誰に請求書を作るか）。1行1択、下に補足や入力欄を入れられる */
.adm-radios label { display: flex; gap: 10px; align-items: flex-start; padding: 9px 0; border-bottom: 1px dashed #eef0f3; cursor: pointer; }
.adm-radios label:last-child { border-bottom: 0; }
.adm-radios input[type="radio"] { margin-top: 6px; flex: none; }
.adm-radios-sub { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-top: 6px; }
.adm-radios .adm-input-auto { width: auto; }
/* 行の「…」: 押すと操作の一覧が出る */
.adm-menu { display: inline-block; position: relative; }
.adm-menu > summary { list-style: none; }
.adm-menu > summary::-webkit-details-marker { display: none; }
.adm-menu-list { position: absolute; right: 0; top: calc(100% + 4px); z-index: 15; min-width: 200px; background: #fff; border: 1px solid #d9dee4; border-radius: 6px; box-shadow: 0 6px 18px rgba(0,0,0,0.12); padding: 6px 0; text-align: left; }
.adm-menu-list a, .adm-menu-list button { display: block; width: 100%; text-align: left; padding: 7px 14px; color: #222; text-decoration: none; background: none; border: 0; font: inherit; font-size: 0.92em; cursor: pointer; white-space: nowrap; }
.adm-menu-list a:hover, .adm-menu-list button:hover { background: #f3f4f6; }
.adm-menu-list .adm-link-danger { color: var(--adm-red-text); }
/* フォームを作る: ひな形のタイル（ラジオ） */
.adm-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; margin: 8px 0 18px; }
.adm-tile { display: block; border: 1px solid #d9dee4; border-radius: 8px; padding: 14px; background: #fff; cursor: pointer; position: relative; }
.adm-tile input { position: absolute; opacity: 0; }
.adm-tile strong { display: block; margin-bottom: 4px; }
.adm-tile span { font-size: 0.85em; color: #6b7280; line-height: 1.5; }
.adm-tile:has(input:checked) { border-color: #23629d; box-shadow: 0 0 0 2px #cfe3f3; }
.adm-tile:has(input:focus-visible) { outline: 2px solid #23629d; outline-offset: 2px; }
.adm-prog-wide { width: 100%; max-width: 360px; height: 12px; }
/* 一斉連絡「選んで指定」の会員の一覧 */
.adm-pick-list { max-height: 280px; overflow-y: auto; border: 1px solid #d9dee4; border-radius: 6px; padding: 4px 0; margin-top: 6px; background: #fff; }
.adm-pick-row { display: block; padding: 5px 12px; cursor: pointer; }
.adm-pick-row:hover { background: #f3f4f6; }
.adm-pick-row[hidden] { display: none; }
/* 「誰に」の部品（_audience.php）。タブは radio（ラベルをタブの見た目に）。チェックボックスは「選んで指定」のときだけ出す */
/* 宛先・公開範囲（_audience.php）: 上にグループのチェックを横並び、その下に絞り込みと一覧。「送る先 ○件」は太字で目に入るように */
.adm-checks.adm-aud-mode label, .adm-checks.adm-aud-groups label { display: inline-block; margin: 2px 18px 6px 0; } /* 横並び（.adm-checks label の縦並びより優先） */
.adm-aud-groups .adm-count { color: #9aa3ad; margin-left: 2px; }
.adm-aud-tools { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin: 4px 0 6px; }
.adm-aud .adm-pick-list { margin-top: 0; }
.adm-aud-sum { margin: 0 0 4px; font-weight: 600; color: #23629d; }
.adm-pick-ro { color: #4b5563; cursor: default; padding-left: 34px; }
.adm-table-files { max-width: 560px; margin-bottom: 8px; }
.adm-form-discard { margin-top: 10px; }
/* 画面の一部の表示・非表示（select[data-switch] と data-show-for。JS が切り替える） */
[data-show-for].adm-hide { display: none; }
.adm-bare-main { max-width: 520px; margin: 50px auto; padding: 0 16px; }
.adm-bare .adm-brand { margin-bottom: 20px; text-align: center; }
.adm-bare .adm-brand a { color: #23629d; font-size: 1.1em; }

.adm-page-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; flex-wrap: wrap; margin-bottom: 10px; }
.adm-page-head h1 { margin-bottom: 6px; }
.adm-card { background: #fff; border: 1px solid #e3e7eb; border-radius: 8px; padding: 16px 18px 18px; margin-bottom: 18px; }
.adm-card-narrow { max-width: 520px; margin: 0 auto 18px; }
.adm-card-table { padding: 10px 12px; overflow-x: auto; }
.adm-card-wide { grid-column: 1 / -1; }
.adm-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 18px; align-items: start; }
.adm-grid > .adm-card { margin-bottom: 0; }
.adm-grid-2-1 { grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr); }
.adm-grid-2-1 > div > .adm-card, .adm-grid-2-1 > aside > .adm-card { margin-bottom: 18px; }

.adm-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin-bottom: 18px; }
.adm-stat { background: #fff; border: 1px solid #e3e7eb; border-radius: 8px; padding: 12px 14px; text-decoration: none; color: #222; display: flex; flex-direction: column; }
.adm-stat-n { font-size: 1.7em; font-weight: bold; line-height: 1.2; }
.adm-stat-n small { font-size: 0.5em; color: #6b7280; }
.adm-stat-text { font-size: 1.1em; }
.adm-stat-l { font-size: 0.85em; color: #6b7280; }
.adm-stat-attn { border-color: #f59e0b; background: #fffbeb; }
/* ダッシュボード: メニューのまとまりごとに区切る */
/* 会員企業ページ: 掲載の申請1件ぶん */
.adm-request { border-top: 1px solid #e5e7eb; padding-top: 12px; margin-top: 12px; }
.adm-request h3 { font-size: 1em; margin: 0 0 8px; }
.adm-dash-group { margin-bottom: 20px; }
.adm-dash-title { font-size: 0.95em; color: #4b5563; border-bottom: 0; margin: 0 0 8px; padding: 0; letter-spacing: 0.05em; }
.adm-dash-items { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; } /* 2列固定（Tak）。画面が広くても3列にしない。狭い画面は下の @media で1列 */
.adm-dash-item { margin-bottom: 0; }
.adm-dash-item h3 { font-size: 1em; margin: 0 0 10px; }
.adm-dash-link { float: right; font-size: 0.8em; font-weight: normal; }
.adm-dash-row-attn { border-left: 3px solid #f59e0b; padding-left: 8px; }
.adm-dash-item h3 a { text-decoration: none; }
.adm-dash-item h3 a:hover { text-decoration: underline; }
.adm-dash-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); gap: 8px; }
.adm-dash-stats .adm-stat { padding: 8px 12px; }
.adm-dash-stats .adm-stat-n { font-size: 1.5em; }
.adm-dash-rows { list-style: none; margin: 10px 0 0; padding: 0; }
.adm-dash-rows li { padding: 5px 0; border-bottom: 1px dashed #e3e7eb; line-height: 1.5; }
.adm-dash-rows li:last-child { border-bottom: 0; }

.adm-table { width: 100%; border-collapse: collapse; font-size: 0.94em; }
.adm-table th, .adm-table td { padding: 9px 10px; border-bottom: 1px solid #edf0f3; text-align: left; vertical-align: top; }
.adm-table thead th { background: #f7f9fb; font-weight: 600; white-space: nowrap; }
.adm-table tbody tr:hover { background: #fafcff; }
.adm-table-compact th, .adm-table-compact td { padding: 6px 8px; }
.adm-table-kv th { width: 30%; background: #f7f9fb; }
.adm-table .adm-subhead th { background: #eef3f8; }
.adm-row-error { background: #fff5f5; }
.adm-row-muted { color: #9aa3ad; }
.adm-json { max-width: 260px; word-break: break-all; font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 0.8em; }
.adm-table-bars th { width: 30%; }
.adm-bar-cell { width: 50%; }
.adm-bar { height: 16px; background: #1a70ae; border-radius: 2px; min-width: 2px; }
.adm-scroll { overflow-x: auto; }
.adm-scroll-y { max-height: 360px; overflow-y: auto; }
.adm-dl { display: grid; grid-template-columns: max-content 1fr; gap: 4px 14px; margin: 0; }
.adm-dl dt { color: #6b7280; }
.adm-dl dd { margin: 0; }
.adm-list { margin: 0; padding-left: 1.2em; }
.adm-list li { margin: 3px 0; }
.adm-list-texts li { padding: 4px 0; border-bottom: 1px dashed #e3e7eb; }

.adm-form .adm-row { margin-bottom: 12px; }
.adm-row-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 10px 16px; }
.adm-row-3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 10px 16px; }
.adm-span-2 { grid-column: 1 / -1; }
.adm-label { display: block; font-size: 0.9em; font-weight: 600; margin-bottom: 4px; color: #374151; }
.adm-input { width: 100%; font: inherit; padding: 8px 10px; border: 1px solid #cfd5dc; border-radius: 5px; background: #fff; color: #222; }
.adm-input:focus { outline: 2px solid #67c5ff; outline-offset: 1px; border-color: #1a70ae; }
.adm-input-file { padding: 6px 10px; background: #f8fafc; }
.adm-input-file::file-selector-button { font: inherit; font-size: 0.9em; padding: 5px 12px; margin-right: 10px; border: 1px solid #cfd5dc; border-radius: 4px; background: #fff; color: #222; cursor: pointer; }
/* 文章の部品（docs/UI_RULES.md）。説明文は44文字ぶんの幅で折り返す */
.adm-lead { max-width: 44em; margin: -4px 0 16px; color: #374151; line-height: 1.75; }
.adm-help { max-width: 44em; margin: 6px 0 0; color: #6b7280; font-size: 0.86em; line-height: 1.7; }
.adm-notes { max-width: 44em; margin: 6px 0 12px; padding-left: 1.3em; color: #4b5563; font-size: 0.9em; line-height: 1.75; }
.adm-notes li, .adm-steps li { margin: 3px 0; }
.adm-steps { max-width: 44em; margin: 6px 0 12px; padding-left: 1.6em; line-height: 1.75; }
.adm-howto { max-width: 52em; margin: 16px 0; background: #fff; border: 1px solid #e3e7eb; border-radius: 8px; padding: 10px 16px; }
.adm-howto > summary { cursor: pointer; color: #23629d; font-weight: 600; }
.adm-howto[open] > summary { margin-bottom: 8px; }
.adm-card > .adm-help:first-child, .adm-card > h2 + .adm-help { margin-top: 0; margin-bottom: 10px; }
.adm-table-public td { vertical-align: top; }
.adm-table-public textarea.adm-input { min-height: 36px; resize: vertical; }
/* 入力の長い画面（登録内容の編集・会員を追加）: 見出しと「保存する・やめる」を画面の上に固定する。背景は画面と同じ色で下の入力欄を隠す */
/* 入力画面の見出し（layouts/_edit_head.php）: 見出しと「やめる・保存する」を画面の上に固定する。
   背景は画面と同じ色にして、下を流れる入力欄を隠す。余白は .adm-main の内側の余白を打ち消して端まで伸ばす */
.adm-page-head-sticky { position: sticky; top: 0; z-index: 20; background: #f0f4f8; margin: -22px -28px 14px; padding: 14px 28px 10px; border-bottom: 1px solid #dde3ea; align-items: center; }
.adm-page-head-sticky h1 { margin-bottom: 0; }
/* 何か入力したら出る「保存していない変更があります」 */
.adm-dirty-flag { font-size: 0.85em; color: #92400e; background: #fef3c7; border-radius: 999px; padding: 2px 10px; }
.adm-input-auto { width: auto; }
.adm-input-code { font-size: 1.5em; letter-spacing: 0.25em; text-align: center; }
.adm-code-area { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 0.88em; line-height: 1.5; tab-size: 2; }
.adm-checks label, .adm-check, .adm-check-row label { display: block; margin: 6px 0; }
.adm-fieldset { border: 1px solid #e3e7eb; border-radius: 6px; padding: 10px 14px 12px; margin: 0 0 14px; }
.adm-fieldset legend { font-weight: 600; padding: 0 6px; color: #374151; }
.adm-actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-top: 14px; }
.adm-actions.adm-left { justify-content: flex-start; }
/* タブの中の長い入力（フォームの設定など）: 保存ボタンをカードの下端で画面に固定する。画面そのものが1つのフォームなら layouts/_edit_head.php（上に固定）を使う */
.adm-card .adm-actions-sticky { position: sticky; bottom: 0; z-index: 5; background: #fff; margin: 14px -18px -18px; padding: 10px 18px 14px; border-top: 1px solid #e6e9ed; border-radius: 0 0 8px 8px; }
.adm-inline { display: inline-flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.adm-filter { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin-bottom: 14px; }
.adm-filter .adm-input { width: auto; min-width: 160px; }
.adm-filter input[type="search"] { min-width: 280px; }
.adm-check-inline { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; }

.adm-btn { display: inline-block; font: inherit; font-size: 0.94em; padding: 8px 14px; border-radius: 5px; border: 1px solid #cfd5dc; background: #fff; color: #222; text-decoration: none; cursor: pointer; line-height: 1.3; }
/* サイト共通の a:hover { color } に負けないよう、hover でも文字色を明示する */
.adm-btn:hover { background: #f3f5f7; color: #222; }
.adm-btn-primary { background: #1a70ae; border-color: #1a70ae; color: #fff; }
.adm-btn-primary:hover { background: #23629d; color: #fff; }
.adm-btn-danger { background: #fff; border-color: #e5484d; color: #b42318; }
.adm-btn-danger:hover { background: #fff1f0; color: #b42318; }
.adm-btn-sm { padding: 4px 10px; font-size: 0.85em; }
.adm-btn:disabled { opacity: 0.5; cursor: not-allowed; }
.adm-link { background: none; border: 0; padding: 0; color: #23629d; text-decoration: underline; cursor: pointer; font: inherit; font-size: 0.94em; }
.adm-link-danger { color: #b42318; }

/* 色は4つだけ（Tak。docs/UI_RULES.md 6章）。状態の丸・札・文字・注意の帯で同じ色を使う
   赤＝解決しないとまずい、黄＝気にかけてほしい（事務局がやること）、緑＝気にしなくていい、灰＝終わったもの */
:root {
    --adm-red: #dc2626; --adm-red-text: #b42318; --adm-red-bg: #fee2e2;
    --adm-yellow: #f59e0b; --adm-yellow-text: #92400e; --adm-yellow-bg: #fef3c7;
    --adm-green: #16a34a; --adm-green-text: #166534; --adm-green-bg: #dcfce7;
    --adm-gray: #c4c9d0; --adm-gray-text: #9aa3ad; --adm-gray-bg: #f3f4f6;
}
/* 状態（Admin\StatusTag）: どの画面でも「小さな丸＋言葉」 */
.adm-st { display: inline-flex; align-items: center; gap: 6px; font-size: 0.9em; color: #374151; white-space: nowrap; vertical-align: middle; font-weight: normal; }
.adm-st::before { content: ""; width: 8px; height: 8px; border-radius: 50%; flex: none; }
.adm-st-danger { color: var(--adm-red-text); }
.adm-st-danger::before { background: var(--adm-red); }
.adm-st-warn { color: var(--adm-yellow-text); }
.adm-st-warn::before { background: var(--adm-yellow); }
.adm-st-ok::before { background: var(--adm-green); }
.adm-st-done { color: var(--adm-gray-text); }
.adm-st-done::before { background: var(--adm-gray); }
/* 会員の詳細の「状態」欄の大きい表示 */
.adm-st-big { font-size: 1.15em; font-weight: 600; gap: 8px; }
.adm-st-big::before { width: 10px; height: 10px; }
.adm-badge { display: inline-block; font-size: 0.78em; padding: 1px 8px; border-radius: 10px; background: #e5e7eb; color: #374151; vertical-align: middle; white-space: nowrap; }
/* 札（注意の印: HPのリンク切れ・送信停止中・未登録 など）。色は上の3つ。色なしの .adm-badge は役職などのただのラベル */
.adm-badge-danger { background: var(--adm-red-bg); color: var(--adm-red-text); }
.adm-badge-warn { background: var(--adm-yellow-bg); color: var(--adm-yellow-text); }
.adm-badge-ok { background: var(--adm-green-bg); color: var(--adm-green-text); }

.adm-alert { background: #eef6fc; border: 1px solid #b7d7ef; color: #1b4f7a; padding: 10px 14px; border-radius: 6px; margin-bottom: 14px; }
.adm-alert-warn { background: #fffbeb; border-color: #fcd34d; color: #78350f; }
.adm-alert.adm-inline { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; justify-content: space-between; }
.adm-alert-danger { background: #fef2f2; border-color: #fca5a5; color: #7f1d1d; }
.app-flash { white-space: pre-line; }
.adm .app-flash { margin: 0 0 14px; }

.adm-tabs { display: flex; gap: 4px; margin-bottom: 10px; border-bottom: 1px solid #d9dee4; flex-wrap: wrap; }
.adm-tabs a { padding: 8px 14px; text-decoration: none; color: #4b5563; border-bottom: 3px solid transparent; margin-bottom: -1px; }
.adm-tabs a.active { color: #23629d; border-bottom-color: #23629d; font-weight: 600; }
/* タブが増えすぎるときの「それ以前 ▾」（請求の年度）。見た目はタブと同じで、押すと下に一覧が出る */
.adm-tabs .adm-tabs-more > summary { padding: 8px 14px; color: #4b5563; border-bottom: 3px solid transparent; margin-bottom: -1px; cursor: pointer; }
.adm-tabs .adm-tabs-more > summary.active { color: #23629d; border-bottom-color: #23629d; font-weight: 600; }
.adm-menu-list.adm-menu-left { right: auto; left: 0; }
.adm-pager a { display: inline-block; padding: 4px 9px; margin: 2px; border: 1px solid #d9dee4; border-radius: 4px; text-decoration: none; }
.adm-pager a.active { background: #1a70ae; color: #fff; border-color: #1a70ae; }
.adm-details summary { cursor: pointer; color: #23629d; margin: 6px 0; }
.adm-pre { background: #f7f9fb; border: 1px solid #e3e7eb; border-radius: 5px; padding: 10px 12px; white-space: pre-wrap; font-size: 0.86em; line-height: 1.5; max-height: 420px; overflow: auto; }
.adm-pre-doc { max-height: 600px; }
.adm-json-result { margin-top: 10px; font-size: 0.92em; white-space: pre-wrap; }
.adm-json-result.ok { color: #065f46; }
.adm-json-result.ng { color: #991b1b; }
.adm-qr { width: 220px; height: 220px; margin: 12px auto; padding: 8px; background: #fff; border: 1px solid #e3e7eb; }
.adm-qr svg { width: 100%; height: 100%; display: block; }
.adm-thumb { height: 72px; border: 1px solid #e3e7eb; background: #fff; vertical-align: middle; margin-right: 8px; }
.adm-recovery { background: #f7f9fb; border: 1px solid #e3e7eb; border-radius: 5px; padding: 14px; font-size: 1.1em; letter-spacing: 0.05em; columns: 2; }

@media screen and (max-width: 900px) {
    .adm-grid-2-1, .adm-detail { grid-template-columns: 1fr; }
    .adm-row-3 { grid-template-columns: 1fr; }
    .adm-side, html.adm-side-closed .adm-side { position: static; width: auto; overflow: visible; }
    .adm-side-top, html.adm-side-closed .adm-side-top { padding: 8px 12px; align-items: center; border-bottom: 0; }
    .adm-brand, html.adm-side-closed .adm-brand { display: block; }
    .adm-side-toggle, html.adm-side-closed .adm-side-toggle { display: none; }
    html.adm-side-closed .adm-nav-label { display: inline; }
    html.adm-side-closed .adm-nav-item { justify-content: flex-start; padding: 8px 16px; }
    html.adm-side-closed .adm-nav-group, html.adm-side-closed .adm-nav-fold { margin: 10px 0 0; padding-top: 0; border-top: 0; }
    html.adm-side-closed .adm-nav-group .adm-nav-head { display: flex; }
    html.adm-side-closed .adm-nav-group .adm-nav-item, html.adm-side-closed .adm-nav-fold .adm-nav-item { margin: 0; }
    html.adm-side-closed .adm-side-user { padding: 10px 16px 0; align-items: stretch; }
    html.adm-side-closed .adm-nav-fold .adm-nav-head { justify-content: flex-start; padding: 6px 16px 2px; font-size: 0.72em; }
    html.adm-side-closed .adm-nav-fold .adm-nav-head .adm-ic { display: none; }
    .adm-nav-toggle { display: block; }
    .adm-nav, html.adm-side-closed .adm-nav { display: none; padding: 0 0 10px; }
    .adm-nav.open { display: flex; }
    .adm-side-user { margin-top: 10px; padding-top: 10px; }
    .adm-body, html.adm-side-closed .adm-body { margin-left: 0; min-height: 0; }
    .adm-main { padding: 14px 12px 30px; }
    .adm-page-head-sticky { margin: -14px -12px 12px; padding: 10px 12px 8px; } /* 狭い画面の余白に合わせる */
}
@media screen and (max-width: 720px) {
    .adm-dash-items { grid-template-columns: 1fr; }
    .adm-row-2 { grid-template-columns: 1fr; }
    .adm-filter input[type="search"] { min-width: 0; width: 100%; }
    .adm-recovery { columns: 1; }
    .adm-dl { grid-template-columns: 1fr; }
    .adm-kv { grid-template-columns: 1fr; }
    .adm-kv .adm-kv-k { padding-bottom: 0; border-bottom: 0; }
    .adm-panel { width: 100%; }
}

/* 問い合わせスレッド */
.app-thread { margin: 0 30px 18px 20px; display: flex; flex-direction: column; gap: 12px; }
.app-msg { background: #fff; border: 1px solid #e3e3e3; border-radius: 6px; padding: 12px 16px; max-width: 85%; }
.app-msg-admin { background: #eef6fc; border-color: #b7d7ef; align-self: flex-start; }
.app-msg-member { align-self: flex-end; }
.app-msg-head { font-size: 0.9em; margin-bottom: 6px; }
.app-msg-body { line-height: 1.7; word-break: break-word; }
.adm-msg { border-left: 3px solid #cfd5dc; padding: 8px 12px; margin-bottom: 14px; }
.adm-msg-admin { border-left-color: #1a70ae; background: #f5f9fd; }
.adm-msg-head { font-size: 0.9em; margin-bottom: 4px; }
@media screen and (max-width: 768px) {
    .app-thread { margin: 0 0 16px 0; }
    .app-msg { max-width: 100%; }
}

/* ---------- 管理画面: 一覧・詳細の部品（作り直し 2026-10） ---------- */
.adm-tabs a .adm-count { color: #9aa3ad; font-weight: normal; margin-left: 2px; }
.adm-filter { align-items: flex-end; }
/* 絞り込みの見出し。入力欄なら label、ボタンの並び（会員の履歴の種類など）なら .adm-filter-label */
.adm-filter-field label, .adm-filter-label { display: block; font-size: 0.8em; color: #4b5563; margin-bottom: 4px; }
.adm-filter-field .adm-input { min-width: 0; }
.adm-filter .adm-input-search { width: 300px; }
.adm-sort { color: #4b5563; text-decoration: none; white-space: nowrap; }
.adm-sort::after { content: " ▲▼"; font-size: 0.65em; opacity: 0.45; }
.adm-sort.asc::after { content: " ▲"; opacity: 1; }
.adm-sort.desc::after { content: " ▼"; opacity: 1; }
.adm-table-tools { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; }
/* 「選んで操作」の帯。選んでいる間は画面の上に固定して、下のほうの行を選んでいてもボタンが見える（Tak: 編集中にスクロールする画面のボタンは固定） */
.adm-bulkbar { display: none; gap: 10px; align-items: center; flex-wrap: wrap; background: #fff8e1; border: 1px solid #f59e0b; border-radius: 6px; padding: 8px 12px; margin-bottom: 10px; position: sticky; top: 8px; z-index: 15; }
.adm-page-head-sticky .adm-head-row { flex-basis: 100%; }      /* 固定帯の2段目（企業一覧の「行を選んでください」の帯） */
.adm-page-head-sticky .adm-bulkbar { margin-bottom: 0; position: static; }
.adm-selecting .adm-bulkbar { display: flex; }
.adm-sel-col { display: none; width: 28px; }
.adm-selecting .adm-sel-col { display: table-cell; }
.adm-selecting .adm-sel-hide { display: none; }
.adm-detail { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 20px; align-items: start; }
.adm-detail > .adm-card { margin-bottom: 0; }
.adm-detail-side > .adm-card { margin-bottom: 16px; }
.adm-card-pad { padding: 22px 26px; }
.adm-sec { margin-bottom: 22px; }
.adm-sec:last-child { margin-bottom: 0; }
.adm-sec h3 { font-size: 0.82em; color: #6b7280; letter-spacing: 0.08em; margin: 0 0 6px; padding-bottom: 6px; border-bottom: 1px solid #e5e7eb; font-weight: 600; }
.adm-sec-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 6px; }
.adm-kv { display: grid; grid-template-columns: 130px minmax(0, 1fr); }
.adm-kv > div { padding: 8px 0; border-bottom: 1px dashed #eef0f3; line-height: 1.6; }
.adm-kv-k { color: #6b7280; font-size: 0.9em; }
.adm-kv-v { color: #111827; word-break: break-word; }
.adm-sub { color: #6b7280; font-size: 0.85em; margin-left: 6px; }
.adm-big { font-size: 1.25em; font-weight: 600; }
.adm-side-title { font-size: 0.82em; color: #6b7280; margin: 0 0 10px; border-bottom: 0; padding: 0; letter-spacing: 0.08em; font-weight: 600; }
.adm-band { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; }
.adm-lock { width: 12px; height: 12px; vertical-align: -1px; }
.adm-chips { display: flex; gap: 6px; flex-wrap: wrap; }
.adm-emails { list-style: none; margin: 0; padding: 0; }
.adm-emails li { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; padding: 2px 0; }
.adm-login-rows { font-size: 0.92em; }
.adm-totals { display: flex; gap: 28px; flex-wrap: wrap; }
.adm-totals .adm-muted { font-size: 0.82em; }
.adm-inv { border: 1px solid #e5e7eb; border-radius: 8px; padding: 14px 16px; margin-bottom: 12px; }
.adm-inv-head { display: flex; justify-content: space-between; gap: 12px; align-items: flex-start; flex-wrap: wrap; }
.adm-inv-meta { color: #6b7280; font-size: 0.82em; margin-top: 2px; }
.adm-inv-amt { text-align: right; }
.adm-inv-pays { margin-top: 8px; border-top: 1px dashed #eef0f3; padding-top: 6px; }
.adm-inv-pay { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; font-size: 0.88em; padding: 4px 0; }
.adm-inv-actions { display: flex; gap: 6px; margin-top: 10px; flex-wrap: wrap; align-items: center; }
.adm-inv-void { opacity: 0.6; }
.adm-inv details.adm-details { display: inline-block; }
.adm-inv details.adm-details > form { margin-top: 6px; }
.adm-text-attn { color: var(--adm-yellow-text); }
.adm-note-strike { color: #9aa3ad; text-decoration: line-through; font-size: 0.85em; }
/* 企業一覧: エクセル風の表 */
.adm-sheet-wrap { background: #fff; border: 1px solid #e3e7eb; border-radius: 8px; overflow: auto; }
.adm-sheet { width: 100%; border-collapse: collapse; font-size: 0.92em; }
.adm-sheet th, .adm-sheet td { border: 1px solid #d9dee4; padding: 0; vertical-align: top; }
.adm-sheet thead th { background: #f3f5f7; padding: 7px 8px; text-align: left; font-weight: 600; white-space: nowrap; }
.adm-sheet td.adm-sheet-ro { padding: 6px 8px; color: #6b7280; white-space: nowrap; background: #fafbfc; }
.adm-sheet .adm-sheet-n { width: 36px; text-align: right; color: #9aa3ad; padding: 6px 8px; background: #f7f9fb; }
.adm-sheet .adm-sel-col { width: 32px; text-align: center; padding: 6px 4px; }
.adm-cell { display: block; width: 100%; min-width: 120px; border: 0; background: transparent; font: inherit; padding: 6px 8px; color: #111827; resize: none; line-height: 1.5; }
.adm-cell:focus { outline: 2px solid #2c95b5; outline-offset: -2px; background: #fff; }
textarea.adm-cell { min-width: 260px; overflow: hidden; }
td.adm-cell-changed, td.adm-cell-changed .adm-cell { background: #ecfdf5; }
/* 企業一覧のセルの下に小さく出す「公開中: …」「名簿: …」 */
.adm-cell-src { display: block; padding: 0 8px 4px; color: #6b7280; font-size: 0.8em; white-space: pre-line; }
/* 公開ページにだけある会社（次の公開で消える）の行 */
tr.adm-row-gone td { background: #f3f4f6; color: #9aa3ad; }
tr.adm-row-gone td.adm-sheet-ro { white-space: normal; }
/* 状態の列（掲載中・退会済み など）。理由が2行になっても読めるよう幅を確保 */
.adm-sheet td.adm-sheet-state { min-width: 9em; white-space: normal; }
.adm-sheet-state .adm-row-note { padding: 2px 0 0; }
.adm-sheet .adm-pre { white-space: pre-line; }
tr.adm-row-applied td { box-shadow: inset 3px 0 0 #2c95b5; }
tr.adm-row-applied td:not(:first-child) { box-shadow: none; }
.adm-row-note { font-size: 0.78em; color: #1e5f7a; padding: 0 8px 4px; display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.adm-sheet-foot { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; padding: 8px 10px; background: #fafbfc; border-top: 1px solid #e3e7eb; }
.adm-dirty-note { color: #065f46; font-size: 0.88em; }
/* 右から出るパネル（申請の確認） */
.adm-panel { position: fixed; right: 0; top: 0; bottom: 0; width: 480px; max-width: 100%; background: #fff; box-shadow: -6px 0 20px rgba(0,0,0,0.15); padding: 22px 24px; overflow: auto; z-index: 40; }
.adm-panel-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 4px; }
.adm-panel-head h2 { margin: 0; font-size: 1.1em; border: 0; padding: 0; }
.adm-panel-close { color: #6b7280; text-decoration: none; font-size: 1.3em; line-height: 1; }
.adm-panel-field { margin-bottom: 14px; }
.adm-panel-field .adm-label { margin-bottom: 0; }
.adm-panel-now { color: #6b7280; font-size: 0.82em; white-space: pre-line; }
.adm-panel-now::before { content: "現在: "; }
.adm-input-req { background: #fffbeb; }
.adm-suggest { font-size: 0.85em; color: #b45309; margin-top: 4px; display: flex; gap: 8px; align-items: flex-start; flex-wrap: wrap; }
.adm-suggest ul { margin: 0; padding-left: 1.2em; }
.adm-kv-2 { grid-template-columns: minmax(0, 1fr) auto; column-gap: 12px; }
.adm-kv-login { grid-template-columns: 110px minmax(0, 1fr); }
.adm-withdraw { padding: 0; }
.adm-withdraw > summary { list-style: none; cursor: pointer; padding: 10px 14px; margin: 0; }
.adm-withdraw > summary::-webkit-details-marker { display: none; }
.adm-withdraw-body { padding: 4px 14px 14px; border-top: 1px dashed #fcd34d; }
.adm-withdraw-body p { margin: 8px 0; }
.adm-details > summary.adm-btn { display: inline-block; list-style: none; }
.adm-details > summary.adm-btn::-webkit-details-marker { display: none; }
.adm-card-attn { border-color: #f59e0b; }
.adm-inline-details { position: relative; display: inline-block; }
.adm-inline-details > summary { list-style: none; }
.adm-inline-details > summary::-webkit-details-marker { display: none; }
.adm-popover { position: absolute; left: 0; top: 100%; z-index: 20; margin-top: 6px; min-width: 320px; background: #fff; border: 1px solid #d9dee4; border-radius: 8px; box-shadow: 0 8px 24px rgba(0,0,0,0.12); padding: 12px 14px; }
.adm-popover .adm-input { margin-bottom: 6px; }
.adm-popover-right { left: auto; right: 0; }                  /* 画面の右端に近いボタンから出すとき（固定帯の中） */
.adm-details > summary.adm-btn { margin: 0; color: #222; }
.adm-details > summary.adm-btn-primary { color: #fff; }
.adm-details > summary.adm-btn-danger { color: #b42318; }

/* 企業一覧の「次の公開で消える」行: 会員コードを打って結びつける（名寄せ）。入力欄は短く、ボタンと横並び */
.adm-link-row { display: inline-flex; gap: 4px; align-items: center; }
.adm-cell-code { width: 6em; min-width: 0; }