/*
 * Thème sombre, actif sous html[data-theme="dark"] (attribut posé dans le <head> par Header_Menu::theme_init_script).
 * Astra tire presque toutes ses couleurs de ses variables globales : on les redéfinit, puis on corrige
 * les couleurs écrites en dur par Bootstrap 3 et par le thème enfant.
 */
html[data-theme="dark"] {
	color-scheme: dark;
	--ast-global-color-0: #6cb4f5; /* liens, boutons */
	--ast-global-color-1: #9ccdfa; /* liens au survol */
	--ast-global-color-2: #e5ebf2; /* titres */
	--ast-global-color-3: #c3cdd9; /* texte */
	--ast-global-color-4: #0b1322; /* fond de page */
	--ast-global-color-5: #141f33; /* fond des blocs (articles, en-tête) */
	--ast-global-color-6: #3a4a63; /* bordures */
	--ast-global-color-7: #e5ebf2;
	--ast-global-color-8: #e5ebf2;
	--st-surface: #141f33;
	--st-surface-2: #1b2840;
	--st-border: #3a4a63;
	--st-text: #c3cdd9;
}

html[data-theme="dark"] body {
	background-color: var(--ast-global-color-4);
	color: var(--st-text);
}

/* Bootstrap 3 : panneaux, boutons par défaut, champs. */
html[data-theme="dark"] .panel,
html[data-theme="dark"] .panel-body,
html[data-theme="dark"] .js-filter-form,
html[data-theme="dark"] .mini-panel,
html[data-theme="dark"] .publications-list-results .mini-panel.primary {
	background-color: var(--st-surface);
	border-color: var(--st-border);
	color: var(--st-text);
}

html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea,
html[data-theme="dark"] #publication-search,
html[data-theme="dark"] #start-date-number,
html[data-theme="dark"] #end-date-number,
html[data-theme="dark"] .js-publication-tags-select2 + span .select2-selection,
html[data-theme="dark"] .select2-dropdown,
html[data-theme="dark"] .select2-search__field {
	background-color: var(--st-surface-2);
	border-color: var(--st-border);
	color: var(--ast-global-color-2);
}

html[data-theme="dark"] .select2-results__option[aria-selected="true"] {
	background-color: var(--st-border);
}

html[data-theme="dark"] .select2-container--default .select2-selection--multiple .select2-selection__choice {
	background-color: var(--st-border);
	border-color: var(--st-border);
	color: var(--ast-global-color-2);
}

html[data-theme="dark"] .dates-fieldset-inner-wrap {
	border-color: var(--st-border);
}

html[data-theme="dark"] .btn-default {
	background-image: none;
	background-color: var(--st-surface-2);
	border-color: var(--st-border);
	color: var(--ast-global-color-2);
	text-shadow: none;
}

/* Contenu des articles : textes en gris foncé écrits en dur. */
html[data-theme="dark"] .entry-content,
html[data-theme="dark"] .publication--abstract,
html[data-theme="dark"] .publication--meta {
	color: var(--st-text);
}

html[data-theme="dark"] hr {
	border-color: var(--st-border);
}

/* Logo DB du pied de page : déjà inversé en clair, rien à changer. Images : légère atténuation. */
html[data-theme="dark"] .entry-content img:not(.footer-logo) {
	filter: brightness(0.9);
}

/* Bootstrap 3 fixe a { color: #337ab7 } et la couleur des titres, trop sombres sur fond sombre. */
html[data-theme="dark"] a:not(.btn):not(.menu-link) {
	color: var(--ast-global-color-0);
}

html[data-theme="dark"] a:not(.btn):not(.menu-link):hover,
html[data-theme="dark"] a:not(.btn):not(.menu-link):focus {
	color: var(--ast-global-color-1);
}

html[data-theme="dark"] h1,
html[data-theme="dark"] h2,
html[data-theme="dark"] h3,
html[data-theme="dark"] h4,
html[data-theme="dark"] h5,
html[data-theme="dark"] h6 {
	color: var(--ast-global-color-2);
}

/* Le titre du panneau des filtres et les titres des bandeaux restent blancs. */
html[data-theme="dark"] .panel-heading .panel-title,
html[data-theme="dark"] .entry-header .alignfull .entry-title,
html[data-theme="dark"] body.archive .ast-archive-description .ast-archive-title,
html[data-theme="dark"] .site-footer a:not(.btn):not(.menu-link) {
	color: #ffffff;
}

/* Logo : le carré bleu marine se détache peu de l'en-tête sombre, fin liseré clair. */
html[data-theme="dark"] .st-logo svg {
	border-radius: 18%;
	box-shadow: 0 0 0 1px var(--st-border);
}

/* Titre du site : couleur des titres, pas celle des liens. */
html[data-theme="dark"] .site-title a:not(.btn):not(.menu-link) {
	color: var(--ast-global-color-2);
}

/* Illustration de la page About : cheminée bleu marine, posée sur une carte claire en thème sombre. */
html[data-theme="dark"] .st-about-logo img {
	background-color: #e5ebf2;
	border-radius: 12px;
	padding: 12px;
	box-sizing: content-box;
}

/* Formulaire de contact (WPForms) : ses couleurs passent par des variables CSS, redéfinies ici. */
html[data-theme="dark"] .wpforms-container {
	--wpforms-label-color: var(--ast-global-color-2);
	--wpforms-label-sublabel-color: var(--st-text);
	--wpforms-label-error-color: #ff8a8a;
	--wpforms-field-background-color: var(--st-surface-2);
	--wpforms-field-border-color: var(--st-border);
	--wpforms-field-border-color-spare: var(--st-border);
	--wpforms-field-text-color: var(--ast-global-color-2);
	--wpforms-field-menu-color: var(--st-surface-2);
}

html[data-theme="dark"] .wpforms-container input,
html[data-theme="dark"] .wpforms-container textarea,
html[data-theme="dark"] .wpforms-container select {
	background-color: var(--st-surface-2) !important;
	border-color: var(--st-border) !important;
	color: var(--ast-global-color-2) !important;
}

html[data-theme="dark"] .wpforms-container .wpforms-field-label,
html[data-theme="dark"] .wpforms-container legend.wpforms-field-label {
	color: var(--ast-global-color-2) !important;
}

html[data-theme="dark"] .wpforms-container .wpforms-field-sublabel {
	color: var(--st-text) !important;
}