/* 計画ツール。色は子テーマ(theme.json)のプリセットを使い、無い場合の値も持つ。 */
.gp-planner {
	--gp-ink: var(--wp--preset--color--contrast, #1c2630);
	--gp-ink-2: var(--wp--preset--color--accent-4, #4a5763);
	--gp-paper: var(--wp--preset--color--base, #f5f6f2);
	--gp-sheet: #fff;
	--gp-rule: var(--wp--preset--color--accent-5, #dce0da);
	--gp-grid: var(--wp--preset--color--accent-6, #e9ece6);
	--gp-accent: var(--wp--preset--color--accent-1, #16705f);
	--gp-accent-soft: var(--wp--preset--color--accent-2, #dceee8);
	--gp-ok: var(--wp--preset--color--ok, #2e7d4f);
	--gp-warn: var(--wp--preset--color--warn, #a36300);
	--gp-bad: var(--wp--preset--color--bad, #b23a3a);
	--gp-ok-bg: #e1f2e7;
	--gp-warn-bg: #fbefd6;
	--gp-bad-bg: #f8e1e1;
	margin-block: 1.5rem;
	font-size: 15px;
	line-height: 1.7;
	color: var(--gp-ink);
}
.gp-planner * { box-sizing: border-box; }
.gp-planner-grid { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 20px; align-items: start; }
@media (max-width: 781px) { .gp-planner-grid { grid-template-columns: minmax(0, 1fr); } }

.gp-form { display: flex; flex-direction: column; gap: 12px; background: var(--gp-grid); border-radius: 8px; padding: 14px; }
.gp-field { display: flex; flex-direction: column; gap: 4px; font-size: 12.5px; color: var(--gp-ink-2); margin: 0; }
.gp-field select, .gp-field input[type="date"] { font: inherit; font-size: 15px; color: var(--gp-ink); background: var(--gp-sheet); border: 1px solid var(--gp-rule); border-radius: 5px; padding: 6px 8px; width: 100%; }
.gp-field input[type="range"] { width: 100%; accent-color: var(--gp-accent); }
.gp-chips { border: 0; padding: 0; flex-direction: row; flex-wrap: wrap; gap: 6px; }
.gp-chips legend { padding: 0; margin-bottom: 4px; }
.gp-chips label { display: inline-block; }
.gp-chips input { position: absolute; opacity: 0; pointer-events: none; }
.gp-chips span { display: inline-block; padding: 6px 12px; border: 1px solid var(--gp-rule); border-radius: 999px; background: var(--gp-sheet); color: var(--gp-ink); cursor: pointer; font-size: 14px; line-height: 1.4; }
.gp-chips span:hover { border-color: var(--gp-accent); }
.gp-chips input:checked + span { background: var(--gp-accent); color: #fff; font-weight: 700; border-color: var(--gp-accent); }
.gp-chips input:focus-visible + span { outline: 2px solid var(--gp-accent); outline-offset: 2px; }
.gp-val { color: var(--gp-ink); font-variant-numeric: tabular-nums; }
.gp-seg { border: 0; padding: 0; }
.gp-seg legend { padding: 0; margin-bottom: 4px; }
.gp-seg label { display: inline-block; }
.gp-seg input { position: absolute; opacity: 0; pointer-events: none; }
.gp-seg span { display: inline-block; padding: 6px 14px; border: 1px solid var(--gp-rule); background: var(--gp-sheet); color: var(--gp-ink-2); cursor: pointer; font-size: 13px; }
.gp-seg label:first-of-type span { border-radius: 6px 0 0 6px; }
.gp-seg label:last-of-type span { border-radius: 0 6px 6px 0; border-left: 0; }
.gp-seg input:checked + span { background: var(--gp-accent); color: #fff; font-weight: 700; border-color: var(--gp-accent); }
.gp-seg input:focus-visible + span, .gp-planner a:focus-visible, .gp-planner button:focus-visible { outline: 2px solid var(--gp-accent); outline-offset: 2px; }

.gp-result { display: flex; flex-direction: column; gap: 16px; min-width: 0; transition: opacity .15s; }
.gp-planner.is-loading .gp-result { opacity: .55; }
.gp-result h3 { font-size: 16px; margin: 0 0 8px; }
.gp-result p { margin: 0; }

.gp-verdict { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 14px; align-items: center; border-radius: 8px; padding: 14px; }
.gp-verdict-label { font-weight: 900; font-size: 22px; white-space: nowrap; }
.gp-tone-ok { background: var(--gp-ok-bg); } .gp-tone-ok .gp-verdict-label { color: var(--gp-ok); } .gp-tone-ok .gp-meter i { background: var(--gp-ok); }
.gp-tone-warn { background: var(--gp-warn-bg); } .gp-tone-warn .gp-verdict-label { color: var(--gp-warn); } .gp-tone-warn .gp-meter i { background: var(--gp-warn); }
.gp-tone-bad { background: var(--gp-bad-bg); } .gp-tone-bad .gp-verdict-label { color: var(--gp-bad); } .gp-tone-bad .gp-meter i { background: var(--gp-bad); }
.gp-meter { height: 10px; background: rgba(0, 0, 0, .08); border-radius: 99px; position: relative; overflow: hidden; margin-top: 6px; }
.gp-meter i { position: absolute; inset: 0 auto 0 0; border-radius: 99px; }

.gp-nums { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
@media (max-width: 480px) { .gp-nums { grid-template-columns: minmax(0, 1fr); } }
.gp-nums div { font-size: 12px; color: var(--gp-ink-2); display: flex; flex-direction: column; }
.gp-nums strong { font-size: 21px; color: var(--gp-ink); font-variant-numeric: tabular-nums; line-height: 1.4; }

.gp-gantt { display: flex; flex-direction: column; gap: 6px; font-size: 12px; }
.gp-g-row { display: grid; grid-template-columns: 120px minmax(0, 1fr); gap: 8px; align-items: center; }
.gp-g-name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 480px) { .gp-g-row { grid-template-columns: 88px minmax(0, 1fr); } }
.gp-g-track { position: relative; height: 20px; background: var(--gp-grid); border-radius: 4px; }
.gp-g-bar { position: absolute; top: 0; bottom: 0; border-radius: 4px; color: #fff; font-size: 11px; padding-left: 6px; white-space: nowrap; overflow: hidden; line-height: 20px; }
.gp-g-input { background: var(--gp-accent); } .gp-g-practice { background: var(--gp-warn); } .gp-g-final { background: var(--gp-bad); }
.gp-g-axis .gp-g-ticks { position: relative; height: 16px; font-size: 10.5px; color: var(--gp-ink-2); font-variant-numeric: tabular-nums; }
.gp-g-ticks span { position: absolute; white-space: nowrap; }
.gp-g-ticks span.is-end { transform: translateX(-100%); }

.gp-table-wrap { overflow-x: auto; }
.gp-weekly { border-collapse: collapse; width: 100%; font-size: 14px; background: var(--gp-sheet); }
.gp-weekly th, .gp-weekly td { border: 1px solid var(--gp-rule); padding: 6px 10px; text-align: left; }
.gp-weekly th { background: var(--gp-grid); white-space: nowrap; }
.gp-weekly td:first-child, .gp-weekly td:last-child { font-variant-numeric: tabular-nums; white-space: nowrap; }

.gp-note, .gp-foot, .gp-meta { font-size: 12.5px; color: var(--gp-ink-2); }
.gp-error { color: var(--gp-bad); }
.gp-milestone { font-size: 14px; }
.gp-actions { display: flex; gap: 8px; flex-wrap: wrap; }

.gp-btn { display: inline-block; background: var(--gp-accent); color: #fff; font-weight: 700; border: 0; border-radius: 6px; padding: 8px 14px; text-align: center; font-size: 14px; text-decoration: none; cursor: pointer; font-family: inherit; }
.gp-btn:hover { color: #fff; filter: brightness(1.08); }
.gp-btn-quiet { background: var(--gp-sheet); color: var(--gp-accent); border: 1px solid var(--gp-accent); font-weight: 500; font-size: 13px; padding: 6px 12px; }
.gp-btn-quiet:hover { color: var(--gp-accent); background: var(--gp-accent-soft); }
.gp-btn-disabled { background: var(--gp-grid); color: var(--gp-ink-2); cursor: default; font-weight: 500; font-size: 13px; }

.gp-offers { border: 1px solid var(--gp-rule); border-radius: 8px; padding: 14px; display: flex; flex-direction: column; gap: 10px; background: var(--gp-sheet); }
.gp-offers-head { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.gp-offers-head h3 { margin: 0; }
.gp-pr { border: 1px solid var(--gp-ink-2); color: var(--gp-ink-2); font-size: 11px; padding: 0 6px; border-radius: 99px; }
.gp-offer-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 10px; }
.gp-offer { border: 1px solid var(--gp-rule); border-radius: 6px; padding: 10px; display: flex; flex-direction: column; gap: 6px; font-size: 13.5px; }
.gp-badge { align-self: flex-start; font-size: 11px; background: var(--gp-warn-bg); color: var(--gp-warn); border-radius: 4px; padding: 0 6px; }
.gp-pill { display: inline-block; font-size: 12px; font-weight: 700; padding: 0 9px; border-radius: 99px; }
.gp-pill-relaxed, .gp-pill-standard { background: var(--gp-ok-bg); color: var(--gp-ok); }
.gp-pill-tight { background: var(--gp-warn-bg); color: var(--gp-warn); }
.gp-pill-short { background: var(--gp-bad-bg); color: var(--gp-bad); }

.gp-editor-note { border-left: 3px solid var(--wp--preset--color--accent-3, #f4db6a); background: var(--wp--preset--color--accent-6, #e9ece6); padding: 10px 14px; border-radius: 0 6px 6px 0; margin-block: 1rem; font-size: 15px; }
.gp-editor-note p { margin: .4em 0 0; }

@media (prefers-reduced-motion: no-preference) {
	.gp-g-bar, .gp-meter i { transition: width .3s ease, left .3s ease; }
}

/* カレンダーへの入れ方 */
.gp-help { font-size: 13px; color: var(--gp-ink-2); }
.gp-help summary { cursor: pointer; color: var(--gp-accent); }
.gp-help ul { margin: 8px 0; padding-left: 1.2em; }
.gp-help li { margin: 4px 0; }

/* ページ部品(資格ハブ・スクール・プラン)。本文の直下に並ぶので、色は :root で定義する。 */
:root {
	--gp-ink: var(--wp--preset--color--contrast, #1c2630);
	--gp-ink-2: var(--wp--preset--color--accent-4, #4a5763);
	--gp-rule: var(--wp--preset--color--accent-5, #dce0da);
	--gp-grid: var(--wp--preset--color--accent-6, #e9ece6);
	--gp-accent: var(--wp--preset--color--accent-1, #16705f);
	--gp-sheet: #fff;
	--gp-ok: var(--wp--preset--color--ok, #2e7d4f);
	--gp-warn: var(--wp--preset--color--warn, #a36300);
	--gp-bad: var(--wp--preset--color--bad, #b23a3a);
	--gp-ok-bg: #e1f2e7;
	--gp-warn-bg: #fbefd6;
	--gp-bad-bg: #f8e1e1;
}
.gp-section { display: flex; flex-direction: column; gap: .5rem; }
.gp-section-head { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.gp-section-head h2 { margin: 0; }
.gp-pr-note { display: flex; align-items: center; gap: 8px; font-size: 13px; color: var(--gp-ink-2); }
.gp-section .gp-pr, .gp-pr-note .gp-pr { border: 1px solid var(--gp-ink-2); color: var(--gp-ink-2); font-size: 11px; padding: 0 6px; border-radius: 99px; }

.gp-kv { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 12px; }
.gp-kv div { border-top: 2px solid var(--gp-ink); padding-top: 6px; }
.gp-kv dt { font-size: 12px; color: var(--gp-ink-2); }
.gp-kv dd { margin: 0; display: flex; flex-direction: column; }
.gp-kv strong { font-size: 1.3rem; font-variant-numeric: tabular-nums; line-height: 1.4; }
.gp-kv span { font-size: 12px; color: var(--gp-ink-2); }

.gp-facts { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 6px 16px; margin: 0; }
.gp-facts div { display: contents; }
.gp-facts dt { color: var(--gp-ink-2); font-size: 14px; }
.gp-facts dd { margin: 0; }

.gp-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 10px; }
.gp-card { border: 1px solid var(--gp-rule); background: var(--gp-sheet); border-radius: 6px; padding: 12px; display: flex; flex-direction: column; gap: 4px; font-size: 14px; color: var(--gp-ink); text-decoration: none; }
.gp-card:hover { border-color: var(--gp-accent); }
.gp-card .gp-pill { align-self: flex-start; }

.gp-courses { border-collapse: collapse; width: 100%; min-width: 560px; font-size: 14px; background: var(--gp-sheet); }
.gp-courses td:first-child { min-width: 11em; }
.gp-courses th, .gp-courses td { border: 1px solid var(--gp-rule); padding: 8px 10px; text-align: left; vertical-align: top; }
.gp-courses th { background: var(--gp-grid); white-space: nowrap; font-size: 13px; }
.gp-num { font-variant-numeric: tabular-nums; white-space: nowrap; }
.gp-courses .gp-btn { display: inline-block; background: var(--gp-accent); color: #fff; font-weight: 700; border-radius: 6px; text-decoration: none; white-space: nowrap; font-size: 13px; padding: 6px 12px; }
.gp-courses .gp-btn-disabled { background: var(--gp-grid); color: var(--gp-ink-2); font-weight: 500; }

.gp-meta, .gp-note { font-size: 12.5px; color: var(--gp-ink-2); }
.gp-badge { display: inline-block; font-size: 11px; background: var(--gp-warn-bg); color: var(--gp-warn); border-radius: 4px; padding: 0 6px; }
.gp-pill { display: inline-block; font-size: 12px; font-weight: 700; padding: 0 9px; border-radius: 99px; }
.gp-pill-relaxed, .gp-pill-standard { background: var(--gp-ok-bg); color: var(--gp-ok); }
.gp-pill-tight { background: var(--gp-warn-bg); color: var(--gp-warn); }
.gp-pill-short { background: var(--gp-bad-bg); color: var(--gp-bad); }
.gp-table-wrap { overflow-x: auto; }
.gp-sources ul { margin: 0; padding-left: 1.2em; }

.gp-breadcrumb ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 4px; font-size: 13px; color: var(--gp-ink-2); }
.gp-breadcrumb li + li::before { content: "›"; margin-right: 4px; }
.gp-breadcrumb a { color: var(--gp-ink-2); }

/* 講座表は広い幅で出し、見出しやリンクは本文の幅にそろえる。 */
.gp-section.alignwide > :not(.gp-table-wrap) { width: 100%; max-width: var(--wp--style--global--content-size, 645px); margin-inline: auto; }

/* お問い合わせフォーム */
.gp-contact { display: flex; flex-direction: column; gap: 4px; max-width: 640px; }
.gp-contact label { display: flex; flex-direction: column; gap: 4px; font-size: 14px; }
.gp-contact input, .gp-contact select, .gp-contact textarea { font: inherit; padding: 8px 10px; border: 1px solid var(--gp-rule); border-radius: 6px; background: var(--gp-sheet); color: var(--gp-ink); }
.gp-contact .gp-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.gp-contact-error { background: var(--gp-bad-bg); color: var(--gp-bad); padding: 8px 12px; border-radius: 6px; }
.gp-contact-done { background: var(--gp-ok-bg); padding: 12px 16px; border-radius: 6px; }
