Template:DynamicInfobox/styles.css

/* Look of the Wikidata-driven infobox rendered by Module:DynamicCapiunto.
   Loaded by the module via ; builds on Capiunto's own
   .mw-capiunto-infobox styles.

   Colours use the skin's Codex design tokens, so the box follows Vector's
   light and dark (night) mode. The hex value after each token is the
   light-mode fallback for skins that don't define it. */

.pc-infobox {
	width: 22em;
	padding: 0;
	border: 1px solid var(--border-color-base, #a2a9b1);
	border-collapse: collapse;
	background-color: var(--background-color-neutral-subtle, #f8f9fa);
	color: var(--color-base, #202122);
	line-height: 1.4;
}

.pc-infobox > caption {
	padding: 0.4em 0.5em;
	border: 1px solid var(--border-color-base, #a2a9b1);
	border-bottom: 0;
	background-color: var(--background-color-progressive-subtle, #eaf3ff);
	color: var(--color-emphasized, #101418);
	font-size: 120%;
	font-weight: bold;
	text-align: center;
}

.pc-infobox th,
.pc-infobox td {
	padding: 0.3em 0.6em;
	overflow-wrap: break-word;
}

/* Thin separators between rows of the same section */
.pc-infobox tr + tr > th,
.pc-infobox tr + tr > td {
	border-top: 1px solid var(--border-color-muted, #dadde3);
}

/* Key column: never wrap labels such as "Parent organization" */
.pc-infobox .mw-capiunto-infobox-label {
	width: 1%;
	white-space: nowrap;
	font-weight: bold;
}

/* Section headers ("Location", "Links") */
.pc-infobox .mw-capiunto-infobox-header {
	padding: 0.3em 0.6em;
	border-top: 1px solid var(--border-color-base, #a2a9b1);
	background-color: var(--background-color-interactive, #eaecf0);
	color: var(--color-emphasized, #101418);
	font-weight: bold;
	text-align: center;
}

/* Official name below the title */
.pc-infobox-subtitle > td {
	font-style: italic;
	text-align: center;
}

/* Images and their captions */
.pc-infobox .mw-capiunto-infobox-spanning img {
	max-width: 100%;
	height: auto;
}

.pc-infobox .mw-capiunto-infobox-spanning div {
	color: var(--color-subtle, #54595d);
	font-size: 90%;
}

/* Logos are often dark artwork on a transparent background; keep a light
   backing behind them so they stay visible in dark mode. */
.pc-infobox-logo img {
	padding: 4px;
	border-radius: 2px;
	background-color: #fff;
}

/* Small additions inside a value, e.g. "(as of May 2023)" */
.pc-infobox-note {
	color: var(--color-subtle, #54595d);
	font-size: 90%;
}

/* Wikipedia / Wikidata line at the bottom */
.pc-infobox .mw-capiunto-infobox-spanning div.pc-infobox-footer {
	color: inherit;
	font-size: 85%;
}