/*
 * shibutani.org 共通配色
 *
 * 既存の情報構造とWeb標準の操作性を保ち、色の役割だけを共通化する。
 * レイアウトは style.css、分野固有の状態色は各分野のCSSが担当する。
 */

:root {
	--site-brand: #004488;
	--site-brand-dark: #002b57;
	--site-link: #0000ff;
	--site-link-hover: #000099;
	--site-accent: #e65100;
	--site-accent-text: #b23c00;
	--site-highlight: #f4c430;
	--site-text: #000000;
	--site-surface: #ffffff;
	--site-surface-subtle: #f5f6f7;
	--site-border: #6f7780;
	--site-border-subtle: #c9cdd1;
	--site-success: #006b4f;
	--site-warning: #7a5200;
	--site-danger: #b42318;
}

body,
body > main {
	background: var(--site-surface);
	color: var(--site-text);
}

body > header,
.site-footer {
	background: var(--site-brand);
	border-color: var(--site-brand-dark);
}

/* 本文リンクは、ブランド色ではなく既知のWeb規則で示す。 */
a:link,
a:visited {
	color: var(--site-link);
	text-decoration-color: var(--site-link);
	text-underline-offset: 0.14em;
}

a:hover,
a:focus-visible {
	color: var(--site-link-hover);
}

body > header a:link,
body > header a:visited,
.site-footer a:link,
.site-footer a:visited {
	color: #ffffff;
	text-decoration-color: #ffffff;
}

:where(a, button, input, select, textarea, [tabindex]):focus-visible {
	outline: 3px solid var(--site-highlight);
	outline-offset: 2px;
}

h1 {
	background: var(--site-brand);
	border-bottom: 4px solid var(--site-highlight);
	color: var(--site-surface) !important;
}

h2 {
	background: var(--site-surface);
	border-left: 0.42rem solid var(--site-brand);
	border-bottom: 2px solid var(--site-highlight);
	color: var(--site-brand-dark) !important;
}

h3,
h4,
caption {
	color: var(--site-brand-dark);
}

/* ナビゲーションは隠さず、青いリンクと現在位置の黄色で区別する。 */
body > main > nav > ul,
body > main > .prefecture-nav > ul,
body > main > .business-nav > ul,
body > main > .special-account-nav > ul {
	background: var(--site-surface);
	border-bottom-color: var(--site-border-subtle);
}

body > main > nav > ul > li > a,
body > main > nav > ul > li > [data-navigation-label],
body > main > .business-nav > ul > li > a,
body > main > .special-account-nav > ul > li > a {
	background: var(--site-surface);
	border-color: var(--site-border-subtle);
	color: var(--site-link);
}

body > main > nav > ul > li > a:link,
body > main > nav > ul > li > a:visited,
body > main > .business-nav > ul > li > a:link,
body > main > .business-nav > ul > li > a:visited,
[data-tag-link]:link,
[data-tag-link]:visited {
	color: var(--site-link);
}

[data-tag-link][aria-current="page"],
[data-tag-link][aria-selected="true"],
body > main > nav > ul > li > a[aria-current="page"],
body > main > .special-account-nav > ul > li > strong[data-navigation-label] {
	background: #fff2b8;
	border-color: var(--site-highlight);
	color: var(--site-text);
}

body > main > nav > ul > li > a:hover,
body > main > nav > ul > li > a:focus-visible {
	background: #fff2b8;
}

body > main > .special-account-nav > ul > li > span[aria-disabled="true"],
[data-tag-link][aria-disabled="true"] {
	background: var(--site-surface-subtle);
	border-color: var(--site-border-subtle);
	color: var(--site-text);
}

.site-subnav {
	background: var(--site-surface);
	border-left-color: var(--site-highlight);
	color: var(--site-text);
}

/* 帳票と図表は、濃紺と黄色の線で階層を作る。 */
[data-dashboard-stack] > [data-dashboard-stack-heading] {
	background: var(--site-brand-dark);
	border-bottom: 4px solid var(--site-highlight);
	color: var(--site-surface) !important;
}

[data-dashboard-board] {
	background: var(--site-surface);
	border-color: var(--site-border);
}

[data-dashboard-board] > h2 {
	background: var(--site-surface);
	border-left: 0.42rem solid var(--site-brand);
	border-bottom: 3px solid var(--site-highlight);
	color: var(--site-brand-dark) !important;
}

body > main figure {
	background: var(--site-surface);
	border-color: var(--site-border);
}

body > main figure > figcaption {
	color: var(--site-text);
	border-bottom-color: var(--site-border);
}

[data-chart-explainer],
[data-report-note],
[data-report-status],
[data-page-metric-primary] > small,
[data-page-metric-facts] dt,
[data-page-metric-facts] dd > small,
.share-panel > div > p {
	color: var(--site-text);
}

/* 新聞型導入部。代表値だけに鮮明な橙を使う。 */
[data-page-metric-lead] {
	background: var(--site-surface);
	border-top-color: var(--site-brand);
	border-bottom-color: var(--site-border);
}

[data-page-metric-primary],
[data-page-metric-facts] > div,
[data-page-metric-facts] > div:nth-child(even) {
	background: var(--site-surface);
}

[data-page-metric-primary] > strong {
	color: var(--site-text);
}

[data-page-metric-primary] > strong > em {
	color: var(--site-accent);
}

[data-page-metric-primary] > span,
[data-page-metric-facts] > div dd {
	color: var(--site-brand);
}

/* 表は薄い文字に頼らず、黒文字・罫線・太さで読ませる。 */
table[data-dashboard-table] {
	background: var(--site-surface);
	color: var(--site-text);
}

table[data-dashboard-table] > thead > tr > th,
table[data-dashboard-table] > tbody > tr > th[scope="colgroup"] {
	background: #eceeef;
	border-color: var(--site-border);
	color: var(--site-text);
}

table[data-dashboard-table] > tbody > tr > th {
	background: var(--site-surface-subtle);
	color: var(--site-text);
}

table[data-dashboard-table] > tbody > tr > td,
table[data-dashboard-table] > tbody > tr:nth-child(even) > td {
	background: var(--site-surface);
	color: var(--site-text);
}

table[data-dashboard-table] > thead > tr > th,
table[data-dashboard-table] > tbody > tr > th,
table[data-dashboard-table] > tbody > tr > td {
	border-color: var(--site-border);
}

table[data-dashboard-table] > tbody > tr:nth-child(even) > td {
	box-shadow: inset 0 1px 0 #eceeef;
}

[data-dashboard-table] [data-cell="value"],
[data-dashboard-table] [data-state="missing"] {
	color: var(--site-text);
}

/* 補助UIも共通の白地と罫線へ揃える。 */
[data-tag-link],
.share-panel,
[data-link-directory][data-layout="compact"] > section,
[data-fiscal-news],
[data-info-panel] {
	background: var(--site-surface);
	border-color: var(--site-border-subtle);
}

[data-info-panel] {
	border-left-color: var(--site-highlight);
	color: var(--site-text);
}

[data-balance-sheet-switcher] > [role="group"] > button {
	background: var(--site-surface-subtle);
	border-color: var(--site-border-subtle);
	color: var(--site-text);
}

[data-balance-sheet-switcher] > [role="group"] > button:hover {
	background: #fff2b8;
	border-color: var(--site-highlight);
}

[data-balance-sheet-switcher] > [role="group"] > button[aria-pressed="true"] {
	background: var(--site-brand);
	border-color: var(--site-brand-dark);
	color: var(--site-surface);
}

[data-chart-rank] strong {
	color: var(--site-accent-text);
}

.chart-status-state--danger {
	color: var(--site-danger);
}

@media print {
	h1,
	h2,
	[data-dashboard-stack] > [data-dashboard-stack-heading],
	[data-dashboard-board] > h2 {
		border-color: #000000;
	}

	[data-page-metric-primary] > strong > em {
		color: #000000;
	}
}