/* Generated from web/assets/css/src by scripts/build-css.sh. Do not edit directly. */

/* 00-tokens.css */
:root {
	color-scheme: light;
	font-family: var(--font-family-sans);
	background: var(--background-default-grey);
	color: var(--text-default-grey);

	/* DSFR fundamentals: fonts */
	--font-family-sans: "Marianne", Arial, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	--font-family-serif: "Spectral", Georgia, serif;
	--font-weight-regular: 400;
	--font-weight-bold: 700;
	--font-weight-heavy: 900;

	/* DSFR fundamentals: base colors and decision tokens */
	--blue-france-sun-113-625: #000091;
	--blue-france-main-525: #6a6af4;
	--blue-france-975-75: #f5f5fe;
	--blue-france-950-100: #ececfe;
	--red-marianne-main-472: #e1000f;
	--red-marianne-425-625: #c9191e;
	--red-marianne-975-75: #fff4f4;
	--grey-1000-50: #ffffff;
	--grey-975-75: #f6f6f6;
	--grey-950-100: #eeeeee;
	--grey-925-125: #e5e5e5;
	--grey-625-425: #666666;
	--grey-425-625: #929292;
	--grey-50-1000: #161616;

	--background-default-grey: var(--grey-1000-50);
	--background-alt-grey: var(--grey-975-75);
	--background-contrast-grey: var(--grey-950-100);
	--background-alt-blue-france: var(--blue-france-975-75);
	--background-alt-red-marianne: var(--red-marianne-975-75);
	--background-action-high-blue-france: var(--blue-france-sun-113-625);
	--background-action-high-blue-france-hover: #1212ff;
	--background-action-high-blue-france-active: #2323ff;
	--background-active-blue-france: var(--blue-france-sun-113-625);
	--background-flat-info: #0063cb;
	--background-flat-success: #18753c;
	--background-flat-warning: #b34000;
	--background-flat-error: #ce0500;
	--background-vote-pour: #18753c;
	--background-vote-contre: #ce0500;
	--background-vote-abstention: #e9a512;
	--background-vote-non-votant: #929292;
	--background-result-adopte: var(--background-flat-success);
	--background-result-rejete: var(--background-flat-error);
	--text-inverted-result: #ffffff;

	--text-title-grey: var(--grey-50-1000);
	--text-default-grey: #3a3a3a;
	--text-mention-grey: var(--grey-625-425);
	--text-label-grey: var(--grey-50-1000);
	--text-action-high-blue-france: var(--blue-france-sun-113-625);
	--text-action-high-blue-france-hover: #1212ff;
	--text-inverted-grey: var(--grey-1000-50);
	--text-inverted-blue-france: var(--blue-france-975-75);
	--text-default-info: #0063cb;
	--text-default-success: #18753c;
	--text-default-warning: #b34000;
	--text-default-error: #ce0500;

	--border-default-grey: #dddddd;
	--border-plain-grey: var(--grey-425-625);
	--border-action-high-blue-france: var(--blue-france-sun-113-625);
	--border-default-blue-france: #cacafb;
	--border-default-red-marianne: #fcbfbf;

	/* Project aliases for future components */
	--color-page: var(--background-default-grey);
	--color-surface: var(--background-default-grey);
	--color-surface-alt: var(--background-alt-grey);
	--color-surface-accent: var(--background-alt-blue-france);
	--color-text: var(--text-default-grey);
	--color-heading: var(--text-title-grey);
	--color-muted: var(--text-mention-grey);
	--color-link: var(--text-action-high-blue-france);
	--color-border: var(--border-default-grey);
	--color-focus: var(--blue-france-main-525);

	/* DSFR spacing rhythm: v = 0.25rem step */
	--space-0: 0;
	--space-1v: 0.25rem;
	--space-2v: 0.5rem;
	--space-3v: 0.75rem;
	--space-4v: 1rem;
	--space-5v: 1.25rem;
	--space-6v: 1.5rem;
	--space-8v: 2rem;
	--space-10v: 2.5rem;
	--space-12v: 3rem;
	--space-16v: 4rem;
	--space-20v: 5rem;
	--space-24v: 6rem;
	--space-1w: var(--space-1v);
	--space-2w: var(--space-2v);
	--space-3w: var(--space-3v);
	--space-4w: var(--space-4v);
	--space-6w: var(--space-6v);
	--space-8w: var(--space-8v);

	/* Typography scale */
	--text-xs: 0.75rem;
	--text-sm: 0.875rem;
	--text-md: 1rem;
	--text-lg: 1.125rem;
	--text-xl: 1.25rem;
	--title-xs: clamp(1.125rem, 1rem + 0.4vw, 1.375rem);
	--title-sm: clamp(1.375rem, 1.2rem + 0.7vw, 1.75rem);
	--title-md: clamp(1.75rem, 1.45rem + 1.3vw, 2.5rem);
	--title-lg: clamp(2.25rem, 1.7rem + 2.8vw, 4.5rem);
	--line-height-tight: 1.15;
	--line-height-title: 1.25;
	--line-height-body: 1.6;
	--measure-content: 45rem;
	--measure-wide: 62rem;

	/* Layout */
	--container-width: 78rem;
	--container-gutter: var(--space-4v);
	--breakpoint-sm: 36em;
	--breakpoint-md: 48em;
	--breakpoint-lg: 62em;
	--breakpoint-xl: 78em;
	--radius-sm: 0.25rem;
	--radius-md: 0.5rem;
	--shadow-raised: 0 1rem 2.5rem rgb(0 0 145 / 0.1);
	--transition-fast: 160ms ease;
}

:root[data-fr-scheme="dark"],
:root[data-fr-theme="dark"] {
	color-scheme: dark;
	--grey-1000-50: #161616;
	--grey-975-75: #1e1e1e;
	--grey-950-100: #242424;
	--grey-925-125: #2a2a2a;
	--grey-625-425: #929292;
	--grey-425-625: #cecece;
	--grey-50-1000: #ffffff;
	--blue-france-sun-113-625: #8585f6;
	--blue-france-main-525: #6a6af4;
	--blue-france-975-75: #1b1b35;
	--blue-france-950-100: #21213f;
	--red-marianne-975-75: #2b1919;
	--background-action-high-blue-france-hover: #b1b1f9;
	--background-action-high-blue-france-active: #c6c6fb;
	--text-action-high-blue-france-hover: #b1b1f9;
	--text-default-grey: #cecece;
	--text-inverted-grey: #161616;
	--text-inverted-blue-france: #000091;
	--border-default-grey: #3a3a3a;
	--border-default-blue-france: #272747;
	--border-default-red-marianne: #3b2424;
	--shadow-raised: 0 1rem 2.5rem rgb(0 0 0 / 0.28);
}

@media (prefers-color-scheme: dark) {
	:root[data-fr-scheme="system"] {
		color-scheme: dark;
		--grey-1000-50: #161616;
		--grey-975-75: #1e1e1e;
		--grey-950-100: #242424;
		--grey-925-125: #2a2a2a;
		--grey-625-425: #929292;
		--grey-425-625: #cecece;
		--grey-50-1000: #ffffff;
		--blue-france-sun-113-625: #8585f6;
		--blue-france-975-75: #1b1b35;
		--blue-france-950-100: #21213f;
		--red-marianne-975-75: #2b1919;
		--background-action-high-blue-france-hover: #b1b1f9;
		--background-action-high-blue-france-active: #c6c6fb;
		--text-action-high-blue-france-hover: #b1b1f9;
		--text-default-grey: #cecece;
		--text-inverted-grey: #161616;
		--text-inverted-blue-france: #000091;
		--border-default-grey: #3a3a3a;
		--border-default-blue-france: #272747;
		--border-default-red-marianne: #3b2424;
		--shadow-raised: 0 1rem 2.5rem rgb(0 0 0 / 0.28);
	}
}

/* 01-base.css */
*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
}

body {
	min-height: 100vh;
	margin: 0;
	font-size: var(--text-md);
	line-height: var(--line-height-body);
	background: var(--color-page);
	color: var(--color-text);
}

body,
button,
input,
select,
textarea {
	font: inherit;
}

img,
svg {
	display: block;
	max-width: 100%;
}

a {
	color: var(--color-link);
	text-underline-offset: 0.18em;
	text-decoration-thickness: 0.08em;
}

a:hover {
	color: var(--text-action-high-blue-france-hover);
}

:focus-visible {
	outline: 3px solid var(--color-focus);
	outline-offset: 3px;
}

::selection {
	background: var(--background-active-blue-france);
	color: var(--text-inverted-blue-france);
}

h1,
h2,
h3,
p {
	margin-block-start: 0;
}

h1,
h2,
h3 {
	color: var(--color-heading);
	font-weight: var(--font-weight-bold);
	line-height: var(--line-height-title);
}

h1 {
	margin-block-end: var(--space-6v);
	font-size: var(--title-lg);
	letter-spacing: -0.03em;
}

h2 {
	margin-block-end: var(--space-4v);
	font-size: var(--title-md);
}

h3 {
	margin-block-end: var(--space-3v);
	font-size: var(--title-xs);
}

p {
	margin-block-end: var(--space-4v);
}

code {
	padding: 0.1em 0.25em;
	border-radius: var(--radius-sm);
	background: var(--background-contrast-grey);
	color: var(--text-title-grey);
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
	font-size: 0.95em;
}

/* 02-layout.css */
.skip-link {
	position: fixed;
	inset-block-start: var(--space-4v);
	inset-inline-start: var(--space-4v);
	z-index: 20;
	transform: translateY(calc(-100% - var(--space-6v)));
	padding: var(--space-2v) var(--space-4v);
	background: var(--background-action-high-blue-france);
	color: var(--text-inverted-blue-france);
	font-weight: var(--font-weight-bold);
	transition: transform var(--transition-fast);
}

.skip-link:focus-visible {
	transform: translateY(0);
}

.fr-container {
	width: min(100% - (var(--container-gutter) * 2), var(--container-width));
	margin-inline: auto;
}

.fr-grid {
	display: grid;
	gap: var(--space-6v);
}

.fr-grid--2,
.fr-grid--3 {
	grid-template-columns: 1fr;
}

.fr-sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/* 03-utilities.css */
.fr-text--xs { font-size: var(--text-xs); }
.fr-text--sm { font-size: var(--text-sm); }
.fr-text--md { font-size: var(--text-md); }
.fr-text--lg { font-size: var(--text-lg); }
.fr-text--xl { font-size: var(--text-xl); }
.fr-text--bold { font-weight: var(--font-weight-bold); }
.fr-text--alt { font-family: var(--font-family-serif); }
.fr-text--mention { color: var(--text-mention-grey); }
.fr-text--title { color: var(--text-title-grey); }
.fr-text--action-high-blue-france { color: var(--text-action-high-blue-france); }
.fr-background-default--grey { background: var(--background-default-grey); }
.fr-background-alt--grey { background: var(--background-alt-grey); }
.fr-background-alt--blue-france { background: var(--background-alt-blue-france); }
.fr-background-alt--red-marianne { background: var(--background-alt-red-marianne); }
.fr-m-0 { margin: 0; }
.fr-mt-2v { margin-block-start: var(--space-2v); }
.fr-mt-4v { margin-block-start: var(--space-4v); }
.fr-mt-6v { margin-block-start: var(--space-6v); }
.fr-mb-0 { margin-block-end: 0; }
.fr-mb-2v { margin-block-end: var(--space-2v); }
.fr-mb-4v { margin-block-end: var(--space-4v); }
.fr-mb-6v { margin-block-end: var(--space-6v); }
.fr-p-2v { padding: var(--space-2v); }
.fr-p-4v { padding: var(--space-4v); }
.fr-p-6v { padding: var(--space-6v); }
.fr-py-4v { padding-block: var(--space-4v); }
.fr-py-6v { padding-block: var(--space-6v); }
.fr-py-8v { padding-block: var(--space-8v); }

/* components/shell-header.css */
.page-shell {
	min-height: 100vh;
	display: flex;
	flex-direction: column;
}

.page-main {
	flex: 1;
}

.site-header {
	border-bottom: 1px solid var(--color-border);
	background: var(--background-default-grey);
}

.site-header__inner {
	display: flex;
	align-items: center;
	gap: var(--space-4v);
	min-height: 5rem;
	padding-block: var(--space-4v);
}

.brand-logo {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	inline-size: 3rem;
	block-size: 3rem;
	text-decoration: none;
}

.brand-logo img {
	display: block;
	inline-size: 100%;
	block-size: 100%;
	object-fit: contain;
}

.service-title {
	min-width: 0;
}

.service-title__name {
	margin-block-end: 0;
	color: var(--text-title-grey);
	font-weight: var(--font-weight-bold);
}

.service-title__tagline {
	margin-block-end: 0;
	color: var(--text-mention-grey);
	font-size: var(--text-sm);
}

.site-nav {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-2v);
	margin-inline-start: auto;
}

.site-nav__link {
	display: inline-flex;
	align-items: center;
	min-height: 2.25rem;
	padding-inline: var(--space-3v);
	color: var(--text-action-high-blue-france);
	font-size: var(--text-sm);
	font-weight: var(--font-weight-bold);
	text-decoration: none;
}

.site-nav__link:hover,
.site-nav__link--active {
	background: var(--background-alt-blue-france);
	color: var(--text-action-high-blue-france-hover);
}

.theme-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--space-2v);
	min-height: 2.25rem;
	padding: var(--space-1v) var(--space-3v);
	border: 1px solid var(--border-default-blue-france);
	border-radius: 999rem;
	background: var(--background-default-grey);
	color: var(--text-action-high-blue-france);
	font-size: var(--text-sm);
	font-weight: var(--font-weight-bold);
	cursor: pointer;
	transition: background-color var(--transition-fast), border-color var(--transition-fast), color var(--transition-fast);
}

.theme-toggle:hover {
	border-color: var(--border-action-high-blue-france);
	background: var(--background-alt-blue-france);
	color: var(--text-action-high-blue-france-hover);
}

.theme-toggle__icon {
	position: relative;
	inline-size: 1.125rem;
	block-size: 1.125rem;
	border: 2px solid currentColor;
	border-radius: 50%;
	background: linear-gradient(90deg, currentColor 50%, transparent 50%);
}

:root[data-fr-scheme="light"] .theme-toggle__icon {
	background: currentColor;
}

:root[data-fr-scheme="dark"] .theme-toggle__icon {
	background: transparent;
}

/* pages/shared-headings.css */
.section {
	padding-block: var(--space-12v);
}

.section--muted {
	border-block: 1px solid var(--color-border);
	background: var(--background-alt-grey);
}

.section-heading {
	max-width: var(--measure-content);
	margin-block-end: var(--space-8v);
}

.page-heading {
	background: var(--background-default-grey);
}

.detail-heading {
	padding-block: var(--space-8v);
}

.page-heading h1 {
	max-width: var(--measure-wide);
}

.detail-heading h1 {
	max-width: var(--measure-wide);
	margin-block-end: 0;
}

.detail-heading .eyebrow {
	margin-block-end: var(--space-2v);
}

.detail-heading .lead {
	margin-block-start: var(--space-3v);
}

.detail-heading__title-row {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-4v);
	align-items: center;
	justify-content: space-between;
}

.deputy-heading__identity {
	display: flex;
	align-items: center;
	gap: var(--space-4v);
	min-width: 0;
}

.deputy-heading__group-logo {
	flex: 0 0 auto;
	inline-size: clamp(4rem, 14vw, 6rem);
	block-size: clamp(4rem, 14vw, 6rem);
	padding: var(--space-2v);
	border: 1px solid var(--border-default-grey);
	background: #fff;
	object-fit: contain;
}

.deputy-heading__group-link {
	display: inline-flex;
	flex: 0 0 auto;
}

.deputy-heading__group-link:hover .deputy-heading__group-logo {
	border-color: var(--border-action-high-blue-france);
}

.political-group-heading__logo {
	flex: 0 0 auto;
	inline-size: clamp(5rem, 16vw, 7rem);
	block-size: clamp(5rem, 16vw, 7rem);
	padding: var(--space-2v);
	border: 1px solid var(--border-default-grey);
	background: #fff;
	object-fit: contain;
}

.breadcrumb {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-2v);
	margin-block-end: var(--space-4v);
	color: var(--text-mention-grey);
	font-size: var(--text-sm);
}

.breadcrumb a {
	font-weight: var(--font-weight-bold);
}

.detail-heading__meta {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-2v);
	margin-block-start: var(--space-4v);
}

.detail-heading__meta span:not(.result-chip) {
	display: inline-flex;
	align-items: center;
	min-height: 1.75rem;
	padding-inline: var(--space-2v);
	background: var(--background-alt-grey);
	color: var(--text-mention-grey);
	font-size: var(--text-sm);
}

.detail-heading__actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-3v);
}

/* pages/home.css */
.hero {
	position: relative;
	overflow: clip;
	background:
		linear-gradient(120deg, transparent 0 62%, var(--background-alt-blue-france) 62% 100%),
		var(--background-default-grey);
}

.hero__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--space-8v);
	align-items: center;
}

.hero__content {
	max-width: var(--measure-wide);
}

.lead {
	max-width: var(--measure-content);
	color: var(--text-default-grey);
	font-size: var(--text-lg);
}

.eyebrow {
	margin-block-end: var(--space-3v);
	color: var(--text-action-high-blue-france);
	font-size: var(--text-xs);
	font-weight: var(--font-weight-bold);
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.hero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-3v);
	margin-block-start: var(--space-8v);
}

.button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 2.75rem;
	padding: var(--space-3v) var(--space-5v);
	border: 1px solid var(--background-action-high-blue-france);
	background: var(--background-action-high-blue-france);
	color: var(--text-inverted-blue-france);
	font-weight: var(--font-weight-bold);
	line-height: 1.2;
	text-decoration: none;
	transition: background-color var(--transition-fast), border-color var(--transition-fast), color var(--transition-fast);
}

.button:hover {
	border-color: var(--background-action-high-blue-france-hover);
	background: var(--background-action-high-blue-france-hover);
	color: var(--text-inverted-blue-france);
}

.button:active {
	border-color: var(--background-action-high-blue-france-active);
	background: var(--background-action-high-blue-france-active);
}

.button--secondary {
	background: transparent;
	color: var(--text-action-high-blue-france);
}

.button--secondary:hover {
	background: var(--background-alt-blue-france);
	color: var(--text-action-high-blue-france-hover);
}

.button--small {
	min-height: 2rem;
	padding: var(--space-1v) var(--space-3v);
	font-size: var(--text-sm);
}

.hero__panel {
	padding: var(--space-6v);
	border: 1px solid var(--border-default-blue-france);
	background: var(--background-default-grey);
	box-shadow: var(--shadow-raised);
}

.hero__panel h2 {
	font-size: var(--title-sm);
}

.status-chip,
.card__kicker {
	display: inline-flex;
	margin-block-end: var(--space-4v);
	padding: var(--space-1v) var(--space-2v);
	background: var(--background-alt-blue-france);
	color: var(--text-action-high-blue-france);
	font-size: var(--text-xs);
	font-weight: var(--font-weight-bold);
	line-height: 1.4;
	text-transform: uppercase;
}

.metric-list {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--space-2v);
	margin-block-start: var(--space-6v);
}

.metric-card {
	padding: var(--space-3v);
	border-top: 3px solid var(--border-action-high-blue-france);
	background: var(--background-alt-grey);
}

.metric-card strong,
.metric-card span {
	display: block;
}

.metric-card strong {
	color: var(--text-title-grey);
	font-size: var(--text-lg);
}

.metric-card span {
	color: var(--text-mention-grey);
	font-size: var(--text-sm);
}

.dataset-meta {
	margin-block-start: var(--space-6v);
	padding-block-start: var(--space-4v);
	border-top: 1px solid var(--border-default-grey);
	color: var(--text-mention-grey);
	font-size: var(--text-sm);
}

.dataset-meta p {
	margin-block-end: var(--space-2v);
	color: var(--text-default-grey);
	font-weight: var(--font-weight-bold);
}

.dataset-meta ul {
	display: grid;
	gap: var(--space-1v);
	margin: 0;
	padding-inline-start: var(--space-5v);
}

.card-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--space-4v);
}

.card {
	min-height: 100%;
	padding: var(--space-6v);
	border: 1px solid var(--border-default-grey);
	border-top: 4px solid var(--border-action-high-blue-france);
	background: var(--background-default-grey);
}

/* components/forms-filters.css */
.scrutin-toolbar {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--space-4v);
	margin-block-end: var(--space-4v);
	padding: var(--space-5v);
	border: 1px solid var(--border-default-grey);
	background: var(--background-default-grey);
}

.field {
	display: grid;
	gap: var(--space-2v);
}

.field span,
.sort-panel > span {
	color: var(--text-title-grey);
	font-size: var(--text-sm);
	font-weight: var(--font-weight-bold);
}

.field input,
.field select {
	min-height: 2.75rem;
	width: 100%;
	border: 1px solid var(--border-plain-grey);
	border-radius: 0;
	padding: var(--space-2v) var(--space-3v);
	background: var(--background-default-grey);
	color: var(--text-default-grey);
}

.field input::placeholder {
	color: var(--text-mention-grey);
}

.scrutin-filters {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--space-4v);
}

.field--checkbox {
	grid-template-columns: auto 1fr;
	align-items: center;
	gap: var(--space-3v);
}

.field--checkbox input {
	min-height: auto;
	width: auto;
}

.scrutin-toolbar__actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-3v);
	align-items: end;
}

.sort-panel {
	display: grid;
	gap: var(--space-3v);
	margin-block-end: var(--space-4v);
	padding: var(--space-4v);
	border: 1px solid var(--border-default-grey);
	background: var(--background-default-grey);
}

.sort-panel__links {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-2v);
}

.sort-link {
	display: inline-flex;
	align-items: center;
	min-height: 2.25rem;
	padding: var(--space-2v) var(--space-3v);
	border: 1px solid var(--border-default-blue-france);
	background: var(--background-default-grey);
	color: var(--text-action-high-blue-france);
	font-size: var(--text-sm);
	font-weight: var(--font-weight-bold);
	line-height: 1.2;
	text-decoration: none;
}

.sort-link:hover,
.sort-link--active {
	border-color: var(--border-action-high-blue-france);
	background: var(--background-alt-blue-france);
	color: var(--text-action-high-blue-france-hover);
}

.list-status {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: var(--space-3v);
	margin-block-end: var(--space-4v);
	color: var(--text-mention-grey);
	font-size: var(--text-sm);
}

.list-status p {
	margin-block-end: 0;
}

.empty-state {
	padding: var(--space-6v);
	border: 1px solid var(--border-default-grey);
	background: var(--background-default-grey);
}

/* components/list-cards.css */
.scrutin-list {
	display: grid;
	gap: var(--space-4v);
}

.deputy-list {
	display: grid;
	gap: var(--space-4v);
}

.political-group-list {
	display: grid;
	gap: var(--space-4v);
}

.scrutin-card {
	position: relative;
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--space-4v);
	padding: var(--space-5v);
	border: 1px solid var(--border-default-grey);
	border-left: 4px solid var(--border-action-high-blue-france);
	background: var(--background-default-grey);
}

.scrutin-card:hover {
	border-left-color: var(--background-action-high-blue-france-hover);
}

.scrutin-card__meta {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-2v);
	color: var(--text-mention-grey);
	font-size: var(--text-sm);
}

.scrutin-card__meta span {
	display: inline-flex;
	align-items: center;
	min-height: 1.75rem;
	padding-inline: var(--space-2v);
	background: var(--background-alt-grey);
}

.scrutin-card__body h2,
.scrutin-card__body h3 {
	max-width: var(--measure-wide);
	font-size: var(--title-xs);
}

.scrutin-card__body p {
	margin-block-end: 0;
	color: var(--text-mention-grey);
	font-size: var(--text-sm);
}

.scrutin-card__title-link {
	color: var(--text-title-grey);
	text-decoration-color: transparent;
}

.scrutin-card__title-link::after {
	content: "";
	position: absolute;
	inset: 0;
}

.scrutin-card__title-link:hover {
	color: var(--text-action-high-blue-france-hover);
	text-decoration-color: currentColor;
}

.scrutin-card__result {
	display: grid;
	gap: var(--space-3v);
}

.deputy-card {
	position: relative;
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--space-4v);
	padding: var(--space-5v);
	border: 1px solid var(--border-default-grey);
	border-left: 4px solid var(--border-action-high-blue-france);
	background: var(--background-default-grey);
}

.deputy-card:hover {
	border-left-color: var(--background-action-high-blue-france-hover);
}

.deputy-card__media {
	position: relative;
	width: fit-content;
}

.deputy-card__photo {
	display: block;
	width: 5.5rem;
	height: 5.5rem;
	border: 1px solid var(--border-default-grey);
	background: var(--background-alt-grey);
	object-fit: cover;
}

.deputy-card__photo--placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--text-mention-grey);
	font-size: var(--title-xs);
	font-weight: var(--font-weight-bold);
}

.deputy-card__group-link {
	position: absolute;
	right: calc(var(--space-2v) * -1);
	bottom: calc(var(--space-2v) * -1);
	width: 2.5rem;
	height: 2.5rem;
	z-index: 2;
	background: #fff;
	text-decoration: none;
}

.deputy-card__group-logo {
	display: block;
	width: 100%;
	height: 100%;
	padding: var(--space-1v);
	border: 1px solid var(--border-default-grey);
	background: #fff;
	object-fit: contain;
}

.deputy-card__group-link:hover .deputy-card__group-logo {
	border-color: var(--border-action-high-blue-france);
}

.deputy-card__body {
	display: grid;
	gap: var(--space-2v);
}

.deputy-card__body h2,
.deputy-card__body p {
	margin-block-end: 0;
}

.deputy-card__body h2 {
	font-size: var(--title-xs);
}

.deputy-card__body p:not(.eyebrow) {
	color: var(--text-mention-grey);
	font-size: var(--text-sm);
}

.deputy-card__meta {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-2v);
	color: var(--text-mention-grey);
	font-size: var(--text-sm);
}

.deputy-card__meta span {
	display: inline-flex;
	align-items: center;
	min-height: 1.75rem;
	padding-inline: var(--space-2v);
	background: var(--background-alt-grey);
}

.deputy-card__stats {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--space-2v);
	margin-block-end: 0;
}

.deputy-card__stats div {
	padding: var(--space-3v);
	background: var(--background-alt-grey);
}

.deputy-card__stats dt {
	color: var(--text-mention-grey);
	font-size: var(--text-xs);
	text-transform: uppercase;
}

.deputy-card__stats dd {
	margin-inline-start: 0;
	color: var(--text-title-grey);
	font-size: var(--text-md);
	font-weight: var(--font-weight-bold);
}

.political-group-card {
	position: relative;
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--space-4v);
	padding: var(--space-5v);
	border: 1px solid var(--border-default-grey);
	border-left: 4px solid var(--border-action-high-blue-france);
	background: var(--background-default-grey);
}

.political-group-card:hover {
	border-left-color: var(--background-action-high-blue-france-hover);
}

.political-group-card__logo-wrap {
	width: fit-content;
}

.political-group-card__logo {
	display: grid;
	width: 5.5rem;
	height: 5.5rem;
	place-items: center;
	padding: var(--space-2v);
	border: 1px solid var(--border-default-grey);
	background: #fff;
	color: #161616;
	font-weight: var(--font-weight-bold);
	object-fit: contain;
}

.political-group-card__logo--placeholder {
	font-size: var(--text-lg);
}

.political-group-card__body {
	display: grid;
	gap: var(--space-2v);
}

.political-group-card__body h2,
.political-group-card__body p {
	margin-block-end: 0;
}

.political-group-card__body h2 {
	font-size: var(--title-xs);
}

.political-group-card__body p:not(.eyebrow) {
	color: var(--text-mention-grey);
	font-size: var(--text-sm);
}

.political-group-card__stats {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--space-2v);
	margin-block-end: 0;
}

.political-group-card__stats div {
	padding: var(--space-3v);
	background: var(--background-alt-grey);
}

.political-group-card__stats dt {
	color: var(--text-mention-grey);
	font-size: var(--text-xs);
	text-transform: uppercase;
}

.political-group-card__stats dd {
	margin-inline-start: 0;
	color: var(--text-title-grey);
	font-size: var(--text-md);
	font-weight: var(--font-weight-bold);
}

.political-group-member-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--space-3v);
}

.political-group-member-disclosure {
	margin-block-start: var(--space-4v);
}

.political-group-member-disclosure summary {
	width: fit-content;
	cursor: pointer;
	color: var(--text-action-high-blue-france);
	font-weight: var(--font-weight-bold);
}

.political-group-member-disclosure summary:hover {
	text-decoration: underline;
}

.political-group-member-disclosure .political-group-member-grid {
	margin-block-start: var(--space-4v);
}

.political-group-member-card {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	gap: var(--space-3v);
	align-items: center;
	padding: var(--space-3v);
	border: 1px solid var(--border-default-grey);
	background: var(--background-alt-grey);
}

.political-group-member-card__photo-link {
	display: block;
	border: 1px solid transparent;
	line-height: 0;
}

.political-group-member-card__photo-link:hover {
	border-color: var(--border-action-high-blue-france);
}

.political-group-member-card__photo {
	display: grid;
	width: 4.5rem;
	height: 4.5rem;
	place-items: center;
	border: 1px solid var(--border-default-grey);
	background: var(--background-default-grey);
	color: var(--text-title-grey);
	font-weight: var(--font-weight-bold);
	object-fit: cover;
}

.political-group-member-card__photo--placeholder {
	font-size: var(--text-lg);
}

.political-group-member-card__body {
	display: grid;
	gap: var(--space-1v);
}

.political-group-member-card__body h3,
.political-group-member-card__body p {
	margin-block-end: 0;
}

.political-group-member-card__body h3 {
	font-size: var(--text-md);
}

.political-group-member-card__body p {
	color: var(--text-mention-grey);
	font-size: var(--text-sm);
}

.political-group-stats-table,
.political-group-votes-table {
	margin-block-start: var(--space-4v);
}

/* components/chips-votes.css */
.result-chip {
	display: flex;
    align-items: center;
	width: fit-content;
	padding: var(--space-1v) var(--space-2v);
	background: var(--background-alt-blue-france);
	color: var(--text-action-high-blue-france);
	font-size: var(--text-xs);
	font-weight: var(--font-weight-bold);
	text-transform: uppercase;
}

.result-chip--adopte {
	background: var(--background-result-adopte);
	color: var(--text-inverted-result);
}

.result-chip--rejete {
	background: var(--background-result-rejete);
	color: var(--text-inverted-result);
}

.vote-counts {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--space-2v);
	margin: 0;
}

.vote-counts div {
	padding: var(--space-2v);
	border-top: 2px solid var(--border-default-grey);
	background: var(--background-alt-grey);
}

.vote-counts .vote-count--pour {
	border-top-color: var(--background-vote-pour);
}

.vote-counts .vote-count--contre {
	border-top-color: var(--background-vote-contre);
}

.vote-counts .vote-count--abstention {
	border-top-color: var(--background-vote-abstention);
}

.vote-counts dt,
.vote-counts dd {
	margin: 0;
}

.vote-counts dt {
	color: var(--text-mention-grey);
	font-size: var(--text-xs);
	text-transform: uppercase;
}

.vote-counts dd {
	color: var(--text-title-grey);
	font-weight: var(--font-weight-bold);
}

.vote-distribution-bar {
	position: relative;
	display: grid;
	grid-template-columns: repeat(100, minmax(0, 1fr));
	gap: 0;
	overflow: hidden;
	min-height: 0.5rem;
	border: 1px solid var(--border-default-grey);
	background: var(--background-alt-grey);
}

.vote-distribution-bar .vote-cell {
	min-height: 0.5rem;
}


/* components/pagination.css */
.pagination {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--space-3v);
	margin-block-start: var(--space-6v);
	padding: var(--space-4v);
	border: 1px solid var(--border-default-grey);
	background: var(--background-default-grey);
}

.pagination__pages {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--space-2v);
}

.pagination__link,
.pagination__ellipsis {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.5rem;
	min-height: 2.5rem;
	padding: var(--space-2v) var(--space-3v);
	font-size: var(--text-sm);
	font-weight: var(--font-weight-bold);
	line-height: 1.2;
}

.pagination__link {
	border: 1px solid var(--border-default-blue-france);
	background: var(--background-default-grey);
	color: var(--text-action-high-blue-france);
	text-decoration: none;
}

.pagination__link:hover,
.pagination__link--current {
	border-color: var(--border-action-high-blue-france);
	background: var(--background-alt-blue-france);
	color: var(--text-action-high-blue-france-hover);
}

.pagination__link--disabled {
	border-color: var(--border-default-grey);
	color: var(--text-mention-grey);
}

.pagination__ellipsis {
	color: var(--text-mention-grey);
}

/* pages/detail.css */
.detail-layout {
	display: grid;
	grid-template-columns: 1fr;
	gap: var(--space-6v);
}

.detail-main {
	display: grid;
	gap: var(--space-6v);
}

.detail-aside {
	display: grid;
	gap: var(--space-6v);
	align-self: start;
}

.detail-card {
	padding: var(--space-5v);
	border: 1px solid var(--border-default-grey);
	background: var(--background-default-grey);
}

.detail-card h2 {
	font-size: var(--title-sm);
}

.detail-card p:last-child {
	margin-block-end: 0;
}

.linked-document {
	display: grid;
	gap: var(--space-3v);
}

.linked-document__header {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--space-2v) var(--space-4v);
}

.linked-document__header h2,
.linked-document__header p {
	margin-block-end: 0;
}

.linked-document__header p {
	color: var(--text-mention-grey);
	font-size: var(--text-sm);
}

.linked-document__facts {
	gap: var(--space-2v);
}

.linked-document__actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-3v);
	margin-block-start: var(--space-1v);
}

.detail-metrics {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--space-3v);
	margin: 0;
}

.detail-metrics div {
	padding: var(--space-3v);
	border-top: 3px solid var(--border-action-high-blue-france);
	background: var(--background-alt-grey);
}

.detail-metrics .detail-metric--pour {
	border-top-color: var(--background-vote-pour);
}

.detail-metrics .detail-metric--contre {
	border-top-color: var(--background-vote-contre);
}

.detail-metrics .detail-metric--abstention {
	border-top-color: var(--background-vote-abstention);
}

.detail-metrics dt,
.detail-metrics dd,
.detail-list dt,
.detail-list dd {
	margin: 0;
}

.detail-metrics dt,
.detail-list dt {
	color: var(--text-mention-grey);
	font-size: var(--text-xs);
	font-weight: var(--font-weight-bold);
	text-transform: uppercase;
}

.detail-metrics dd {
	color: var(--text-title-grey);
	font-size: var(--text-xl);
	font-weight: var(--font-weight-bold);
}

.vote-breakdowns {
	display: grid;
	gap: var(--space-5v);
	margin-block-start: var(--space-6v);
}

.vote-breakdown {
	display: grid;
	gap: var(--space-3v);
	padding-block-start: var(--space-5v);
	border-top: 1px solid var(--border-default-grey);
}

.vote-breakdown__header {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--space-2v);
}

.vote-breakdown__header h3,
.vote-breakdown__header p {
	margin-block-end: 0;
}

.vote-breakdown__header h3 {
	font-size: var(--text-lg);
}

.vote-breakdown__header p {
	color: var(--text-mention-grey);
	font-size: var(--text-sm);
}

/* visualizations/vote-breakdowns.css */
.vote-breakdown__bar {
	position: relative;
	display: grid;
	grid-template-columns: repeat(100, minmax(0, 1fr));
	gap: 1px;
	overflow: hidden;
	min-height: 2rem;
	border: 1px solid var(--border-default-grey);
	background: var(--background-alt-grey);
}

.vote-breakdown__bar::before {
	content: none;
}

.vote-breakdown__marker {
	position: absolute;
	inset-block: 0;
	width: 1px;
	
	opacity: 0.9;
	pointer-events: none;
}


.vote-breakdown__marker--50 {
	inset-inline-start: 50%;
    background: rgb(255 255 255);
    box-shadow: 0 0 0 1px rgb(255 255 255/0.5);
}


.vote-cell {
	display: block;
	min-height: 2rem;
}

.vote-segment--pour {
	background: var(--background-vote-pour);
}

.vote-segment--contre {
	background: var(--background-vote-contre);
}

.vote-segment--abstention {
	background: var(--background-vote-abstention);
}

.vote-segment--non-votant {
	background: var(--background-vote-non-votant);
}

.vote-breakdown__legend {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--space-2v);
	padding: 0;
	margin: 0;
	list-style: none;
}

.vote-breakdown__legend li {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr) auto auto;
	align-items: center;
	gap: var(--space-2v);
	padding: var(--space-2v);
	background: var(--background-alt-grey);
	font-size: var(--text-sm);
}

.vote-breakdown__legend strong {
	color: var(--text-title-grey);
}

.vote-breakdown__legend li span:last-child {
	color: var(--text-mention-grey);
	font-size: var(--text-xs);
}

.vote-breakdown__swatch {
	width: 0.75rem;
	height: 0.75rem;
}

/* visualizations/group-vote-chart.css */
.group-vote-chart {
	display: grid;
	gap: var(--space-4v);
	margin: 0;
}

.group-vote-chart figcaption {
	color: var(--text-mention-grey);
	font-size: var(--text-sm);
}

.group-vote-chart__legend {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-3v);
	align-items: center;
	padding: 0;
	margin: 0;
	color: var(--text-mention-grey);
	font-size: var(--text-sm);
	list-style: none;
}

.group-vote-chart__legend li {
	display: inline-flex;
	gap: var(--space-2v);
	align-items: center;
}

.group-vote-chart__plot {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	gap: var(--space-3v);
	align-items: start;
}

.group-vote-chart__y-axis {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	height: 16rem;
	margin-block-start: 1.5rem;
	color: var(--text-mention-grey);
	font-size: var(--text-xs);
	line-height: 1;
	text-align: right;
}

.group-vote-chart__scroller {
	overflow-x: auto;
}

.group-vote-chart__bars {
	display: grid;
	grid-auto-columns: minmax(3.25rem, 1fr);
	grid-auto-flow: column;
	gap: var(--space-4v);
	min-width: max(42rem, 100%);
	background: repeating-linear-gradient(to bottom, var(--border-default-grey) 0 1px, transparent 1px 25%);
	background-position: 0 1.5rem;
	background-repeat: no-repeat;
	background-size: 100% 16rem;
}

.group-vote-chart__group {
	display: grid;
	grid-template-rows: auto 16rem auto;
	gap: var(--space-2v);
	min-width: 0;
}

.group-vote-chart__voters {
	color: var(--text-mention-grey);
	font-size: var(--text-xs);
	font-weight: var(--font-weight-bold);
	line-height: 1;
	text-align: center;
}

.group-vote-chart__bar {
	display: flex;
	flex-direction: column-reverse;
	overflow: hidden;
	border: 1px solid var(--border-default-grey);
	background: var(--background-alt-grey);
}

.group-vote-chart__bar--empty {
	align-items: center;
	justify-content: center;
	flex-direction: row;
	background: var(--background-default-grey);
}

.group-vote-chart__empty {
	color: var(--text-mention-grey);
	font-size: var(--text-sm);
	font-weight: var(--font-weight-bold);
}

.group-vote-chart__bar .vote-cell {
	flex: 1 1 0;
	min-height: 0;
}

.group-vote-chart__label {
	overflow: hidden;
	color: var(--text-mention-grey);
	font-size: var(--text-xs);
	font-weight: var(--font-weight-bold);
	line-height: 1.25;
	text-align: center;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* visualizations/group-deviation-chart.css */
.group-deviation-chart {
	display: grid;
	gap: var(--space-3v);
	margin: var(--space-6v) 0 0;
	padding-block-start: var(--space-5v);
	border-top: 1px solid var(--border-default-grey);
}

.group-deviation-chart figcaption {
	display: grid;
	gap: var(--space-1v);
}

.group-deviation-chart h3,
.group-deviation-chart p {
	margin-block-end: 0;
}

.group-deviation-chart h3 {
	font-size: var(--text-lg);
}

.group-deviation-chart p {
	color: var(--text-mention-grey);
	font-size: var(--text-sm);
}

.group-deviation-chart__list {
	display: grid;
	gap: var(--space-2v);
}

.group-deviation-chart__row {
	display: grid;
	grid-template-columns: minmax(4.5rem, 0.18fr) minmax(12rem, 1fr) minmax(6rem, auto);
	gap: var(--space-3v);
	align-items: center;
}

.group-deviation-chart__group {
	overflow: hidden;
	color: var(--text-title-grey);
	font-size: var(--text-sm);
	font-weight: var(--font-weight-bold);
	text-overflow: ellipsis;
	white-space: nowrap;
}

.group-deviation-chart__track {
	display: grid;
	grid-template-columns: repeat(41, minmax(0, 1fr));
	gap: 1px;
	min-height: 0.875rem;
	padding-block: var(--space-1v);
	background: var(--background-alt-grey);
}

.group-deviation-cell {
	min-height: 0.875rem;
	background: var(--background-contrast-grey);
}

.group-deviation-cell--center {
	background: var(--border-plain-grey);
}

.group-deviation-cell--positive {
	background: var(--background-vote-pour);
}

.group-deviation-cell--negative {
	background: var(--background-vote-contre);
}

.group-deviation-cell--empty {
	background: var(--background-default-grey);
}

.group-deviation-chart__value {
	color: var(--text-mention-grey);
	font-size: var(--text-sm);
	font-weight: var(--font-weight-bold);
	text-align: right;
	white-space: nowrap;
}

.group-deviation-chart__value--positive {
	color: var(--text-default-success);
}

.group-deviation-chart__value--negative {
	color: var(--text-default-error);
}

.group-deviation-chart__value--abstention {
	color: var(--background-vote-abstention);
}

.group-deviation-chart__value--empty {
	color: var(--text-mention-grey);
}

.group-deviation-chart__axis {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--space-3v);
	padding-inline-start: calc(4.5rem + var(--space-3v));
	color: var(--text-mention-grey);
	font-size: var(--text-xs);
}

.group-deviation-chart__axis span:nth-child(2) {
	text-align: center;
}

.group-deviation-chart__axis span:last-child {
	text-align: right;
}

.group-vote-details {
	margin-block-start: var(--space-6v);
}

.group-vote-details summary {
	cursor: pointer;
	color: var(--text-action-high-blue-france);
	font-weight: var(--font-weight-bold);
}

.group-vote-details .table-scroll {
	margin-block-start: var(--space-4v);
}

/* components/individual-votes.css */
.individual-votes-details {
	margin-block-start: var(--space-4v);
}

.individual-votes-details summary {
	cursor: pointer;
	color: var(--text-action-high-blue-france);
	font-weight: var(--font-weight-bold);
}

.individual-vote-groups {
	display: grid;
	gap: var(--space-5v);
	margin-block-start: var(--space-4v);
}

.individual-vote-group {
	display: grid;
	gap: var(--space-3v);
}

.individual-vote-group__header {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--space-2v) var(--space-4v);
}

.individual-vote-group__header h3,
.individual-vote-group__header p {
	margin-block-end: 0;
}

.individual-vote-group__header p,
.individual-vote-table__uid {
	color: var(--text-mention-grey);
	font-size: var(--text-sm);
}

.individual-vote-table {
	min-width: 34rem;
}

.individual-vote-table__name,
.individual-vote-table__uid {
	display: block;
}

.individual-vote-table__name {
	width: fit-content;
}

/* pages/deputy-detail.css */
.deputy-stats-table {
	margin-block-start: var(--space-5v);
}

.deputy-photo-card {
	display: grid;
	gap: var(--space-3v);
}

.deputy-photo-card__image {
	display: block;
	width: 100%;
	height: auto;
	border: 1px solid var(--border-default-grey);
	background: var(--background-alt-grey);
	object-fit: cover;
}

.deputy-photo-card p {
	margin-block-end: 0;
	color: var(--text-mention-grey);
	font-size: var(--text-sm);
}

.deputy-mandat-list {
	display: grid;
	gap: var(--space-4v);
}

.deputy-mandat-list--nested {
	margin-block-start: var(--space-4v);
}

.deputy-mandat-disclosure {
	border-block-start: 1px solid var(--border-default-grey);
	padding-block-start: var(--space-4v);
}

.deputy-mandat-disclosure summary {
	cursor: pointer;
	width: fit-content;
	color: var(--text-action-high-blue-france);
	font-weight: var(--font-weight-bold);
}

.deputy-mandat-disclosure summary:hover {
	text-decoration: underline;
}

.deputy-mandat-card {
	display: grid;
	gap: var(--space-3v);
	padding: var(--space-4v);
	border: 1px solid var(--border-default-grey);
	background: var(--background-alt-grey);
}

.deputy-mandat-card h3,
.deputy-mandat-card p {
	margin-block-end: 0;
}

.deputy-mandat-card p {
	color: var(--text-mention-grey);
	font-size: var(--text-sm);
}

.deputy-mandat-card__details {
	margin-block-start: var(--space-2v);
}

.deputy-tag-list {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-2v);
	padding: 0;
	margin: 0;
	list-style: none;
}

.deputy-tag-list li {
	padding: var(--space-1v) var(--space-2v);
	background: var(--background-alt-blue-france);
	color: var(--text-action-high-blue-france);
	font-size: var(--text-xs);
	font-weight: var(--font-weight-bold);
}

.deputy-votes-table {
	min-width: 52rem;
}

.deputy-votes-table__title {
	display: block;
	margin-block-start: var(--space-1v);
	color: var(--text-mention-grey);
	font-size: var(--text-sm);
	font-weight: var(--font-weight-regular);
}

.vote-position {
	display: inline-flex;
	padding: var(--space-1v) var(--space-2v);
	background: var(--background-alt-grey);
	color: var(--text-title-grey);
	font-size: var(--text-xs);
	font-weight: var(--font-weight-bold);
	text-transform: uppercase;
}

.vote-position--pour {
	background: var(--background-vote-pour);
	color: var(--text-inverted-result);
}

.vote-position--contre {
	background: var(--background-vote-contre);
	color: var(--text-inverted-result);
}

.vote-position--abstention {
	background: var(--background-vote-abstention);
	color: var(--grey-50-1000);
}

.vote-position--non-votant {
	background: var(--background-vote-non-votant);
	color: var(--grey-50-1000);
}

.detail-list {
	display: grid;
	gap: var(--space-3v);
	margin: 0;
}

.detail-list div {
	padding-block: var(--space-3v);
	border-top: 1px solid var(--border-default-grey);
}

.detail-list dd {
	overflow-wrap: anywhere;
	color: var(--text-title-grey);
}


/* components/tables.css */
.table-scroll {
	overflow-x: auto;
	border: 1px solid var(--border-default-grey);
}

.data-table {
	width: 100%;
	min-width: 44rem;
	border-collapse: collapse;
	background: var(--background-default-grey);
	font-size: var(--text-sm);
}

.data-table th,
.data-table td {
	padding: var(--space-3v);
	border-bottom: 1px solid var(--border-default-grey);
	text-align: right;
	vertical-align: top;
}

.data-table th:first-child,
.data-table td:first-child,
.data-table th:nth-child(2),
.data-table td:nth-child(2) {
	text-align: left;
}

.data-table thead th {
	background: var(--background-alt-grey);
	color: var(--text-title-grey);
	font-size: var(--text-xs);
	text-transform: uppercase;
}

.data-table tbody th {
	color: var(--text-title-grey);
	font-weight: var(--font-weight-bold);
}

.data-table tr:last-child th,
.data-table tr:last-child td {
	border-bottom: 0;
}

/* components/footer.css */
.card p:last-child,
.hero__panel p:last-child,
.section-heading p:last-child,
.scrutin-card__body p:last-child {
	margin-block-end: 0;
}

.site-footer {
	background: var(--background-contrast-grey);
	color: var(--text-mention-grey);
}

.site-footer__inner {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: var(--space-3v);
	padding-block: var(--space-6v);
}

.site-footer p {
	margin-block-end: 0;
	font-size: var(--text-sm);
}

.site-footer p:first-child {
	color: var(--text-title-grey);
	font-weight: var(--font-weight-bold);
}

/* responsive.css */
@media (min-width: 48em) {
	:root {
		--container-gutter: var(--space-8v);
	}

	.fr-grid--2 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.fr-grid--3,
	.card-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.hero__grid {
		grid-template-columns: minmax(0, 1.3fr) minmax(20rem, 0.7fr);
	}

	.scrutin-card {
		grid-template-columns: minmax(0, 1fr) minmax(16rem, 0.35fr);
	}

	.deputy-card {
		grid-template-columns: auto minmax(0, 1fr) minmax(14rem, 0.3fr);
		align-items: center;
	}

	.political-group-card {
		grid-template-columns: auto minmax(0, 1fr) minmax(16rem, 0.35fr);
		align-items: center;
	}

	.political-group-member-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.scrutin-filters {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.scrutin-card__meta,
	.scrutin-card__body {
		grid-column: 1;
	}

	.scrutin-card__result {
		grid-column: 2;
		grid-row: 1 / span 2;
		align-self: start;
	}

	.deputy-card__stats {
		align-self: start;
	}

	.political-group-card__stats {
		align-self: start;
	}

	.detail-layout {
		grid-template-columns: minmax(0, 1fr) minmax(18rem, 0.35fr);
		align-items: start;
	}

	.detail-metrics {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (max-width: 35.99em) {
	.site-header__inner,
	.site-footer__inner,
	.hero__actions {
		align-items: stretch;
		flex-direction: column;
	}

	.site-nav {
		margin-inline-start: 0;
	}

	.theme-toggle {
		width: 100%;
	}

	.button {
		width: 100%;
	}

	.scrutin-toolbar__actions,
	.sort-panel__links,
	.pagination,
	.pagination__pages {
		align-items: stretch;
		flex-direction: column;
	}

	.sort-link,
	.pagination__link,
	.pagination__ellipsis {
		width: 100%;
	}

	.vote-counts {
		grid-template-columns: 1fr;
	}

	.metric-list {
		grid-template-columns: 1fr;
	}

	.detail-metrics {
		grid-template-columns: 1fr;
	}

	.group-deviation-chart__row {
		grid-template-columns: 1fr;
		gap: var(--space-2v);
	}

	.group-deviation-chart__value {
		text-align: left;
	}

	.group-deviation-chart__axis {
		padding-inline-start: 0;
	}

	.vote-breakdown__legend {
		grid-template-columns: 1fr;
	}
}

/* forced-colors.css */
@media (forced-colors: active) {
	:focus-visible {
		outline: 3px solid Highlight;
	}

	.button,
	.brand-logo,
	.card,
	.data-table th,
	.data-table td,
	.deputy-heading__group-link,
	.deputy-heading__group-logo,
	.political-group-heading__logo,
	.detail-card,
	.detail-metrics div,
	.detail-list div,
	.deputy-mandat-card,
	.empty-state,
	.deputy-card,
	.deputy-card__group-link,
	.deputy-card__group-logo,
	.deputy-card__photo,
	.deputy-card__stats div,
	.political-group-card,
	.political-group-card__logo,
	.political-group-card__stats div,
	.political-group-member-card,
	.political-group-member-card__photo,
	.political-group-member-card__photo-link,
	.group-vote-chart__bar,
	.group-deviation-chart__track,
	.hero__panel,
	.metric-card,
	.pagination,
	.pagination__link,
	.scrutin-toolbar,
	.scrutin-card,
	.sort-link,
	.sort-panel,
	.theme-toggle,
	.vote-position,
	.vote-breakdown__bar,
	.vote-breakdown__legend li,
	.vote-counts div {
		border: 1px solid CanvasText;
		box-shadow: none;
	}
}